@agnos-ui/svelte-bootstrap 0.10.0 → 0.11.0-next.0

package/components/accordion/Accordion.svelte

@@ -10,7 +10,9 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	let {children, ...props}: Partial<AccordionProps> & {children: Snippet} = $props();
 
 	const {directives, api: accordionApi} = callWidgetFactory(createAccordion, {
-		props,
+		get props() {
+			return props;
+		},
 	});
 	export const api: AccordionApi = accordionApi;
 

package/components/accordion/ItemDefaultStructure.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: AccordionItemContext = $props();
-	const {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 
 	let headingTag = $derived(`h${state.headingLevel}`);
 </script>

package/components/accordion/accordion.gen.d.ts

@@ -345,30 +345,37 @@ export interface AccordionApi {
      * Given the itemId, will expand the corresponding accordion-item.
      *
      * If the itemId is not valid, nothing will happen.
+     * @returns A promise that resolves when the expand operation is completed.
      */
-    expand(itemId: string): void;
+    expand(itemId: string): Promise<void>;
     /**
      * Given the itemId, will collapse the corresponding accordion-item.
      *
      * If the itemId is not valid, nothing will happen.
+     * @returns A promise that resolves when the collapse operation is completed.
      */
-    collapse(itemId: string): void;
+    collapse(itemId: string): Promise<void>;
     /**
      * Given the itemId, will toggle the corresponding accordion-item.
      *
+     * @returns A promise that resolves when the toggle operation is completed.
      * If the itemId is not valid, nothing will happen.
      */
-    toggle(itemId: string): void;
+    toggle(itemId: string): Promise<void>;
     /**
      * It will expand all the items in the accordion.
      *
      * If `closeOthers` is `true` it will expand only the last accordion-item.
+     *
+     * @returns A promise that resolves when all the expand operations are completed.
      */
-    expandAll(): void;
+    expandAll(): Promise<void>;
     /**
      * It will collapse all the accordion-items in the accordion.
+     *
+     * @returns A promise that resolves when all the collapse operations are completed.
      */
-    collapseAll(): void;
+    collapseAll(): Promise<void>;
     /**
      * Creates a new accordionItem.
      */
@@ -389,16 +396,19 @@ export interface AccordionDirectives {
 export interface AccordionItemApi {
     /**
      * It will collapse the accordion-item.
+     * @returns A promise that resolves when the collapse operation is completed.
      */
-    collapse(): void;
+    collapse(): Promise<void>;
     /**
      * It will expand the accordion-item.
+     * @returns A promise that resolves when the expand operation is completed.
      */
-    expand(): void;
+    expand(): Promise<void>;
     /**
      * It will toggle the accordion-item.
+     * @returns A promise that resolves when the toggle operation is completed.
      */
-    toggle(): void;
+    toggle(): Promise<void>;
     /**
      * Method to be called after the initialization to allow animations.
      */

package/components/alert/AlertDefaultStructure.svelte

@@ -3,7 +3,7 @@
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: AlertContext = $props();
-	let state = widget.state;
+	let state = $derived(widget.state);
 </script>
 
 <div class="alert-body">

package/components/alert/alert.gen.d.ts

@@ -175,11 +175,11 @@ export interface AlertApi {
     /**
      * Triggers alert closing programmatically (same as clicking on the close button (×)).
      */
-    close(): void;
+    close(): Promise<void>;
     /**
      * Triggers the alert to be displayed for the user.
      */
-    open(): void;
+    open(): Promise<void>;
 }
 /**
  * Represents the directives for an alert component.

package/components/carousel/Carousel.svelte

@@ -12,7 +12,9 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	let props: Partial<CarouselProps<SlideData>> = $props();
 
 	const widget = callWidgetFactory(createCarousel<SlideData>, {
-		props,
+		get props() {
+			return props;
+		},
 		defaultConfig: {
 			structure,
 			navigation,

package/components/carousel/CarouselDefaultStructure.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: CarouselContext<SlideData> = $props();
-	let {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 </script>
 
 <Slot content={state.navigation} props={widget} />

package/components/carousel/carousel.gen.d.ts

@@ -334,7 +334,7 @@ declare const export_createCarousel: WidgetFactory<CarouselWidget<{
     id: string;
 }>, <SlideData extends {
     id: string;
-}>(config?: PropsConfig<CarouselProps<SlideData>>) => CarouselWidget<SlideData>>;
+}>(config?: PropsConfig<CarouselProps<SlideData>> | undefined) => CarouselWidget<SlideData>>;
 export { export_createCarousel as createCarousel };
 /**
  * Represents the API for a carousel component.

package/components/collapse/collapse.gen.d.ts

@@ -112,15 +112,15 @@ export interface CollapseApi {
     /**
      * Triggers collapse closing programmatically.
      */
-    close(): void;
+    close(): Promise<void>;
     /**
      * Triggers the collapse content to be displayed for the user.
      */
-    open(): void;
+    open(): Promise<void>;
     /**
      * Toggles the collapse content visibility.
      */
-    toggle(): void;
+    toggle(): Promise<void>;
 }
 /**
  * Interface representing the directives used in a collapse component.

package/components/drawer/DrawerDefaultStructure.svelte

@@ -3,14 +3,13 @@
 	import type {DrawerContext} from './drawer.gen';
 
 	let widget: DrawerContext = $props();
-	let {state} = widget;
 </script>
 
 <div class="au-drawer-content">
 	<div class="au-drawer-header">
-		<Slot content={state.header} props={widget} />
+		<Slot content={widget.state.header} props={widget} />
 	</div>
 	<div class="au-drawer-body">
-		<Slot content={state.children} props={widget} />
+		<Slot content={widget.state.children} props={widget} />
 	</div>
 </div>

package/components/drawer/drawer.gen.d.ts

@@ -320,9 +320,9 @@ export interface DrawerApi {
     /**
      * Trigger the opening of the drawer.
      */
-    open: () => void;
+    open: () => Promise<void>;
     /**
      * Trigger the closing of the drawer.
      */
-    close: () => void;
+    close: () => Promise<void>;
 }

package/components/modal/modal.gen.d.ts

@@ -295,7 +295,7 @@ export type ModalWidget<Data> = Widget<ModalProps<Data>, ModalState<Data>, Modal
  * @param config - config of the modal, either as a store or as an object containing values or stores.
  * @returns a new modal widget instance
  */
-declare const export_createModal: <Data>(config?: PropsConfig<ModalProps<Data>>) => ModalWidget<Data>;
+declare const export_createModal: <Data>(config?: PropsConfig<ModalProps<Data>> | undefined) => ModalWidget<Data>;
 export { export_createModal as createModal };
 /**
  * Value present in the {@link ModalBeforeCloseEvent.result|result} property of the {@link ModalProps.onBeforeClose|onBeforeClose} event

package/components/pagination/PaginationDefaultPages.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: PaginationContext = $props();
-	let {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 </script>
 
 {#each state.pages as page}

package/components/pagination/PaginationDefaultStructure.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: PaginationContext = $props();
-	let {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 
 	let sizeClass = $derived(state.size ? `pagination-${state.size}` : '');
 </script>

package/components/progressbar/Progressbar.svelte

@@ -10,7 +10,9 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	let props: Partial<ProgressbarProps> = $props();
 
 	const widget = callWidgetFactory(createProgressbar, {
-		props,
+		get props() {
+			return props;
+		},
 		defaultConfig: {
 			structure,
 		},

package/components/slider/SliderDefaultStructure.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: SliderContext = $props();
-	let {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 </script>
 
 {#each state.progressDisplayOptions as option (option.id)}

package/components/toast/ToastDefaultStructure.svelte

@@ -6,7 +6,7 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import {Slot} from '@agnos-ui/svelte-headless/slot';
 
 	let widget: ToastContext = $props();
-	let state = widget.state;
+	let state = $derived(widget.state);
 </script>
 
 {#if state.header}

package/components/toast/toast.gen.d.ts

@@ -210,11 +210,11 @@ export interface ToastApi {
     /**
      * Triggers alert closing programmatically (same as clicking on the close button (×)).
      */
-    close(): void;
+    close(): Promise<void>;
     /**
      * Triggers the alert to be displayed for the user.
      */
-    open(): void;
+    open(): Promise<void>;
 }
 /**
  * Interface representing the directives for a toast component.

package/components/tree/Tree.svelte

@@ -11,7 +11,9 @@
 	let props: Partial<TreeProps> = $props();
 
 	const widget = callWidgetFactory(createTree, {
-		props,
+		get props() {
+			return props;
+		},
 		defaultConfig: {structure, item, itemContent, itemToggle},
 	});
 	const {state} = widget;

package/components/tree/TreeDefaultStructure.svelte

@@ -6,7 +6,8 @@ import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
 	import type {TreeContext} from './tree.gen';
 
 	let widget: TreeContext = $props();
-	let {state, directives} = widget;
+	let state = $derived(widget.state);
+	let directives = $derived(widget.directives);
 </script>
 
 <ul role="tree" use:__AgnosUISveltePreprocess__classDirective={"au-tree "+(state.className)} use:directives.navigationDirective {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes(directives.navigationDirective, [__AgnosUISveltePreprocess__classDirective, "au-tree "+(state.className)])}>

package/config.gen.d.ts

@@ -7,7 +7,6 @@ import type { ModalProps } from './components/modal';
 import type { PaginationProps } from './components/pagination';
 import type { ProgressbarProps } from './components/progressbar';
 import type { RatingProps } from './components/rating';
-import type { SelectProps } from './components/select';
 import type { SliderProps } from './components/slider';
 import type { ToastProps } from './components/toast';
 import type { TreeProps } from './components/tree';
@@ -48,10 +47,6 @@ export type WidgetsConfig = {
      * the rating widget config
      */
     rating: RatingProps;
-    /**
-     * the select widget config
-     */
-    select: SelectProps<any>;
     /**
      * the slider widget config
      */

package/index.d.ts

@@ -6,7 +6,6 @@ export * from './components/modal';
 export * from './components/pagination';
 export * from './components/progressbar';
 export * from './components/rating';
-export * from './components/select';
 export * from './components/slider';
 export * from './components/toast';
 export * from './components/tree';

package/index.js

@@ -6,7 +6,6 @@ export * from './components/modal';
 export * from './components/pagination';
 export * from './components/progressbar';
 export * from './components/rating';
-export * from './components/select';
 export * from './components/slider';
 export * from './components/toast';
 export * from './components/tree';

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@agnos-ui/svelte-bootstrap",
 	"description": "Bootstrap-based component library for Svelte.",
-	"version": "0.10.0",
+	"version": "0.11.0-next.0",
 	"type": "module",
 	"main": "./index.js",
 	"module": "./index.js",
@@ -49,8 +49,8 @@
 		}
 	},
 	"dependencies": {
-		"@agnos-ui/core-bootstrap": "0.10.0",
-		"@agnos-ui/svelte-headless": "0.10.0"
+		"@agnos-ui/core-bootstrap": "0.11.0-next.0",
+		"@agnos-ui/svelte-headless": "0.11.0-next.0"
 	},
 	"peerDependencies": {
 		"@amadeus-it-group/tansu": "^2.0.0",

package/components/select/Select.svelte

@@ -1,71 +0,0 @@
-<script lang="ts" generics="Item">
-import {ssrAttributes as __AgnosUISveltePreprocess__ssrAttributes, classDirective as __AgnosUISveltePreprocess__classDirective} from '@agnos-ui/svelte-headless/utils/directive';
-import {BROWSER as __AgnosUISveltePreprocess__BROWSER} from 'esm-env';
-
-	import {Slot} from '@agnos-ui/svelte-headless/slot';
-	import {callWidgetFactory} from '../../config';
-	import type {SelectApi, SelectItemContext, SelectProps, SelectWidget} from './select.gen';
-	import {createSelect} from './select.gen';
-
-	let {open = $bindable(false), filterText = $bindable(), selected = $bindable(), ...props}: Partial<SelectProps<Item>> = $props();
-
-	const widget = callWidgetFactory<SelectWidget<Item>>(createSelect, {
-		get props() {
-			return {...props, open, filterText, selected};
-		},
-		defaultConfig: {badgeLabel, itemLabel},
-		events: {
-			onOpenChange: function (isOpen: boolean): void {
-				open = isOpen;
-			},
-			onSelectedChange: (newSelection) => {
-				selected = newSelection;
-			},
-			onFilterTextChange: (value) => {
-				filterText = value;
-			},
-		},
-	});
-	export const api: SelectApi<Item> = widget.api;
-	const {
-		state,
-		directives: {
-			floatingDirective,
-			hasFocusDirective,
-			referenceDirective,
-			inputContainerDirective,
-			badgeAttributesDirective,
-			menuAttributesDirective,
-			itemAttributesDirective,
-			inputDirective,
-		},
-	} = widget;
-</script>
-
-{#snippet badgeLabel({itemContext}: SelectItemContext<Item>)}
-	{itemContext.item}
-{/snippet}
-{#snippet itemLabel({itemContext}: SelectItemContext<Item>)}
-	{itemContext.item}
-{/snippet}
-
-<div use:referenceDirective use:__AgnosUISveltePreprocess__classDirective={"au-select dropdown border border-1 p-1 mb-3 d-block "+(state.className)} {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes(referenceDirective, [__AgnosUISveltePreprocess__classDirective, "au-select dropdown border border-1 p-1 mb-3 d-block "+(state.className)])}>
-	<div use:hasFocusDirective use:inputContainerDirective use:__AgnosUISveltePreprocess__classDirective={"d-flex align-items-center flex-wrap gap-1"} {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes(hasFocusDirective, inputContainerDirective, [__AgnosUISveltePreprocess__classDirective, "d-flex align-items-center flex-wrap gap-1"])}>
-		{#each state.selectedContexts as itemContext (itemContext.id)}
-			<div use:badgeAttributesDirective={itemContext} {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes([badgeAttributesDirective, itemContext])}>
-				<Slot content={state.badgeLabel} props={{state, directives: widget.directives, api: widget.api, itemContext}} />
-			</div>
-		{/each}
-		<input value={state.filterText} use:inputDirective {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes(inputDirective)} />
-	</div>
-	{#if state.open && state.visibleItems.length > 0}
-		<ul use:hasFocusDirective use:floatingDirective use:menuAttributesDirective use:__AgnosUISveltePreprocess__classDirective={"dropdown-menu show"} {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes(hasFocusDirective, floatingDirective, menuAttributesDirective, [__AgnosUISveltePreprocess__classDirective, "dropdown-menu show"])}>
-			{#each state.visibleItems as itemContext (itemContext.id)}
-				{@const isHighlighted = itemContext === state.highlighted}
-				<li use:__AgnosUISveltePreprocess__classDirective={(['dropdown-item position-relative', {'text-bg-primary': isHighlighted}])} use:itemAttributesDirective={itemContext} {...__AgnosUISveltePreprocess__BROWSER ? {} : __AgnosUISveltePreprocess__ssrAttributes([itemAttributesDirective, itemContext], [__AgnosUISveltePreprocess__classDirective, (['dropdown-item position-relative', {'text-bg-primary': isHighlighted}])])}>
-					<Slot content={state.itemLabel} props={{state, directives: widget.directives, api: widget.api, itemContext}} />
-				</li>
-			{/each}
-		</ul>
-	{/if}
-</div>

package/components/select/Select.svelte.d.ts

@@ -1,29 +0,0 @@
-import type { SelectApi, SelectProps } from './select.gen';
-declare function $$render<Item>(): {
-    props: Partial<SelectProps<Item>>;
-    exports: {
-        api: SelectApi<Item>;
-    };
-    bindings: "open" | "selected" | "filterText";
-    slots: {};
-    events: {};
-};
-declare class __sveltets_Render<Item> {
-    props(): ReturnType<typeof $$render<Item>>['props'];
-    events(): ReturnType<typeof $$render<Item>>['events'];
-    slots(): ReturnType<typeof $$render<Item>>['slots'];
-    bindings(): "open" | "selected" | "filterText";
-    exports(): {
-        api: SelectApi<Item>;
-    };
-}
-interface $$IsomorphicComponent {
-    new <Item>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Item>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Item>['props']>, ReturnType<__sveltets_Render<Item>['events']>, ReturnType<__sveltets_Render<Item>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<Item>['bindings']>;
-    } & ReturnType<__sveltets_Render<Item>['exports']>;
-    <Item>(internal: unknown, props: ReturnType<__sveltets_Render<Item>['props']> & {}): ReturnType<__sveltets_Render<Item>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
-}
-declare const Select: $$IsomorphicComponent;
-type Select<Item> = InstanceType<typeof Select<Item>>;
-export default Select;

package/components/select/index.d.ts

@@ -1,3 +0,0 @@
-import Select from './Select.svelte';
-export * from './select.gen';
-export { Select };

package/components/select/index.js

@@ -1,3 +0,0 @@
-import Select from './Select.svelte';
-export * from './select.gen';
-export { Select };

package/components/select/select.gen.d.ts

@@ -1,435 +0,0 @@
-import type { WidgetSlotContext, SlotContent, Widget, PropsConfig, Directive } from '@agnos-ui/svelte-headless/types';
-import type { Placement } from '@floating-ui/dom';
-import type { HasFocus } from '@agnos-ui/svelte-headless/services/focustrack';
-import type { FloatingUI } from '@agnos-ui/svelte-headless/services/floatingUI';
-/**
- * Retrieve a shallow copy of the default Select config
- * @returns the default Select config
- */
-declare const export_getSelectDefaultConfig: () => SelectProps<any>;
-export { export_getSelectDefaultConfig as getSelectDefaultConfig };
-/**
- * Interface for the slot context of the pagination widget
- * @template Item - The type of the items in the Select component.
- */
-export interface SelectContext<Item> extends WidgetSlotContext<SelectWidget<Item>> {
-}
-/**
- * Represents the context for a select item, extending the base `SelectContext` with additional
- * contextual data specific to an item.
- *
- * @template Item - The type of the item within the select context.
- */
-export interface SelectItemContext<Item> extends SelectContext<Item> {
-    /**
-     * Contextual data related to an item
-     */
-    itemContext: ItemContext<Item>;
-}
-/**
- * Represents the state of a Select component.
- *
- * @template Item - The type of the items in the select component.
- */
-export interface SelectState<Item> {
-    /**
-     * List of item contexts, to be displayed in the menu
-     */
-    visibleItems: ItemContext<Item>[];
-    /**
-     * List of selected items to be display
-     */
-    selectedContexts: ItemContext<Item>[];
-    /**
-     * Highlighted item context.
-     * It is designed to define the highlighted item in the dropdown menu
-     */
-    highlighted: ItemContext<Item> | undefined;
-    /**
-     * Current placement of the dropdown
-     */
-    placement: Placement | undefined;
-    /**
-     * id used for the input inside the select
-     */
-    id: string | undefined;
-    /**
-     * aria-label used for the input inside the select
-     *
-     * @defaultValue `'Select'`
-     */
-    ariaLabel: string | undefined;
-    /**
-     * List of selected item ids
-     *
-     * @defaultValue `[]`
-     */
-    selected: Item[];
-    /**
-     * Filtered text to be display in the filter input
-     *
-     * @defaultValue `''`
-     */
-    filterText: string;
-    /**
-     * true if the select is disabled
-     *
-     * @defaultValue `false`
-     */
-    disabled: boolean;
-    /**
-     * true if the select is open
-     *
-     * @defaultValue `false`
-     */
-    open: boolean;
-    /**
-     * Class to be added on the dropdown menu container
-     *
-     * @defaultValue `''`
-     */
-    menuClassName: string;
-    /**
-     * Class to be added on menu items
-     *
-     * @defaultValue `''`
-     */
-    menuItemClassName: string;
-    /**
-     * Class to be added on selected items (displayed in the input zone)
-     *
-     * @defaultValue `''`
-     */
-    badgeClassName: string;
-    /**
-     * true if a loading process is being done
-     *
-     * @defaultValue `false`
-     */
-    loading: boolean;
-    /**
-     * CSS classes to be applied on the widget main container
-     *
-     * @defaultValue `''`
-     */
-    className: string;
-    /**
-     * The template to override the way each badge on the left of the input is displayed.
-     * This define the content of the badge inside the badge container.
-     *
-     * @defaultValue
-     * ```ts
-     * ({itemContext}: SelectItemContext<any>) => itemContext.item
-     * ```
-     */
-    badgeLabel: SlotContent<SelectItemContext<Item>>;
-    /**
-     * The template to override the way each item is displayed in the list.
-     * This define the content of the badge inside the badge container.
-     *
-     * @defaultValue
-     * ```ts
-     * ({itemContext}: SelectItemContext<any>) => itemContext.item
-     * ```
-     */
-    itemLabel: SlotContent<SelectItemContext<Item>>;
-}
-/**
- * Represents the properties for the Select component.
- *
- * @template Item - The type of the items in the select component.
- */
-export interface SelectProps<Item> {
-    /**
-     * List of available items for the dropdown
-     *
-     * @defaultValue `[]`
-     */
-    items: Item[];
-    /**
-     * List of allowed placements for the dropdown.
-     * This refers to the [allowedPlacements from floating UI](https://floating-ui.com/docs/autoPlacement#allowedplacements), given the different [Placement possibilities](https://floating-ui.com/docs/computePosition#placement).
-     *
-     * @defaultValue
-     * ```ts
-     * ['bottom-start', 'top-start', 'bottom-end', 'top-end']
-     * ```
-     */
-    allowedPlacements: Placement[];
-    /**
-     * Custom function to get the id of an item
-     * By default, the item is returned
-     *
-     * @defaultValue
-     * ```ts
-     * (item: any) => '' + item
-     * ```
-     */
-    itemIdFn(item: Item): string;
-    /**
-     * Retrieves navigable elements within an HTML element containing badges and the input.
-     *
-     * @param node - HTMLElement that contains the badges and the input
-     *
-     * @defaultValue
-     * ```ts
-     * (node: HTMLElement) => node.querySelectorAll('.au-select-badge,input')
-     * ```
-     */
-    navSelector(node: HTMLElement): NodeListOf<HTMLSpanElement | HTMLInputElement>;
-    /**
-     * Callback called dropdown open state change
-     * @param isOpen - updated open state
-     *
-     * @defaultValue
-     * ```ts
-     * () => {}
-     * ```
-     */
-    onOpenChange(isOpen: boolean): void;
-    /**
-     * Callback called when the text filter change
-     * @param text - Filtered text
-     *
-     * @defaultValue
-     * ```ts
-     * () => {}
-     * ```
-     */
-    onFilterTextChange(text: string): void;
-    /**
-     * Callback called when the selection change
-     *
-     * @defaultValue
-     * ```ts
-     * () => {}
-     * ```
-     */
-    onSelectedChange(selected: Item[]): void;
-    /**
-     * id used for the input inside the select
-     */
-    id: string | undefined;
-    /**
-     * aria-label used for the input inside the select
-     *
-     * @defaultValue `'Select'`
-     */
-    ariaLabel: string | undefined;
-    /**
-     * List of selected item ids
-     *
-     * @defaultValue `[]`
-     */
-    selected: Item[];
-    /**
-     * Filtered text to be display in the filter input
-     *
-     * @defaultValue `''`
-     */
-    filterText: string;
-    /**
-     * true if the select is disabled
-     *
-     * @defaultValue `false`
-     */
-    disabled: boolean;
-    /**
-     * true if the select is open
-     *
-     * @defaultValue `false`
-     */
-    open: boolean;
-    /**
-     * Class to be added on the dropdown menu container
-     *
-     * @defaultValue `''`
-     */
-    menuClassName: string;
-    /**
-     * Class to be added on menu items
-     *
-     * @defaultValue `''`
-     */
-    menuItemClassName: string;
-    /**
-     * Class to be added on selected items (displayed in the input zone)
-     *
-     * @defaultValue `''`
-     */
-    badgeClassName: string;
-    /**
-     * true if a loading process is being done
-     *
-     * @defaultValue `false`
-     */
-    loading: boolean;
-    /**
-     * CSS classes to be applied on the widget main container
-     *
-     * @defaultValue `''`
-     */
-    className: string;
-    /**
-     * The template to override the way each badge on the left of the input is displayed.
-     * This define the content of the badge inside the badge container.
-     *
-     * @defaultValue
-     * ```ts
-     * ({itemContext}: SelectItemContext<any>) => itemContext.item
-     * ```
-     */
-    badgeLabel: SlotContent<SelectItemContext<Item>>;
-    /**
-     * The template to override the way each item is displayed in the list.
-     * This define the content of the badge inside the badge container.
-     *
-     * @defaultValue
-     * ```ts
-     * ({itemContext}: SelectItemContext<any>) => itemContext.item
-     * ```
-     */
-    itemLabel: SlotContent<SelectItemContext<Item>>;
-}
-/**
- * Represents a Select widget component.
- *
- * @template Item - The type of the items that the select widget will handle.
- */
-export type SelectWidget<Item> = Widget<SelectProps<Item>, SelectState<Item>, SelectApi<Item>, SelectDirectives<Item>>;
-/**
- * Creates a new select widget instance.
- * @param config - config of the modal, either as a store or as an object containing values or stores.
- * @returns a new select widget instance
- */
-declare const export_createSelect: <Item>(config?: PropsConfig<SelectProps<Item>>) => SelectWidget<Item>;
-export { export_createSelect as createSelect };
-/**
- * Item representation built from the items provided in parameters
- *
- * @template T - The type of the Select Items
- */
-export interface ItemContext<T> {
-    /**
-     * Original item given in the parameters
-     */
-    item: T;
-    /**
-     * Unique id to identify the item
-     */
-    id: string;
-    /**
-     * Specify if the item is checked
-     */
-    selected: boolean;
-}
-/**
- * Interface representing the API for a Select component.
- *
- * @template Item - The type of the Select Items
- */
-export interface SelectApi<Item> {
-    /**
-     * Clear all the selected items
-     */
-    clear(): void;
-    /**
-     * Clear the filter text
-     */
-    clearText(): void;
-    /**
-     * Highlight the given item, if there is a corresponding match among the visible list
-     */
-    highlight(item: Item): void;
-    /**
-     * Highlight the first item among the visible list
-     */
-    highlightFirst(): void;
-    /**
-     * Highlight the previous item among the visible list
-     * Loop to the last item if needed
-     */
-    highlightPrevious(): void;
-    /**
-     * Highlight the next item among the visible list.
-     * Loop to the first item if needed
-     */
-    highlightNext(): void;
-    /**
-     * Highlight the last item among the visible list
-     */
-    highlightLast(): void;
-    /**
-     * Select the provided item.
-     * The selected list is used to
-     * @param item - the item to select
-     */
-    select(item: Item): void;
-    /**
-     * Unselect the provided item.
-     * @param item - the item to unselect
-     */
-    unselect(item: Item): void;
-    /**
-     * Toggle the selection of an item
-     * @param item - the item to toggle
-     * @param selected - an optional boolean to enforce the selected/unselected state instead of toggling
-     */
-    toggleItem(item: Item, selected?: boolean): void;
-    /**
-     * open the select
-     */
-    open(): void;
-    /**
-     * close the select
-     */
-    close(): void;
-    /**
-     * Toggle the dropdown menu
-     * @param isOpen - If specified, set the menu in the defined state.
-     */
-    toggle(isOpen?: boolean): void;
-}
-/**
- * Interface representing the directives used in the Select component.
- *
- * @template Item - The type of the Select Items
- */
-export interface SelectDirectives<Item> {
-    /**
-     * Directive to be used in the input group and the menu containers
-     */
-    hasFocusDirective: HasFocus['directive'];
-    /**
-     * Directive that enables dynamic positioning of menu element
-     */
-    floatingDirective: FloatingUI['directives']['floatingDirective'];
-    /**
-     * A directive to be applied to the input group element serves as the base for menu positioning
-     */
-    referenceDirective: FloatingUI['directives']['referenceDirective'];
-    /**
-     * A directive to be applied to the element that contains the badges and the input
-     */
-    inputContainerDirective: Directive;
-    /**
-     * A directive that applies all the necessary attributes to the container badges
-     */
-    badgeAttributesDirective: Directive<ItemContext<Item>>;
-    /**
-     * A directive that applies all the necessary attributes to the dropdown menu
-     */
-    menuAttributesDirective: Directive;
-    /**
-     * A directive that applies all the necessary attributes to the dropdown item
-     */
-    itemAttributesDirective: Directive<ItemContext<Item>>;
-    /**
-     * A directive to be applied to the input
-     */
-    inputDirective: Directive;
-    /**
-     * A directive to be applied to a button that closes a badge
-     */
-    badgeCloseButtonDirective: Directive<ItemContext<Item>>;
-}

package/components/select/select.gen.js

@@ -1,14 +0,0 @@
-import { getSelectDefaultConfig, createSelect } from '@agnos-ui/core-bootstrap/components/select';
-/**
- * Retrieve a shallow copy of the default Select config
- * @returns the default Select config
- */
-const export_getSelectDefaultConfig = getSelectDefaultConfig;
-export { export_getSelectDefaultConfig as getSelectDefaultConfig };
-/**
- * Creates a new select widget instance.
- * @param config - config of the modal, either as a store or as an object containing values or stores.
- * @returns a new select widget instance
- */
-const export_createSelect = createSelect;
-export { export_createSelect as createSelect };