@agnos-ui/react-bootstrap 0.7.0 → 0.8.0-next.0

package/{alert-BWfpiNSz.cjs → alert-BGVw_vsM.cjs}

@@ -18,7 +18,7 @@ const AlertElement = (slotContext) => /* @__PURE__ */ jsxRuntime.jsx(
     ...directive.useDirectives(
       [
         directive.classDirective,
-        `au-alert alert alert-${slotContext.state.type} ${slotContext.state.className} ${slotContext.state.dismissible ? "alert-dismissible" : ""}`
+        [`au-alert alert alert-${slotContext.state.type} ${slotContext.state.className}`, { "alert-dismissible": slotContext.state.dismissible }]
       ],
       slotContext.directives.transitionDirective
     ),

package/{alert-CWbr08rp.js → alert-BM4ImSpO.js}

@@ -17,7 +17,7 @@ const AlertElement = (slotContext) => /* @__PURE__ */ jsx(
     ...useDirectives(
       [
         classDirective,
-        `au-alert alert alert-${slotContext.state.type} ${slotContext.state.className} ${slotContext.state.dismissible ? "alert-dismissible" : ""}`
+        [`au-alert alert alert-${slotContext.state.type} ${slotContext.state.className}`, { "alert-dismissible": slotContext.state.dismissible }]
       ],
       slotContext.directives.transitionDirective
     ),

package/components/alert/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const alert = require("../../alert-BWfpiNSz.cjs");
+const alert = require("../../alert-BGVw_vsM.cjs");
 exports.Alert = alert.Alert;
 exports.AlertDefaultSlotStructure = alert.AlertDefaultSlotStructure;
 exports.createAlert = alert.export_createAlert;

package/components/alert/index.js

@@ -1,4 +1,4 @@
-import { a, A, b, e } from "../../alert-CWbr08rp.js";
+import { a, A, b, e } from "../../alert-BM4ImSpO.js";
 export {
   a as Alert,
   A as AlertDefaultSlotStructure,

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

@@ -134,6 +134,10 @@ export interface CollapseDirectives {
      * Directive to apply the collapse.
      */
     collapseDirective: Directive;
+    /**
+     * Directive to apply to a trigger;
+     */
+    triggerDirective: Directive;
 }
 /**
  * Represents a widget for handling collapse functionality.

package/components/modal/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const modal = require("../../modal-C3hVG-lH.cjs");
+const modal = require("../../modal-DQLOz7TE.cjs");
 exports.Modal = modal.Modal;
 exports.ModalDefaultSlotHeader = modal.ModalDefaultSlotHeader;
 exports.ModalDefaultSlotStructure = modal.ModalDefaultSlotStructure;

package/components/modal/index.js

@@ -1,4 +1,4 @@
-import { b, M, a, c, e, f, d, o } from "../../modal-DPKlan_9.js";
+import { b, M, a, c, e, f, d, o } from "../../modal-apFubipB.js";
 export {
   b as Modal,
   M as ModalDefaultSlotHeader,

package/components/pagination/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const pagination = require("../../pagination-CYTSlunk.cjs");
+const pagination = require("../../pagination-Bq4Hvm1j.cjs");
 exports.NavButton = pagination.NavButton;
 exports.PageItem = pagination.PageItem;
 exports.Pagination = pagination.Pagination;

package/components/pagination/index.js

@@ -1,4 +1,4 @@
-import { N, P, c, a, b, d, e } from "../../pagination-AH4hiASa.js";
+import { N, P, c, a, b, d, e } from "../../pagination-B1Ho_-r4.js";
 export {
   N as NavButton,
   P as PageItem,

package/components/progressbar/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const progressbar = require("../../progressbar-JO1ey9mx.cjs");
+const progressbar = require("../../progressbar-CnbqCXqH.cjs");
 exports.Progressbar = progressbar.Progressbar;
 exports.ProgressbarDefaultSlotStructure = progressbar.ProgressbarDefaultSlotStructure;
 exports.createProgressbar = progressbar.export_createProgressbar;

package/components/progressbar/index.js

@@ -1,4 +1,4 @@
-import { a, P, b, e } from "../../progressbar-DKFR5epE.js";
+import { a, P, b, e } from "../../progressbar-Ck20N_ee.js";
 export {
   a as Progressbar,
   P as ProgressbarDefaultSlotStructure,

package/components/select/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const select = require("../../select-D9kVpioc.cjs");
+const select = require("../../select-DHNspXXB.cjs");
 exports.Select = select.Select;
 exports.createSelect = select.export_createSelect;
 exports.getSelectDefaultConfig = select.export_getSelectDefaultConfig;

package/components/select/index.js

@@ -1,4 +1,4 @@
-import { S, a, e } from "../../select-VhhSuDsJ.js";
+import { S, a, e } from "../../select-C2jCf6jT.js";
 export {
   S as Select,
   a as createSelect,

package/components/slider/index.cjs

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const slider = require("../../slider-D0knY75x.cjs");
+const slider = require("../../slider-DyvRcMCK.cjs");
 exports.Slider = slider.Slider;
 exports.SliderDefaultSlotHandle = slider.SliderDefaultSlotHandle;
 exports.SliderDefaultSlotStructure = slider.SliderDefaultSlotStructure;
+exports.SliderDefaultTick = slider.SliderDefaultTick;
 exports.createSlider = slider.export_createSlider;
 exports.getSliderDefaultConfig = slider.export_getSliderDefaultConfig;

package/components/slider/index.js

@@ -1,8 +1,9 @@
-import { b, S, a, c, e } from "../../slider-UQlY3PHn.js";
+import { c, S, b, a, d, e } from "../../slider-vFEkaZP-.js";
 export {
-  b as Slider,
+  c as Slider,
   S as SliderDefaultSlotHandle,
-  a as SliderDefaultSlotStructure,
-  c as createSlider,
+  b as SliderDefaultSlotStructure,
+  a as SliderDefaultTick,
+  d as createSlider,
   e as getSliderDefaultConfig
 };

package/components/slider/slider.d.ts

@@ -1,5 +1,5 @@
 import type { PropsWithChildren } from 'react';
-import type { SliderContext, SliderProps, SliderSlotHandleContext } from './slider.gen';
+import type { SliderContext, SliderProps, SliderSlotHandleContext, SliderSlotTickContext } from './slider.gen';
 /**
  * A functional component that renders a button element with a directive applied to it.
  * The directive is provided through the `slotContext` parameter.
@@ -8,6 +8,14 @@ import type { SliderContext, SliderProps, SliderSlotHandleContext } from './slid
  * @returns A button element with the applied directive.
  */
 export declare const SliderDefaultSlotHandle: (slotContext: SliderSlotHandleContext) => import("react/jsx-runtime").JSX.Element;
+/**
+ * A functional component that renders a tick element with a directive applied to it.
+ * The directive is provided through the `slotContext` parameter.
+ *
+ * @param slotContext - The context object containing the directives and item for the slider tick.
+ * @returns A tick element with the applied directive.
+ */
+export declare const SliderDefaultTick: (slotContext: SliderSlotTickContext) => import("react/jsx-runtime").JSX.Element;
 /**
  * Renders the default slot structure for the Slider component.
  *

package/components/slider/slider.gen.d.ts

@@ -31,6 +31,15 @@ export interface SliderSlotHandleContext extends SliderContext {
      */
     item: SliderHandle;
 }
+/**
+ * Represents the context for a slider tick slot
+ */
+export interface SliderSlotTickContext extends SliderContext {
+    /**
+     * tick context
+     */
+    tick: SliderTick;
+}
 /**
  * Represents the state of a slider component.
  */
@@ -75,6 +84,10 @@ export interface SliderState {
      * Check if the slider is interactive, meaning it is not disabled or readonly
      */
     interactive: boolean;
+    /**
+     * Array of ticks to display on the slider component
+     */
+    ticks: SliderTick[];
     /**
      * Minimum value that can be assigned to the slider
      *
@@ -129,6 +142,12 @@ export interface SliderState {
      * @defaultValue `true`
      */
     showMinMaxLabels: boolean;
+    /**
+     * If `true` the ticks are displayed on the slider
+     *
+     * @defaultValue `false`
+     */
+    showTicks: boolean;
     /**
      * It `true` slider display is inversed
      *
@@ -158,6 +177,10 @@ export interface SliderState {
      *  Slot to change the handlers
      */
     handle: SlotContent<SliderSlotHandleContext>;
+    /**
+     * Slot to change the ticks
+     */
+    tick: SlotContent<SliderSlotTickContext>;
 }
 /**
  * Represents the properties for the Slider component.
@@ -165,28 +188,35 @@ export interface SliderState {
 export interface SliderProps {
     /**
      * Return the value for the 'aria-label' attribute for the handle
-     * @param value - value of the handle
      * @param sortedIndex - index of the handle in the sorted list
-     * @param index - index of the handle in the original list
      *
      * @defaultValue
      * ```ts
-     * (value: number) => '' + value
+     * () => 'Value'
+     * ```
+     */
+    ariaLabel: (sortedIndex: number) => string;
+    /**
+     * Return the value for the 'aria-labelledBy' attribute for the handle
+     * @param sortedIndex - index of the handle in the sorted list
+     *
+     * @defaultValue
+     * ```ts
+     * () => ''
      * ```
      */
-    ariaLabelHandle: (value: number, sortedIndex: number, index: number) => string;
+    ariaLabelledBy: (sortedIndex: number) => string;
     /**
      * Return the value for the 'aria-valuetext' attribute for the handle
      * @param value - value of the handle
      * @param sortedIndex - index of the handle in the sorted list
-     * @param index - index of the handle in the original list
      *
      * @defaultValue
      * ```ts
-     * (value: number) => '' + value
+     * (value: number) => ''
      * ```
      */
-    ariaValueText: (value: number, sortedIndex: number, index: number) => string;
+    ariaValueText: (value: number, sortedIndex: number) => string;
     /**
      * An event emitted when slider values are changed
      *
@@ -198,6 +228,19 @@ export interface SliderProps {
      * ```
      */
     onValuesChange: (values: number[]) => void;
+    /**
+     * Unit value between the ticks
+     * If value is set to `0` the {@link stepSize} is used to space the ticks
+     *
+     * @defaultValue `0`
+     */
+    tickInterval: number;
+    /**
+     * If `true` the tick values are displayed on the slider
+     *
+     * @defaultValue `true`
+     */
+    showTickValues: boolean;
     /**
      * Minimum value that can be assigned to the slider
      *
@@ -252,6 +295,12 @@ export interface SliderProps {
      * @defaultValue `true`
      */
     showMinMaxLabels: boolean;
+    /**
+     * If `true` the ticks are displayed on the slider
+     *
+     * @defaultValue `false`
+     */
+    showTicks: boolean;
     /**
      * It `true` slider display is inversed
      *
@@ -281,6 +330,10 @@ export interface SliderProps {
      *  Slot to change the handlers
      */
     handle: SlotContent<SliderSlotHandleContext>;
+    /**
+     * Slot to change the ticks
+     */
+    tick: SlotContent<SliderSlotTickContext>;
 }
 /**
  * Represents a slider widget component.
@@ -354,11 +407,44 @@ export interface SliderHandle {
     /**
      * ariaLabel of the handle
      */
-    ariaLabel: string;
+    ariaLabel: string | undefined;
     /**
      * ariaValueText of the handle
      */
-    ariaValueText: string;
+    ariaValueText: string | undefined;
+    /**
+     * aria-labelledBy of the handle
+     */
+    ariaLabelledBy: string | undefined;
+}
+/**
+ * Represents a tick in a slider component.
+ */
+export interface SliderTick {
+    /**
+     * CSS classes to be applied on the tick
+     */
+    className?: string | null;
+    /**
+     * Visualized optional explanation of the label
+     */
+    legend?: string | null;
+    /**
+     * Position of the tick in percent
+     */
+    position: number;
+    /**
+     * If `true` the tick has selected style
+     */
+    selected: boolean;
+    /**
+     * Value of the tick
+     */
+    value: number;
+    /**
+     * If `true` the tick label is displayed
+     */
+    displayLabel: boolean;
 }
 /**
  * Interface representing various directives used in the slider component.
@@ -410,4 +496,16 @@ export interface SliderDirectives {
     handleLabelDisplayDirective: Directive<{
         index: number;
     }>;
+    /**
+     * Directive to apply to the slider tick
+     */
+    tickDirective: Directive<{
+        tick: SliderTick;
+    }>;
+    /**
+     * Directive to apply to the slider tick label
+     */
+    tickLabelDirective: Directive<{
+        tick: SliderTick;
+    }>;
 }

package/components/toast/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const toast = require("../../toast-BdNereP2.cjs");
+const toast = require("../../toast-CkwIDuRg.cjs");
 exports.Toast = toast.Toast;
 exports.ToastDefaultSlotStructure = toast.ToastDefaultSlotStructure;
 exports.createToast = toast.export_createToast;

package/components/toast/index.js

@@ -1,4 +1,4 @@
-import { a, T, b, e } from "../../toast-CDfXkRkD.js";
+import { a, T, b, e } from "../../toast-BUHjCme7.js";
 export {
   a as Toast,
   T as ToastDefaultSlotStructure,

package/components/tree/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const tree = require("../../tree-CCmlpEPq.cjs");
+const tree = require("../../tree-DT261j-0.cjs");
 exports.DefaultTreeSlotItem = tree.DefaultTreeSlotItem;
 exports.DefaultTreeSlotItemContent = tree.DefaultTreeSlotItemContent;
 exports.DefaultTreeSlotItemToggle = tree.DefaultTreeSlotItemToggle;

package/components/tree/index.js

@@ -1,4 +1,4 @@
-import { b, a, D, c, T, d, e } from "../../tree-CrXS0sFt.js";
+import { b, a, D, c, T, d, e } from "../../tree-BflF5hyD.js";
 export {
   b as DefaultTreeSlotItem,
   a as DefaultTreeSlotItemContent,

package/generated/index.d.ts

@@ -7,6 +7,7 @@ export * from './utils/stores';
 export * from './utils/portal';
 export * from './utils/directive';
 export * from './utils/writables';
+export * from './utils/func';
 export * from './services/siblingsInert';
 export * from './services/resizeObserver';
 export * from './services/portal';

package/generated/utils/func.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const func = require("@agnos-ui/react-headless/utils/func");
+Object.keys(func).forEach((k) => {
+  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+    enumerable: true,
+    get: () => func[k]
+  });
+});

package/generated/utils/func.d.ts

@@ -0,0 +1 @@
+export * from '@agnos-ui/react-headless/utils/func';

package/generated/utils/func.js

@@ -0,0 +1 @@
+export * from "@agnos-ui/react-headless/utils/func";

package/index.cjs

@@ -1,16 +1,16 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const accordion = require("./accordion-QclyKh8E.cjs");
-const alert = require("./alert-BWfpiNSz.cjs");
+const alert = require("./alert-BGVw_vsM.cjs");
 const collapse = require("./collapse-UMbDs6Gh.cjs");
-const modal = require("./modal-C3hVG-lH.cjs");
-const pagination = require("./pagination-CYTSlunk.cjs");
-const progressbar = require("./progressbar-JO1ey9mx.cjs");
+const modal = require("./modal-DQLOz7TE.cjs");
+const pagination = require("./pagination-Bq4Hvm1j.cjs");
+const progressbar = require("./progressbar-CnbqCXqH.cjs");
 const rating = require("./rating-BaZTCQi1.cjs");
-const select = require("./select-D9kVpioc.cjs");
-const slider = require("./slider-D0knY75x.cjs");
-const toast = require("./toast-BdNereP2.cjs");
-const tree = require("./tree-CCmlpEPq.cjs");
+const select = require("./select-DHNspXXB.cjs");
+const slider = require("./slider-DyvRcMCK.cjs");
+const toast = require("./toast-CkwIDuRg.cjs");
+const tree = require("./tree-DT261j-0.cjs");
 const types = require("@agnos-ui/react-headless/types");
 const slot = require("@agnos-ui/react-headless/slot");
 const config = require("@agnos-ui/react-headless/config");
@@ -20,6 +20,7 @@ const stores = require("@agnos-ui/react-headless/utils/stores");
 const portal = require("@agnos-ui/react-headless/utils/portal");
 const directive = require("@agnos-ui/react-headless/utils/directive");
 const writables = require("@agnos-ui/react-headless/utils/writables");
+const func = require("@agnos-ui/react-headless/utils/func");
 const siblingsInert = require("@agnos-ui/react-headless/services/siblingsInert");
 const resizeObserver = require("@agnos-ui/react-headless/services/resizeObserver");
 const portal$1 = require("@agnos-ui/react-headless/services/portal");
@@ -77,6 +78,7 @@ exports.getSelectDefaultConfig = select.export_getSelectDefaultConfig;
 exports.Slider = slider.Slider;
 exports.SliderDefaultSlotHandle = slider.SliderDefaultSlotHandle;
 exports.SliderDefaultSlotStructure = slider.SliderDefaultSlotStructure;
+exports.SliderDefaultTick = slider.SliderDefaultTick;
 exports.createSlider = slider.export_createSlider;
 exports.getSliderDefaultConfig = slider.export_getSliderDefaultConfig;
 exports.Toast = toast.Toast;
@@ -142,6 +144,12 @@ Object.keys(writables).forEach((k) => {
     get: () => writables[k]
   });
 });
+Object.keys(func).forEach((k) => {
+  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+    enumerable: true,
+    get: () => func[k]
+  });
+});
 Object.keys(siblingsInert).forEach((k) => {
   if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
     enumerable: true,

package/index.js

@@ -1,14 +1,14 @@
 import { b, a, A, d, c, f, e } from "./accordion-GX854ooE.js";
-import { a as a2, A as A2, b as b2, e as e2 } from "./alert-CWbr08rp.js";
+import { a as a2, A as A2, b as b2, e as e2 } from "./alert-BM4ImSpO.js";
 import { C, a as a3, e as e3 } from "./collapse-BOXBa8_8.js";
-import { b as b3, M, a as a4, c as c2, e as e4, f as f2, d as d2, o } from "./modal-DPKlan_9.js";
-import { N, P, c as c3, a as a5, b as b4, d as d3, e as e5 } from "./pagination-AH4hiASa.js";
-import { a as a6, P as P2, b as b5, e as e6 } from "./progressbar-DKFR5epE.js";
+import { b as b3, M, a as a4, c as c2, e as e4, f as f2, d as d2, o } from "./modal-apFubipB.js";
+import { N, P, c as c3, a as a5, b as b4, d as d3, e as e5 } from "./pagination-B1Ho_-r4.js";
+import { a as a6, P as P2, b as b5, e as e6 } from "./progressbar-Ck20N_ee.js";
 import { R, a as a7, e as e7 } from "./rating-DziC4Tsh.js";
-import { S, a as a8, e as e8 } from "./select-VhhSuDsJ.js";
-import { b as b6, S as S2, a as a9, c as c4, e as e9 } from "./slider-UQlY3PHn.js";
-import { a as a10, T, b as b7, e as e10 } from "./toast-CDfXkRkD.js";
-import { b as b8, a as a11, D, c as c5, T as T2, d as d4, e as e11 } from "./tree-CrXS0sFt.js";
+import { S, a as a8, e as e8 } from "./select-C2jCf6jT.js";
+import { c as c4, S as S2, b as b6, a as a9, d as d4, e as e9 } from "./slider-vFEkaZP-.js";
+import { a as a10, T, b as b7, e as e10 } from "./toast-BUHjCme7.js";
+import { b as b8, a as a11, D, c as c5, T as T2, d as d5, e as e11 } from "./tree-BflF5hyD.js";
 export * from "@agnos-ui/react-headless/types";
 export * from "@agnos-ui/react-headless/slot";
 export * from "@agnos-ui/react-headless/config";
@@ -18,6 +18,7 @@ export * from "@agnos-ui/react-headless/utils/stores";
 export * from "@agnos-ui/react-headless/utils/portal";
 export * from "@agnos-ui/react-headless/utils/directive";
 export * from "@agnos-ui/react-headless/utils/writables";
+export * from "@agnos-ui/react-headless/utils/func";
 export * from "@agnos-ui/react-headless/services/siblingsInert";
 export * from "@agnos-ui/react-headless/services/resizeObserver";
 export * from "@agnos-ui/react-headless/services/portal";
@@ -56,9 +57,10 @@ export {
   P2 as ProgressbarDefaultSlotStructure,
   R as Rating,
   S as Select,
-  b6 as Slider,
+  c4 as Slider,
   S2 as SliderDefaultSlotHandle,
-  a9 as SliderDefaultSlotStructure,
+  b6 as SliderDefaultSlotStructure,
+  a9 as SliderDefaultTick,
   a10 as Toast,
   T as ToastDefaultSlotStructure,
   T2 as Tree,
@@ -73,9 +75,9 @@ export {
   b5 as createProgressbar,
   a7 as createRating,
   a8 as createSelect,
-  c4 as createSlider,
+  d4 as createSlider,
   b7 as createToast,
-  d4 as createTree,
+  d5 as createTree,
   f as factoryCreateAccordion,
   e as getAccordionDefaultConfig,
   e2 as getAlertDefaultConfig,

package/{modal-C3hVG-lH.cjs → modal-DQLOz7TE.cjs}

@@ -3,7 +3,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const slot = require("@agnos-ui/react-headless/slot");
 const directive = require("@agnos-ui/react-headless/utils/directive");
 const portal = require("@agnos-ui/react-headless/utils/portal");
-const classNames = require("classnames");
+const clsx = require("clsx");
 const React = require("react");
 const ReactDOM = require("react-dom/client");
 const generated_config = require("./generated/config.cjs");
@@ -25,7 +25,7 @@ const ModalDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxRuntime.js
 const BackdropElement = ({ directives }) => /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirectives([directive.classDirective, "modal-backdrop"], directives.backdropDirective) });
 const ModalElement = (slotContext) => {
   const { fullscreen } = slotContext.state;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirectives([directive.classDirective, "modal d-block"], slotContext.directives.modalDirective), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames("modal-dialog", { "modal-fullscreen": fullscreen }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-content", children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.structure, props: slotContext }) }) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirectives([directive.classDirective, "modal d-block"], slotContext.directives.modalDirective), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("modal-dialog", { "modal-fullscreen": fullscreen }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-content", children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.structure, props: slotContext }) }) }) });
 };
 function Modal(props) {
   const widgetContext = generated_config.useWidgetWithConfig(export_createModal, props, "modal", {

package/{modal-DPKlan_9.js → modal-apFubipB.js}

@@ -2,7 +2,7 @@ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { Slot } from "@agnos-ui/react-headless/slot";
 import { useDirective, useDirectives, classDirective } from "@agnos-ui/react-headless/utils/directive";
 import { Portal } from "@agnos-ui/react-headless/utils/portal";
-import classNames from "classnames";
+import clsx from "clsx";
 import { useImperativeHandle } from "react";
 import ReactDOM from "react-dom/client";
 import { useWidgetWithConfig } from "./generated/config.js";
@@ -24,7 +24,7 @@ const ModalDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxs(Fragment
 const BackdropElement = ({ directives }) => /* @__PURE__ */ jsx("div", { ...useDirectives([classDirective, "modal-backdrop"], directives.backdropDirective) });
 const ModalElement = (slotContext) => {
   const { fullscreen } = slotContext.state;
-  return /* @__PURE__ */ jsx("div", { ...useDirectives([classDirective, "modal d-block"], slotContext.directives.modalDirective), children: /* @__PURE__ */ jsx("div", { className: classNames("modal-dialog", { "modal-fullscreen": fullscreen }), children: /* @__PURE__ */ jsx("div", { className: "modal-content", children: /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.structure, props: slotContext }) }) }) });
+  return /* @__PURE__ */ jsx("div", { ...useDirectives([classDirective, "modal d-block"], slotContext.directives.modalDirective), children: /* @__PURE__ */ jsx("div", { className: clsx("modal-dialog", { "modal-fullscreen": fullscreen }), children: /* @__PURE__ */ jsx("div", { className: "modal-content", children: /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.structure, props: slotContext }) }) }) });
 };
 function Modal(props) {
   const widgetContext = useWidgetWithConfig(export_createModal, props, "modal", {

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@agnos-ui/react-bootstrap",
 	"description": "Bootstrap-based component library for React.",
-	"version": "0.7.0",
+	"version": "0.8.0-next.0",
 	"type": "module",
 	"main": "./index.cjs",
 	"module": "./index.js",
@@ -49,9 +49,9 @@
 		}
 	},
 	"dependencies": {
-		"@agnos-ui/core-bootstrap": "0.7.0",
-		"@agnos-ui/react-headless": "0.7.0",
-		"classnames": "^2.5.1"
+		"@agnos-ui/core-bootstrap": "0.8.0-next.0",
+		"@agnos-ui/react-headless": "0.8.0-next.0",
+		"clsx": "^2.1.1"
 	},
 	"peerDependencies": {
 		"@amadeus-it-group/tansu": "^2.0.0",

package/{pagination-AH4hiASa.js → pagination-B1Ho_-r4.js}

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { Slot } from "@agnos-ui/react-headless/slot";
-import classNames from "classnames";
+import clsx from "clsx";
 import { useWidgetWithConfig } from "./generated/config.js";
 import * as React from "react";
 import { useImperativeHandle } from "react";
@@ -8,7 +8,7 @@ import { useDirectives, classDirective } from "@agnos-ui/react-headless/utils/di
 import { getPaginationDefaultConfig, createPagination } from "@agnos-ui/core-bootstrap/components/pagination";
 const PageItem = React.forwardRef(
   ({ disabled, active, activeLabel, className, children, directive, page }, ref) => {
-    return /* @__PURE__ */ jsx("li", { ref, className: classNames("page-item", { active, disabled }), children: /* @__PURE__ */ jsxs("a", { ...useDirectives([directive, { page }], [classDirective, classNames("page-link", className)]), children: [
+    return /* @__PURE__ */ jsx("li", { ref, className: clsx("page-item", { active, disabled }), children: /* @__PURE__ */ jsxs("a", { ...useDirectives([directive, { page }], [classDirective, ["page-link", className]]), children: [
       children,
       active && activeLabel && /* @__PURE__ */ jsx("span", { className: "visually-hidden", children: activeLabel })
     ] }) });
@@ -16,7 +16,7 @@ const PageItem = React.forwardRef(
 );
 PageItem.displayName = "PageItem";
 const NavButton = React.forwardRef(({ disabled, className, children, directive }, ref) => {
-  return /* @__PURE__ */ jsx("li", { ref, className: classNames("page-item", { disabled }), children: /* @__PURE__ */ jsx("a", { ...useDirectives(directive, [classDirective, classNames("page-link", className)]), children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children }) }) });
+  return /* @__PURE__ */ jsx("li", { ref, className: clsx("page-item", { disabled }), children: /* @__PURE__ */ jsx("a", { ...useDirectives(directive, [classDirective, ["page-link", className]]), children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children }) }) });
 });
 NavButton.displayName = "NavButton";
 const export_getPaginationDefaultConfig = getPaginationDefaultConfig;
@@ -76,7 +76,7 @@ const PaginationDefaultSlotStructure = (slotContext) => {
     );
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs("ul", { className: classNames("au-pagination", "pagination", { [`pagination-${state.size}`]: !!state.size }, state.className), children: [
+    /* @__PURE__ */ jsxs("ul", { className: clsx("au-pagination", "pagination", { [`pagination-${state.size}`]: !!state.size }, state.className), children: [
       ItemsBefore,
       /* @__PURE__ */ jsx(Slot, { slotContent: state.pagesDisplay, props: slotContext }),
       ItemsAfter

package/{pagination-CYTSlunk.cjs → pagination-Bq4Hvm1j.cjs}

@@ -1,7 +1,7 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
 const slot = require("@agnos-ui/react-headless/slot");
-const classNames = require("classnames");
+const clsx = require("clsx");
 const generated_config = require("./generated/config.cjs");
 const React = require("react");
 const directive = require("@agnos-ui/react-headless/utils/directive");
@@ -25,7 +25,7 @@ function _interopNamespaceDefault(e) {
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const PageItem = React__namespace.forwardRef(
   ({ disabled, active, activeLabel, className, children, directive: directive$1, page }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: classNames("page-item", { active, disabled }), children: /* @__PURE__ */ jsxRuntime.jsxs("a", { ...directive.useDirectives([directive$1, { page }], [directive.classDirective, classNames("page-link", className)]), children: [
+    return /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: clsx("page-item", { active, disabled }), children: /* @__PURE__ */ jsxRuntime.jsxs("a", { ...directive.useDirectives([directive$1, { page }], [directive.classDirective, ["page-link", className]]), children: [
       children,
       active && activeLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "visually-hidden", children: activeLabel })
     ] }) });
@@ -33,7 +33,7 @@ const PageItem = React__namespace.forwardRef(
 );
 PageItem.displayName = "PageItem";
 const NavButton = React__namespace.forwardRef(({ disabled, className, children, directive: directive$1 }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: classNames("page-item", { disabled }), children: /* @__PURE__ */ jsxRuntime.jsx("a", { ...directive.useDirectives(directive$1, [directive.classDirective, classNames("page-link", className)]), children: /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children }) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: clsx("page-item", { disabled }), children: /* @__PURE__ */ jsxRuntime.jsx("a", { ...directive.useDirectives(directive$1, [directive.classDirective, ["page-link", className]]), children: /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children }) }) });
 });
 NavButton.displayName = "NavButton";
 const export_getPaginationDefaultConfig = pagination.getPaginationDefaultConfig;
@@ -93,7 +93,7 @@ const PaginationDefaultSlotStructure = (slotContext) => {
     );
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: classNames("au-pagination", "pagination", { [`pagination-${state.size}`]: !!state.size }, state.className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: clsx("au-pagination", "pagination", { [`pagination-${state.size}`]: !!state.size }, state.className), children: [
       ItemsBefore,
       /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: state.pagesDisplay, props: slotContext }),
       ItemsAfter

package/{progressbar-DKFR5epE.js → progressbar-Ck20N_ee.js}

@@ -1,14 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { Slot } from "@agnos-ui/react-headless/slot";
 import { useDirective } from "@agnos-ui/react-headless/utils/directive";
-import classNames from "classnames";
+import clsx from "clsx";
 import { useWidgetWithConfig } from "./generated/config.js";
 import { getProgressbarDefaultConfig, createProgressbar } from "@agnos-ui/core-bootstrap/components/progressbar";
 const export_getProgressbarDefaultConfig = getProgressbarDefaultConfig;
 const export_createProgressbar = createProgressbar;
 const ProgressbarDefaultSlotStructure = (slotContext) => {
   const { striped, animated, type } = slotContext.state;
-  const classes = classNames("progress-bar", { "progress-bar-striped": striped }, { "progress-bar-animated": animated }, { [`text-bg-${type}`]: !!type });
+  const classes = clsx("progress-bar", { "progress-bar-striped": striped }, { "progress-bar-animated": animated }, { [`text-bg-${type}`]: !!type });
   return /* @__PURE__ */ jsx("div", { className: "progress", style: { height: slotContext.state.height || void 0 }, children: /* @__PURE__ */ jsx("div", { className: classes, style: { width: `${slotContext.state.percentage}%` }, children: /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.children, props: slotContext }) }) });
 };
 const Progressbar = (props) => {

package/{progressbar-JO1ey9mx.cjs → progressbar-CnbqCXqH.cjs}

@@ -2,14 +2,14 @@
 const jsxRuntime = require("react/jsx-runtime");
 const slot = require("@agnos-ui/react-headless/slot");
 const directive = require("@agnos-ui/react-headless/utils/directive");
-const classNames = require("classnames");
+const clsx = require("clsx");
 const generated_config = require("./generated/config.cjs");
 const progressbar = require("@agnos-ui/core-bootstrap/components/progressbar");
 const export_getProgressbarDefaultConfig = progressbar.getProgressbarDefaultConfig;
 const export_createProgressbar = progressbar.createProgressbar;
 const ProgressbarDefaultSlotStructure = (slotContext) => {
   const { striped, animated, type } = slotContext.state;
-  const classes = classNames("progress-bar", { "progress-bar-striped": striped }, { "progress-bar-animated": animated }, { [`text-bg-${type}`]: !!type });
+  const classes = clsx("progress-bar", { "progress-bar-striped": striped }, { "progress-bar-animated": animated }, { [`text-bg-${type}`]: !!type });
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "progress", style: { height: slotContext.state.height || void 0 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes, style: { width: `${slotContext.state.percentage}%` }, children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.children, props: slotContext }) }) });
 };
 const Progressbar = (props) => {

package/{select-VhhSuDsJ.js → select-C2jCf6jT.js}

@@ -1,7 +1,7 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { Slot } from "@agnos-ui/react-headless/slot";
 import { useDirectives, classDirective, useDirective } from "@agnos-ui/react-headless/utils/directive";
-import classNames from "classnames";
+import clsx from "clsx";
 import { useWidgetWithConfig } from "./generated/config.js";
 import { getSelectDefaultConfig, createSelect } from "@agnos-ui/core-bootstrap/components/select";
 import { useImperativeHandle } from "react";
@@ -24,7 +24,7 @@ function Badges({ slotContext }) {
   return badges.length ? /* @__PURE__ */ jsx(Fragment, { children: badges }) : null;
 }
 function SelectItem({ itemContext, slotContext }) {
-  const classname = classNames("dropdown-item", "position-relative", { "text-bg-primary": itemContext === slotContext.state.highlighted });
+  const classname = clsx("dropdown-item", "position-relative", { "text-bg-primary": itemContext === slotContext.state.highlighted });
   return /* @__PURE__ */ jsx("li", { className: classname, ...useDirective(slotContext.directives.itemAttributesDirective, itemContext), children: /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.itemLabel, props: { ...slotContext, itemContext } }) });
 }
 function Rows({ slotContext }) {

package/{select-D9kVpioc.cjs → select-DHNspXXB.cjs}

@@ -2,7 +2,7 @@
 const jsxRuntime = require("react/jsx-runtime");
 const slot = require("@agnos-ui/react-headless/slot");
 const directive = require("@agnos-ui/react-headless/utils/directive");
-const classNames = require("classnames");
+const clsx = require("clsx");
 const generated_config = require("./generated/config.cjs");
 const select = require("@agnos-ui/core-bootstrap/components/select");
 const React = require("react");
@@ -25,7 +25,7 @@ function Badges({ slotContext }) {
   return badges.length ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: badges }) : null;
 }
 function SelectItem({ itemContext, slotContext }) {
-  const classname = classNames("dropdown-item", "position-relative", { "text-bg-primary": itemContext === slotContext.state.highlighted });
+  const classname = clsx("dropdown-item", "position-relative", { "text-bg-primary": itemContext === slotContext.state.highlighted });
   return /* @__PURE__ */ jsxRuntime.jsx("li", { className: classname, ...directive.useDirective(slotContext.directives.itemAttributesDirective, itemContext), children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.itemLabel, props: { ...slotContext, itemContext } }) });
 }
 function Rows({ slotContext }) {

package/{slider-D0knY75x.cjs → slider-DyvRcMCK.cjs}

@@ -10,6 +10,50 @@ const export_createSlider = slider.createSlider;
 const SliderDefaultSlotHandle = (slotContext) => {
   return /* @__PURE__ */ jsxRuntime.jsx("button", { ...directive.useDirective(slotContext.directives.handleDirective, { item: slotContext.item }), children: " " });
 };
+const TickLabelDisplay = ({ directive: directive$1, tick }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { ...directive.useDirective(directive$1, { tick }), children: tick.value });
+};
+const SliderDefaultTick = (slotContext) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+  slotContext.tick.displayLabel && /* @__PURE__ */ jsxRuntime.jsx(TickLabelDisplay, { directive: slotContext.directives.tickLabelDirective, tick: slotContext.tick }),
+  /* @__PURE__ */ jsxRuntime.jsx("span", { ...directive.useDirective(slotContext.directives.tickDirective, { tick: slotContext.tick }), children: slotContext.tick.selected ? /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      style: { width: "var(--bs-slider-tick-secondary-size)", height: "var(--bs-slider-tick-primary-size)" },
+      fill: "none",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "circle",
+          {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fill: slotContext.state.disabled ? "var(--bs-slider-tick-disabled-color)" : "var(--bs-slider-tick-selected-color)"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "50%", cy: "50%", r: "25%", fill: "white" })
+      ]
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      style: { width: "var(--bs-slider-tick-secondary-size)", height: "var(--bs-slider-tick-primary-size)" },
+      fill: "none",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "circle",
+        {
+          cx: "50%",
+          cy: "50%",
+          r: "45%",
+          fill: "white",
+          stroke: slotContext.state.disabled ? "var(--bs-slider-tick-disabled-color)" : "var(--bs-slider-tick-neutral-color)",
+          strokeWidth: "1.5"
+        }
+      )
+    }
+  ) })
+] });
 const ProgressDisplay = ({ directive: directive$1, option }) => {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirective(directive$1, { option }) });
 };
@@ -38,6 +82,7 @@ const SliderDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxRuntime.j
   /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirective(slotContext.directives.clickableAreaDirective) }),
   slotContext.state.showMinMaxLabels && /* @__PURE__ */ jsxRuntime.jsx(MinMaxLabels, { ...slotContext }),
   slotContext.state.showValueLabels && slotContext.state.combinedLabelDisplay && /* @__PURE__ */ jsxRuntime.jsx(CombinedLabel, { ...slotContext }),
+  slotContext.state.ticks.map((tick) => /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.tick, props: { tick, ...slotContext } }, tick.position)),
   slotContext.state.sortedHandles.map((item, i) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.handle, props: { item, ...slotContext } }),
     slotContext.state.showValueLabels && !slotContext.state.combinedLabelDisplay && /* @__PURE__ */ jsxRuntime.jsx(HandleLabelDisplay, { directive: slotContext.directives.handleLabelDisplayDirective, index: i, children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: slotContext.state.label, props: { value: slotContext.state.values[i], ...slotContext } }) })
@@ -46,12 +91,14 @@ const SliderDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxRuntime.j
 function Slider(props) {
   const widgetContext = generated_config.useWidgetWithConfig(export_createSlider, props, "slider", {
     structure: SliderDefaultSlotStructure,
-    handle: SliderDefaultSlotHandle
+    handle: SliderDefaultSlotHandle,
+    tick: SliderDefaultTick
   });
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ...directive.useDirective(widgetContext.directives.sliderDirective), children: /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: widgetContext.state.structure, props: widgetContext }) });
 }
 exports.Slider = Slider;
 exports.SliderDefaultSlotHandle = SliderDefaultSlotHandle;
 exports.SliderDefaultSlotStructure = SliderDefaultSlotStructure;
+exports.SliderDefaultTick = SliderDefaultTick;
 exports.export_createSlider = export_createSlider;
 exports.export_getSliderDefaultConfig = export_getSliderDefaultConfig;

package/{slider-UQlY3PHn.js → slider-vFEkaZP-.js}

@@ -9,6 +9,50 @@ const export_createSlider = createSlider;
 const SliderDefaultSlotHandle = (slotContext) => {
   return /* @__PURE__ */ jsx("button", { ...useDirective(slotContext.directives.handleDirective, { item: slotContext.item }), children: " " });
 };
+const TickLabelDisplay = ({ directive, tick }) => {
+  return /* @__PURE__ */ jsx("span", { ...useDirective(directive, { tick }), children: tick.value });
+};
+const SliderDefaultTick = (slotContext) => /* @__PURE__ */ jsxs(Fragment, { children: [
+  slotContext.tick.displayLabel && /* @__PURE__ */ jsx(TickLabelDisplay, { directive: slotContext.directives.tickLabelDirective, tick: slotContext.tick }),
+  /* @__PURE__ */ jsx("span", { ...useDirective(slotContext.directives.tickDirective, { tick: slotContext.tick }), children: slotContext.tick.selected ? /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      style: { width: "var(--bs-slider-tick-secondary-size)", height: "var(--bs-slider-tick-primary-size)" },
+      fill: "none",
+      children: [
+        /* @__PURE__ */ jsx(
+          "circle",
+          {
+            cx: "50%",
+            cy: "50%",
+            r: "50%",
+            fill: slotContext.state.disabled ? "var(--bs-slider-tick-disabled-color)" : "var(--bs-slider-tick-selected-color)"
+          }
+        ),
+        /* @__PURE__ */ jsx("circle", { cx: "50%", cy: "50%", r: "25%", fill: "white" })
+      ]
+    }
+  ) : /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      style: { width: "var(--bs-slider-tick-secondary-size)", height: "var(--bs-slider-tick-primary-size)" },
+      fill: "none",
+      children: /* @__PURE__ */ jsx(
+        "circle",
+        {
+          cx: "50%",
+          cy: "50%",
+          r: "45%",
+          fill: "white",
+          stroke: slotContext.state.disabled ? "var(--bs-slider-tick-disabled-color)" : "var(--bs-slider-tick-neutral-color)",
+          strokeWidth: "1.5"
+        }
+      )
+    }
+  ) })
+] });
 const ProgressDisplay = ({ directive, option }) => {
   return /* @__PURE__ */ jsx("div", { ...useDirective(directive, { option }) });
 };
@@ -37,6 +81,7 @@ const SliderDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxs(Fragmen
   /* @__PURE__ */ jsx("div", { ...useDirective(slotContext.directives.clickableAreaDirective) }),
   slotContext.state.showMinMaxLabels && /* @__PURE__ */ jsx(MinMaxLabels, { ...slotContext }),
   slotContext.state.showValueLabels && slotContext.state.combinedLabelDisplay && /* @__PURE__ */ jsx(CombinedLabel, { ...slotContext }),
+  slotContext.state.ticks.map((tick) => /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.tick, props: { tick, ...slotContext } }, tick.position)),
   slotContext.state.sortedHandles.map((item, i) => /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
     /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.handle, props: { item, ...slotContext } }),
     slotContext.state.showValueLabels && !slotContext.state.combinedLabelDisplay && /* @__PURE__ */ jsx(HandleLabelDisplay, { directive: slotContext.directives.handleLabelDisplayDirective, index: i, children: /* @__PURE__ */ jsx(Slot, { slotContent: slotContext.state.label, props: { value: slotContext.state.values[i], ...slotContext } }) })
@@ -45,14 +90,16 @@ const SliderDefaultSlotStructure = (slotContext) => /* @__PURE__ */ jsxs(Fragmen
 function Slider(props) {
   const widgetContext = useWidgetWithConfig(export_createSlider, props, "slider", {
     structure: SliderDefaultSlotStructure,
-    handle: SliderDefaultSlotHandle
+    handle: SliderDefaultSlotHandle,
+    tick: SliderDefaultTick
   });
   return /* @__PURE__ */ jsx("div", { ...useDirective(widgetContext.directives.sliderDirective), children: /* @__PURE__ */ jsx(Slot, { slotContent: widgetContext.state.structure, props: widgetContext }) });
 }
 export {
   SliderDefaultSlotHandle as S,
-  SliderDefaultSlotStructure as a,
-  Slider as b,
-  export_createSlider as c,
+  SliderDefaultTick as a,
+  SliderDefaultSlotStructure as b,
+  Slider as c,
+  export_createSlider as d,
   export_getSliderDefaultConfig as e
 };

package/{toast-CDfXkRkD.js → toast-BUHjCme7.js}

@@ -21,7 +21,7 @@ const ToastElement = (slotContext) => /* @__PURE__ */ jsx(
   "div",
   {
     ...useDirectives(
-      [classDirective, `toast ${slotContext.state.dismissible ? "toast-dismissible" : ""} ${!slotContext.state.header ? "d-flex" : ""}`],
+      [classDirective, { "toast-dismissible": slotContext.state.dismissible, "d-flex": !slotContext.state.header }],
       slotContext.directives.transitionDirective,
       slotContext.directives.autoHideDirective,
       slotContext.directives.bodyDirective

package/{toast-BdNereP2.cjs → toast-CkwIDuRg.cjs}

@@ -22,7 +22,7 @@ const ToastElement = (slotContext) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ...directive.useDirectives(
-      [directive.classDirective, `toast ${slotContext.state.dismissible ? "toast-dismissible" : ""} ${!slotContext.state.header ? "d-flex" : ""}`],
+      [directive.classDirective, { "toast-dismissible": slotContext.state.dismissible, "d-flex": !slotContext.state.header }],
       slotContext.directives.transitionDirective,
       slotContext.directives.autoHideDirective,
       slotContext.directives.bodyDirective

package/{tree-CrXS0sFt.js → tree-BflF5hyD.js}

@@ -3,7 +3,7 @@ import { Slot } from "@agnos-ui/react-headless/slot";
 import { useDirective } from "@agnos-ui/react-headless/utils/directive";
 import { useWidgetWithConfig } from "./generated/config.js";
 import { getTreeDefaultConfig, createTree } from "@agnos-ui/core-bootstrap/components/tree";
-import classNames from "classnames";
+import clsx from "clsx";
 const export_getTreeDefaultConfig = getTreeDefaultConfig;
 const export_createTree = createTree;
 const ToggleButtonDisplay = ({ directive, item }) => {
@@ -29,7 +29,7 @@ const DefaultTreeSlotItem = (slotContext) => {
 };
 const DefaultTreeSlotStructure = (slotContext) => {
   const { state } = slotContext;
-  return /* @__PURE__ */ jsx("ul", { role: "tree", className: classNames("au-tree", state.className), ...useDirective(slotContext.directives.navigationDirective), children: state.normalizedNodes.map((node, index) => /* @__PURE__ */ jsx(Slot, { slotContent: state.item, props: { item: node, ...slotContext } }, node.label + node.level + index)) });
+  return /* @__PURE__ */ jsx("ul", { role: "tree", className: clsx("au-tree", state.className), ...useDirective(slotContext.directives.navigationDirective), children: state.normalizedNodes.map((node, index) => /* @__PURE__ */ jsx(Slot, { slotContent: state.item, props: { item: node, ...slotContext } }, node.label + node.level + index)) });
 };
 const defaultConfig = {
   structure: DefaultTreeSlotStructure,

package/{tree-CCmlpEPq.cjs → tree-DT261j-0.cjs}

@@ -4,7 +4,7 @@ const slot = require("@agnos-ui/react-headless/slot");
 const directive = require("@agnos-ui/react-headless/utils/directive");
 const generated_config = require("./generated/config.cjs");
 const tree = require("@agnos-ui/core-bootstrap/components/tree");
-const classNames = require("classnames");
+const clsx = require("clsx");
 const export_getTreeDefaultConfig = tree.getTreeDefaultConfig;
 const export_createTree = tree.createTree;
 const ToggleButtonDisplay = ({ directive: directive$1, item }) => {
@@ -30,7 +30,7 @@ const DefaultTreeSlotItem = (slotContext) => {
 };
 const DefaultTreeSlotStructure = (slotContext) => {
   const { state } = slotContext;
-  return /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "tree", className: classNames("au-tree", state.className), ...directive.useDirective(slotContext.directives.navigationDirective), children: state.normalizedNodes.map((node, index) => /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: state.item, props: { item: node, ...slotContext } }, node.label + node.level + index)) });
+  return /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "tree", className: clsx("au-tree", state.className), ...directive.useDirective(slotContext.directives.navigationDirective), children: state.normalizedNodes.map((node, index) => /* @__PURE__ */ jsxRuntime.jsx(slot.Slot, { slotContent: state.item, props: { item: node, ...slotContext } }, node.label + node.level + index)) });
 };
 const defaultConfig = {
   structure: DefaultTreeSlotStructure,