@casinogate/ui 1.11.14 → 2.0.0

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

@@ -0,0 +1,2 @@
+export * as Collapsible from './components/index.js';
+export type * from './types.js';

package/dist/primitives/collapsible/index.js

@@ -0,0 +1 @@
+export * as Collapsible from './components/index.js';

package/dist/primitives/collapsible/styles.d.ts

@@ -0,0 +1,70 @@
+import { Context } from 'runed';
+import type { ReadableBox } from 'svelte-toolbelt';
+export type CollapsibleVariant = 'default' | 'none';
+export type CollapsibleIconPosition = 'start' | 'end';
+export type CollapsibleVariants = {
+    variant: CollapsibleVariant;
+    iconPosition: CollapsibleIconPosition;
+};
+export declare const collapsibleRootVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, string[], {
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, string[], unknown, unknown, undefined>>;
+export declare const collapsibleTriggerVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+    iconPosition: {
+        start: string[];
+        end: string[];
+    };
+}, undefined, string[], {
+    variant: {
+        default: string[];
+        none: string[];
+    };
+    iconPosition: {
+        start: string[];
+        end: string[];
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+    iconPosition: {
+        start: string[];
+        end: string[];
+    };
+}, undefined, string[], unknown, unknown, undefined>>;
+export declare const collapsibleIconVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, string[], {
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string[];
+        none: string[];
+    };
+}, undefined, string[], unknown, unknown, undefined>>;
+export declare const collapsibleContentVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+export declare const CollapsibleStylesContext: Context<ReadableBox<CollapsibleVariants>>;

package/dist/primitives/collapsible/styles.js

@@ -0,0 +1,55 @@
+import { keyWithPrefix } from '../../internal/utils/common.js';
+import { tv } from '../../internal/utils/tailwindcss.js';
+import { Context } from 'runed';
+export const collapsibleRootVariants = tv({
+    base: [
+        'cgui:relative cgui:overflow-hidden',
+        'cgui:w-full',
+        'cgui:transition-all cgui:duration-250 cgui:ease-in-out',
+        'cgui:data-[disabled]:opacity-50 cgui:data-[disabled]:cursor-not-allowed cgui:data-[disabled]:pointer-events-none',
+    ],
+    variants: {
+        variant: {
+            default: [
+                'cgui:bg-surface-lightest',
+                'cgui:border cgui:border-stroke-divider cgui:rounded-sm',
+                'cgui:hover:[&_[data-slot=icon]]:text-icon-focus',
+            ],
+            none: [''],
+        },
+    },
+});
+export const collapsibleTriggerVariants = tv({
+    base: [
+        'cgui:w-full cgui:text-left cgui:py-1.5 cgui:px-2 cgui:flex cgui:items-center cgui:gap-1',
+        'cgui:cursor-pointer cgui:font-normal cgui:text-body-2',
+        'cgui:data-[state=open]:[&_[data-slot=icon]]:rotate-90',
+    ],
+    variants: {
+        variant: {
+            default: ['cgui:text-fg-darkest'],
+            none: [''],
+        },
+        iconPosition: {
+            start: ['cgui:flex-row'],
+            end: ['cgui:flex-row-reverse cgui:justify-end'],
+        },
+    },
+});
+export const collapsibleIconVariants = tv({
+    base: [
+        'cgui:relative cgui:inline-flex cgui:ml-auto cgui:size-6 cgui:items-center cgui:justify-center cgui:shrink-0',
+        'cgui:transition-all cgui:duration-250 cgui:ease-in-out',
+        'cgui:[&>svg]:size-5',
+    ],
+    variants: {
+        variant: {
+            default: ['cgui:text-icon-regular'],
+            none: [''],
+        },
+    },
+});
+export const collapsibleContentVariants = tv({
+    base: ['cgui:px-2 cgui:pb-1.5', 'cgui:text-fg-medium cgui:text-body-2'],
+});
+export const CollapsibleStylesContext = new Context(keyWithPrefix('collapsible-styles'));

package/dist/primitives/collapsible/types.d.ts

@@ -0,0 +1,12 @@
+import { type CollapsibleContentProps as CollapsibleContentPropsPrimitive, type CollapsibleRootProps as CollapsibleRootPropsPrimitive, type CollapsibleTriggerProps as CollapsibleTriggerPropsPrimitive } from 'bits-ui';
+import type { Snippet } from 'svelte';
+import type { WithChild, WithoutChild } from 'svelte-toolbelt';
+import type { CollapsibleVariants } from './styles.js';
+export type CollapsibleOpenVariant = 'single' | 'multiple';
+export type CollapsibleRootProps = CollapsibleRootPropsPrimitive & Partial<CollapsibleVariants>;
+export type CollapsibleContentProps = CollapsibleContentPropsPrimitive;
+export type CollapsibleTriggerProps = WithChild<WithoutChild<CollapsibleTriggerPropsPrimitive> & Partial<CollapsibleVariants> & {
+    icon?: Snippet | null;
+}, {
+    open: boolean;
+}>;

package/dist/primitives/collapsible/types.js

@@ -0,0 +1 @@
+import {} from 'bits-ui';

package/dist/primitives/combobox/components/combobox.content.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+  import { cn } from '../../../internal/utils/common.js';
+  import { Command } from '../../command/index.js';
+  import { Popover } from '../../popover/index.js';
+  import type { ComboboxContentProps } from '../types.js';
+
+  let { class: className, children, commandKey, ...restProps }: ComboboxContentProps = $props();
+</script>
+
+<Popover.Content class={cn('cgui:overflow-hidden cgui:rounded-md', className)} {...restProps}>
+  {#key commandKey}
+    <Command.Root>
+      {@render children?.()}
+    </Command.Root>
+  {/key}
+</Popover.Content>

package/dist/primitives/combobox/components/combobox.content.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { ComboboxContentProps } from '../types.js';
+declare const Combobox: import("svelte").Component<ComboboxContentProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.empty.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxEmptyProps } from '../types.js';
+
+  let { empty, children, ...restProps }: ComboboxEmptyProps = $props();
+</script>
+
+{#if typeof empty === 'string'}
+  <Command.Empty {...restProps}>{empty}</Command.Empty>
+{:else if empty}
+  {@render empty({ props: {} })}
+{:else}
+  <Command.Empty {...restProps}>
+    {#if children}
+      {@render children()}
+    {:else}
+      No results found
+    {/if}
+  </Command.Empty>
+{/if}

package/dist/primitives/combobox/components/combobox.empty.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { ComboboxEmptyProps } from '../types.js';
+declare const Combobox: import("svelte").Component<ComboboxEmptyProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.group-heading.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxGroupHeadingProps } from '../types.js';
+
+  let { children, ...restProps }: ComboboxGroupHeadingProps = $props();
+</script>
+
+<Command.GroupHeading {...restProps}>
+  {@render children?.()}
+</Command.GroupHeading>

package/dist/primitives/combobox/components/combobox.group-heading.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Combobox: import("svelte").Component<import("../../command/index.js").CommandGroupHeadingProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.group-items.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxGroupItemsProps } from '../types.js';
+
+  let { children, ...restProps }: ComboboxGroupItemsProps = $props();
+</script>
+
+<Command.GroupItems {...restProps}>
+  {@render children?.()}
+</Command.GroupItems>

package/dist/primitives/combobox/components/combobox.group-items.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Combobox: import("svelte").Component<import("bits-ui").CommandGroupItemsProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.group.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxGroupProps } from '../types.js';
+
+  let { children, ...restProps }: ComboboxGroupProps = $props();
+</script>
+
+<Command.Group {...restProps}>
+  {@render children?.()}
+</Command.Group>

package/dist/primitives/combobox/components/combobox.group.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Combobox: import("svelte").Component<import("../../command/index.js").CommandGroupProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.input.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxInputProps } from '../types.js';
+  import { ComboboxRootState } from './combobox.svelte.js';
+
+  let { placeholder, ...restProps }: ComboboxInputProps = $props();
+
+  const rootState = ComboboxRootState.get();
+</script>
+
+<Command.Input bind:value={rootState.opts.searchValue.current} {placeholder} {...restProps} />

package/dist/primitives/combobox/components/combobox.input.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { ComboboxInputProps } from '../types.js';
+declare const Combobox: import("svelte").Component<ComboboxInputProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.item.svelte

@@ -0,0 +1,41 @@
+<script lang="ts" generics="TItem extends ComboboxItem">
+  import { boolAttr } from '../../../internal/utils/attrs.js';
+  import { Command } from '../../command/index.js';
+  import type { ComboboxItem, ComboboxItemProps } from '../types.js';
+  import { ComboboxRootState } from './combobox.svelte.js';
+
+  let { item, children: childSnippet }: ComboboxItemProps<TItem> = $props();
+
+  const rootState = ComboboxRootState.get<TItem>();
+  const itemValue = $derived(item.value);
+  const selected = $derived(rootState.isSelected(itemValue));
+  const itemAttrs = $derived.by(() => {
+    const {
+      value,
+      label: _,
+      icon: __,
+      shortcut: ___,
+      onSelect,
+      key: ____,
+      preventSelect: _____,
+      __creatable: ______,
+      inputValue: _______,
+      ...restItem
+    } = item;
+
+    return {
+      value,
+      onSelect: () => {
+        onSelect?.();
+        rootState.selectItem(item);
+      },
+      ...restItem,
+    };
+  });
+</script>
+
+<Command.Item {...itemAttrs} data-selected={boolAttr(selected)}>
+  {#snippet child({ props })}
+    {@render childSnippet?.({ item, props, selected })}
+  {/snippet}
+</Command.Item>

package/dist/primitives/combobox/components/combobox.item.svelte.d.ts

@@ -0,0 +1,25 @@
+import type { ComboboxItem, ComboboxItemProps } from '../types.js';
+declare function $$render<TItem extends ComboboxItem>(): {
+    props: ComboboxItemProps<TItem>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<TItem extends ComboboxItem> {
+    props(): ReturnType<typeof $$render<TItem>>['props'];
+    events(): ReturnType<typeof $$render<TItem>>['events'];
+    slots(): ReturnType<typeof $$render<TItem>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TItem extends ComboboxItem>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TItem>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TItem>['props']>, ReturnType<__sveltets_Render<TItem>['events']>, ReturnType<__sveltets_Render<TItem>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TItem>['bindings']>;
+    } & ReturnType<__sveltets_Render<TItem>['exports']>;
+    <TItem extends ComboboxItem>(internal: unknown, props: ReturnType<__sveltets_Render<TItem>['props']> & {}): ReturnType<__sveltets_Render<TItem>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Combobox: $$IsomorphicComponent;
+type Combobox<TItem extends ComboboxItem> = InstanceType<typeof Combobox<TItem>>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.list.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxListProps } from '../types.js';
+
+  let { children, maxContentHeight, ...restProps }: ComboboxListProps = $props();
+</script>
+
+<Command.List class="cgui:rounded-inherit" style={{ maxHeight: maxContentHeight }} {...restProps}>
+  {@render children?.()}
+</Command.List>

package/dist/primitives/combobox/components/combobox.list.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { ComboboxListProps } from '../types.js';
+declare const Combobox: import("svelte").Component<ComboboxListProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.portal.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import { Popover } from '../../popover/index.js';
+  import type { ComboboxPortalProps } from '../types.js';
+
+  let { children, disabled, ...restProps }: ComboboxPortalProps = $props();
+</script>
+
+<Popover.Portal {disabled} {...restProps}>
+  {@render children?.()}
+</Popover.Portal>

package/dist/primitives/combobox/components/combobox.portal.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Combobox: import("svelte").Component<import("bits-ui").PortalProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.root.svelte

@@ -0,0 +1,81 @@
+<script lang="ts" generics="TItem extends ComboboxItem">
+  import { SELECTION_TYPE } from '../../../internal/constants/selection-type.js';
+  import { noop } from '../../../internal/utils/common.js';
+  import { Popover } from '../../popover/index.js';
+  import { watch } from 'runed';
+  import { boxWith } from 'svelte-toolbelt';
+  import type { ComboboxItem, ComboboxRootProps } from '../types.js';
+  import { ComboboxRootState } from './combobox.svelte.js';
+
+  let {
+    open = $bindable(false),
+    value = $bindable(),
+    searchValue = $bindable(''),
+    type,
+    items = [],
+    groups: _groups = [],
+    empty: _empty,
+    placeholder = 'Select an option',
+    searchPlaceholder: _searchPlaceholder,
+    portalDisabled: _portalDisabled,
+    allowDeselect = true,
+    triggerClass: _triggerClass,
+    contentClass: _contentClass,
+    closeOnSelect,
+    maxContentHeight: _maxContentHeight,
+    clearable: _clearable,
+    trigger: _triggerSnippet,
+    item: _itemSnippet,
+    label: _labelSnippet,
+    size: _size,
+    variant: _variant,
+    rounded: _rounded,
+    fullWidth: _fullWidth,
+    onSelect = noop,
+    children,
+    ...restProps
+  }: ComboboxRootProps<TItem> = $props();
+
+  const rootState = ComboboxRootState.create<TItem>({
+    open: boxWith(
+      () => open,
+      (next) => {
+        open = next;
+      }
+    ),
+    value: boxWith(
+      () => value,
+      (next) => {
+        value = next;
+      }
+    ),
+    searchValue: boxWith(
+      () => searchValue,
+      (next) => {
+        searchValue = next;
+      }
+    ),
+    type: boxWith(() => type),
+    items: boxWith(() => items),
+    placeholder: boxWith(() => placeholder),
+    allowDeselect: boxWith(() => allowDeselect),
+    closeOnSelect: boxWith(() => closeOnSelect),
+    onSelect,
+  });
+
+  if (value === undefined) {
+    value = rootState.defaultValue;
+  }
+
+  watch.pre(
+    () => value,
+    () => {
+      if (value !== undefined) return;
+      value = type === SELECTION_TYPE.MULTIPLE ? [] : '';
+    }
+  );
+</script>
+
+<Popover.Root bind:open={rootState.opts.open.current} {...restProps}>
+  {@render children?.()}
+</Popover.Root>

package/dist/primitives/combobox/components/combobox.root.svelte.d.ts

@@ -0,0 +1,25 @@
+import type { ComboboxItem, ComboboxRootProps } from '../types.js';
+declare function $$render<TItem extends ComboboxItem>(): {
+    props: ComboboxRootProps<TItem>;
+    exports: {};
+    bindings: "value" | "open" | "searchValue";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<TItem extends ComboboxItem> {
+    props(): ReturnType<typeof $$render<TItem>>['props'];
+    events(): ReturnType<typeof $$render<TItem>>['events'];
+    slots(): ReturnType<typeof $$render<TItem>>['slots'];
+    bindings(): "value" | "open" | "searchValue";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <TItem extends ComboboxItem>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<TItem>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<TItem>['props']>, ReturnType<__sveltets_Render<TItem>['events']>, ReturnType<__sveltets_Render<TItem>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<TItem>['bindings']>;
+    } & ReturnType<__sveltets_Render<TItem>['exports']>;
+    <TItem extends ComboboxItem>(internal: unknown, props: ReturnType<__sveltets_Render<TItem>['props']> & {}): ReturnType<__sveltets_Render<TItem>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Combobox: $$IsomorphicComponent;
+type Combobox<TItem extends ComboboxItem> = InstanceType<typeof Combobox<TItem>>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.separator.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+  import { Command } from '../../command/index.js';
+  import type { ComboboxSeparatorProps } from '../types.js';
+
+  let { ...restProps }: ComboboxSeparatorProps = $props();
+</script>
+
+<Command.Separator {...restProps} />

package/dist/primitives/combobox/components/combobox.separator.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Combobox: import("svelte").Component<import("../../index.js").SeparatorProps, {}, "">;
+type Combobox = ReturnType<typeof Combobox>;
+export default Combobox;

package/dist/primitives/combobox/components/combobox.svelte.d.ts

@@ -0,0 +1,32 @@
+import { SELECTION_TYPE } from '../../../internal/constants/selection-type.js';
+import { type ReadableBoxedValues, type WritableBoxedValues } from 'svelte-toolbelt';
+import type { ComboboxItem } from '../types.js';
+type ComboboxRootStateOpts<TItem extends ComboboxItem> = WritableBoxedValues<{
+    open: boolean;
+    value: string | string[] | undefined;
+    searchValue: string;
+}> & ReadableBoxedValues<{
+    type: typeof SELECTION_TYPE.SINGLE | typeof SELECTION_TYPE.MULTIPLE | undefined;
+    items: TItem[];
+    placeholder: string;
+    allowDeselect: boolean;
+    closeOnSelect: boolean | undefined;
+}> & {
+    onSelect: (value: string | string[], item: TItem | null) => void;
+};
+export declare class ComboboxRootState<TItem extends ComboboxItem> {
+    static create<TItem extends ComboboxItem>(opts: ComboboxRootStateOpts<TItem>): ComboboxRootState<TItem>;
+    static get<TItem extends ComboboxItem>(): ComboboxRootState<TItem>;
+    readonly opts: ComboboxRootStateOpts<TItem>;
+    constructor(opts: ComboboxRootStateOpts<TItem>);
+    readonly isMultiple: boolean;
+    readonly defaultValue: string | never[];
+    readonly selectedItems: TItem[];
+    readonly displayValue: string;
+    readonly isPlaceholder: boolean;
+    readonly isNotEmpty: boolean;
+    isSelected(itemValue: string): boolean;
+    clear(): void;
+    selectItem(item: TItem): void;
+}
+export {};

package/dist/primitives/combobox/components/combobox.svelte.js

@@ -0,0 +1,103 @@
+import { SELECTION_TYPE } from '../../../internal/constants/selection-type.js';
+import { keyWithPrefix } from '../../../internal/utils/common.js';
+import { Context } from 'runed';
+import { afterTick } from 'svelte-toolbelt';
+const ComboboxRootContext = new Context(keyWithPrefix('combobox-root'));
+export class ComboboxRootState {
+    static create(opts) {
+        return ComboboxRootContext.set(new ComboboxRootState(opts));
+    }
+    static get() {
+        return ComboboxRootContext.get();
+    }
+    opts;
+    constructor(opts) {
+        this.opts = opts;
+    }
+    isMultiple = $derived.by(() => this.opts.type.current === SELECTION_TYPE.MULTIPLE);
+    defaultValue = $derived.by(() => (this.isMultiple ? [] : ''));
+    selectedItems = $derived.by(() => {
+        const findItem = (itemValue) => this.opts.items.current.find((item) => item.value === itemValue);
+        if (typeof this.opts.value.current === 'string' && this.opts.value.current.trim() !== '') {
+            const item = findItem(this.opts.value.current);
+            return item ? [item] : [];
+        }
+        if (Array.isArray(this.opts.value.current) && this.opts.value.current.length > 0) {
+            return this.opts.value.current.map((v) => findItem(v)).filter((i) => i !== undefined);
+        }
+        return [];
+    });
+    displayValue = $derived.by(() => {
+        const findItem = (itemValue) => this.opts.items.current.find((item) => item.value === itemValue);
+        if (typeof this.opts.value.current === 'string' && this.opts.value.current.trim() !== '') {
+            const item = findItem(this.opts.value.current);
+            return item?.label ?? this.opts.value.current;
+        }
+        if (Array.isArray(this.opts.value.current) && this.opts.value.current.length > 0) {
+            return this.opts.value.current
+                .map((v) => {
+                const item = findItem(v);
+                return item?.label ?? v;
+            })
+                .join(', ');
+        }
+        return this.opts.placeholder.current;
+    });
+    isPlaceholder = $derived.by(() => {
+        if (Array.isArray(this.opts.value.current))
+            return this.opts.value.current.length === 0;
+        return typeof this.opts.value.current === 'string' && this.opts.value.current.trim() === '';
+    });
+    isNotEmpty = $derived.by(() => {
+        if (Array.isArray(this.opts.value.current))
+            return this.opts.value.current.length > 0;
+        return typeof this.opts.value.current === 'string' && this.opts.value.current.trim() !== '';
+    });
+    isSelected(itemValue) {
+        if (Array.isArray(this.opts.value.current))
+            return this.opts.value.current.includes(itemValue);
+        return this.opts.value.current === itemValue;
+    }
+    clear() {
+        const nextValue = this.isMultiple ? [] : '';
+        this.opts.value.current = nextValue;
+        this.opts.onSelect(nextValue, null);
+    }
+    selectItem(item) {
+        const shouldPreventSelect = item.preventSelect === true;
+        if (Array.isArray(this.opts.value.current)) {
+            let result = this.opts.value.current;
+            if (this.opts.value.current.includes(item.value)) {
+                result = this.opts.allowDeselect.current
+                    ? this.opts.value.current.filter((value) => value !== item.value)
+                    : this.opts.value.current;
+            }
+            else {
+                result = [...this.opts.value.current, item.value];
+            }
+            this.opts.onSelect(result, item);
+            if (!shouldPreventSelect) {
+                this.opts.value.current = result;
+            }
+        }
+        else {
+            let result = typeof this.opts.value.current === 'string' ? this.opts.value.current : '';
+            if (item.value === this.opts.value.current) {
+                result = this.opts.allowDeselect.current ? '' : result;
+            }
+            else {
+                result = item.value;
+            }
+            this.opts.onSelect(result, item);
+            if (!shouldPreventSelect) {
+                this.opts.value.current = result;
+            }
+        }
+        afterTick(() => {
+            const shouldClose = this.opts.closeOnSelect.current ?? !this.isMultiple;
+            if (shouldClose) {
+                this.opts.open.current = false;
+            }
+        });
+    }
+}