@ibobbyts/svelte-ui-utils 0.1.2

package/dist/dropdown-search/DropdownSearch.svelte

@@ -0,0 +1,312 @@
+<script lang="ts">
+  import { onDestroy, onMount } from 'svelte';
+  import { getUiMessages, type UiLanguage } from '../i18n.js';
+  import { formatParamDict, normalizeDropdownSearchValue, resolveDropdownSearchStatus } from './state.js';
+  import type {
+    DropdownSearchChangeDetail,
+    DropdownSearchItem,
+    DropdownSearchItemValueGetter,
+    DropdownSearchLoadOptions,
+    DropdownSearchStatus
+  } from './types.js';
+
+  export let value = '';
+  export let selectedItem: DropdownSearchItem | null = null;
+  export let status: DropdownSearchStatus = 'empty';
+  export let placeholder = '';
+  export let debounceMs = 500;
+  export let limit = 10;
+  export let minLength = 1;
+  export let validate = true;
+  export let loadOptions: DropdownSearchLoadOptions;
+  export let id: string | undefined = undefined;
+  export let name: string | undefined = undefined;
+  export let ariaLabel: string | undefined = undefined;
+  export let listboxId: string | undefined = undefined;
+  export let disabled = false;
+  export let language: UiLanguage = 'en_us';
+  export let noResultsText: string | undefined = undefined;
+  export let loadingText: string | undefined = undefined;
+  export let clearLabel: string | undefined = undefined;
+  export let searchOnExternalValueChange = false;
+  export let width: string | undefined = undefined;
+  export let minWidth: string | undefined = undefined;
+  export let maxWidth: string | undefined = undefined;
+  export let getItemValue: DropdownSearchItemValueGetter = (item) => item.title;
+  export let onChange: ((detail: DropdownSearchChangeDetail) => void) | undefined = undefined;
+  export let onSelect: ((item: DropdownSearchItem) => void) | undefined = undefined;
+  export let onStatusChange: ((status: DropdownSearchStatus) => void) | undefined = undefined;
+  export let onInputBlur: ((event: FocusEvent) => void) | undefined = undefined;
+
+  let options: DropdownSearchItem[] = [];
+  let exactMatch: DropdownSearchItem | null = null;
+  let focused = false;
+  let inputElement: HTMLInputElement | undefined;
+  let searchTimer: ReturnType<typeof setTimeout> | undefined;
+  let activeController: AbortController | undefined;
+  let requestId = 0;
+  let lastHandledValue = value;
+
+  $: messages = getUiMessages(language);
+  $: resolvedNoResultsText = noResultsText?.trim() ? noResultsText : messages.dropdownSearch.noResultsText;
+  $: resolvedLoadingText = loadingText?.trim() ? loadingText : messages.dropdownSearch.loadingText;
+  $: resolvedClearLabel = clearLabel?.trim() ? clearLabel : messages.dropdownSearch.clearLabel;
+  $: resolvedListboxId = listboxId ?? (id ? `${id}-options` : undefined);
+  $: hasQuery = normalizeDropdownSearchValue(value).length > 0;
+  $: showOptions = focused && !disabled && (options.length > 0 || status === 'loading' || (hasQuery && status === 'invalid'));
+  $: if (!validate && status !== 'empty' && status !== 'loading') {
+    setStatus('empty');
+  }
+  $: if (searchOnExternalValueChange && value !== lastHandledValue) {
+    handleExternalValue(value);
+  }
+
+  function emitChange() {
+    const detail = { value, selectedItem, status };
+    onChange?.(detail);
+  }
+
+  function setStatus(nextStatus: DropdownSearchStatus) {
+    if (status !== nextStatus) {
+      status = nextStatus;
+      onStatusChange?.(status);
+    }
+  }
+
+  function resetSearchState(nextValue: string) {
+    lastHandledValue = nextValue;
+    value = nextValue;
+    selectedItem = null;
+    exactMatch = null;
+    options = [];
+    const trimmed = normalizeDropdownSearchValue(nextValue);
+    if (trimmed && trimmed.length >= minLength) {
+      abortActiveSearch();
+      setStatus('loading');
+    } else {
+      abortActiveSearch();
+      setStatus(resolveDropdownSearchStatus({ value, selectedItem, exactMatch, minLength, validate }));
+    }
+    emitChange();
+  }
+
+  function clearSearchTimer() {
+    if (searchTimer) {
+      clearTimeout(searchTimer);
+      searchTimer = undefined;
+    }
+  }
+
+  function abortActiveSearch() {
+    if (activeController) {
+      activeController.abort();
+      activeController = undefined;
+    }
+  }
+
+  async function runSearch(query: string) {
+    const trimmed = normalizeDropdownSearchValue(query);
+
+    if (!trimmed || trimmed.length < minLength) {
+      abortActiveSearch();
+      options = [];
+      exactMatch = null;
+      setStatus(resolveDropdownSearchStatus({ value: query, minLength, validate }));
+      emitChange();
+      return;
+    }
+
+    abortActiveSearch();
+    const currentRequestId = ++requestId;
+    const controller = new AbortController();
+    activeController = controller;
+    setStatus('loading');
+    emitChange();
+
+    try {
+      const result = await loadOptions(trimmed, { limit, signal: controller.signal });
+
+      if (controller.signal.aborted || currentRequestId !== requestId) {
+        return;
+      }
+
+      options = result.options ?? [];
+      exactMatch = validate ? (result.exactMatch ?? null) : null;
+      selectedItem = validate && exactMatch && !exactMatch.disabled ? exactMatch : null;
+      setStatus(resolveDropdownSearchStatus({ value, selectedItem, exactMatch, minLength, validate }));
+      emitChange();
+    } catch (error) {
+      if (controller.signal.aborted || currentRequestId !== requestId) {
+        return;
+      }
+
+      options = [];
+      exactMatch = null;
+      selectedItem = null;
+      setStatus(resolveDropdownSearchStatus({ value: query, errored: true, minLength, validate }));
+      emitChange();
+    } finally {
+      if (activeController === controller) {
+        activeController = undefined;
+      }
+    }
+  }
+
+  function scheduleSearch(query: string) {
+    clearSearchTimer();
+    searchTimer = setTimeout(() => {
+      void runSearch(query);
+    }, debounceMs);
+  }
+
+  function handleInput(event: Event) {
+    const input = event.currentTarget as HTMLInputElement;
+    resetSearchState(input.value);
+    scheduleSearch(input.value);
+  }
+
+  function selectItem(item: DropdownSearchItem) {
+    if (item.disabled) {
+      return;
+    }
+
+    clearSearchTimer();
+    abortActiveSearch();
+    selectedItem = item;
+    exactMatch = validate ? item : null;
+    value = getItemValue(item);
+    lastHandledValue = value;
+    setStatus(validate ? 'valid' : 'empty');
+    focused = false;
+    emitChange();
+    onSelect?.(item);
+  }
+
+  function clearSearch() {
+    if (!hasQuery || disabled) {
+      return;
+    }
+
+    clearSearchTimer();
+    abortActiveSearch();
+    value = '';
+    lastHandledValue = value;
+    selectedItem = null;
+    exactMatch = null;
+    options = [];
+    setStatus(resolveDropdownSearchStatus({ value, selectedItem, exactMatch, minLength, validate }));
+    focused = true;
+    emitChange();
+    inputElement?.focus();
+  }
+
+  function handleExternalValue(nextValue: string) {
+    lastHandledValue = nextValue;
+    selectedItem = null;
+    exactMatch = null;
+    options = [];
+
+    clearSearchTimer();
+    if (!normalizeDropdownSearchValue(nextValue) || normalizeDropdownSearchValue(nextValue).length < minLength) {
+      setStatus(resolveDropdownSearchStatus({ value: nextValue, selectedItem, exactMatch, minLength, validate }));
+      emitChange();
+      return;
+    }
+
+    void runSearch(nextValue);
+  }
+
+  onDestroy(() => {
+    clearSearchTimer();
+    abortActiveSearch();
+  });
+
+  onMount(() => {
+    if (searchOnExternalValueChange && normalizeDropdownSearchValue(value)) {
+      handleExternalValue(value);
+    }
+  });
+</script>
+
+<div
+  class={`suu-dropdown-search suu-dropdown-search--${status}`}
+  class:suu-dropdown-search--has-clear={hasQuery && !disabled}
+  data-status={status}
+  style:width
+  style:min-width={minWidth}
+  style:max-width={maxWidth}
+>
+  <div class="suu-dropdown-search__field">
+    <svg class="suu-dropdown-search__icon" viewBox="0 0 24 24" aria-hidden="true">
+      <circle cx="11" cy="11" r="7"></circle>
+      <path d="m16 16 4 4"></path>
+    </svg>
+    <input
+      bind:this={inputElement}
+      class="suu-dropdown-search__input"
+      {id}
+      {name}
+      {value}
+      {placeholder}
+      aria-label={ariaLabel}
+      {disabled}
+      autocomplete="off"
+      aria-autocomplete="list"
+      aria-controls={resolvedListboxId}
+      aria-expanded={showOptions}
+      aria-invalid={status === 'invalid' || status === 'error'}
+      on:input={handleInput}
+      on:focus={() => (focused = true)}
+      on:blur={(event) => {
+        onInputBlur?.(event);
+        setTimeout(() => (focused = false), 120);
+      }}
+    />
+    {#if hasQuery && !disabled}
+      <button
+        type="button"
+        class="suu-dropdown-search__clear"
+        aria-label={resolvedClearLabel}
+        title={resolvedClearLabel}
+        on:mousedown|preventDefault
+        on:click={clearSearch}
+      >
+        <svg viewBox="0 0 20 20" aria-hidden="true">
+          <path d="m6 6 8 8M14 6l-8 8"></path>
+        </svg>
+      </button>
+    {/if}
+  </div>
+
+  {#if showOptions}
+    <div class="suu-dropdown-search__menu">
+      <div class="suu-dropdown-search__menu-panel" id={resolvedListboxId} role="listbox">
+        {#if status === 'loading'}
+          <div class="suu-dropdown-search__empty suu-dropdown-search__empty--loading" aria-live="polite">
+            <span class="suu-dropdown-search__spinner" aria-hidden="true"></span>
+            <span>{resolvedLoadingText}</span>
+          </div>
+        {:else if options.length > 0}
+          {#each options as option (option.id)}
+            <button
+              type="button"
+              class="suu-dropdown-search__option"
+              class:suu-dropdown-search__option--disabled={option.disabled}
+              role="option"
+              aria-selected={selectedItem?.id === option.id}
+              disabled={option.disabled}
+              on:mousedown|preventDefault={() => selectItem(option)}
+            >
+              <span class="suu-dropdown-search__title">{option.title}</span>
+              {#if formatParamDict(option.param_dict).length > 0}
+                <span class="suu-dropdown-search__meta">{formatParamDict(option.param_dict).join(' · ')}</span>
+              {/if}
+            </button>
+          {/each}
+        {:else}
+          <div class="suu-dropdown-search__empty">{resolvedNoResultsText}</div>
+        {/if}
+      </div>
+    </div>
+  {/if}
+</div>

package/dist/dropdown-search/DropdownSearch.svelte.d.ts

@@ -0,0 +1,51 @@
+import { type UiLanguage } from '../i18n.js';
+import type { DropdownSearchChangeDetail, DropdownSearchItem, DropdownSearchItemValueGetter, DropdownSearchLoadOptions, DropdownSearchStatus } from './types.js';
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const DropdownSearch: $$__sveltets_2_IsomorphicComponent<{
+    value?: string;
+    selectedItem?: DropdownSearchItem | null;
+    status?: DropdownSearchStatus;
+    placeholder?: string;
+    debounceMs?: number;
+    limit?: number;
+    minLength?: number;
+    validate?: boolean;
+    loadOptions: DropdownSearchLoadOptions;
+    id?: string | undefined;
+    name?: string | undefined;
+    ariaLabel?: string | undefined;
+    listboxId?: string | undefined;
+    disabled?: boolean;
+    language?: UiLanguage;
+    noResultsText?: string | undefined;
+    loadingText?: string | undefined;
+    clearLabel?: string | undefined;
+    searchOnExternalValueChange?: boolean;
+    width?: string | undefined;
+    minWidth?: string | undefined;
+    maxWidth?: string | undefined;
+    getItemValue?: DropdownSearchItemValueGetter;
+    onChange?: ((detail: DropdownSearchChangeDetail) => void) | undefined;
+    onSelect?: ((item: DropdownSearchItem) => void) | undefined;
+    onStatusChange?: ((status: DropdownSearchStatus) => void) | undefined;
+    onInputBlur?: ((event: FocusEvent) => void) | undefined;
+}, {
+    mousedown: MouseEvent;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type DropdownSearch = InstanceType<typeof DropdownSearch>;
+export default DropdownSearch;
+//# sourceMappingURL=DropdownSearch.svelte.d.ts.map

package/dist/dropdown-search/DropdownSearch.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownSearch.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/DropdownSearch.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,EAAiB,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAE5D,OAAO,KAAK,EACR,0BAA0B,EAC1B,kBAAkB,EAClB,6BAA6B,EAC7B,yBAAyB,EACzB,oBAAoB,EACrB,MAAM,YAAY,CAAC;AAgRtB,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,cAAc;;mBAVoqB,kBAAkB,GAAG,IAAI;aAAW,oBAAoB;;;;;;iBAAiK,yBAAyB;SAAO,MAAM,GAAG,SAAS;WAAS,MAAM,GAAG,SAAS;gBAAc,MAAM,GAAG,SAAS;gBAAc,MAAM,GAAG,SAAS;;eAAyC,UAAU;oBAAkB,MAAM,GAAG,SAAS;kBAAgB,MAAM,GAAG,SAAS;iBAAe,MAAM,GAAG,SAAS;;YAA4E,MAAM,GAAG,SAAS;eAAa,MAAM,GAAG,SAAS;eAAa,MAAM,GAAG,SAAS;mBAAiB,6BAA6B;eAAa,CAAC,CAAC,MAAM,EAAE,0BAA0B,KAAK,IAAI,CAAC,GAAG,SAAS;eAAa,CAAC,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC,GAAG,SAAS;qBAAmB,CAAC,CAAC,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC,GAAG,SAAS;kBAAgB,CAAC,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC,GAAG,SAAS;;;;;kBAUniD,CAAC;AAClF,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,eAAe,cAAc,CAAC"}

package/dist/dropdown-search/index.d.ts

@@ -0,0 +1,6 @@
+export { default as DropdownSearch } from './DropdownSearch.svelte';
+export { getUiMessages, resolveUiLanguage, uiLanguages } from '../i18n.js';
+export { clampDropdownSearchLimit, formatParamDict, isUsableExactMatch, normalizeDropdownSearchValue, resolveDropdownSearchStatus } from './state.js';
+export type { UiLanguage, UiMessages } from '../i18n.js';
+export type { DropdownSearchChangeDetail, DropdownSearchItem, DropdownSearchItemValueGetter, DropdownSearchLoadContext, DropdownSearchLoadOptions, DropdownSearchResult, DropdownSearchStatus } from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/dropdown-search/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAC3E,OAAO,EACL,wBAAwB,EACxB,eAAe,EACf,kBAAkB,EAClB,4BAA4B,EAC5B,2BAA2B,EAC5B,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACzD,YAAY,EACV,0BAA0B,EAC1B,kBAAkB,EAClB,6BAA6B,EAC7B,yBAAyB,EACzB,yBAAyB,EACzB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,YAAY,CAAC"}

package/dist/dropdown-search/index.js

@@ -0,0 +1,3 @@
+export { default as DropdownSearch } from './DropdownSearch.svelte';
+export { getUiMessages, resolveUiLanguage, uiLanguages } from '../i18n.js';
+export { clampDropdownSearchLimit, formatParamDict, isUsableExactMatch, normalizeDropdownSearchValue, resolveDropdownSearchStatus } from './state.js';

package/dist/dropdown-search/state.d.ts

@@ -0,0 +1,15 @@
+import type { DropdownSearchItem, DropdownSearchStatus } from './types.js';
+export declare function normalizeDropdownSearchValue(value: string): string;
+export declare function clampDropdownSearchLimit(limit: number): number;
+export declare function isUsableExactMatch(item: DropdownSearchItem | null | undefined): item is DropdownSearchItem;
+export declare function resolveDropdownSearchStatus(params: {
+    value: string;
+    selectedItem?: DropdownSearchItem | null;
+    exactMatch?: DropdownSearchItem | null;
+    loading?: boolean;
+    errored?: boolean;
+    minLength?: number;
+    validate?: boolean;
+}): DropdownSearchStatus;
+export declare function formatParamDict(paramDict: DropdownSearchItem['param_dict']): string[];
+//# sourceMappingURL=state.d.ts.map

package/dist/dropdown-search/state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAE3E,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAElE;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAM9D;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,kBAAkB,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,kBAAkB,CAE1G;AAED,wBAAgB,2BAA2B,CAAC,MAAM,EAAE;IAClD,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACzC,UAAU,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,oBAAoB,CA8BvB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,kBAAkB,CAAC,YAAY,CAAC,GAAG,MAAM,EAAE,CAQrF"}

package/dist/dropdown-search/state.js

@@ -0,0 +1,44 @@
+export function normalizeDropdownSearchValue(value) {
+    return value.trim();
+}
+export function clampDropdownSearchLimit(limit) {
+    if (!Number.isFinite(limit)) {
+        return 10;
+    }
+    return Math.min(50, Math.max(1, Math.floor(limit)));
+}
+export function isUsableExactMatch(item) {
+    return Boolean(item && !item.disabled);
+}
+export function resolveDropdownSearchStatus(params) {
+    const trimmed = normalizeDropdownSearchValue(params.value);
+    const minLength = params.minLength ?? 1;
+    const validate = params.validate ?? true;
+    if (!trimmed) {
+        return 'empty';
+    }
+    if (params.loading) {
+        return 'loading';
+    }
+    if (!validate) {
+        return 'empty';
+    }
+    if (params.errored) {
+        return 'error';
+    }
+    if (trimmed.length < minLength) {
+        return 'invalid';
+    }
+    if (isUsableExactMatch(params.selectedItem) || isUsableExactMatch(params.exactMatch)) {
+        return 'valid';
+    }
+    return 'invalid';
+}
+export function formatParamDict(paramDict) {
+    if (!paramDict) {
+        return [];
+    }
+    return Object.entries(paramDict)
+        .filter(([, value]) => value !== null && value !== undefined && value !== '')
+        .map(([key, value]) => `${key}: ${value}`);
+}

package/dist/dropdown-search/types.d.ts

@@ -0,0 +1,24 @@
+export type DropdownSearchStatus = 'empty' | 'loading' | 'valid' | 'invalid' | 'error';
+export interface DropdownSearchItem {
+    id: string | number;
+    title: string;
+    param_dict?: Record<string, string | number | null>;
+    disabled?: boolean;
+    [key: string]: unknown;
+}
+export interface DropdownSearchLoadContext {
+    limit: number;
+    signal: AbortSignal;
+}
+export interface DropdownSearchResult {
+    options: DropdownSearchItem[];
+    exactMatch?: DropdownSearchItem | null;
+}
+export type DropdownSearchLoadOptions = (query: string, context: DropdownSearchLoadContext) => Promise<DropdownSearchResult> | DropdownSearchResult;
+export interface DropdownSearchChangeDetail {
+    value: string;
+    selectedItem: DropdownSearchItem | null;
+    status: DropdownSearchStatus;
+}
+export type DropdownSearchItemValueGetter = (item: DropdownSearchItem) => string;
+//# sourceMappingURL=types.d.ts.map

package/dist/dropdown-search/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown-search/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAEvF,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC,CAAC;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,kBAAkB,EAAE,CAAC;IAC9B,UAAU,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;CACxC;AAED,MAAM,MAAM,yBAAyB,GAAG,CACtC,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,yBAAyB,KAC/B,OAAO,CAAC,oBAAoB,CAAC,GAAG,oBAAoB,CAAC;AAE1D,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACxC,MAAM,EAAE,oBAAoB,CAAC;CAC9B;AAED,MAAM,MAAM,6BAA6B,GAAG,CAAC,IAAI,EAAE,kBAAkB,KAAK,MAAM,CAAC"}

package/dist/dropdown-search/types.js

@@ -0,0 +1 @@
+export {};

package/dist/i18n.d.ts

@@ -0,0 +1,31 @@
+export declare const uiLanguages: readonly ["en_us", "zh_cn", "zh_tw"];
+export type UiLanguage = (typeof uiLanguages)[number];
+type DateRangePresetKey = 'last24Hours' | 'last7Days' | 'last30Days' | 'today' | 'thisWeek' | 'thisMonth' | 'thisYear';
+export interface UiMessages {
+    toast: {
+        closeLabel: string;
+    };
+    dropdownSearch: {
+        noResultsText: string;
+        loadingText: string;
+        clearLabel: string;
+    };
+    table: {
+        emptyText: string;
+        pageSizeLabel: string;
+        paginationLabel: string;
+    };
+    dateRange: {
+        startLabel: string;
+        endLabel: string;
+        presetLabels: Record<DateRangePresetKey, string>;
+    };
+    numberRange: {
+        minLabel: string;
+        maxLabel: string;
+    };
+}
+export declare function resolveUiLanguage(language: UiLanguage | string | null | undefined): UiLanguage;
+export declare function getUiMessages(language: UiLanguage | string | null | undefined): UiMessages;
+export {};
+//# sourceMappingURL=i18n.d.ts.map

package/dist/i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../src/lib/i18n.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,sCAAuC,CAAC;AAEhE,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD,KAAK,kBAAkB,GACnB,aAAa,GACb,WAAW,GACX,YAAY,GACZ,OAAO,GACP,UAAU,GACV,WAAW,GACX,UAAU,CAAC;AAEf,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE;QACL,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,cAAc,EAAE;QACd,aAAa,EAAE,MAAM,CAAC;QACtB,WAAW,EAAE,MAAM,CAAC;QACpB,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,KAAK,EAAE;QACL,SAAS,EAAE,MAAM,CAAC;QAClB,aAAa,EAAE,MAAM,CAAC;QACtB,eAAe,EAAE,MAAM,CAAC;KACzB,CAAC;IACF,SAAS,EAAE;QACT,UAAU,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,MAAM,CAAC;QACjB,YAAY,EAAE,MAAM,CAAC,kBAAkB,EAAE,MAAM,CAAC,CAAC;KAClD,CAAC;IACF,WAAW,EAAE;QACX,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAqGD,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,UAAU,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,UAAU,CAiB9F;AAED,wBAAgB,aAAa,CAAC,QAAQ,EAAE,UAAU,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,UAAU,CAE1F"}

package/dist/i18n.js

@@ -0,0 +1,118 @@
+export const uiLanguages = ['en_us', 'zh_cn', 'zh_tw'];
+const messages = {
+    en_us: {
+        toast: {
+            closeLabel: 'Close notification'
+        },
+        dropdownSearch: {
+            noResultsText: 'Empty',
+            loadingText: 'Loading...',
+            clearLabel: 'Clear'
+        },
+        table: {
+            emptyText: 'No records',
+            pageSizeLabel: 'Rows',
+            paginationLabel: 'Pagination'
+        },
+        dateRange: {
+            startLabel: 'Start date',
+            endLabel: 'End date',
+            presetLabels: {
+                last24Hours: 'Last 24 Hours',
+                last7Days: 'Last 7 Days',
+                last30Days: 'Last 30 Days',
+                today: 'Today',
+                thisWeek: 'This Week',
+                thisMonth: 'This Month',
+                thisYear: 'This Year'
+            }
+        },
+        numberRange: {
+            minLabel: 'Min',
+            maxLabel: 'Max'
+        }
+    },
+    zh_cn: {
+        toast: {
+            closeLabel: '关闭通知'
+        },
+        dropdownSearch: {
+            noResultsText: '空',
+            loadingText: '搜索中...',
+            clearLabel: '清除'
+        },
+        table: {
+            emptyText: '暂无记录',
+            pageSizeLabel: '每页',
+            paginationLabel: '分页'
+        },
+        dateRange: {
+            startLabel: '开始日期',
+            endLabel: '结束日期',
+            presetLabels: {
+                last24Hours: '过去 24 小时',
+                last7Days: '过去 7 天',
+                last30Days: '过去 30 天',
+                today: '今天',
+                thisWeek: '本周',
+                thisMonth: '本月',
+                thisYear: '今年'
+            }
+        },
+        numberRange: {
+            minLabel: '最小值',
+            maxLabel: '最大值'
+        }
+    },
+    zh_tw: {
+        toast: {
+            closeLabel: '關閉通知'
+        },
+        dropdownSearch: {
+            noResultsText: '空',
+            loadingText: '搜尋中...',
+            clearLabel: '清除'
+        },
+        table: {
+            emptyText: '暫無記錄',
+            pageSizeLabel: '每頁',
+            paginationLabel: '分頁'
+        },
+        dateRange: {
+            startLabel: '開始日期',
+            endLabel: '結束日期',
+            presetLabels: {
+                last24Hours: '過去 24 小時',
+                last7Days: '過去 7 天',
+                last30Days: '過去 30 天',
+                today: '今天',
+                thisWeek: '本週',
+                thisMonth: '本月',
+                thisYear: '今年'
+            }
+        },
+        numberRange: {
+            minLabel: '最小值',
+            maxLabel: '最大值'
+        }
+    }
+};
+export function resolveUiLanguage(language) {
+    if (!language) {
+        return 'en_us';
+    }
+    const normalized = language.trim().toLowerCase().replaceAll('-', '_');
+    if (normalized === 'zh' || normalized === 'zh_cn' || normalized === 'zh_hans') {
+        return 'zh_cn';
+    }
+    if (normalized === 'zh_tw' || normalized === 'zh_hant' || normalized === 'zh_hk') {
+        return 'zh_tw';
+    }
+    if (normalized === 'en' || normalized === 'en_us') {
+        return 'en_us';
+    }
+    return 'en_us';
+}
+export function getUiMessages(language) {
+    return messages[resolveUiLanguage(language)];
+}

package/dist/index.d.ts

@@ -0,0 +1,7 @@
+export * from './toast/index.js';
+export * from './dropdown/index.js';
+export * from './dropdown-search/index.js';
+export * from './data-table/index.js';
+export { getUiMessages, resolveUiLanguage, uiLanguages } from './i18n.js';
+export type { UiLanguage, UiMessages } from './i18n.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC1E,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC"}

package/dist/index.js

@@ -0,0 +1,5 @@
+export * from './toast/index.js';
+export * from './dropdown/index.js';
+export * from './dropdown-search/index.js';
+export * from './data-table/index.js';
+export { getUiMessages, resolveUiLanguage, uiLanguages } from './i18n.js';