@ibobbyts/svelte-ui-utils 0.1.2

package/dist/data-table/index.js

@@ -0,0 +1,8 @@
+export { default as DataTable } from './DataTable.svelte';
+export { default as DateRangeFilter } from './DateRangeFilter.svelte';
+export { default as FilterTable } from './FilterTable.svelte';
+export { default as NumberRangeFilter } from './NumberRangeFilter.svelte';
+export { default as Pagination } from '../pagination/Pagination.svelte';
+export { filter } from './filter.js';
+export { getUiMessages, resolveUiLanguage, uiLanguages } from '../i18n.js';
+export { getAriaSort, getCellValue, getPageCount, normalizePagination, setDataTableFilters, setDataTablePageSize, setDataTablePagination, setDataTableSort, toggleSort } from './state.js';

package/dist/data-table/state.d.ts

@@ -0,0 +1,11 @@
+import type { DataTableColumn, DataTableState, FilterState, PaginationState, SortState } from './types.js';
+export declare function toggleSort(current: SortState | null, columnKey: string): SortState;
+export declare function getAriaSort(sort: SortState | null, columnKey: string): 'none' | 'ascending' | 'descending';
+export declare function getPageCount(totalRows: number, pageSize: number): number;
+export declare function normalizePagination(pagination: PaginationState, totalRows: number): PaginationState;
+export declare function setDataTableSort(state: DataTableState, columnKey: string): DataTableState;
+export declare function setDataTablePagination(state: DataTableState, pagination: PaginationState, totalRows: number): DataTableState;
+export declare function setDataTablePageSize(state: DataTableState, pageSize: number, totalRows: number): DataTableState;
+export declare function setDataTableFilters(state: DataTableState, filters: FilterState): DataTableState;
+export declare function getCellValue<Row = unknown>(row: Row, column: DataTableColumn<Row>): unknown;
+//# sourceMappingURL=state.d.ts.map

package/dist/data-table/state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../src/lib/data-table/state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,WAAW,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE3G,wBAAgB,UAAU,CAAC,OAAO,EAAE,SAAS,GAAG,IAAI,EAAE,SAAS,EAAE,MAAM,GAAG,SAAS,CAMlF;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,SAAS,GAAG,IAAI,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,YAAY,CAM1G;AAED,wBAAgB,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMxE;AAED,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,GAAG,eAAe,CAQnG;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,GAAG,cAAc,CAMzF;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,GAAG,cAAc,CAK5H;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,cAAc,CAE/G;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,WAAW,GAAG,cAAc,CAM/F;AAED,wBAAgB,YAAY,CAAC,GAAG,GAAG,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAE,eAAe,CAAC,GAAG,CAAC,WAUjF"}

package/dist/data-table/state.js

@@ -0,0 +1,58 @@
+export function toggleSort(current, columnKey) {
+    if (!current || current.key !== columnKey) {
+        return { key: columnKey, direction: 'asc' };
+    }
+    return { key: columnKey, direction: current.direction === 'asc' ? 'desc' : 'asc' };
+}
+export function getAriaSort(sort, columnKey) {
+    if (!sort || sort.key !== columnKey) {
+        return 'none';
+    }
+    return sort.direction === 'asc' ? 'ascending' : 'descending';
+}
+export function getPageCount(totalRows, pageSize) {
+    if (pageSize <= 0) {
+        return 1;
+    }
+    return Math.max(1, Math.ceil(Math.max(0, totalRows) / pageSize));
+}
+export function normalizePagination(pagination, totalRows) {
+    const pageSize = Math.max(1, pagination.pageSize);
+    const pageCount = getPageCount(totalRows, pageSize);
+    return {
+        pageSize,
+        page: Math.min(Math.max(1, pagination.page), pageCount)
+    };
+}
+export function setDataTableSort(state, columnKey) {
+    return {
+        ...state,
+        sort: toggleSort(state.sort, columnKey),
+        pagination: { ...state.pagination, page: 1 }
+    };
+}
+export function setDataTablePagination(state, pagination, totalRows) {
+    return {
+        ...state,
+        pagination: normalizePagination(pagination, totalRows)
+    };
+}
+export function setDataTablePageSize(state, pageSize, totalRows) {
+    return setDataTablePagination(state, { page: 1, pageSize }, totalRows);
+}
+export function setDataTableFilters(state, filters) {
+    return {
+        ...state,
+        filters,
+        pagination: { ...state.pagination, page: 1 }
+    };
+}
+export function getCellValue(row, column) {
+    if (column.render) {
+        return column.render(row, column);
+    }
+    const value = row && typeof row === 'object' && column.key in row
+        ? row[column.key]
+        : undefined;
+    return value === null || value === undefined ? '' : value;
+}

package/dist/data-table/types.d.ts

@@ -0,0 +1,167 @@
+import type { DropdownSearchChangeDetail, DropdownSearchItem, DropdownSearchItemValueGetter, DropdownSearchLoadOptions, DropdownSearchStatus } from '../dropdown-search/types.js';
+import type { DropdownPlacement } from '../dropdown/types.js';
+export type SortDirection = 'asc' | 'desc';
+export type DataTableLayout = 'auto' | 'fixed';
+export interface SortState {
+    key: string;
+    direction: SortDirection;
+}
+export type DataTableSortChangeHandler = (sort: SortState) => void | Promise<void>;
+export type DataTableStateChangeHandler = (nextState: DataTableState) => void | Promise<void>;
+export interface PaginationState {
+    page: number;
+    pageSize: number;
+}
+export type PaginationDropdownPlacement = DropdownPlacement;
+export type PaginationChangeHandler = (pagination: PaginationState) => void | Promise<void>;
+export type FilterValue = string | number | boolean | null | undefined | DateRangeFilterValue | NumberRangeFilterValue | Array<string | number> | Record<string, unknown>;
+export type FilterState = Record<string, FilterValue>;
+export interface DataTableState {
+    sort: SortState | null;
+    pagination: PaginationState;
+    filters: FilterState;
+}
+export type DataTableCellValue = unknown;
+export type DataTableClassValue<Row = unknown> = string | undefined | null | ((row: Row, value: DataTableCellValue, column: DataTableColumn<Row>) => string | undefined | null);
+export type DataTableRowKey<Row = unknown> = string | ((row: Row, index: number) => string | number);
+export type DataTableRowAttributes<Row = unknown> = (row: Row, index: number) => Record<string, string | number | boolean | null | undefined>;
+export interface DataTableColumn<Row = unknown> {
+    key: string;
+    header: string;
+    sortable?: boolean;
+    align?: 'left' | 'center' | 'right';
+    class?: DataTableClassValue<Row>;
+    headerClass?: string;
+    nowrap?: boolean;
+    render?: (row: Row, column: DataTableColumn<Row>) => DataTableCellValue;
+}
+export interface FilterOption {
+    label: string;
+    value: string | number;
+    disabled?: boolean;
+}
+export type FilterActionVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
+export type FilterActionIcon = 'search' | 'qr' | 'x';
+export interface FilterButtonControl {
+    type: 'button';
+    label?: string;
+    ariaLabel?: string;
+    icon?: FilterActionIcon;
+    variant?: FilterActionVariant;
+    disabled?: boolean;
+    onClick: () => void | Promise<void>;
+}
+export interface FilterLinkControl {
+    type: 'link';
+    label: string;
+    href: string;
+    ariaLabel?: string;
+    icon?: FilterActionIcon;
+    variant?: FilterActionVariant;
+}
+export interface FilterSelectControl {
+    type: 'select';
+    value: string | number;
+    ariaLabel?: string;
+    options: FilterOption[];
+    onChange: (value: string) => void | Promise<void>;
+}
+export type DateRangePreset = 'last24Hours' | 'last7Days' | 'last30Days' | 'today' | 'thisWeek' | 'thisMonth' | 'thisYear';
+export interface DateRangeFilterValue {
+    startDate: string;
+    endDate: string;
+    preset: DateRangePreset | null;
+    startDateTime?: string;
+    endDateTime?: string;
+}
+export interface NumberRangeFilterValue {
+    min: number | null;
+    max: number | null;
+}
+export interface CheckboxFilterControl {
+    type: 'checkbox';
+    value: Array<string | number>;
+    options: FilterOption[];
+    onChange: (value: Array<string | number>) => void | Promise<void>;
+}
+export interface RadioFilterControl {
+    type: 'radio';
+    value: string | number | null | undefined;
+    options: FilterOption[];
+    onChange: (value: string | number) => void | Promise<void>;
+}
+export interface DropdownSearchFilterControl {
+    type: 'dropdownSearch';
+    value: string;
+    selectedItem: DropdownSearchItem | null;
+    status: DropdownSearchStatus;
+    ariaLabel?: string;
+    placeholder?: string;
+    debounceMs?: number;
+    limit?: number;
+    minLength?: number;
+    noResultsText?: string;
+    loadingText?: string;
+    clearLabel?: string;
+    searchOnExternalValueChange?: boolean;
+    width?: string;
+    minWidth?: string;
+    maxWidth?: string;
+    getItemValue?: DropdownSearchItemValueGetter;
+    loadOptions: DropdownSearchLoadOptions;
+    onChange: (detail: DropdownSearchChangeDetail) => void | Promise<void>;
+}
+export interface DateRangeFilterControl {
+    type: 'dateRange';
+    value: DateRangeFilterValue;
+    startLabel?: string;
+    endLabel?: string;
+    presetLabels?: Partial<Record<DateRangePreset, string>>;
+    now?: () => Date;
+    weekStartsOn?: 0 | 1;
+    onChange: (value: DateRangeFilterValue) => void | Promise<void>;
+}
+export interface NumberRangeFilterControl {
+    type: 'numberRange';
+    value: NumberRangeFilterValue;
+    minLabel?: string;
+    maxLabel?: string;
+    prefixLabel?: string;
+    min?: number;
+    max?: number;
+    step?: number | string;
+    width?: string;
+    onChange: (value: NumberRangeFilterValue) => void | Promise<void>;
+}
+export interface FilterContainerControl {
+    type: 'container';
+    controls: FilterControl[];
+}
+export type FilterControl = CheckboxFilterControl | RadioFilterControl | DropdownSearchFilterControl | DateRangeFilterControl | NumberRangeFilterControl | FilterButtonControl | FilterLinkControl | FilterSelectControl | FilterContainerControl;
+export interface FilterTableRow {
+    key: string;
+    title: string;
+    filter: FilterControl;
+}
+export type CheckboxFilterDefinition = CheckboxFilterControl & {
+    key: string;
+    label: string;
+};
+export type RadioFilterDefinition = RadioFilterControl & {
+    key: string;
+    label: string;
+};
+export type DropdownSearchFilterDefinition = DropdownSearchFilterControl & {
+    key: string;
+    label: string;
+};
+export type DateRangeFilterDefinition = DateRangeFilterControl & {
+    key: string;
+    label: string;
+};
+export type NumberRangeFilterDefinition = NumberRangeFilterControl & {
+    key: string;
+    label: string;
+};
+export type FilterDefinition = CheckboxFilterDefinition | RadioFilterDefinition | DropdownSearchFilterDefinition | DateRangeFilterDefinition | NumberRangeFilterDefinition;
+//# sourceMappingURL=types.d.ts.map

package/dist/data-table/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/data-table/types.ts"],"names":[],"mappings":"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"}

package/dist/data-table/types.js

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

package/dist/dropdown/Dropdown.svelte

@@ -0,0 +1,159 @@
+<script lang="ts">
+  import type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
+
+  export let id: string | undefined = undefined;
+  export let value: DropdownValue = '';
+  export let options: DropdownOption[] = [];
+  export let ariaLabel: string | undefined = undefined;
+  export let placement: DropdownPlacement = 'down';
+  export let disabled = false;
+  export let onChange: DropdownChangeHandler | undefined = undefined;
+
+  let open = false;
+  let activeValue: DropdownValue = value;
+  let buttonElement: HTMLButtonElement | undefined;
+
+  $: selectedOption = options.find((option) => option.value === value);
+  $: selectedText = selectedOption?.label ?? String(value);
+  $: if (!open) {
+    activeValue = selectedOption?.value ?? firstEnabledOption()?.value ?? value;
+  }
+
+  function firstEnabledOption(): DropdownOption | undefined {
+    return options.find((option) => !option.disabled);
+  }
+
+  function activeOptionIndex(nextActiveValue: DropdownValue): number {
+    const index = options.findIndex((option) => option.value === nextActiveValue && !option.disabled);
+    if (index >= 0) {
+      return index;
+    }
+    const fallbackIndex = options.findIndex((option) => option.value === value && !option.disabled);
+    if (fallbackIndex >= 0) {
+      return fallbackIndex;
+    }
+    return options.findIndex((option) => !option.disabled);
+  }
+
+  function moveActiveOption(offset: number) {
+    const enabledOptions = options.filter((option) => !option.disabled);
+    if (enabledOptions.length === 0) {
+      return;
+    }
+
+    const currentIndex = Math.max(0, enabledOptions.findIndex((option) => option.value === activeValue));
+    const nextIndex = (currentIndex + offset + enabledOptions.length) % enabledOptions.length;
+    activeValue = enabledOptions[nextIndex]?.value ?? activeValue;
+  }
+
+  function selectOption(option: DropdownOption) {
+    if (option.disabled) {
+      return;
+    }
+    open = false;
+    activeValue = option.value;
+    void onChange?.(option.value);
+    buttonElement?.focus();
+  }
+
+  function toggleOpen() {
+    if (disabled) {
+      return;
+    }
+    open = !open;
+    activeValue = selectedOption?.value ?? firstEnabledOption()?.value ?? value;
+  }
+
+  function handleKeydown(event: KeyboardEvent) {
+    if (disabled) {
+      return;
+    }
+
+    if (event.key === 'Escape') {
+      if (open) {
+        event.preventDefault();
+        open = false;
+      }
+      return;
+    }
+
+    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+      event.preventDefault();
+      if (!open) {
+        open = true;
+        activeValue = selectedOption?.value ?? firstEnabledOption()?.value ?? value;
+      }
+      moveActiveOption(event.key === 'ArrowDown' ? 1 : -1);
+      return;
+    }
+
+    if ((event.key === 'Enter' || event.key === ' ') && open) {
+      event.preventDefault();
+      const index = activeOptionIndex(activeValue);
+      const option = index >= 0 ? options[index] : undefined;
+      if (option) {
+        selectOption(option);
+      }
+    }
+  }
+
+  function handleFocusout(event: FocusEvent) {
+    const nextTarget = event.relatedTarget;
+    if (nextTarget instanceof Node && event.currentTarget instanceof Node && event.currentTarget.contains(nextTarget)) {
+      return;
+    }
+    open = false;
+  }
+</script>
+
+<span class="suu-dropdown" on:focusout={handleFocusout}>
+  <button
+    bind:this={buttonElement}
+    {id}
+    type="button"
+    class="suu-dropdown__button"
+    {disabled}
+    aria-label={ariaLabel}
+    aria-haspopup="listbox"
+    aria-expanded={open}
+    data-value={String(value)}
+    on:click={toggleOpen}
+    on:keydown={handleKeydown}
+  >
+    <span>{selectedText}</span>
+    <span class="suu-dropdown__chevron" aria-hidden="true"></span>
+  </button>
+
+  {#if open}
+    <div
+      class="suu-dropdown__menu"
+      class:suu-dropdown__menu--up={placement === 'up'}
+      class:suu-dropdown__menu--down={placement === 'down'}
+    >
+      <div class="suu-dropdown__panel" role="listbox" aria-label={ariaLabel}>
+        {#each options as option}
+          <button
+            type="button"
+            class="suu-dropdown__option"
+            class:suu-dropdown__option--active={option.value === activeValue}
+            class:suu-dropdown__option--disabled={option.disabled}
+            role="option"
+            aria-selected={option.value === value}
+            aria-disabled={option.disabled}
+            disabled={option.disabled}
+            data-value={String(option.value)}
+            on:mousedown|preventDefault={() => undefined}
+            on:mouseenter={() => {
+              if (!option.disabled) {
+                activeValue = option.value;
+              }
+            }}
+            on:click={() => selectOption(option)}
+          >
+            {option.label}
+          </button>
+        {/each}
+      </div>
+    </div>
+  {/if}
+</span>

package/dist/dropdown/Dropdown.svelte.d.ts

@@ -0,0 +1,28 @@
+import type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } 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 Dropdown: $$__sveltets_2_IsomorphicComponent<{
+    id?: string | undefined;
+    value?: DropdownValue;
+    options?: DropdownOption[];
+    ariaLabel?: string | undefined;
+    placement?: DropdownPlacement;
+    disabled?: boolean;
+    onChange?: DropdownChangeHandler | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type Dropdown = InstanceType<typeof Dropdown>;
+export default Dropdown;
+//# sourceMappingURL=Dropdown.svelte.d.ts.map

package/dist/dropdown/Dropdown.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/Dropdown.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAuI1G,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,QAAQ;SAV8I,MAAM,GAAG,SAAS;YAAU,aAAa;cAAY,cAAc,EAAE;gBAAc,MAAM,GAAG,SAAS;gBAAc,iBAAiB;;eAAyC,qBAAqB,GAAG,SAAS;;;kBAU7Q,CAAC;AAC5E,KAAK,QAAQ,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AAChD,eAAe,QAAQ,CAAC"}

package/dist/dropdown/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Dropdown } from './Dropdown.svelte';
+export type { DropdownChangeHandler, DropdownOption, DropdownPlacement, DropdownValue } from './types.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,YAAY,EAAE,qBAAqB,EAAE,cAAc,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}

package/dist/dropdown/index.js

@@ -0,0 +1 @@
+export { default as Dropdown } from './Dropdown.svelte';

package/dist/dropdown/types.d.ts

@@ -0,0 +1,9 @@
+export type DropdownValue = string | number;
+export type DropdownPlacement = 'up' | 'down';
+export interface DropdownOption {
+    label: string;
+    value: DropdownValue;
+    disabled?: boolean;
+}
+export type DropdownChangeHandler = (value: DropdownValue) => void | Promise<void>;
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/lib/dropdown/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,MAAM,CAAC;AAE9C,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,qBAAqB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC"}

package/dist/dropdown/types.js

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