bank20baht-ui 0.2.8 → 0.2.9

package/dist/components/primitives/baht-typeahead.d.ts

@@ -0,0 +1,92 @@
+import { PropertyValues, TemplateResult } from 'lit';
+import { BahtElement } from '../base.js';
+export interface TypeaheadOption {
+    key: string;
+    label: string;
+    /** Secondary text shown right-aligned (e.g. an email under a name). */
+    sub?: string;
+}
+/**
+ * Text input with suggestions (autocomplete). The value IS the text — pick a
+ * suggestion and the input shows its label; keep typing and the text stands
+ * on its own (`free-text`, default) or is only a filter (`free-text="false"`,
+ * blur then reverts to the last picked option).
+ *
+ * Suggestions come from a static `options` list (filtered here — labels that
+ * start with the term rank first, then labels that contain it) or from an
+ * async `fetcher(term)`. Typing is debounced (`debounce`, 150 ms) before the
+ * host hears `baht-change` and before a fetcher runs.
+ *
+ *   const el = document.createElement('baht-typeahead');
+ *   el.options = [{ key: 'th', label: 'Thailand' }, { key: 'tw', label: 'Taiwan' }];
+ *   el.addEventListener('baht-change', (e) => (draft.country = e.detail.value));
+ *   el.addEventListener('baht-select', (e) => (draft.countryCode = e.detail.option.key));
+ *
+ * ARIA: APG editable combobox with list autocomplete — the input is the
+ * combobox, `aria-activedescendant` walks the listbox, Escape closes, Enter
+ * picks. Unlike <baht-reference-picker> the input is always editable and the
+ * text itself is a valid value; unlike <baht-select> the list is a filter of
+ * what was typed, not a fixed menu.
+ */
+export declare class BahtTypeahead extends BahtElement {
+    /** Accessible name (also the listbox name). */
+    label: string;
+    /** The text. Controlled: re-feed after `baht-change` (or don't — the input keeps what was typed). */
+    value: string;
+    placeholder: string;
+    disabled: boolean;
+    /** Marks the control invalid (styles + aria-invalid). */
+    invalid: boolean;
+    /** Static suggestion list, filtered client-side. Ignored when `fetcher` is set. */
+    options: TypeaheadOption[];
+    /** Async suggestions: term in, options out. Errors show as "no matches". */
+    fetcher: ((term: string) => Promise<TypeaheadOption[]>) | null;
+    /** Quiet time (ms) before the host hears the text and suggestions are (re)computed. */
+    debounce: number;
+    /** Characters typed before suggestions appear (0 = suggest on focus/arrow too). */
+    minChars: number;
+    /** Cap on suggestions shown. */
+    maxItems: number;
+    /** false = the text must be a picked option; blur reverts otherwise. */
+    freeText: boolean;
+    /** HTML autocomplete token forwarded to the input ('off' keeps the browser's own list away). */
+    autocomplete: string;
+    private term;
+    private open;
+    private results;
+    private loading;
+    private activeIndex;
+    private inputEl;
+    private readonly uid;
+    private timer;
+    private fetchSeq;
+    /** The text currently IS this picked option (null once the user types again). */
+    private picked;
+    /** Most recent pick ever — what `free-text="false"` reverts to on blur. */
+    private lastPicked;
+    private readonly onDocMousedown;
+    private get inputId();
+    private get listboxId();
+    private optionId;
+    disconnectedCallback(): void;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    protected updated(): void;
+    private filterStatic;
+    private suggest;
+    private highlight;
+    private listen;
+    private close;
+    private emitChange;
+    private onInput;
+    /** Hand pending text to the host now (blur, Enter). */
+    private flush;
+    private pick;
+    private onBlur;
+    private onKeydown;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'baht-typeahead': BahtTypeahead;
+    }
+}

package/dist/components/primitives/index.d.ts

@@ -42,6 +42,7 @@ export { BahtEmptyState } from './baht-empty-state.js';
 export { BahtErrorState } from './baht-error-state.js';
 export { BahtKeyvalueEditor } from './baht-keyvalue-editor.js';
 export { BahtReferencePicker, type ReferenceOption } from './baht-reference-picker.js';
+export { BahtTypeahead, type TypeaheadOption } from './baht-typeahead.js';
 export { BahtRepeater } from './baht-repeater.js';
 export { BahtSteps } from './baht-steps.js';
 export { TAG_FOR_TYPE } from './tag-map.js';

package/dist/core/i18n.d.ts

@@ -41,6 +41,16 @@ export interface MessageCatalog {
     /** Placeholder option of a dropdown. */
     choose: string;
     rowCount: string;
+    close: string;
+    dismiss: string;
+    opensInNewTab: string;
+    otpCharacter: string;
+    row: string;
+    removeRowN: string;
+    stepDone: string;
+    stepCurrent: string;
+    today: string;
+    clear: string;
 }
 export type MessageKey = keyof MessageCatalog;
 export type Locale = 'en' | 'th';