import{type ComplexAttributeConverter,type PropertyValues,type TemplateResult}from'lit';import{LyraElement}from'../../../internal/lyra-element.js';import type{LyraAppearance,LyraSize}from'../../../internal/variants.js';import{type TimeHourFormat}from'./time-input-shared.js';import{type LyraFormValidator}from'../form-validator.js';export type LyraTimeInputHourFormat=TimeHourFormat;export type LyraTimeInputStep=number|'any';export type LyraTimeInputPlacement='top'|'top-start'|'top-end'|'right'|'right-start'|'right-end'|'bottom'|'bottom-start'|'bottom-end'|'left'|'left-start'|'left-end';export interface LyraTimeInputEventMap{input:InputEvent;change:Event;focus:FocusEvent;blur:FocusEvent;'lr-input':CustomEvent<{value:string;}>;'lr-change':CustomEvent<{value:string;}>;'lr-clear':CustomEvent;'lr-show':CustomEvent;'lr-after-show':CustomEvent;'lr-hide':CustomEvent;'lr-after-hide':CustomEvent;'lr-invalid':CustomEvent;}declare class LyraTimeInputBase extends LyraElement{}declare const LyraTimeInput_base:typeof LyraTimeInputBase&(new(...args:any[])=>import("../../../lyra.js").FormAssociatedInterface &import("../../../internal/form-associated.js").FormAssociatedSubclassInterface); /** * `` — a locale-aware segmented time field with an attached column picker. * * Mirrors the public `` surface under the `lr-` prefix. The submitted value is a * timezone-free 24-hour string (`HH:mm`, or `HH:mm:ss` when seconds are shown); an incomplete * draft submits the empty string. Use `` for the Lyra 7 browser-native * `input[type=time]` experience. * * The outer row follows the shared control-height ladder without adding padding around its action * hit targets: compact tiers grow only enough for the clear/expand buttons, while `l` and `xl` * retain their larger shared heights. * Locale digits and ASCII digits are accepted symmetrically. Constraint bounds are formatted * through the same locale presentation, while the wire value remains ASCII. Numeric step * validation and picker options use the native time step base (valid `min`, then the reset * default, then midnight) and the picker projects only complete times on that grid. * Each picker column is a one-stop listbox: ArrowUp/ArrowDown/Home/End rove its enabled options, * and the native option button supplies Enter/Space activation. * When a controlled locale, hour format, or step change removes the segment that currently owns * focus, focus moves to the first surviving segment after the new pattern renders. Changes never * reclaim focus from another control. * The semantic group and every spinbutton expose explicit required/invalid states. Requiredness * also has one localized hidden group description that composes with the visible hint/error * relationship; visible error chrome wins `aria-invalid` immediately, while intrinsic/custom * invalidity is exposed only after interaction. * A host `aria-describedby` is resolved onto the semantic group before its own hint, error, and * required descriptions, so externally-owned guidance remains valid across the shadow boundary. * Host `aria-labelledby` is deliberately not projected: the rendered visible label owns this * group's label relationship. * * Removing label or hint safely omits that content while retaining native null property * readback. Explicit empty strings remain empty. * * @customElement lr-time-input * @event input - Native `InputEvent` fired for user edits. * @event change - Native `Event` fired when a complete value is committed. * @event focus - Re-dispatched when focus enters the segmented editing surface. * @event blur - Re-dispatched when focus leaves the segmented editing surface. * @event lr-input - Prefixed compatibility alias for `input` with `detail.value`. * @event lr-change - Prefixed compatibility alias for `change` with `detail.value`. * @event lr-clear - The clear action removed the value. * @event lr-show - Cancelable event fired before the picker opens. * @event lr-after-show - The opening transition finished. * @event lr-hide - Cancelable event fired before the picker closes. * @event lr-after-hide - The closing transition finished. * @event lr-invalid - The control failed a validity check; cancelable. Calling `preventDefault()` * also cancels the native `invalid` event it aliases, suppressing the browser's own validation * bubble and `reportValidity()`'s focus/scroll. * @slot label - Custom label content. * @slot hint - Custom hint content. * @slot error - Custom error content. * @slot start - Adornment before the segments. * @slot end - Adornment after the clear action and before the expand action. * @slot clear-icon - Replaces the clear glyph. * @slot expand-icon - Replaces the picker expand glyph. * @slot footer - Replaces the default Now footer action. * @csspart form-control - The outer form-control wrapper. * @csspart form-control-input - The row containing segments and actions. * @csspart form-control-label - The wrap-safe label wrapper; unbroken localized text stays within * the host allocation. * @csspart label - Compatibility alias for `form-control-label` on the same node. * @csspart base - The segmented time row. * @csspart time-input - Compatibility alias for `base` on the same node. * @csspart input-wrapper - The row containing segments and actions. * @csspart input - The segmented editing surface. * @csspart segment - An editable time segment. * @csspart segment-literal - A locale-derived separator. * @csspart start - Shrinkable wrapper around the `start` slot; long content ellipsizes. * @csspart end - Shrinkable wrapper around the `end` slot; long content ellipsizes. * @csspart clear-button - The clear action. * @csspart expand-button - The picker toggle. * @csspart expand-icon - The picker-toggle glyph. * @csspart popup - The positioned picker surface. * @csspart columns - The picker column group. * @csspart column - One hour, minute, second, or day-period column. It scrolls only in the block * axis and clips inline overflow when a consumer supplies an undersized `--column-width`. * @csspart column-item - A picker column option. * @csspart column-item-selected - A selected picker option; also carries `column-item`. * @csspart now-button - The default Now footer action. * @csspart hint - The hint message. * @csspart error - Ordinary validation text referenced by the segmented input through * `aria-describedby`; it is not a live region, avoiding duplicate native validation feedback. * @cssprop [--lr-time-input-control-min-height=var(--lr-form-control-height)] - Outer row height * floor, taken from the active `size` tier of the shared form-control ladder * (`internal/sizes.styles.ts`), so a time field is exactly as tall as an ``/ * `` of the same tier. * @cssprop --lr-time-input-control-height - Exact outer row height. Unset by default, which leaves * `--lr-time-input-control-min-height` as a floor only; set it to a length to both floor and cap * the row (e.g. to pixel-match `` in the same toolbar). Because it is never * declared by the component itself, it can be set from an ancestor or an outer-tree rule as well * as inline on the element. * @cssprop [--lr-time-input-gap=var(--lr-form-control-gap)] - Gap between segments, adornments, * and actions in the outer row. Undeclared on the host so ancestor theme wrappers can set it. * @cssprop [--lr-time-input-radius=var(--lr-form-control-radius)] - Outer row corner radius. * `pill` supplies `--lr-radius-pill` only as the fallback, so a component-scoped value wins. * @cssprop [--lr-time-input-border-color=var(--lr-color-border)] - Outer row border color, with * appearance-specific fallbacks. * @cssprop [--lr-time-input-fill=transparent] - Outer row background, with appearance-specific * fallbacks. * @cssprop [--lr-time-input-color=var(--lr-color-text)] - Outer row text color, including the * accent appearance fallback. * @cssprop [--lr-time-input-focus-border-color=var(--lr-color-brand)] - Open/focused row border. * @cssprop [--lr-time-input-segment-hover-bg=var(--lr-color-brand-quiet)] - Segment hover fill. * @cssprop --lr-time-input-segment-active-bg - Segment pressed fill; derived from hover when unset. * @cssprop [--lr-time-input-segment-focus-bg=var(--lr-time-input-segment-hover-bg,var(--lr-color-brand-quiet))] - * Keyboard-focused segment fill. * @cssprop [--lr-time-input-action-color=var(--lr-color-text-quiet)] - Resting clear/expand color. * @cssprop [--lr-time-input-action-hover-color=var(--lr-color-text)] - Hovered clear/expand color. * @cssprop [--lr-time-input-action-hover-bg=var(--lr-color-brand-quiet)] - Clear/expand/Now hover fill. * @cssprop --lr-time-input-action-active-bg - Clear/expand/Now pressed fill; derived from hover when unset. * @cssprop [--lr-time-input-column-hover-bg=var(--lr-color-brand-quiet)] - Picker-option hover fill. * @cssprop --lr-time-input-column-active-bg - Picker-option pressed fill; derived from hover when unset. * @cssprop [--lr-time-input-column-selected-bg=var(--lr-color-brand)] - Selected option fill. * @cssprop [--lr-time-input-column-selected-color=var(--lr-color-on-brand)] - Selected option text. * @cssprop [--lr-time-input-column-selected-font-weight=var(--lr-font-weight-semibold)] - Selected option weight. * @cssprop --lr-time-input-column-selected-hover-bg - Selected-option hover fill; derived when unset. * @cssprop --lr-time-input-column-selected-active-bg - Selected-option pressed fill; derived when unset. * @cssprop [--column-item-height=calc(var(--lr-size-1em)*2.25)] - Picker row height. * @cssprop [--column-width=calc(var(--lr-size-1em)*3)] - Picker column width. * @cssprop [--show-duration=var(--lr-duration-fast)] - Picker opening duration. * @cssprop [--hide-duration=var(--lr-duration-fast)] - Picker closing duration. * @cssprop [--lr-form-control-focus-shadow=none] - The shared field focus halo, painted as a * `box-shadow` while this control is focused. One name for every field-shaped control in the * library, so a halo is configured once rather than per component. Additive: the focus outline and * border cue are the accessibility answer to focus and are never replaced by it. * @cssprop [--lr-form-control-required-content=' *'] - The required-field marker rendered after the * label. Set it to `''` to suppress the marker, or to any other quoted string (`' (required)'`, a * localized word) to replace it. Caller-supplied content, so it is never localized here. * @cssprop [--lr-form-control-required-color=var(--lr-color-danger)] - Color of that marker, * retunable without touching any other danger-coloured surface. * @cssprop [--lr-form-control-required-offset=0] - Inline space between the label text and the * marker. * @cssstate blank - Present while the committed value is empty. * @cssstate disabled - Present while the control is disabled directly or by a fieldset. * @cssstate open - Present while the column picker is open. * @method show - `show(): Promise` opens the picker and settles after `lr-after-show`. * @method hide - `hide(): Promise` closes the picker and settles after `lr-after-hide`. * @cssprop [--lr-overlay-surface=var(--lr-color-surface-raised)] - Shared floating-surface fill, on * the anchored picker panel. The family's own default is `var(--lr-color-surface-overlay)`; this * panel deliberately keeps the raised tone as its unset value so it stays separated from the field * it drops from, and it never read as a hole in dark mode. * @cssprop [--lr-overlay-border=var(--lr-color-border)] - Shared floating-surface edge colour, on * the anchored picker panel. * @cssprop [--lr-overlay-radius=var(--lr-radius)] - Shared floating-surface corner radius, on the * anchored picker panel. * @cssprop [--lr-overlay-shadow-anchored=var(--lr-shadow-m)] - Elevation of the anchored surface. * @cssprop --lr-positioning-strategy - Cascading `absolute`/`fixed` override for the column * picker's `fixed` default, read from computed style when it is (re)positioned. Set it once on * `:root`, a theme, or one clipping ancestor to change every unset time input beneath it; an * unrecognized value falls back to `fixed`. * @status stable * @since 4.0.0 */ export declare class LyraTimeInput extends LyraTimeInput_base{ /** Public WA-compatible intrinsic validator catalog. */ static get validators():LyraFormValidator[];static styles:import("lit").CSSResultGroup[];static properties:{open:{type:BooleanConstructor;reflect:boolean;noAccessor:boolean;};readonly:{type:BooleanConstructor;reflect:boolean;noAccessor:boolean;};step:{converter:ComplexAttributeConverter;reflect:boolean;noAccessor:boolean;};};appearance:LyraAppearance;autocomplete:string;distance:number;hint:string;hourFormat:LyraTimeInputHourFormat;label:string;min:string;max:string;pill:boolean;placement:LyraTimeInputPlacement;size:LyraSize;withClear:boolean;withHint:boolean;withLabel:boolean;withNow:boolean;errorText:string;private activeSegment;private touched;private hasLabelSlot;private hasHintSlot;private hasErrorSlot;private hasStartSlot;private hasEndSlot;private hasFooterSlot;private _open;private _readonly;private _step;private draft;private partial;private secondsVisible; /** The last explicitly assigned/typed value, normalized but never step-padded. The committed * `value` is always re-derived from this (see `committedValue`), so second-precision padding * applies and reverts consistently regardless of `value`/`step` assignment order instead of * depending on which was assigned first. */ private genuineValue;private digitBuffer;private digitSegment?;private pendingSegmentFocus?;private restoringSegmentFocus;private cleanupPositioner?;private overlayHandle?;private lightDismissDocument?;private restoreFocusOnClose;private transitionToken;private visibilityPromise;private segmentOrderKey;private pickerGridKey;private pickerGridMilliseconds;private inputId;private labelId;private hintId;private errorId;private requiredDescriptionId;private popupId;private externalDescriptionLease?;private requiredDescriptionLease?;private requiredDescriptionTarget?; /** Clock seam for deterministic local-time tests. */ private now;constructor();connectedCallback():void; /** Whether the column picker is open. * @default false */ get open():boolean;set open(next:boolean); /** Whether the control remains focusable but blocks user edits. * @default false */ get readonly():boolean;set readonly(next:boolean); /** Allowed value step in seconds, or `any` to disable step validation. Numeric grids use valid * `min`, then `defaultValue`, then midnight as their base; picker columns project that full grid. * @default 60 */ get step():LyraTimeInputStep;set step(next:LyraTimeInputStep);get disabled():boolean;set disabled(next:boolean);get value():string;set value(next:string|Date|null); /** Milliseconds since local midnight, or `NaN` while blank/incomplete. * * Assigning sets `value` from the same scale. `NaN`, a negative number, or a full day or more * clears the field rather than wrapping, matching how a native time input treats an * out-of-range `valueAsNumber`. Assignment is silent, like the native property. */ get valueAsNumber():number;set valueAsNumber(next:number); /** A Date carrying the selected local clock fields on today's local calendar date. * * Assigning reads the same local clock fields back off the given Date, so it round-trips with * the getter; `null` or an invalid Date clears the field. Assignment is silent. */ get valueAsDate():Date|null;set valueAsDate(next:Date|null);private get numericStep(); /** Pads a canonical time string to second precision when the step currently in effect requires * it, so the committed `value` string is identical no matter which of `value`/`step` was * assigned first. */ private padToStepPrecision; /** `genuineValue` padded for the step currently in effect -- what `value` actually commits to. */ private get committedValue();private get includeSeconds();private get pattern();private get segmentOrder(); /** Reads component state plus the UA's synchronous fieldset cascade when a browser selector * predicate exists. Lit's server element shim has no callable `matches()`, so SSR falls back to * the reactive authority instead of aborting public-state application before the first render. */ private get liveDisabled();private activeSegmentFor;private get usesTwelveHour();private get draftComplete();private get draftHasAny();private syncDraft;private canonicalDraftValue;private syncComponentStates;private formattedNumber; /** Accepts both ASCII digits and the active numbering system's single-key digit glyphs. */ private inputDigit; /** Formats a canonical constraint value through the same locale pattern as the segment UI. */ private displayTime;private segmentNumericValue;private segmentText;private segmentLabel;private segmentBounds;private setDraftSegment;private publishDraftEdit;private commitUserValue;private resetDigitBuffer;private moveSegment;private acceptDigit;private stepSegment;private onSegmentKeyDown;private onSegmentPaste;private onSegmentFocus;private onSegmentBlur;private segmentElement; /** Focuses the active segment unless the control is directly or fieldset disabled. */ focus(options?:FocusOptions):void;blur():void;click():void;private setOpen;private syncOpenAttribute;private requestVisibility; /** Opens the picker unless disabled or vetoed by `lr-show`. */ show():Promise; /** Closes the picker unless vetoed by `lr-hide`. */ hide():Promise;private forceClose;private settleTransition;private positionPopup;private activatePopup;private teardownPopup;private onDocumentPointerDown;private onExpand;private onClear;private onNow;private onColumnSelect;private onPopupPointerDown;private onAutofillInput;private onAutofillChange;private updateSlotState;protected updateValidity():void;checkValidity():boolean;reportValidity():boolean;formResetCallback():void;formStateRestoreCallback(state:string|File|FormData|null,reason?:'autocomplete'|'restore'):void;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;disconnectedCallback():void;adoptedCallback():void; /** Resolves host-owned descriptions before the semantic group's generated descriptions. */ private syncExternalDescription;private releaseExternalDescription; /** Owns only requiredness text; the rendered hint and error IDs remain the baseline owners. */ private syncRequiredDescription;private releaseRequiredDescription;private renderSegment;private renderPatternPart;private columnValues; /** Bounded projection of every whole-second point on the effective native time step grid. */ private validPickerGridMilliseconds;private onColumnKeyDown;private isColumnValueSelected;private columnText;private renderColumn;render():TemplateResult;}declare global{interface HTMLElementTagNameMap{'lr-time-input':LyraTimeInput;}}export{};