@d4gger/design-system 2.7.0 → 3.0.0

package/dist/components/skeleton/Skeleton.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/skeleton/Skeleton.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { skeletonPropDefs } from './skeleton.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype SkeletonElement = React.ComponentRef<'div'>\ntype SkeletonOwnProps = GetPropDefTypes<typeof skeletonPropDefs>\n\ninterface SkeletonProps extends React.ComponentPropsWithoutRef<'div'>, SkeletonOwnProps {}\n\nconst Skeleton = React.forwardRef<SkeletonElement, SkeletonProps>((props, forwardedRef) => {\n  const { asChild, children, className, shape = 'rectangle', ...skeletonProps } = extractProps(props, skeletonPropDefs)\n\n  const Comp = asChild ? Slot : 'div'\n\n  return (\n    <Comp\n      {...skeletonProps}\n      ref={forwardedRef}\n      className={classNames('dsx-skeleton', `dsx-skeleton--${shape}`, className)}\n      data-shape={shape}\n    >\n      {asChild ? <Slottable>{children}</Slottable> : children}\n    </Comp>\n  )\n})\nSkeleton.displayName = 'Skeleton'\n\nexport { Skeleton }\nexport type { SkeletonElement, SkeletonOwnProps, SkeletonProps }\n"],
-  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,SAAS,MAAM,iBAAiB;AAEhC,SAAS,oBAAoB;AAC7B,SAAS,wBAAwB;AAqBhB;AAZjB,MAAM,WAAW,MAAM,WAA2C,CAAC,OAAO,iBAAiB;AACzF,QAAM,EAAE,SAAS,UAAU,WAAW,QAAQ,aAAa,GAAG,cAAc,IAAI,aAAa,OAAO,gBAAgB;AAEpH,QAAM,OAAO,UAAU,OAAO;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,WAAW,gBAAgB,iBAAiB,KAAK,IAAI,SAAS;AAAA,MACzE,cAAY;AAAA,MAEX,oBAAU,oBAAC,aAAW,UAAS,IAAe;AAAA;AAAA,EACjD;AAEJ,CAAC;AACD,SAAS,cAAc;",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { skeletonPropDefs } from './skeleton.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\ntype SkeletonElement = React.ComponentRef<'div'>\ntype SkeletonOwnProps = GetPropDefTypes<typeof skeletonPropDefs>\n\ninterface SkeletonProps extends React.ComponentPropsWithoutRef<'div'>, SkeletonOwnProps {}\n\nconst Skeleton = React.forwardRef<SkeletonElement, SkeletonProps>((props, forwardedRef) => {\n  const { asChild, children, className, shape = 'rectangle', ...skeletonProps } = extractProps(props, skeletonPropDefs)\n\n  const Comp = asChild ? Slot : 'div'\n\n  return (\n    <Comp\n      {...skeletonProps}\n      ref={forwardedRef}\n      className={classNames('dsx-skeleton', className)}\n      data-shape={shape}\n    >\n      {asChild ? <Slottable>{children}</Slottable> : children}\n    </Comp>\n  )\n})\nSkeleton.displayName = 'Skeleton'\n\nexport { Skeleton }\nexport type { SkeletonElement, SkeletonOwnProps, SkeletonProps }\n"],
+  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,SAAS,MAAM,iBAAiB;AAEhC,SAAS,oBAAoB;AAC7B,SAAS,wBAAwB;AAqBhB;AAZjB,MAAM,WAAW,MAAM,WAA2C,CAAC,OAAO,iBAAiB;AACzF,QAAM,EAAE,SAAS,UAAU,WAAW,QAAQ,aAAa,GAAG,cAAc,IAAI,aAAa,OAAO,gBAAgB;AAEpH,QAAM,OAAO,UAAU,OAAO;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,WAAW,WAAW,gBAAgB,SAAS;AAAA,MAC/C,cAAY;AAAA,MAEX,oBAAU,oBAAC,aAAW,UAAS,IAAe;AAAA;AAAA,EACjD;AAEJ,CAAC;AACD,SAAS,cAAc;",
   "names": []
 }

package/dist/components/skeleton.css

@@ -10,13 +10,19 @@
   );
   background-size: 200% 100%;
   border-radius: var(--dsx-rounded-md);
-  animation: dsx-skeleton-shimmer calc(var(--dsx-motion-duration-slow) * 4) var(--dsx-motion-easing-in-out) infinite;
+  animation: dsx-skeleton-shimmer var(--dsx-motion-duration-shimmer) var(--dsx-motion-easing-in-out) infinite;
 }
 
-.dsx-skeleton--circle {
+.dsx-skeleton[data-shape='circle'] {
   border-radius: var(--dsx-rounded-full);
 }
 
-.dsx-skeleton--text-line {
+.dsx-skeleton[data-shape='text-line'] {
   min-height: 1em;
 }
+
+@media (prefers-reduced-motion: reduce) {
+  .dsx-skeleton {
+    animation: none;
+  }
+}

package/dist/components/slider.css

@@ -39,7 +39,7 @@
 .dsx-slider__range {
   position: absolute;
   border-radius: var(--dsx-rounded-full);
-  background: var(--dsx-color-primary);
+  background: var(--dsx-color-accent-10);
 }
 
 .dsx-slider--horizontal .dsx-slider__range {
@@ -53,11 +53,12 @@
 /* Size — track thickness and thumb diameter */
 .dsx-slider[data-size='sm'].dsx-slider--horizontal .dsx-slider__track { height: var(--dsx-space-xs); }
 .dsx-slider[data-size='sm'].dsx-slider--vertical .dsx-slider__track { width: var(--dsx-space-xs); }
-.dsx-slider[data-size='sm'] .dsx-slider__thumb { width: var(--dsx-size-sm); height: var(--dsx-size-sm); }
+.dsx-slider[data-size='sm'] .dsx-slider__thumb { width: var(--dsx-space-md); height: var(--dsx-space-md); }
+.dsx-slider[data-size='md'] .dsx-slider__thumb { width: var(--dsx-size-sm); height: var(--dsx-size-sm); }
 
 .dsx-slider[data-size='lg'].dsx-slider--horizontal .dsx-slider__track { height: var(--dsx-space-md); }
 .dsx-slider[data-size='lg'].dsx-slider--vertical .dsx-slider__track { width: var(--dsx-space-md); }
-.dsx-slider[data-size='lg'] .dsx-slider__thumb { width: var(--dsx-size-lg); height: var(--dsx-size-lg); }
+.dsx-slider[data-size='lg'] .dsx-slider__thumb { width: var(--dsx-size-md); height: var(--dsx-size-md); }
 
 /* Variant — subtle: muted/sunken track; ghost: transparent track */
 .dsx-slider[data-variant='subtle'] .dsx-slider__track { background: var(--dsx-color-surface-sunken); }
@@ -75,11 +76,10 @@
 
 .dsx-slider__thumb {
   display: block;
-  width: var(--dsx-size-md);
-  height: var(--dsx-size-md);
+  width: var(--dsx-size-sm);
+  height: var(--dsx-size-sm);
   border-radius: var(--dsx-rounded-full);
-  border: var(--dsx-border-width-lg) solid var(--dsx-color-primary);
-  background: var(--dsx-color-on-surface);
+  background: var(--dsx-color-accent-track);
   box-shadow: var(--dsx-shadow-elevation-1);
 }
 
@@ -88,6 +88,14 @@
   box-shadow: var(--dsx-shadow-focus-ring);
 }
 
+.dsx-slider[data-high-contrast='true'] .dsx-slider__thumb {
+  background: var(--dsx-color-high-contrast);
+}
+
+.dsx-slider[data-high-contrast='true'] .dsx-slider__range {
+  background: var(--dsx-color-high-contrast);
+}
+
 @media (prefers-reduced-motion: reduce) {
   .dsx-slider__thumb {
     transition: none;

package/dist/components/sortable-list.css

@@ -3,5 +3,6 @@
 .dsx-sortable-list__item[data-dragging] { opacity: var(--dsx-opacity-disabled); }
 .dsx-sortable-list__item[data-disabled] { opacity: var(--dsx-opacity-disabled); }
 .dsx-sortable-list__handle { display: inline-flex; align-items: center; justify-content: center; min-width: var(--dsx-size-lg); min-height: var(--dsx-size-lg); padding: 0; border: 0; background: transparent; color: var(--dsx-color-on-surface-variant); cursor: grab; touch-action: none; }
+.dsx-sortable-list__item[data-disabled] :where(.dsx-sortable-list__handle) { cursor: not-allowed; }
 .dsx-sortable-list__handle:focus-visible { outline: none; box-shadow: var(--dsx-shadow-focus-ring); }
 @media (prefers-reduced-motion: reduce) { .dsx-sortable-list__item { transition: none; } }

package/dist/components/sortableList/SortableList.cjs

@@ -41,6 +41,7 @@ var import_classnames = __toESM(require("classnames"), 1);
 var import_core = require("@dnd-kit/core");
 var import_sortable = require("@dnd-kit/sortable");
 var import_utilities = require("@dnd-kit/utilities");
+var import_VisuallyHidden = require("../visuallyHidden/VisuallyHidden");
 var import_jsx_runtime = require("react/jsx-runtime");
 const SortableContextValue = React.createContext({});
 const SortableListItem = React.forwardRef(({ id, disabled, className, style, children, ...props }, ref) => {
@@ -65,6 +66,10 @@ const SortableListRoot = React.forwardRef(({ ids, disabledIds = [], onReorder, a
   const [message, setMessage] = React.useState("");
   const sensors = (0, import_core.useSensors)((0, import_core.useSensor)(import_core.PointerSensor), (0, import_core.useSensor)(import_core.TouchSensor), (0, import_core.useSensor)(import_core.KeyboardSensor, { coordinateGetter: import_sortable.sortableKeyboardCoordinates }));
   const handleStart = (event) => setActiveId(event.active.id);
+  const activeChild = React.Children.toArray(children).find(
+    (child) => React.isValidElement(child) && child.props.id === activeId
+  );
+  const activeContent = React.isValidElement(activeChild) ? activeChild.props.children : activeId == null ? null : String(activeId);
   const handleEnd = (event) => {
     setActiveId(null);
     if (!event.over || event.active.id === event.over.id) return;
@@ -79,8 +84,8 @@ const SortableListRoot = React.forwardRef(({ ids, disabledIds = [], onReorder, a
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.DndContext, { sensors, collisionDetection: import_core.closestCenter, onDragStart: handleStart, onDragCancel: () => setActiveId(null), onDragEnd: handleEnd, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_sortable.SortableContext, { items: ids, strategy: import_sortable.verticalListSortingStrategy, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...props, ref, className: (0, import_classnames.default)("dsx-sortable-list", className), role: props.role ?? "list", children: React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child, { "data-sortable-id": String(child.props.id), disabled: child.props.disabled || disabledIds.includes(child.props.id), role: child.props.role ?? "listitem" }) : child) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dsx-visually-hidden", "aria-live": "assertive", children: message }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.DragOverlay, { children: activeId == null ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SortableListOverlay, { children: String(activeId) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_VisuallyHidden.VisuallyHidden, { "aria-live": "assertive", children: message }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.DragOverlay, { children: activeId == null ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SortableListOverlay, { children: activeContent }) })
   ] });
 });
 SortableListRoot.displayName = "SortableList";

package/dist/components/sortableList/SortableList.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/sortableList/SortableList.tsx"],
-  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { DndContext, DragOverlay, KeyboardSensor, PointerSensor, TouchSensor, closestCenter, useSensor, useSensors, type DragEndEvent, type DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable'\nimport { CSS as TransformCSS } from '@dnd-kit/utilities'\n\ntype SortableId = string | number\ntype SortableListChange = { ids: SortableId[]; activeIndex: number; overIndex: number }\ninterface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> { ids: SortableId[]; disabledIds?: SortableId[]; onReorder?: (change: SortableListChange) => void; announcements?: { moved?: (id: SortableId, from: number, to: number) => string } }\ninterface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> { id: SortableId; disabled?: boolean }\n\nconst SortableContextValue = React.createContext<{ attributes?: ReturnType<typeof useSortable>['attributes']; listeners?: ReturnType<typeof useSortable>['listeners'] }>({})\nconst SortableListItem = React.forwardRef<HTMLDivElement, SortableListItemProps>(({ id, disabled, className, style, children, ...props }, ref) => {\n  const sortable = useSortable({ id, disabled })\n  const mergedRef = (node: HTMLDivElement | null) => { sortable.setNodeRef(node); if (typeof ref === 'function') ref(node); else if (ref) ref.current = node }\n  return <SortableContextValue.Provider value={{ attributes: sortable.attributes, listeners: sortable.listeners }}><div {...props} ref={mergedRef} className={classNames('dsx-sortable-list__item', className)} data-disabled={disabled || undefined} data-dragging={sortable.isDragging || undefined} style={{ ...style, transform: TransformCSS.Transform.toString(sortable.transform), transition: sortable.transition }}>{children}</div></SortableContextValue.Provider>\n})\nSortableListItem.displayName = 'SortableListItem'\n\nconst SortableListHandle = React.forwardRef<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>(({ className, children = '\u22EE\u22EE', ...props }, ref) => {\n  const context = React.useContext(SortableContextValue)\n  return <button {...props} {...context.attributes} {...context.listeners} ref={ref} type=\"button\" className={classNames('dsx-sortable-list__handle', className)} aria-label={props['aria-label'] ?? 'Reorder item'}>{children}</button>\n})\nSortableListHandle.displayName = 'SortableListHandle'\nconst SortableListOverlay = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-sortable-list__overlay', className)} />)\nSortableListOverlay.displayName = 'SortableListOverlay'\n\nconst SortableListRoot = React.forwardRef<HTMLDivElement, SortableListRootProps>(({ ids, disabledIds = [], onReorder, announcements, className, children, ...props }, ref) => {\n  const [activeId, setActiveId] = React.useState<SortableId | null>(null)\n  const [message, setMessage] = React.useState('')\n  const sensors = useSensors(useSensor(PointerSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }))\n  const handleStart = (event: DragStartEvent) => setActiveId(event.active.id)\n  const handleEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    if (!event.over || event.active.id === event.over.id) return\n    const from = ids.indexOf(event.active.id); const to = ids.indexOf(event.over.id)\n    if (from < 0 || to < 0 || disabledIds.includes(event.active.id) || disabledIds.includes(event.over.id)) return\n    const next = arrayMove(ids, from, to)\n    setMessage(announcements?.moved?.(event.active.id, from, to) ?? `Moved item ${String(event.active.id)} from position ${from + 1} to ${to + 1}`)\n    onReorder?.({ ids: next, activeIndex: from, overIndex: to })\n    const escapedId = globalThis.CSS?.escape?.(String(event.active.id)) ?? String(event.active.id).replace(/[\"\\\\]/g, '\\\\$&')\n    requestAnimationFrame(() => document.querySelector<HTMLElement>(`[data-sortable-id=\"${escapedId}\"] button`)?.focus())\n  }\n  return <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleStart} onDragCancel={() => setActiveId(null)} onDragEnd={handleEnd}><SortableContext items={ids} strategy={verticalListSortingStrategy}><div {...props} ref={ref} className={classNames('dsx-sortable-list', className)} role={props.role ?? 'list'}>{React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child as React.ReactElement<Record<string, unknown>>, { 'data-sortable-id': String((child.props as SortableListItemProps).id), disabled: (child.props as SortableListItemProps).disabled || disabledIds.includes((child.props as SortableListItemProps).id), role: (child.props as SortableListItemProps).role ?? 'listitem' }) : child)}</div></SortableContext><span className=\"dsx-visually-hidden\" aria-live=\"assertive\">{message}</span><DragOverlay>{activeId == null ? null : <SortableListOverlay>{String(activeId)}</SortableListOverlay>}</DragOverlay></DndContext>\n})\nSortableListRoot.displayName = 'SortableList'\n\nconst SortableList = Object.assign(SortableListRoot, { Root: SortableListRoot, Item: SortableListItem, Handle: SortableListHandle, Overlay: SortableListOverlay })\nexport { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot }\nexport type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps }\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { DndContext, DragOverlay, KeyboardSensor, PointerSensor, TouchSensor, closestCenter, useSensor, useSensors, type DragEndEvent, type DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable'\nimport { CSS as TransformCSS } from '@dnd-kit/utilities'\n\nimport { VisuallyHidden } from '../visuallyHidden/VisuallyHidden'\n\nimport type {\n  SortableId,\n  SortableListItemProps,\n  SortableListRootProps,\n} from './sortableList.props'\n\nconst SortableContextValue = React.createContext<{ attributes?: ReturnType<typeof useSortable>['attributes']; listeners?: ReturnType<typeof useSortable>['listeners'] }>({})\nconst SortableListItem = React.forwardRef<HTMLDivElement, SortableListItemProps>(({ id, disabled, className, style, children, ...props }, ref) => {\n  const sortable = useSortable({ id, disabled })\n  const mergedRef = (node: HTMLDivElement | null) => { sortable.setNodeRef(node); if (typeof ref === 'function') ref(node); else if (ref) ref.current = node }\n  return <SortableContextValue.Provider value={{ attributes: sortable.attributes, listeners: sortable.listeners }}><div {...props} ref={mergedRef} className={classNames('dsx-sortable-list__item', className)} data-disabled={disabled || undefined} data-dragging={sortable.isDragging || undefined} style={{ ...style, transform: TransformCSS.Transform.toString(sortable.transform), transition: sortable.transition }}>{children}</div></SortableContextValue.Provider>\n})\nSortableListItem.displayName = 'SortableListItem'\n\nconst SortableListHandle = React.forwardRef<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>(({ className, children = '\u22EE\u22EE', ...props }, ref) => {\n  const context = React.useContext(SortableContextValue)\n  return <button {...props} {...context.attributes} {...context.listeners} ref={ref} type=\"button\" className={classNames('dsx-sortable-list__handle', className)} aria-label={props['aria-label'] ?? 'Reorder item'}>{children}</button>\n})\nSortableListHandle.displayName = 'SortableListHandle'\nconst SortableListOverlay = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-sortable-list__overlay', className)} />)\nSortableListOverlay.displayName = 'SortableListOverlay'\n\nconst SortableListRoot = React.forwardRef<HTMLDivElement, SortableListRootProps>(({ ids, disabledIds = [], onReorder, announcements, className, children, ...props }, ref) => {\n  const [activeId, setActiveId] = React.useState<SortableId | null>(null)\n  const [message, setMessage] = React.useState('')\n  const sensors = useSensors(useSensor(PointerSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }))\n  const handleStart = (event: DragStartEvent) => setActiveId(event.active.id)\n  const activeChild = React.Children.toArray(children).find(\n    (child) => React.isValidElement(child) && (child.props as SortableListItemProps).id === activeId,\n  )\n  const activeContent = React.isValidElement<{ children?: React.ReactNode }>(activeChild)\n    ? activeChild.props.children\n    : activeId == null ? null : String(activeId)\n  const handleEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    if (!event.over || event.active.id === event.over.id) return\n    const from = ids.indexOf(event.active.id); const to = ids.indexOf(event.over.id)\n    if (from < 0 || to < 0 || disabledIds.includes(event.active.id) || disabledIds.includes(event.over.id)) return\n    const next = arrayMove(ids, from, to)\n    setMessage(announcements?.moved?.(event.active.id, from, to) ?? `Moved item ${String(event.active.id)} from position ${from + 1} to ${to + 1}`)\n    onReorder?.({ ids: next, activeIndex: from, overIndex: to })\n    const escapedId = globalThis.CSS?.escape?.(String(event.active.id)) ?? String(event.active.id).replace(/[\"\\\\]/g, '\\\\$&')\n    requestAnimationFrame(() => document.querySelector<HTMLElement>(`[data-sortable-id=\"${escapedId}\"] button`)?.focus())\n  }\n  return <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleStart} onDragCancel={() => setActiveId(null)} onDragEnd={handleEnd}><SortableContext items={ids} strategy={verticalListSortingStrategy}><div {...props} ref={ref} className={classNames('dsx-sortable-list', className)} role={props.role ?? 'list'}>{React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child as React.ReactElement<Record<string, unknown>>, { 'data-sortable-id': String((child.props as SortableListItemProps).id), disabled: (child.props as SortableListItemProps).disabled || disabledIds.includes((child.props as SortableListItemProps).id), role: (child.props as SortableListItemProps).role ?? 'listitem' }) : child)}</div></SortableContext><VisuallyHidden aria-live=\"assertive\">{message}</VisuallyHidden><DragOverlay>{activeId == null ? null : <SortableListOverlay>{activeContent}</SortableListOverlay>}</DragOverlay></DndContext>\n})\nSortableListRoot.displayName = 'SortableList'\n\nconst SortableList = Object.assign(SortableListRoot, { Root: SortableListRoot, Item: SortableListItem, Handle: SortableListHandle, Overlay: SortableListOverlay })\nexport { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot }\nexport type {\n  SortableId,\n  SortableListChange,\n  SortableListItemProps,\n  SortableListRootProps,\n} from './sortableList.props'\n"],
+  "mappings": "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",
   "names": ["classNames", "TransformCSS"]
 }

package/dist/components/sortableList/SortableList.d.cts

@@ -1,22 +1,5 @@
 import * as React from 'react';
-type SortableId = string | number;
-type SortableListChange = {
-    ids: SortableId[];
-    activeIndex: number;
-    overIndex: number;
-};
-interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
-    ids: SortableId[];
-    disabledIds?: SortableId[];
-    onReorder?: (change: SortableListChange) => void;
-    announcements?: {
-        moved?: (id: SortableId, from: number, to: number) => string;
-    };
-}
-interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
-    id: SortableId;
-    disabled?: boolean;
-}
+import type { SortableListItemProps, SortableListRootProps } from './sortableList.props.cjs';
 declare const SortableListItem: React.ForwardRefExoticComponent<SortableListItemProps & React.RefAttributes<HTMLDivElement>>;
 declare const SortableListHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 declare const SortableListOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
@@ -28,5 +11,5 @@ declare const SortableList: React.ForwardRefExoticComponent<SortableListRootProp
     Overlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot };
-export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps, } from './sortableList.props.cjs';
 //# sourceMappingURL=SortableList.d.cts.map

package/dist/components/sortableList/SortableList.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"SortableList.d.cts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AACjC,KAAK,kBAAkB,GAAG;IAAE,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,CAAA;AACvF,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAAG,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAAC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAAC,aAAa,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAAE,CAAA;CAAE;AACnQ,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IAAG,EAAE,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE;AAGhI,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAiBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"SortableList.d.cts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,OAAO,KAAK,EAEV,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAA;AAG7B,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAuBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EACV,UAAU,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,GACtB,MAAM,sBAAsB,CAAA"}

package/dist/components/sortableList/SortableList.d.mts

@@ -1,22 +1,5 @@
 import * as React from 'react';
-type SortableId = string | number;
-type SortableListChange = {
-    ids: SortableId[];
-    activeIndex: number;
-    overIndex: number;
-};
-interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
-    ids: SortableId[];
-    disabledIds?: SortableId[];
-    onReorder?: (change: SortableListChange) => void;
-    announcements?: {
-        moved?: (id: SortableId, from: number, to: number) => string;
-    };
-}
-interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
-    id: SortableId;
-    disabled?: boolean;
-}
+import type { SortableListItemProps, SortableListRootProps } from './sortableList.props.js';
 declare const SortableListItem: React.ForwardRefExoticComponent<SortableListItemProps & React.RefAttributes<HTMLDivElement>>;
 declare const SortableListHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 declare const SortableListOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
@@ -28,5 +11,5 @@ declare const SortableList: React.ForwardRefExoticComponent<SortableListRootProp
     Overlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot };
-export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps, } from './sortableList.props.js';
 //# sourceMappingURL=SortableList.d.mts.map

package/dist/components/sortableList/SortableList.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"SortableList.d.mts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AACjC,KAAK,kBAAkB,GAAG;IAAE,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,CAAA;AACvF,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAAG,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAAC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAAC,aAAa,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAAE,CAAA;CAAE;AACnQ,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IAAG,EAAE,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE;AAGhI,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAiBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"SortableList.d.mts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,OAAO,KAAK,EAEV,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAA;AAG7B,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAuBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EACV,UAAU,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,GACtB,MAAM,sBAAsB,CAAA"}

package/dist/components/sortableList/SortableList.d.ts

@@ -1,22 +1,5 @@
 import * as React from 'react';
-type SortableId = string | number;
-type SortableListChange = {
-    ids: SortableId[];
-    activeIndex: number;
-    overIndex: number;
-};
-interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
-    ids: SortableId[];
-    disabledIds?: SortableId[];
-    onReorder?: (change: SortableListChange) => void;
-    announcements?: {
-        moved?: (id: SortableId, from: number, to: number) => string;
-    };
-}
-interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
-    id: SortableId;
-    disabled?: boolean;
-}
+import type { SortableListItemProps, SortableListRootProps } from './sortableList.props.js';
 declare const SortableListItem: React.ForwardRefExoticComponent<SortableListItemProps & React.RefAttributes<HTMLDivElement>>;
 declare const SortableListHandle: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 declare const SortableListOverlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
@@ -28,5 +11,5 @@ declare const SortableList: React.ForwardRefExoticComponent<SortableListRootProp
     Overlay: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 };
 export { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot };
-export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps, } from './sortableList.props.js';
 //# sourceMappingURL=SortableList.d.ts.map

package/dist/components/sortableList/SortableList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SortableList.d.ts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AACjC,KAAK,kBAAkB,GAAG;IAAE,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,CAAA;AACvF,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAAG,GAAG,EAAE,UAAU,EAAE,CAAC;IAAC,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAAC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAAC,aAAa,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAAE,CAAA;CAAE;AACnQ,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IAAG,EAAE,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE;AAGhI,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAiBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}
+{"version":3,"file":"SortableList.d.ts","sourceRoot":"","sources":["../../../src/components/sortableList/SortableList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,OAAO,KAAK,EAEV,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAA;AAG7B,QAAA,MAAM,gBAAgB,8FAIpB,CAAA;AAGF,QAAA,MAAM,kBAAkB,yHAGtB,CAAA;AAEF,QAAA,MAAM,mBAAmB,6GAAyM,CAAA;AAGlO,QAAA,MAAM,gBAAgB,8FAuBpB,CAAA;AAGF,QAAA,MAAM,YAAY;;;;;CAAgJ,CAAA;AAClK,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,CAAA;AACpG,YAAY,EACV,UAAU,EACV,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,GACtB,MAAM,sBAAsB,CAAA"}

package/dist/components/sortableList/SortableList.js

@@ -4,6 +4,7 @@ import classNames from "classnames";
 import { DndContext, DragOverlay, KeyboardSensor, PointerSensor, TouchSensor, closestCenter, useSensor, useSensors } from "@dnd-kit/core";
 import { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
 import { CSS as TransformCSS } from "@dnd-kit/utilities";
+import { VisuallyHidden } from "../visuallyHidden/VisuallyHidden.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 const SortableContextValue = React.createContext({});
 const SortableListItem = React.forwardRef(({ id, disabled, className, style, children, ...props }, ref) => {
@@ -28,6 +29,10 @@ const SortableListRoot = React.forwardRef(({ ids, disabledIds = [], onReorder, a
   const [message, setMessage] = React.useState("");
   const sensors = useSensors(useSensor(PointerSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
   const handleStart = (event) => setActiveId(event.active.id);
+  const activeChild = React.Children.toArray(children).find(
+    (child) => React.isValidElement(child) && child.props.id === activeId
+  );
+  const activeContent = React.isValidElement(activeChild) ? activeChild.props.children : activeId == null ? null : String(activeId);
   const handleEnd = (event) => {
     setActiveId(null);
     if (!event.over || event.active.id === event.over.id) return;
@@ -42,8 +47,8 @@ const SortableListRoot = React.forwardRef(({ ids, disabledIds = [], onReorder, a
   };
   return /* @__PURE__ */ jsxs(DndContext, { sensors, collisionDetection: closestCenter, onDragStart: handleStart, onDragCancel: () => setActiveId(null), onDragEnd: handleEnd, children: [
     /* @__PURE__ */ jsx(SortableContext, { items: ids, strategy: verticalListSortingStrategy, children: /* @__PURE__ */ jsx("div", { ...props, ref, className: classNames("dsx-sortable-list", className), role: props.role ?? "list", children: React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child, { "data-sortable-id": String(child.props.id), disabled: child.props.disabled || disabledIds.includes(child.props.id), role: child.props.role ?? "listitem" }) : child) }) }),
-    /* @__PURE__ */ jsx("span", { className: "dsx-visually-hidden", "aria-live": "assertive", children: message }),
-    /* @__PURE__ */ jsx(DragOverlay, { children: activeId == null ? null : /* @__PURE__ */ jsx(SortableListOverlay, { children: String(activeId) }) })
+    /* @__PURE__ */ jsx(VisuallyHidden, { "aria-live": "assertive", children: message }),
+    /* @__PURE__ */ jsx(DragOverlay, { children: activeId == null ? null : /* @__PURE__ */ jsx(SortableListOverlay, { children: activeContent }) })
   ] });
 });
 SortableListRoot.displayName = "SortableList";

package/dist/components/sortableList/SortableList.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/sortableList/SortableList.tsx"],
-  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { DndContext, DragOverlay, KeyboardSensor, PointerSensor, TouchSensor, closestCenter, useSensor, useSensors, type DragEndEvent, type DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable'\nimport { CSS as TransformCSS } from '@dnd-kit/utilities'\n\ntype SortableId = string | number\ntype SortableListChange = { ids: SortableId[]; activeIndex: number; overIndex: number }\ninterface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> { ids: SortableId[]; disabledIds?: SortableId[]; onReorder?: (change: SortableListChange) => void; announcements?: { moved?: (id: SortableId, from: number, to: number) => string } }\ninterface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> { id: SortableId; disabled?: boolean }\n\nconst SortableContextValue = React.createContext<{ attributes?: ReturnType<typeof useSortable>['attributes']; listeners?: ReturnType<typeof useSortable>['listeners'] }>({})\nconst SortableListItem = React.forwardRef<HTMLDivElement, SortableListItemProps>(({ id, disabled, className, style, children, ...props }, ref) => {\n  const sortable = useSortable({ id, disabled })\n  const mergedRef = (node: HTMLDivElement | null) => { sortable.setNodeRef(node); if (typeof ref === 'function') ref(node); else if (ref) ref.current = node }\n  return <SortableContextValue.Provider value={{ attributes: sortable.attributes, listeners: sortable.listeners }}><div {...props} ref={mergedRef} className={classNames('dsx-sortable-list__item', className)} data-disabled={disabled || undefined} data-dragging={sortable.isDragging || undefined} style={{ ...style, transform: TransformCSS.Transform.toString(sortable.transform), transition: sortable.transition }}>{children}</div></SortableContextValue.Provider>\n})\nSortableListItem.displayName = 'SortableListItem'\n\nconst SortableListHandle = React.forwardRef<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>(({ className, children = '\u22EE\u22EE', ...props }, ref) => {\n  const context = React.useContext(SortableContextValue)\n  return <button {...props} {...context.attributes} {...context.listeners} ref={ref} type=\"button\" className={classNames('dsx-sortable-list__handle', className)} aria-label={props['aria-label'] ?? 'Reorder item'}>{children}</button>\n})\nSortableListHandle.displayName = 'SortableListHandle'\nconst SortableListOverlay = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-sortable-list__overlay', className)} />)\nSortableListOverlay.displayName = 'SortableListOverlay'\n\nconst SortableListRoot = React.forwardRef<HTMLDivElement, SortableListRootProps>(({ ids, disabledIds = [], onReorder, announcements, className, children, ...props }, ref) => {\n  const [activeId, setActiveId] = React.useState<SortableId | null>(null)\n  const [message, setMessage] = React.useState('')\n  const sensors = useSensors(useSensor(PointerSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }))\n  const handleStart = (event: DragStartEvent) => setActiveId(event.active.id)\n  const handleEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    if (!event.over || event.active.id === event.over.id) return\n    const from = ids.indexOf(event.active.id); const to = ids.indexOf(event.over.id)\n    if (from < 0 || to < 0 || disabledIds.includes(event.active.id) || disabledIds.includes(event.over.id)) return\n    const next = arrayMove(ids, from, to)\n    setMessage(announcements?.moved?.(event.active.id, from, to) ?? `Moved item ${String(event.active.id)} from position ${from + 1} to ${to + 1}`)\n    onReorder?.({ ids: next, activeIndex: from, overIndex: to })\n    const escapedId = globalThis.CSS?.escape?.(String(event.active.id)) ?? String(event.active.id).replace(/[\"\\\\]/g, '\\\\$&')\n    requestAnimationFrame(() => document.querySelector<HTMLElement>(`[data-sortable-id=\"${escapedId}\"] button`)?.focus())\n  }\n  return <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleStart} onDragCancel={() => setActiveId(null)} onDragEnd={handleEnd}><SortableContext items={ids} strategy={verticalListSortingStrategy}><div {...props} ref={ref} className={classNames('dsx-sortable-list', className)} role={props.role ?? 'list'}>{React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child as React.ReactElement<Record<string, unknown>>, { 'data-sortable-id': String((child.props as SortableListItemProps).id), disabled: (child.props as SortableListItemProps).disabled || disabledIds.includes((child.props as SortableListItemProps).id), role: (child.props as SortableListItemProps).role ?? 'listitem' }) : child)}</div></SortableContext><span className=\"dsx-visually-hidden\" aria-live=\"assertive\">{message}</span><DragOverlay>{activeId == null ? null : <SortableListOverlay>{String(activeId)}</SortableListOverlay>}</DragOverlay></DndContext>\n})\nSortableListRoot.displayName = 'SortableList'\n\nconst SortableList = Object.assign(SortableListRoot, { Root: SortableListRoot, Item: SortableListItem, Handle: SortableListHandle, Overlay: SortableListOverlay })\nexport { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot }\nexport type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps }\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\nimport * as React from 'react'\nimport classNames from 'classnames'\nimport { DndContext, DragOverlay, KeyboardSensor, PointerSensor, TouchSensor, closestCenter, useSensor, useSensors, type DragEndEvent, type DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, arrayMove, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable'\nimport { CSS as TransformCSS } from '@dnd-kit/utilities'\n\nimport { VisuallyHidden } from '../visuallyHidden/VisuallyHidden'\n\nimport type {\n  SortableId,\n  SortableListItemProps,\n  SortableListRootProps,\n} from './sortableList.props'\n\nconst SortableContextValue = React.createContext<{ attributes?: ReturnType<typeof useSortable>['attributes']; listeners?: ReturnType<typeof useSortable>['listeners'] }>({})\nconst SortableListItem = React.forwardRef<HTMLDivElement, SortableListItemProps>(({ id, disabled, className, style, children, ...props }, ref) => {\n  const sortable = useSortable({ id, disabled })\n  const mergedRef = (node: HTMLDivElement | null) => { sortable.setNodeRef(node); if (typeof ref === 'function') ref(node); else if (ref) ref.current = node }\n  return <SortableContextValue.Provider value={{ attributes: sortable.attributes, listeners: sortable.listeners }}><div {...props} ref={mergedRef} className={classNames('dsx-sortable-list__item', className)} data-disabled={disabled || undefined} data-dragging={sortable.isDragging || undefined} style={{ ...style, transform: TransformCSS.Transform.toString(sortable.transform), transition: sortable.transition }}>{children}</div></SortableContextValue.Provider>\n})\nSortableListItem.displayName = 'SortableListItem'\n\nconst SortableListHandle = React.forwardRef<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>(({ className, children = '\u22EE\u22EE', ...props }, ref) => {\n  const context = React.useContext(SortableContextValue)\n  return <button {...props} {...context.attributes} {...context.listeners} ref={ref} type=\"button\" className={classNames('dsx-sortable-list__handle', className)} aria-label={props['aria-label'] ?? 'Reorder item'}>{children}</button>\n})\nSortableListHandle.displayName = 'SortableListHandle'\nconst SortableListOverlay = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => <div {...props} ref={ref} className={classNames('dsx-sortable-list__overlay', className)} />)\nSortableListOverlay.displayName = 'SortableListOverlay'\n\nconst SortableListRoot = React.forwardRef<HTMLDivElement, SortableListRootProps>(({ ids, disabledIds = [], onReorder, announcements, className, children, ...props }, ref) => {\n  const [activeId, setActiveId] = React.useState<SortableId | null>(null)\n  const [message, setMessage] = React.useState('')\n  const sensors = useSensors(useSensor(PointerSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }))\n  const handleStart = (event: DragStartEvent) => setActiveId(event.active.id)\n  const activeChild = React.Children.toArray(children).find(\n    (child) => React.isValidElement(child) && (child.props as SortableListItemProps).id === activeId,\n  )\n  const activeContent = React.isValidElement<{ children?: React.ReactNode }>(activeChild)\n    ? activeChild.props.children\n    : activeId == null ? null : String(activeId)\n  const handleEnd = (event: DragEndEvent) => {\n    setActiveId(null)\n    if (!event.over || event.active.id === event.over.id) return\n    const from = ids.indexOf(event.active.id); const to = ids.indexOf(event.over.id)\n    if (from < 0 || to < 0 || disabledIds.includes(event.active.id) || disabledIds.includes(event.over.id)) return\n    const next = arrayMove(ids, from, to)\n    setMessage(announcements?.moved?.(event.active.id, from, to) ?? `Moved item ${String(event.active.id)} from position ${from + 1} to ${to + 1}`)\n    onReorder?.({ ids: next, activeIndex: from, overIndex: to })\n    const escapedId = globalThis.CSS?.escape?.(String(event.active.id)) ?? String(event.active.id).replace(/[\"\\\\]/g, '\\\\$&')\n    requestAnimationFrame(() => document.querySelector<HTMLElement>(`[data-sortable-id=\"${escapedId}\"] button`)?.focus())\n  }\n  return <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleStart} onDragCancel={() => setActiveId(null)} onDragEnd={handleEnd}><SortableContext items={ids} strategy={verticalListSortingStrategy}><div {...props} ref={ref} className={classNames('dsx-sortable-list', className)} role={props.role ?? 'list'}>{React.Children.map(children, (child) => React.isValidElement(child) ? React.cloneElement(child as React.ReactElement<Record<string, unknown>>, { 'data-sortable-id': String((child.props as SortableListItemProps).id), disabled: (child.props as SortableListItemProps).disabled || disabledIds.includes((child.props as SortableListItemProps).id), role: (child.props as SortableListItemProps).role ?? 'listitem' }) : child)}</div></SortableContext><VisuallyHidden aria-live=\"assertive\">{message}</VisuallyHidden><DragOverlay>{activeId == null ? null : <SortableListOverlay>{activeContent}</SortableListOverlay>}</DragOverlay></DndContext>\n})\nSortableListRoot.displayName = 'SortableList'\n\nconst SortableList = Object.assign(SortableListRoot, { Root: SortableListRoot, Item: SortableListItem, Handle: SortableListHandle, Overlay: SortableListOverlay })\nexport { SortableList, SortableListHandle, SortableListItem, SortableListOverlay, SortableListRoot }\nexport type {\n  SortableId,\n  SortableListChange,\n  SortableListItemProps,\n  SortableListRootProps,\n} from './sortableList.props'\n"],
+  "mappings": ";AACA,YAAY,WAAW;AACvB,OAAO,gBAAgB;AACvB,SAAS,YAAY,aAAa,gBAAgB,eAAe,aAAa,eAAe,WAAW,kBAA0D;AAClK,SAAS,iBAAiB,WAAW,6BAA6B,aAAa,mCAAmC;AAClH,SAAS,OAAO,oBAAoB;AAEpC,SAAS,sBAAsB;AAYoF,cAkC1G,YAlC0G;AAJnH,MAAM,uBAAuB,MAAM,cAAsI,CAAC,CAAC;AAC3K,MAAM,mBAAmB,MAAM,WAAkD,CAAC,EAAE,IAAI,UAAU,WAAW,OAAO,UAAU,GAAG,MAAM,GAAG,QAAQ;AAChJ,QAAM,WAAW,YAAY,EAAE,IAAI,SAAS,CAAC;AAC7C,QAAM,YAAY,CAAC,SAAgC;AAAE,aAAS,WAAW,IAAI;AAAG,QAAI,OAAO,QAAQ,WAAY,KAAI,IAAI;AAAA,aAAY,IAAK,KAAI,UAAU;AAAA,EAAK;AAC3J,SAAO,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,EAAE,YAAY,SAAS,YAAY,WAAW,SAAS,UAAU,GAAG,8BAAC,SAAK,GAAG,OAAO,KAAK,WAAW,WAAW,WAAW,2BAA2B,SAAS,GAAG,iBAAe,YAAY,QAAW,iBAAe,SAAS,cAAc,QAAW,OAAO,EAAE,GAAG,OAAO,WAAW,aAAa,UAAU,SAAS,SAAS,SAAS,GAAG,YAAY,SAAS,WAAW,GAAI,UAAS,GAAM;AAC7a,CAAC;AACD,iBAAiB,cAAc;AAE/B,MAAM,qBAAqB,MAAM,WAA6E,CAAC,EAAE,WAAW,WAAW,gBAAM,GAAG,MAAM,GAAG,QAAQ;AAC/J,QAAM,UAAU,MAAM,WAAW,oBAAoB;AACrD,SAAO,oBAAC,YAAQ,GAAG,OAAQ,GAAG,QAAQ,YAAa,GAAG,QAAQ,WAAW,KAAU,MAAK,UAAS,WAAW,WAAW,6BAA6B,SAAS,GAAG,cAAY,MAAM,YAAY,KAAK,gBAAiB,UAAS;AAC/N,CAAC;AACD,mBAAmB,cAAc;AACjC,MAAM,sBAAsB,MAAM,WAAiE,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ,oBAAC,SAAK,GAAG,OAAO,KAAU,WAAW,WAAW,8BAA8B,SAAS,GAAG,CAAE;AACjO,oBAAoB,cAAc;AAElC,MAAM,mBAAmB,MAAM,WAAkD,CAAC,EAAE,KAAK,cAAc,CAAC,GAAG,WAAW,eAAe,WAAW,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC5K,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAA4B,IAAI;AACtE,QAAM,CAAC,SAAS,UAAU,IAAI,MAAM,SAAS,EAAE;AAC/C,QAAM,UAAU,WAAW,UAAU,aAAa,GAAG,UAAU,WAAW,GAAG,UAAU,gBAAgB,EAAE,kBAAkB,4BAA4B,CAAC,CAAC;AACzJ,QAAM,cAAc,CAAC,UAA0B,YAAY,MAAM,OAAO,EAAE;AAC1E,QAAM,cAAc,MAAM,SAAS,QAAQ,QAAQ,EAAE;AAAA,IACnD,CAAC,UAAU,MAAM,eAAe,KAAK,KAAM,MAAM,MAAgC,OAAO;AAAA,EAC1F;AACA,QAAM,gBAAgB,MAAM,eAA+C,WAAW,IAClF,YAAY,MAAM,WAClB,YAAY,OAAO,OAAO,OAAO,QAAQ;AAC7C,QAAM,YAAY,CAAC,UAAwB;AACzC,gBAAY,IAAI;AAChB,QAAI,CAAC,MAAM,QAAQ,MAAM,OAAO,OAAO,MAAM,KAAK,GAAI;AACtD,UAAM,OAAO,IAAI,QAAQ,MAAM,OAAO,EAAE;AAAG,UAAM,KAAK,IAAI,QAAQ,MAAM,KAAK,EAAE;AAC/E,QAAI,OAAO,KAAK,KAAK,KAAK,YAAY,SAAS,MAAM,OAAO,EAAE,KAAK,YAAY,SAAS,MAAM,KAAK,EAAE,EAAG;AACxG,UAAM,OAAO,UAAU,KAAK,MAAM,EAAE;AACpC,eAAW,eAAe,QAAQ,MAAM,OAAO,IAAI,MAAM,EAAE,KAAK,cAAc,OAAO,MAAM,OAAO,EAAE,CAAC,kBAAkB,OAAO,CAAC,OAAO,KAAK,CAAC,EAAE;AAC9I,gBAAY,EAAE,KAAK,MAAM,aAAa,MAAM,WAAW,GAAG,CAAC;AAC3D,UAAM,YAAY,WAAW,KAAK,SAAS,OAAO,MAAM,OAAO,EAAE,CAAC,KAAK,OAAO,MAAM,OAAO,EAAE,EAAE,QAAQ,UAAU,MAAM;AACvH,0BAAsB,MAAM,SAAS,cAA2B,sBAAsB,SAAS,WAAW,GAAG,MAAM,CAAC;AAAA,EACtH;AACA,SAAO,qBAAC,cAAW,SAAkB,oBAAoB,eAAe,aAAa,aAAa,cAAc,MAAM,YAAY,IAAI,GAAG,WAAW,WAAW;AAAA,wBAAC,mBAAgB,OAAO,KAAK,UAAU,6BAA6B,8BAAC,SAAK,GAAG,OAAO,KAAU,WAAW,WAAW,qBAAqB,SAAS,GAAG,MAAM,MAAM,QAAQ,QAAS,gBAAM,SAAS,IAAI,UAAU,CAAC,UAAU,MAAM,eAAe,KAAK,IAAI,MAAM,aAAa,OAAsD,EAAE,oBAAoB,OAAQ,MAAM,MAAgC,EAAE,GAAG,UAAW,MAAM,MAAgC,YAAY,YAAY,SAAU,MAAM,MAAgC,EAAE,GAAG,MAAO,MAAM,MAAgC,QAAQ,WAAW,CAAC,IAAI,KAAK,GAAE,GAAM;AAAA,IAAkB,oBAAC,kBAAe,aAAU,aAAa,mBAAQ;AAAA,IAAiB,oBAAC,eAAa,sBAAY,OAAO,OAAO,oBAAC,uBAAqB,yBAAc,GAAuB;AAAA,KAAc;AAC97B,CAAC;AACD,iBAAiB,cAAc;AAE/B,MAAM,eAAe,OAAO,OAAO,kBAAkB,EAAE,MAAM,kBAAkB,MAAM,kBAAkB,QAAQ,oBAAoB,SAAS,oBAAoB,CAAC;",
   "names": []
 }

package/dist/components/sortableList/sortableList.props.cjs

@@ -0,0 +1,17 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var sortableList_props_exports = {};
+module.exports = __toCommonJS(sortableList_props_exports);
+//# sourceMappingURL=sortableList.props.cjs.map

package/dist/components/sortableList/sortableList.props.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/sortableList/sortableList.props.ts"],
+  "sourcesContent": ["import type * as React from 'react'\n\ntype SortableId = string | number\n\ntype SortableListChange = {\n  ids: SortableId[]\n  activeIndex: number\n  overIndex: number\n}\n\ninterface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {\n  ids: SortableId[]\n  disabledIds?: SortableId[]\n  onReorder?: (change: SortableListChange) => void\n  announcements?: {\n    moved?: (id: SortableId, from: number, to: number) => string\n  }\n}\n\ninterface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {\n  id: SortableId\n  disabled?: boolean\n}\n\nexport type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps }\n"],
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}

package/dist/components/sortableList/sortableList.props.d.cts

@@ -0,0 +1,21 @@
+import type * as React from 'react';
+type SortableId = string | number;
+type SortableListChange = {
+    ids: SortableId[];
+    activeIndex: number;
+    overIndex: number;
+};
+interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
+    ids: SortableId[];
+    disabledIds?: SortableId[];
+    onReorder?: (change: SortableListChange) => void;
+    announcements?: {
+        moved?: (id: SortableId, from: number, to: number) => string;
+    };
+}
+interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
+    id: SortableId;
+    disabled?: boolean;
+}
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+//# sourceMappingURL=sortableList.props.d.cts.map

package/dist/components/sortableList/sortableList.props.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sortableList.props.d.cts","sourceRoot":"","sources":["../../../src/components/sortableList/sortableList.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AAEjC,KAAK,kBAAkB,GAAG;IACxB,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC3E,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAChD,aAAa,CAAC,EAAE;QACd,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAC7D,CAAA;CACF;AAED,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IACvF,EAAE,EAAE,UAAU,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/components/sortableList/sortableList.props.d.mts

@@ -0,0 +1,21 @@
+import type * as React from 'react';
+type SortableId = string | number;
+type SortableListChange = {
+    ids: SortableId[];
+    activeIndex: number;
+    overIndex: number;
+};
+interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
+    ids: SortableId[];
+    disabledIds?: SortableId[];
+    onReorder?: (change: SortableListChange) => void;
+    announcements?: {
+        moved?: (id: SortableId, from: number, to: number) => string;
+    };
+}
+interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
+    id: SortableId;
+    disabled?: boolean;
+}
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+//# sourceMappingURL=sortableList.props.d.mts.map

package/dist/components/sortableList/sortableList.props.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sortableList.props.d.mts","sourceRoot":"","sources":["../../../src/components/sortableList/sortableList.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AAEjC,KAAK,kBAAkB,GAAG;IACxB,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC3E,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAChD,aAAa,CAAC,EAAE;QACd,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAC7D,CAAA;CACF;AAED,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IACvF,EAAE,EAAE,UAAU,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/components/sortableList/sortableList.props.d.ts

@@ -0,0 +1,21 @@
+import type * as React from 'react';
+type SortableId = string | number;
+type SortableListChange = {
+    ids: SortableId[];
+    activeIndex: number;
+    overIndex: number;
+};
+interface SortableListRootProps extends React.ComponentPropsWithoutRef<'div'> {
+    ids: SortableId[];
+    disabledIds?: SortableId[];
+    onReorder?: (change: SortableListChange) => void;
+    announcements?: {
+        moved?: (id: SortableId, from: number, to: number) => string;
+    };
+}
+interface SortableListItemProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'id'> {
+    id: SortableId;
+    disabled?: boolean;
+}
+export type { SortableId, SortableListChange, SortableListItemProps, SortableListRootProps };
+//# sourceMappingURL=sortableList.props.d.ts.map

package/dist/components/sortableList/sortableList.props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sortableList.props.d.ts","sourceRoot":"","sources":["../../../src/components/sortableList/sortableList.props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAA;AAEnC,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AAEjC,KAAK,kBAAkB,GAAG;IACxB,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC;IAC3E,GAAG,EAAE,UAAU,EAAE,CAAA;IACjB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAA;IAC1B,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAChD,aAAa,CAAC,EAAE;QACd,KAAK,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,MAAM,CAAA;KAC7D,CAAA;CACF;AAED,UAAU,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;IACvF,EAAE,EAAE,UAAU,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/components/sortableList/sortableList.props.js

@@ -0,0 +1 @@
+//# sourceMappingURL=sortableList.props.js.map

package/dist/components/sortableList/sortableList.props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/components/spinner/Spinner.cjs

@@ -43,20 +43,39 @@ const SPINNER_SIZES = {
   md: "dsx-spinner--md",
   lg: "dsx-spinner--lg"
 };
+const RING_RADIUS = 9;
+const RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
 const Spinner = React.forwardRef((props, forwardedRef) => {
-  const { asChild, children, className, label = "Loading", size = "md", ...spinnerProps } = (0, import_extractProps.extractProps)(props, import_spinner.spinnerPropDefs);
+  const { asChild, children, className, label = "Loading", size = "md", state = "loading", value, ...spinnerProps } = (0, import_extractProps.extractProps)(props, import_spinner.spinnerPropDefs);
   const Comp = asChild ? import_react_slot.Slot : "span";
+  const determinate = state === "loading" && typeof value === "number";
+  const complete = state === "done" || determinate && value >= 100;
+  const statusLabel = state === "done" || complete ? "Done" : state === "error" ? "Error" : typeof value === "number" ? `${label} ${Math.round(Math.min(100, Math.max(0, value)))}%` : label;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     Comp,
     {
       ...spinnerProps,
       ref: forwardedRef,
       "data-size": size,
+      "data-state": complete ? "done" : state,
       role: "status",
-      "aria-label": label,
+      "aria-label": statusLabel,
       className: (0, import_classnames.default)("dsx-spinner", SPINNER_SIZES[size], className),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.Icon, { className: "dsx-spinner__icon", name: "loader", size: size === "sm" ? "sm" : size === "lg" ? "lg" : "md" }),
+        state === "done" || complete ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.Icon, { className: "dsx-spinner__icon", name: "check", size: size === "sm" ? "sm" : size === "lg" ? "lg" : "md" }) : state === "error" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.Icon, { className: "dsx-spinner__icon", name: "x", size: size === "sm" ? "sm" : size === "lg" ? "lg" : "md" }) : determinate ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { className: "dsx-spinner__ring", viewBox: "0 0 24 24", "aria-hidden": "true", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "dsx-spinner__ring-track", cx: "12", cy: "12", r: RING_RADIUS }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "circle",
+            {
+              className: "dsx-spinner__ring-fill",
+              cx: "12",
+              cy: "12",
+              r: RING_RADIUS,
+              strokeDasharray: RING_CIRCUMFERENCE,
+              strokeDashoffset: RING_CIRCUMFERENCE * (1 - Math.min(100, Math.max(0, value)) / 100)
+            }
+          )
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Icon.Icon, { className: "dsx-spinner__icon", name: "loader", size: size === "sm" ? "sm" : size === "lg" ? "lg" : "md" }),
         asChild ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_slot.Slottable, { children }) : children
       ]
     }

package/dist/components/spinner/Spinner.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/spinner/Spinner.tsx"],
-  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { Icon } from '../icon/Icon'\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { spinnerPropDefs } from './spinner.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst SPINNER_SIZES = {\n  sm: 'dsx-spinner--sm',\n  md: 'dsx-spinner--md',\n  lg: 'dsx-spinner--lg',\n} as const\n\ntype SpinnerElement = React.ComponentRef<'span'>\ntype SpinnerOwnProps = GetPropDefTypes<typeof spinnerPropDefs>\n\ninterface SpinnerProps extends React.ComponentPropsWithoutRef<'span'>, SpinnerOwnProps {}\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>((props, forwardedRef) => {\n  const { asChild, children, className, label = 'Loading', size = 'md', ...spinnerProps } = extractProps(props, spinnerPropDefs)\n\n  const Comp = asChild ? Slot : 'span'\n\n  return (\n    <Comp\n      {...spinnerProps}\n      ref={forwardedRef}\n      data-size={size}\n      role=\"status\"\n      aria-label={label}\n      className={classNames('dsx-spinner', SPINNER_SIZES[size], className)}\n    >\n      <Icon className=\"dsx-spinner__icon\" name=\"loader\" size={size === 'sm' ? 'sm' : size === 'lg' ? 'lg' : 'md'} />\n      {asChild ? <Slottable>{children}</Slottable> : children}\n    </Comp>\n  )\n})\nSpinner.displayName = 'Spinner'\n\nexport { Spinner }\nexport type { SpinnerElement, SpinnerOwnProps, SpinnerProps }\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,wBAAuB;AACvB,wBAAgC;AAEhC,kBAAqB;AACrB,0BAA6B;AAC7B,qBAAgC;AAqB5B;AAjBJ,MAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAOA,MAAM,UAAU,MAAM,WAAyC,CAAC,OAAO,iBAAiB;AACtF,QAAM,EAAE,SAAS,UAAU,WAAW,QAAQ,WAAW,OAAO,MAAM,GAAG,aAAa,QAAI,kCAAa,OAAO,8BAAe;AAE7H,QAAM,OAAO,UAAU,yBAAO;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,aAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,eAAW,kBAAAA,SAAW,eAAe,cAAc,IAAI,GAAG,SAAS;AAAA,MAEnE;AAAA,oDAAC,oBAAK,WAAU,qBAAoB,MAAK,UAAS,MAAM,SAAS,OAAO,OAAO,SAAS,OAAO,OAAO,MAAM;AAAA,QAC3G,UAAU,4CAAC,+BAAW,UAAS,IAAe;AAAA;AAAA;AAAA,EACjD;AAEJ,CAAC;AACD,QAAQ,cAAc;",
+  "sourcesContent": ["import * as React from 'react'\nimport classNames from 'classnames'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport { Icon } from '../icon/Icon'\nimport { extractProps } from '../../_internal/helpers/extractProps'\nimport { spinnerPropDefs } from './spinner.props'\n\nimport type { GetPropDefTypes } from '../../_internal/props/propDef'\n\nconst SPINNER_SIZES = {\n  sm: 'dsx-spinner--sm',\n  md: 'dsx-spinner--md',\n  lg: 'dsx-spinner--lg',\n} as const\n\ntype SpinnerElement = React.ComponentRef<'span'>\ntype SpinnerOwnProps = GetPropDefTypes<typeof spinnerPropDefs>\n\ninterface SpinnerProps extends React.ComponentPropsWithoutRef<'span'>, SpinnerOwnProps {}\n\nconst RING_RADIUS = 9\nconst RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>((props, forwardedRef) => {\n  const { asChild, children, className, label = 'Loading', size = 'md', state = 'loading', value, ...spinnerProps } = extractProps(props, spinnerPropDefs)\n\n  const Comp = asChild ? Slot : 'span'\n  const determinate = state === 'loading' && typeof value === 'number'\n  const complete = state === 'done' || (determinate && value >= 100)\n\n  const statusLabel = state === 'done' || complete ? 'Done' : state === 'error' ? 'Error' : typeof value === 'number' ? `${label} ${Math.round(Math.min(100, Math.max(0, value)))}%` : label\n\n  return (\n    <Comp\n      {...spinnerProps}\n      ref={forwardedRef}\n      data-size={size}\n      data-state={complete ? 'done' : state}\n      role=\"status\"\n      aria-label={statusLabel}\n      className={classNames('dsx-spinner', SPINNER_SIZES[size], className)}\n    >\n      {state === 'done' || complete ? (\n        <Icon className=\"dsx-spinner__icon\" name=\"check\" size={size === 'sm' ? 'sm' : size === 'lg' ? 'lg' : 'md'} />\n      ) : state === 'error' ? (\n        <Icon className=\"dsx-spinner__icon\" name=\"x\" size={size === 'sm' ? 'sm' : size === 'lg' ? 'lg' : 'md'} />\n      ) : determinate ? (\n        <svg className=\"dsx-spinner__ring\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n          <circle className=\"dsx-spinner__ring-track\" cx=\"12\" cy=\"12\" r={RING_RADIUS} />\n          <circle\n            className=\"dsx-spinner__ring-fill\"\n            cx=\"12\"\n            cy=\"12\"\n            r={RING_RADIUS}\n            strokeDasharray={RING_CIRCUMFERENCE}\n            strokeDashoffset={RING_CIRCUMFERENCE * (1 - Math.min(100, Math.max(0, value)) / 100)}\n          />\n        </svg>\n      ) : (\n        <Icon className=\"dsx-spinner__icon\" name=\"loader\" size={size === 'sm' ? 'sm' : size === 'lg' ? 'lg' : 'md'} />\n      )}\n      {asChild ? <Slottable>{children}</Slottable> : children}\n    </Comp>\n  )\n})\nSpinner.displayName = 'Spinner'\n\nexport { Spinner }\nexport type { SpinnerElement, SpinnerOwnProps, SpinnerProps }\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,wBAAuB;AACvB,wBAAgC;AAEhC,kBAAqB;AACrB,0BAA6B;AAC7B,qBAAgC;AAsCxB;AAlCR,MAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAOA,MAAM,cAAc;AACpB,MAAM,qBAAqB,IAAI,KAAK,KAAK;AAEzC,MAAM,UAAU,MAAM,WAAyC,CAAC,OAAO,iBAAiB;AACtF,QAAM,EAAE,SAAS,UAAU,WAAW,QAAQ,WAAW,OAAO,MAAM,QAAQ,WAAW,OAAO,GAAG,aAAa,QAAI,kCAAa,OAAO,8BAAe;AAEvJ,QAAM,OAAO,UAAU,yBAAO;AAC9B,QAAM,cAAc,UAAU,aAAa,OAAO,UAAU;AAC5D,QAAM,WAAW,UAAU,UAAW,eAAe,SAAS;AAE9D,QAAM,cAAc,UAAU,UAAU,WAAW,SAAS,UAAU,UAAU,UAAU,OAAO,UAAU,WAAW,GAAG,KAAK,IAAI,KAAK,MAAM,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM;AAErL,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,aAAW;AAAA,MACX,cAAY,WAAW,SAAS;AAAA,MAChC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,eAAW,kBAAAA,SAAW,eAAe,cAAc,IAAI,GAAG,SAAS;AAAA,MAElE;AAAA,kBAAU,UAAU,WACnB,4CAAC,oBAAK,WAAU,qBAAoB,MAAK,SAAQ,MAAM,SAAS,OAAO,OAAO,SAAS,OAAO,OAAO,MAAM,IACzG,UAAU,UACZ,4CAAC,oBAAK,WAAU,qBAAoB,MAAK,KAAI,MAAM,SAAS,OAAO,OAAO,SAAS,OAAO,OAAO,MAAM,IACrG,cACF,6CAAC,SAAI,WAAU,qBAAoB,SAAQ,aAAY,eAAY,QACjE;AAAA,sDAAC,YAAO,WAAU,2BAA0B,IAAG,MAAK,IAAG,MAAK,GAAG,aAAa;AAAA,UAC5E;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,IAAG;AAAA,cACH,IAAG;AAAA,cACH,GAAG;AAAA,cACH,iBAAiB;AAAA,cACjB,kBAAkB,sBAAsB,IAAI,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,IAAI;AAAA;AAAA,UAClF;AAAA,WACF,IAEA,4CAAC,oBAAK,WAAU,qBAAoB,MAAK,UAAS,MAAM,SAAS,OAAO,OAAO,SAAS,OAAO,OAAO,MAAM;AAAA,QAE7G,UAAU,4CAAC,+BAAW,UAAS,IAAe;AAAA;AAAA;AAAA,EACjD;AAEJ,CAAC;AACD,QAAQ,cAAc;",
   "names": ["classNames"]
 }

package/dist/components/spinner/Spinner.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.cts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAEzF,QAAA,MAAM,OAAO,sFAkBX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"Spinner.d.cts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAKzF,QAAA,MAAM,OAAO,sFAyCX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/spinner/Spinner.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.mts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAEzF,QAAA,MAAM,OAAO,sFAkBX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"Spinner.d.mts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAKzF,QAAA,MAAM,OAAO,sFAyCX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/spinner/Spinner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAEzF,QAAA,MAAM,OAAO,sFAkBX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../../src/components/spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAQpE,KAAK,cAAc,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;AAChD,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAA;AAE9D,UAAU,YAAa,SAAQ,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,eAAe;CAAG;AAKzF,QAAA,MAAM,OAAO,sFAyCX,CAAA;AAGF,OAAO,EAAE,OAAO,EAAE,CAAA;AAClB,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,YAAY,EAAE,CAAA"}