@namroodinc/liquid-editorial 0.1.6 → 0.1.7

package/dist/components/Drawer/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","useRef","useId","createPortal","Button","require_components_Button_index","react","react_jsx_runtime","react_dom","Drawer","rest","panelRef","onCloseRef","onClose","titleId","descriptionId","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","side","node","ref","description","size","className","title","footer"],"sources":["../../../src/components/Drawer/index.tsx"],"sourcesContent":["import { forwardRef, useEffect, useId, useRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type DrawerSide = \"end\" | \"start\" | \"bottom\";\nexport type DrawerSize = \"md\" | \"wide\";\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  isOpen: boolean;\n  /** Escape, the scrim and the close button all call this. */\n  onClose: () => void;\n  title: string;\n  description?: string;\n  /** Which edge the panel is anchored to. */\n  side?: DrawerSide;\n  size?: DrawerSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A side panel for work that belongs beside the page rather than on top of it\n * — editing one record, a filter set, a revision history. Same frame, rules\n * and footer band as `Modal`; focus is trapped while open.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n  {\n    isOpen,\n    onClose,\n    title,\n    description,\n    side = \"end\",\n    size = \"md\",\n    footer,\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const panelRef = useRef<HTMLDivElement | null>(null);\n  const onCloseRef = useRef(onClose);\n  const titleId = useId();\n  const descriptionId = useId();\n\n  useEffect(() => {\n    onCloseRef.current = onClose;\n  }, [onClose]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const previous = document.activeElement as HTMLElement | null;\n    const initialFocus = panelRef.current?.querySelector<HTMLElement>(\n      \"button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])\",\n    );\n    (initialFocus ?? panelRef.current)?.focus();\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        onCloseRef.current();\n        return;\n      }\n      if (event.key !== \"Tab\") return;\n      const focusable = Array.from(\n        panelRef.current?.querySelectorAll<HTMLElement>(\n          \"button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])\",\n        ) ?? [],\n      );\n      if (focusable.length === 0) return;\n      const first = focusable[0]!;\n      const last = focusable[focusable.length - 1]!;\n      if (event.shiftKey && document.activeElement === first) {\n        event.preventDefault();\n        last.focus();\n      } else if (!event.shiftKey && document.activeElement === last) {\n        event.preventDefault();\n        first.focus();\n      }\n    };\n\n    document.addEventListener(\"keydown\", onKeyDown);\n    const overflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n\n    return () => {\n      document.removeEventListener(\"keydown\", onKeyDown);\n      document.body.style.overflow = overflow;\n      previous?.focus();\n    };\n  }, [isOpen]);\n\n  if (!isOpen || typeof document === \"undefined\") return null;\n\n  return createPortal(\n    <div\n      className=\"ds-drawer-scrim\"\n      data-side={side}\n      onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}\n    >\n      <div\n        {...rest}\n        ref={(node) => {\n          panelRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={titleId}\n        aria-describedby={description ? descriptionId : undefined}\n        tabIndex={-1}\n        data-side={side}\n        data-size={size}\n        className={[\"ds-drawer\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-drawer__head\">\n          <div className=\"ds-drawer__titles\">\n            <h2 id={titleId} className=\"ds-drawer__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-drawer__description\">\n                {description}\n              </p>\n            )}\n          </div>\n          <Button\n            variant=\"simple\"\n            size=\"sm\"\n            isIconOnly\n            iconStart=\"x\"\n            aria-label=\"Close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-drawer__body\">{children}</div>\n        {footer && <footer className=\"ds-drawer__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    document.body,\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["forwardRef","useRef","useId","useState","createPortal","Button","require_components_Button_index","react","react_dom","react_jsx_runtime","Drawer","rest","panelRef","scrimRef","closeRef","onCloseRef","onClose","titleId","descriptionId","previousOpen","setPreviousOpen","isOpen","exiting","setExiting","variant","durations","duration","value","timeout","previous","focusOptions","selector","onKeyDown","event","focusable","first","last","overflow","portalContainer","node","side","ref","description","size","className","title","closeLabel","footer"],"sources":["../../../src/components/Drawer/index.tsx"],"sourcesContent":["import { forwardRef, useEffect, useId, useRef, useState, type HTMLAttributes, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type DrawerSide = \"end\" | \"start\" | \"bottom\";\nexport type DrawerSize = \"md\" | \"wide\";\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  isOpen: boolean;\n  /** Escape, the scrim and the close button all call this. */\n  onClose: () => void;\n  title: ReactNode;\n  description?: string;\n  /** Which edge the panel is anchored to. */\n  side?: DrawerSide;\n  size?: DrawerSize;\n  /** Navigation uses a compact, square panel and animates its exit. */\n  variant?: \"default\" | \"navigation\";\n  /** Accessible name of the dismiss button. */\n  closeLabel?: string;\n  /**\n   * Defaults to document.body, covering the viewport. A navigation drawer\n   * portaled into a positioned element, such as an app shell, stays inside it.\n   */\n  portalContainer?: HTMLElement | null;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A side panel for work that belongs beside the page rather than on top of it\n * — editing one record, a filter set, a revision history. Same frame, rules\n * and footer band as `Modal`; focus is trapped while open.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n  {\n    isOpen,\n    onClose,\n    title,\n    description,\n    side = \"end\",\n    size = \"md\",\n    variant = \"default\",\n    closeLabel = \"Close\",\n    portalContainer,\n    footer,\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const panelRef = useRef<HTMLDivElement | null>(null);\n  const scrimRef = useRef<HTMLDivElement | null>(null);\n  const closeRef = useRef<HTMLButtonElement | null>(null);\n  const onCloseRef = useRef(onClose);\n  const titleId = useId();\n  const descriptionId = useId();\n  const [previousOpen, setPreviousOpen] = useState(isOpen);\n  const [exiting, setExiting] = useState(false);\n\n  if (previousOpen !== isOpen) {\n    setPreviousOpen(isOpen);\n    setExiting(!isOpen && variant === \"navigation\");\n  }\n\n  useEffect(() => {\n    if (!exiting || isOpen) return;\n    // Read the actual transition, including token overrides and reduced motion.\n    const durations = getComputedStyle(scrimRef.current!).transitionDuration.split(\",\");\n    const duration = Math.max(0, ...durations.map((value) =>\n      parseFloat(value) * (value.trim().endsWith(\"ms\") ? 1 : 1000) || 0,\n    ));\n    const timeout = window.setTimeout(() => setExiting(false), duration);\n    return () => window.clearTimeout(timeout);\n  }, [exiting, isOpen]);\n\n  useEffect(() => {\n    onCloseRef.current = onClose;\n  }, [onClose]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const previous = document.activeElement as HTMLElement | null;\n    // Navigation starts off-screen; focusing it must not scroll the shell with it.\n    const focusOptions = variant === \"navigation\" ? { preventScroll: true } : undefined;\n    const selector = \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])\";\n    const initialFocus = variant === \"navigation\" ? closeRef.current : panelRef.current?.querySelector<HTMLElement>(selector);\n    (initialFocus ?? panelRef.current)?.focus(focusOptions);\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        // A popup inside the panel (Menu, Select, DateField) claims its Escape.\n        if (event.defaultPrevented) return;\n        event.preventDefault();\n        onCloseRef.current();\n        return;\n      }\n      if (event.key !== \"Tab\") return;\n      const focusable = Array.from(\n        panelRef.current?.querySelectorAll<HTMLElement>(\n          selector,\n        ) ?? [],\n      );\n      if (focusable.length === 0) return;\n      const first = focusable[0]!;\n      const last = focusable[focusable.length - 1]!;\n      if (event.shiftKey && (document.activeElement === first || !panelRef.current?.contains(document.activeElement))) {\n        event.preventDefault();\n        last.focus();\n      } else if (!event.shiftKey && (document.activeElement === last || !panelRef.current?.contains(document.activeElement))) {\n        event.preventDefault();\n        first.focus();\n      }\n    };\n\n    // On window, so document-level popup handlers inside the panel run first.\n    window.addEventListener(\"keydown\", onKeyDown);\n    const overflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n\n    return () => {\n      window.removeEventListener(\"keydown\", onKeyDown);\n      document.body.style.overflow = overflow;\n      previous?.focus(focusOptions);\n    };\n  }, [isOpen, variant, portalContainer]);\n\n  if ((!isOpen && !exiting) || typeof document === \"undefined\") return null;\n\n  return createPortal(\n    <div\n      ref={(node) => {\n        scrimRef.current = node;\n        if (node) node.inert = !isOpen;\n      }}\n      className=\"ds-drawer-scrim\"\n      data-side={side}\n      data-variant={variant}\n      data-contained={portalContainer ? \"\" : undefined}\n      data-state={isOpen ? \"open\" : \"closed\"}\n      aria-hidden={!isOpen || undefined}\n      onTransitionEnd={(event) => {\n        if (event.target === event.currentTarget && event.propertyName === \"opacity\" && !isOpen) setExiting(false);\n      }}\n      onMouseDown={(event) => isOpen && event.target === event.currentTarget && onCloseRef.current()}\n    >\n      <div\n        {...rest}\n        ref={(node) => {\n          panelRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={rest[\"aria-label\"] ? undefined : (rest[\"aria-labelledby\"] ?? titleId)}\n        aria-describedby={description ? descriptionId : undefined}\n        tabIndex={-1}\n        data-side={side}\n        data-size={size}\n        data-variant={variant}\n        className={[\"ds-drawer\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-drawer__head\">\n          <div className=\"ds-drawer__titles\">\n            <h2 id={titleId} className=\"ds-drawer__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-drawer__description\">\n                {description}\n              </p>\n            )}\n          </div>\n          <Button\n            ref={closeRef}\n            variant=\"simple\"\n            size={variant === \"navigation\" ? \"lg\" : \"sm\"}\n            isIconOnly\n            iconStart=\"x\"\n            className={variant === \"navigation\" ? \"ds-drawer__close\" : undefined}\n            aria-label={closeLabel}\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-drawer__body\">{children}</div>\n        {footer && <footer className=\"ds-drawer__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    portalContainer ?? document.body,\n  );\n});\n"],"mappings":"A,uLAoCA,IAAaU,GAAA,EAASV,EAAAA,WAAAA,CAAwC,SAC5D,CACE,SACA,UACA,QACA,cACA,OAAO,MACP,OAAO,KACP,UAAU,UACV,aAAa,QACb,kBACA,SACA,YACA,WACA,GAAGW,GAEL,EACA,CACA,IAAMC,GAAA,EAAWX,EAAAA,OAAAA,CAA8B,IAAI,EAC7CY,GAAA,EAAWZ,EAAAA,OAAAA,CAA8B,IAAI,EAC7Ca,GAAA,EAAWb,EAAAA,OAAAA,CAAiC,IAAI,EAChDc,GAAA,EAAad,EAAAA,OAAAA,CAAOe,CAAO,EAC3BC,GAAA,EAAUf,EAAAA,MAAAA,CAAM,EAChBgB,GAAA,EAAgBhB,EAAAA,MAAAA,CAAM,EACtB,CAACiB,EAAcC,IAAA,EAAmBjB,EAAAA,SAAAA,CAASkB,CAAM,EACjD,CAACC,EAASC,IAAA,EAAcpB,EAAAA,SAAAA,CAAS,EAAK,EAwE5C,OAtEIgB,IAAiBE,IACnBD,EAAgBC,CAAM,EACtBE,EAAW,CAACF,GAAUG,IAAY,YAAY,IAGhD,EAAAjB,EAAA,UAAA,KAAgB,CACd,GAAI,CAACe,GAAWD,EAAQ,OAExB,IAAMI,EAAY,iBAAiBZ,EAAS,OAAQ,CAAC,CAAC,mBAAmB,MAAM,GAAG,EAC5Ea,EAAW,KAAK,IAAI,EAAG,GAAGD,EAAU,IAAK,GAC7C,WAAWE,CAAK,GAAKA,EAAM,KAAK,CAAC,CAAC,SAAS,IAAI,EAAI,EAAI,MAAS,CAClE,CAAC,EACKC,EAAU,OAAO,eAAiBL,EAAW,EAAK,EAAGG,CAAQ,EACnE,UAAa,OAAO,aAAaE,CAAO,CAC1C,EAAG,CAACN,EAASD,CAAM,CAAC,GAEpB,EAAAd,EAAA,UAAA,KAAgB,CACd,EAAW,QAAUS,CACvB,EAAG,CAACA,CAAO,CAAC,GAEZ,EAAAT,EAAA,UAAA,KAAgB,CACd,GAAI,CAACc,EAAQ,OAEb,IAAMQ,EAAW,SAAS,cAEpBC,EAAeN,IAAY,aAAe,CAAE,cAAe,EAAK,EAAI,IAAA,GACpEO,EAAW,iGACIP,IAAY,aAAeV,EAAS,QAAUF,EAAS,SAAS,cAA2BmB,CAAQ,IACvGnB,EAAS,QAAA,EAAU,MAAMkB,CAAY,EAEtD,IAAME,EAAa,GAAyB,CAC1C,GAAIC,EAAM,MAAQ,SAAU,CAE1B,GAAIA,EAAM,iBAAkB,OAC5BA,EAAM,eAAe,EACrBlB,EAAW,QAAQ,EACnB,MACF,CACA,GAAIkB,EAAM,MAAQ,MAAO,OACzB,IAAMC,EAAY,MAAM,KACtBtB,EAAS,SAAS,iBAChBmB,CACF,GAAK,CAAC,CACR,EACA,GAAIG,EAAU,SAAW,EAAG,OAC5B,IAAMC,EAAQD,EAAU,GAClBE,EAAOF,EAAUA,EAAU,OAAS,GACtCD,EAAM,WAAa,SAAS,gBAAkBE,GAAS,CAACvB,EAAS,SAAS,SAAS,SAAS,aAAa,IAC3GqB,EAAM,eAAe,EACrBG,EAAK,MAAM,GACF,CAACH,EAAM,WAAa,SAAS,gBAAkBG,GAAQ,CAACxB,EAAS,SAAS,SAAS,SAAS,aAAa,KAClHqB,EAAM,eAAe,EACrBE,EAAM,MAAM,EAEhB,EAGA,OAAO,iBAAiB,UAAWH,CAAS,EAC5C,IAAMK,EAAW,SAAS,KAAK,MAAM,SAGrC,MAFA,UAAS,KAAK,MAAM,SAAW,aAElB,CACX,OAAO,oBAAoB,UAAWL,CAAS,EAC/C,SAAS,KAAK,MAAM,SAAWK,EAC/BR,GAAU,MAAMC,CAAY,CAC9B,CACF,EAAG,CAACT,EAAQG,EAASc,CAAe,CAAC,EAEhC,CAACjB,GAAU,CAACC,GAAY,OAAO,SAAa,IAAoB,MAErE,EAAOlB,EAAAA,aAAAA,EACL,EAAAK,EAAA,IAAA,CAAC,MAAD,CACE,IAAM,GAAS,CACb,EAAS,QAAU8B,EACfA,IAAM,EAAK,MAAQ,CAAClB,EAC1B,EACA,UAAU,kBACV,YAAWmB,EACX,eAAchB,EACd,iBAAgBc,EAAkB,GAAK,IAAA,GACvC,aAAYjB,EAAS,OAAS,SAC9B,cAAa,CAACA,GAAU,IAAA,GACxB,gBAAkB,GAAU,CACtBY,EAAM,SAAWA,EAAM,eAAiBA,EAAM,eAAiB,WAAa,CAACZ,GAAQE,EAAW,EAAK,CAC3G,EACA,YAAc,GAAUF,GAAUY,EAAM,SAAWA,EAAM,eAAiBlB,EAAW,QAAQ,EAE7F,UAAA,EAAAN,EAAA,KAAA,CAAC,MAAD,CACE,GAAIE,EACJ,IAAM,GAAS,CACb,EAAS,QAAU4B,EACf,OAAOE,GAAQ,WAAYA,EAAIF,CAAI,EAC9BE,IAAK,EAAI,QAAUF,EAC9B,EACA,KAAK,SACL,aAAW,OACX,kBAAiB5B,EAAK,cAAgB,IAAA,GAAaA,EAAK,oBAAsBM,EAC9E,mBAAkByB,EAAcxB,EAAgB,IAAA,GAChD,SAAU,GACV,YAAWsB,EACX,YAAWG,EACX,eAAcnB,EACd,UAAW,CAAC,YAAaoB,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,EAf9D,SAAA,EAiBE,EAAAnC,EAAA,KAAA,CAAC,SAAD,CAAQ,UAAU,kBAAlB,SAAA,EACE,EAAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAU,oBAAf,SAAA,EACE,EAAAA,EAAA,IAAA,CAAC,KAAD,CAAI,GAAIQ,EAAS,UAAU,mBACxB,SAAA4B,CACC,CAAA,EACHH,IACC,EAAAjC,EAAA,IAAA,CAAC,IAAD,CAAG,GAAIS,EAAe,UAAU,yBAC7B,SAAAwB,CACA,CAAA,CAEF,CACL,CAAA,GAAA,EAAAjC,EAAA,IAAA,CAACJ,EAAAA,OAAD,CACE,IAAKS,EACL,QAAQ,SACR,KAAMU,IAAY,aAAe,KAAO,KACxC,WAAA,GACA,UAAU,IACV,UAAWA,IAAY,aAAe,mBAAqB,IAAA,GAC3D,aAAYsB,EACZ,YAAe/B,EAAW,QAAQ,CACnC,CAAA,CACK,C,IACR,EAAAN,EAAA,IAAA,CAAC,MAAD,CAAK,UAAU,kBAAmB,UAAc,CAAA,EAC/CsC,IAAU,EAAAtC,EAAA,IAAA,CAAC,SAAD,CAAQ,UAAU,oBAAqB,SAAAsC,CAAe,CAAA,CAC9D,C,EACF,CAAA,EACLT,GAAmB,SAAS,IAC9B,CACF,CAAC,E"}

package/dist/components/Drawer/index.d.cts

@@ -5,11 +5,20 @@ export interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title
     isOpen: boolean;
     /** Escape, the scrim and the close button all call this. */
     onClose: () => void;
-    title: string;
+    title: ReactNode;
     description?: string;
     /** Which edge the panel is anchored to. */
     side?: DrawerSide;
     size?: DrawerSize;
+    /** Navigation uses a compact, square panel and animates its exit. */
+    variant?: "default" | "navigation";
+    /** Accessible name of the dismiss button. */
+    closeLabel?: string;
+    /**
+     * Defaults to document.body, covering the viewport. A navigation drawer
+     * portaled into a positioned element, such as an app shell, stays inside it.
+     */
+    portalContainer?: HTMLElement | null;
     /** Actions, right-aligned. The confirming action goes last. */
     footer?: ReactNode;
     children?: ReactNode;

package/dist/components/Drawer/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,wGAqHjB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkD,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5G,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qEAAqE;IACrE,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC;IACnC,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,wGA+JjB,CAAC"}

package/dist/components/Drawer/index.d.ts

@@ -5,11 +5,20 @@ export interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title
     isOpen: boolean;
     /** Escape, the scrim and the close button all call this. */
     onClose: () => void;
-    title: string;
+    title: ReactNode;
     description?: string;
     /** Which edge the panel is anchored to. */
     side?: DrawerSide;
     size?: DrawerSize;
+    /** Navigation uses a compact, square panel and animates its exit. */
+    variant?: "default" | "navigation";
+    /** Accessible name of the dismiss button. */
+    closeLabel?: string;
+    /**
+     * Defaults to document.body, covering the viewport. A navigation drawer
+     * portaled into a positioned element, such as an app shell, stays inside it.
+     */
+    portalContainer?: HTMLElement | null;
     /** Actions, right-aligned. The confirming action goes last. */
     footer?: ReactNode;
     children?: ReactNode;

package/dist/components/Drawer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,wGAqHjB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkD,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAG5G,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpD,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAChF,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qEAAqE;IACrE,OAAO,CAAC,EAAE,SAAS,GAAG,YAAY,CAAC;IACnC,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,wGA+JjB,CAAC"}

package/dist/components/Drawer/index.js

@@ -1,85 +1,107 @@
 import { Button as e } from "../Button/index.js";
-import { forwardRef as t, useEffect as n, useId as r, useRef as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { createPortal as s } from "react-dom";
+import { forwardRef as t, useEffect as n, useId as r, useRef as i, useState as a } from "react";
+import { createPortal as o } from "react-dom";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/Drawer/index.tsx
-var c = t(function({ isOpen: t, onClose: c, title: l, description: u, side: d = "end", size: f = "md", footer: p, className: m, children: h, ...g }, _) {
-	let v = i(null), y = i(c), b = r(), x = r();
-	return n(() => {
-		y.current = c;
-	}, [c]), n(() => {
+var l = t(function({ isOpen: t, onClose: l, title: u, description: d, side: f = "end", size: p = "md", variant: m = "default", closeLabel: h = "Close", portalContainer: g, footer: _, className: v, children: y, ...b }, x) {
+	let S = i(null), C = i(null), w = i(null), T = i(l), E = r(), D = r(), [O, k] = a(t), [A, j] = a(!1);
+	return O !== t && (k(t), j(!t && m === "navigation")), n(() => {
+		if (!A || t) return;
+		let e = getComputedStyle(C.current).transitionDuration.split(","), n = Math.max(0, ...e.map((e) => parseFloat(e) * (e.trim().endsWith("ms") ? 1 : 1e3) || 0)), r = window.setTimeout(() => j(!1), n);
+		return () => window.clearTimeout(r);
+	}, [A, t]), n(() => {
+		T.current = l;
+	}, [l]), n(() => {
 		if (!t) return;
-		let e = document.activeElement;
-		(v.current?.querySelector("button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])") ?? v.current)?.focus();
-		let n = (e) => {
+		let e = document.activeElement, n = m === "navigation" ? { preventScroll: !0 } : void 0, r = ":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])";
+		((m === "navigation" ? w.current : S.current?.querySelector(r)) ?? S.current)?.focus(n);
+		let i = (e) => {
 			if (e.key === "Escape") {
-				y.current();
+				if (e.defaultPrevented) return;
+				e.preventDefault(), T.current();
 				return;
 			}
 			if (e.key !== "Tab") return;
-			let t = Array.from(v.current?.querySelectorAll("button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])") ?? []);
+			let t = Array.from(S.current?.querySelectorAll(r) ?? []);
 			if (t.length === 0) return;
-			let n = t[0], r = t[t.length - 1];
-			e.shiftKey && document.activeElement === n ? (e.preventDefault(), r.focus()) : !e.shiftKey && document.activeElement === r && (e.preventDefault(), n.focus());
+			let n = t[0], i = t[t.length - 1];
+			e.shiftKey && (document.activeElement === n || !S.current?.contains(document.activeElement)) ? (e.preventDefault(), i.focus()) : !e.shiftKey && (document.activeElement === i || !S.current?.contains(document.activeElement)) && (e.preventDefault(), n.focus());
 		};
-		document.addEventListener("keydown", n);
-		let r = document.body.style.overflow;
+		window.addEventListener("keydown", i);
+		let a = document.body.style.overflow;
 		return document.body.style.overflow = "hidden", () => {
-			document.removeEventListener("keydown", n), document.body.style.overflow = r, e?.focus();
+			window.removeEventListener("keydown", i), document.body.style.overflow = a, e?.focus(n);
 		};
-	}, [t]), !t || typeof document > "u" ? null : s(/* @__PURE__ */ a("div", {
+	}, [
+		t,
+		m,
+		g
+	]), !t && !A || typeof document > "u" ? null : o(/* @__PURE__ */ s("div", {
+		ref: (e) => {
+			C.current = e, e && (e.inert = !t);
+		},
 		className: "ds-drawer-scrim",
-		"data-side": d,
-		onMouseDown: (e) => e.target === e.currentTarget && y.current(),
-		children: /* @__PURE__ */ o("div", {
-			...g,
+		"data-side": f,
+		"data-variant": m,
+		"data-contained": g ? "" : void 0,
+		"data-state": t ? "open" : "closed",
+		"aria-hidden": !t || void 0,
+		onTransitionEnd: (e) => {
+			e.target === e.currentTarget && e.propertyName === "opacity" && !t && j(!1);
+		},
+		onMouseDown: (e) => t && e.target === e.currentTarget && T.current(),
+		children: /* @__PURE__ */ c("div", {
+			...b,
 			ref: (e) => {
-				v.current = e, typeof _ == "function" ? _(e) : _ && (_.current = e);
+				S.current = e, typeof x == "function" ? x(e) : x && (x.current = e);
 			},
 			role: "dialog",
 			"aria-modal": "true",
-			"aria-labelledby": b,
-			"aria-describedby": u ? x : void 0,
+			"aria-labelledby": b["aria-label"] ? void 0 : b["aria-labelledby"] ?? E,
+			"aria-describedby": d ? D : void 0,
 			tabIndex: -1,
-			"data-side": d,
-			"data-size": f,
-			className: ["ds-drawer", m].filter(Boolean).join(" "),
+			"data-side": f,
+			"data-size": p,
+			"data-variant": m,
+			className: ["ds-drawer", v].filter(Boolean).join(" "),
 			children: [
-				/* @__PURE__ */ o("header", {
+				/* @__PURE__ */ c("header", {
 					className: "ds-drawer__head",
-					children: [/* @__PURE__ */ o("div", {
+					children: [/* @__PURE__ */ c("div", {
 						className: "ds-drawer__titles",
-						children: [/* @__PURE__ */ a("h2", {
-							id: b,
+						children: [/* @__PURE__ */ s("h2", {
+							id: E,
 							className: "ds-drawer__title",
-							children: l
-						}), u && /* @__PURE__ */ a("p", {
-							id: x,
-							className: "ds-drawer__description",
 							children: u
+						}), d && /* @__PURE__ */ s("p", {
+							id: D,
+							className: "ds-drawer__description",
+							children: d
 						})]
-					}), /* @__PURE__ */ a(e, {
+					}), /* @__PURE__ */ s(e, {
+						ref: w,
 						variant: "simple",
-						size: "sm",
+						size: m === "navigation" ? "lg" : "sm",
 						isIconOnly: !0,
 						iconStart: "x",
-						"aria-label": "Close",
-						onClick: () => y.current()
+						className: m === "navigation" ? "ds-drawer__close" : void 0,
+						"aria-label": h,
+						onClick: () => T.current()
 					})]
 				}),
-				/* @__PURE__ */ a("div", {
+				/* @__PURE__ */ s("div", {
 					className: "ds-drawer__body",
-					children: h
+					children: y
 				}),
-				p && /* @__PURE__ */ a("footer", {
+				_ && /* @__PURE__ */ s("footer", {
 					className: "ds-drawer__footer",
-					children: p
+					children: _
 				})
 			]
 		})
-	}), document.body);
+	}), g ?? document.body);
 });
 //#endregion
-export { c as Drawer };
+export { l as Drawer };
 
 //# sourceMappingURL=index.js.map

package/dist/components/Drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Drawer","forwardRef","rest","panelRef","useRef","onCloseRef","onClose","titleId","useId","descriptionId","useEffect","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","createPortal","side","node","ref","description","size","className","title","Button","footer"],"sources":["../../../src/components/Drawer/index.tsx"],"sourcesContent":["import { forwardRef, useEffect, useId, useRef, type HTMLAttributes, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type DrawerSide = \"end\" | \"start\" | \"bottom\";\nexport type DrawerSize = \"md\" | \"wide\";\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  isOpen: boolean;\n  /** Escape, the scrim and the close button all call this. */\n  onClose: () => void;\n  title: string;\n  description?: string;\n  /** Which edge the panel is anchored to. */\n  side?: DrawerSide;\n  size?: DrawerSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A side panel for work that belongs beside the page rather than on top of it\n * — editing one record, a filter set, a revision history. Same frame, rules\n * and footer band as `Modal`; focus is trapped while open.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n  {\n    isOpen,\n    onClose,\n    title,\n    description,\n    side = \"end\",\n    size = \"md\",\n    footer,\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const panelRef = useRef<HTMLDivElement | null>(null);\n  const onCloseRef = useRef(onClose);\n  const titleId = useId();\n  const descriptionId = useId();\n\n  useEffect(() => {\n    onCloseRef.current = onClose;\n  }, [onClose]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const previous = document.activeElement as HTMLElement | null;\n    const initialFocus = panelRef.current?.querySelector<HTMLElement>(\n      \"button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])\",\n    );\n    (initialFocus ?? panelRef.current)?.focus();\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        onCloseRef.current();\n        return;\n      }\n      if (event.key !== \"Tab\") return;\n      const focusable = Array.from(\n        panelRef.current?.querySelectorAll<HTMLElement>(\n          \"button:not(:disabled), [href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex='-1'])\",\n        ) ?? [],\n      );\n      if (focusable.length === 0) return;\n      const first = focusable[0]!;\n      const last = focusable[focusable.length - 1]!;\n      if (event.shiftKey && document.activeElement === first) {\n        event.preventDefault();\n        last.focus();\n      } else if (!event.shiftKey && document.activeElement === last) {\n        event.preventDefault();\n        first.focus();\n      }\n    };\n\n    document.addEventListener(\"keydown\", onKeyDown);\n    const overflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n\n    return () => {\n      document.removeEventListener(\"keydown\", onKeyDown);\n      document.body.style.overflow = overflow;\n      previous?.focus();\n    };\n  }, [isOpen]);\n\n  if (!isOpen || typeof document === \"undefined\") return null;\n\n  return createPortal(\n    <div\n      className=\"ds-drawer-scrim\"\n      data-side={side}\n      onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}\n    >\n      <div\n        {...rest}\n        ref={(node) => {\n          panelRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={titleId}\n        aria-describedby={description ? descriptionId : undefined}\n        tabIndex={-1}\n        data-side={side}\n        data-size={size}\n        className={[\"ds-drawer\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-drawer__head\">\n          <div className=\"ds-drawer__titles\">\n            <h2 id={titleId} className=\"ds-drawer__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-drawer__description\">\n                {description}\n              </p>\n            )}\n          </div>\n          <Button\n            variant=\"simple\"\n            size=\"sm\"\n            isIconOnly\n            iconStart=\"x\"\n            aria-label=\"Close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-drawer__body\">{children}</div>\n        {footer && <footer className=\"ds-drawer__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    document.body,\n  );\n});\n"],"mappings":";;;;;AA2BA,IAAaA,IAASC,EAAwC,SAC5D,EACE,WACA,YACA,UACA,gBACA,UAAO,OACP,UAAO,MACP,WACA,cACA,aACA,GAAGC,KAEL,GACA;CACA,IAAMC,IAAWC,EAA8B,IAAI,GAC7CC,IAAaD,EAAOE,CAAO,GAC3BC,IAAUC,EAAM,GAChBC,IAAgBD,EAAM;CAmD5B,OAjDAE,QAAgB;EACd,EAAW,UAAUJ;CACvB,GAAG,CAACA,CAAO,CAAC,GAEZI,QAAgB;EACd,IAAI,CAACC,GAAQ;EAEb,IAAMC,IAAW,SAAS;EAI1B,CAHqBT,EAAS,SAAS,cACrC,sIACF,KACiBA,EAAS,QAAA,EAAU,MAAM;EAE1C,IAAMU,KAAa,MAAyB;GAC1C,IAAIC,EAAM,QAAQ,UAAU;IAC1B,EAAW,QAAQ;IACnB;GACF;GACA,IAAIA,EAAM,QAAQ,OAAO;GACzB,IAAMC,IAAY,MAAM,KACtBZ,EAAS,SAAS,iBAChB,sIACF,KAAK,CAAC,CACR;GACA,IAAIY,EAAU,WAAW,GAAG;GAC5B,IAAMC,IAAQD,EAAU,IAClBE,IAAOF,EAAUA,EAAU,SAAS;GAC1C,AAAID,EAAM,YAAY,SAAS,kBAAkBE,KAC/CF,EAAM,eAAe,GACrBG,EAAK,MAAM,KACF,CAACH,EAAM,YAAY,SAAS,kBAAkBG,MACvDH,EAAM,eAAe,GACrBE,EAAM,MAAM;EAEhB;EAEA,SAAS,iBAAiB,WAAWH,CAAS;EAC9C,IAAMK,IAAW,SAAS,KAAK,MAAM;EAGrC,OAFA,SAAS,KAAK,MAAM,WAAW,gBAElB;GAGX,AAFA,SAAS,oBAAoB,WAAWL,CAAS,GACjD,SAAS,KAAK,MAAM,WAAWK,GAC/BN,GAAU,MAAM;EAClB;CACF,GAAG,CAACD,CAAM,CAAC,GAEP,CAACA,KAAU,OAAO,WAAa,MAAoB,OAEhDQ,EACL,kBAAC,OAAD;EACE,WAAU;EACV,aAAWC;EACX,cAAc,MAAUN,EAAM,WAAWA,EAAM,iBAAiBT,EAAW,QAAQ;EAEnF,UAAA,kBAAC,OAAD;GACE,GAAIH;GACJ,MAAM,MAAS;IAEb,AADA,EAAS,UAAUmB,GACf,OAAOC,KAAQ,aAAYA,EAAID,CAAI,IAC9BC,MAAK,EAAI,UAAUD;GAC9B;GACA,MAAK;GACL,cAAW;GACX,mBAAiBd;GACjB,oBAAkBgB,IAAcd,IAAgB,KAAA;GAChD,UAAU;GACV,aAAWW;GACX,aAAWI;GACX,WAAW,CAAC,aAAaC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;GAd9D,UAAA;IAgBE,kBAAC,UAAD;KAAQ,WAAU;KAAlB,UAAA,CACE,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,kBAAC,MAAD;OAAI,IAAIlB;OAAS,WAAU;OACxB,UAAAmB;MACC,CAAA,GACHH,KACC,kBAAC,KAAD;OAAG,IAAId;OAAe,WAAU;OAC7B,UAAAc;MACA,CAAA,CAEF;KACL,CAAA,GAAA,kBAACI,GAAD;MACE,SAAQ;MACR,MAAK;MACL,YAAA;MACA,WAAU;MACV,cAAW;MACX,eAAetB,EAAW,QAAQ;KACnC,CAAA,CACK;;IACR,kBAAC,OAAD;KAAK,WAAU;KAAmB;IAAc,CAAA;IAC/CuB,KAAU,kBAAC,UAAD;KAAQ,WAAU;KAAqB,UAAAA;IAAe,CAAA;GAC9D;;CACF,CAAA,GACL,SAAS,IACX;AACF,CAAC"}
+{"version":3,"file":"index.js","names":["Drawer","forwardRef","rest","panelRef","useRef","scrimRef","closeRef","onCloseRef","onClose","titleId","useId","descriptionId","previousOpen","setPreviousOpen","useState","isOpen","exiting","setExiting","variant","useEffect","durations","duration","value","timeout","previous","focusOptions","selector","onKeyDown","event","focusable","first","last","overflow","portalContainer","createPortal","node","side","ref","description","size","className","title","Button","closeLabel","footer"],"sources":["../../../src/components/Drawer/index.tsx"],"sourcesContent":["import { forwardRef, useEffect, useId, useRef, useState, type HTMLAttributes, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Button } from \"../Button\";\nimport \"./style.css\";\n\nexport type DrawerSide = \"end\" | \"start\" | \"bottom\";\nexport type DrawerSize = \"md\" | \"wide\";\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  isOpen: boolean;\n  /** Escape, the scrim and the close button all call this. */\n  onClose: () => void;\n  title: ReactNode;\n  description?: string;\n  /** Which edge the panel is anchored to. */\n  side?: DrawerSide;\n  size?: DrawerSize;\n  /** Navigation uses a compact, square panel and animates its exit. */\n  variant?: \"default\" | \"navigation\";\n  /** Accessible name of the dismiss button. */\n  closeLabel?: string;\n  /**\n   * Defaults to document.body, covering the viewport. A navigation drawer\n   * portaled into a positioned element, such as an app shell, stays inside it.\n   */\n  portalContainer?: HTMLElement | null;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A side panel for work that belongs beside the page rather than on top of it\n * — editing one record, a filter set, a revision history. Same frame, rules\n * and footer band as `Modal`; focus is trapped while open.\n */\nexport const Drawer = forwardRef<HTMLDivElement, DrawerProps>(function Drawer(\n  {\n    isOpen,\n    onClose,\n    title,\n    description,\n    side = \"end\",\n    size = \"md\",\n    variant = \"default\",\n    closeLabel = \"Close\",\n    portalContainer,\n    footer,\n    className,\n    children,\n    ...rest\n  },\n  ref,\n) {\n  const panelRef = useRef<HTMLDivElement | null>(null);\n  const scrimRef = useRef<HTMLDivElement | null>(null);\n  const closeRef = useRef<HTMLButtonElement | null>(null);\n  const onCloseRef = useRef(onClose);\n  const titleId = useId();\n  const descriptionId = useId();\n  const [previousOpen, setPreviousOpen] = useState(isOpen);\n  const [exiting, setExiting] = useState(false);\n\n  if (previousOpen !== isOpen) {\n    setPreviousOpen(isOpen);\n    setExiting(!isOpen && variant === \"navigation\");\n  }\n\n  useEffect(() => {\n    if (!exiting || isOpen) return;\n    // Read the actual transition, including token overrides and reduced motion.\n    const durations = getComputedStyle(scrimRef.current!).transitionDuration.split(\",\");\n    const duration = Math.max(0, ...durations.map((value) =>\n      parseFloat(value) * (value.trim().endsWith(\"ms\") ? 1 : 1000) || 0,\n    ));\n    const timeout = window.setTimeout(() => setExiting(false), duration);\n    return () => window.clearTimeout(timeout);\n  }, [exiting, isOpen]);\n\n  useEffect(() => {\n    onCloseRef.current = onClose;\n  }, [onClose]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const previous = document.activeElement as HTMLElement | null;\n    // Navigation starts off-screen; focusing it must not scroll the shell with it.\n    const focusOptions = variant === \"navigation\" ? { preventScroll: true } : undefined;\n    const selector = \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])\";\n    const initialFocus = variant === \"navigation\" ? closeRef.current : panelRef.current?.querySelector<HTMLElement>(selector);\n    (initialFocus ?? panelRef.current)?.focus(focusOptions);\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        // A popup inside the panel (Menu, Select, DateField) claims its Escape.\n        if (event.defaultPrevented) return;\n        event.preventDefault();\n        onCloseRef.current();\n        return;\n      }\n      if (event.key !== \"Tab\") return;\n      const focusable = Array.from(\n        panelRef.current?.querySelectorAll<HTMLElement>(\n          selector,\n        ) ?? [],\n      );\n      if (focusable.length === 0) return;\n      const first = focusable[0]!;\n      const last = focusable[focusable.length - 1]!;\n      if (event.shiftKey && (document.activeElement === first || !panelRef.current?.contains(document.activeElement))) {\n        event.preventDefault();\n        last.focus();\n      } else if (!event.shiftKey && (document.activeElement === last || !panelRef.current?.contains(document.activeElement))) {\n        event.preventDefault();\n        first.focus();\n      }\n    };\n\n    // On window, so document-level popup handlers inside the panel run first.\n    window.addEventListener(\"keydown\", onKeyDown);\n    const overflow = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n\n    return () => {\n      window.removeEventListener(\"keydown\", onKeyDown);\n      document.body.style.overflow = overflow;\n      previous?.focus(focusOptions);\n    };\n  }, [isOpen, variant, portalContainer]);\n\n  if ((!isOpen && !exiting) || typeof document === \"undefined\") return null;\n\n  return createPortal(\n    <div\n      ref={(node) => {\n        scrimRef.current = node;\n        if (node) node.inert = !isOpen;\n      }}\n      className=\"ds-drawer-scrim\"\n      data-side={side}\n      data-variant={variant}\n      data-contained={portalContainer ? \"\" : undefined}\n      data-state={isOpen ? \"open\" : \"closed\"}\n      aria-hidden={!isOpen || undefined}\n      onTransitionEnd={(event) => {\n        if (event.target === event.currentTarget && event.propertyName === \"opacity\" && !isOpen) setExiting(false);\n      }}\n      onMouseDown={(event) => isOpen && event.target === event.currentTarget && onCloseRef.current()}\n    >\n      <div\n        {...rest}\n        ref={(node) => {\n          panelRef.current = node;\n          if (typeof ref === \"function\") ref(node);\n          else if (ref) ref.current = node;\n        }}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={rest[\"aria-label\"] ? undefined : (rest[\"aria-labelledby\"] ?? titleId)}\n        aria-describedby={description ? descriptionId : undefined}\n        tabIndex={-1}\n        data-side={side}\n        data-size={size}\n        data-variant={variant}\n        className={[\"ds-drawer\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-drawer__head\">\n          <div className=\"ds-drawer__titles\">\n            <h2 id={titleId} className=\"ds-drawer__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-drawer__description\">\n                {description}\n              </p>\n            )}\n          </div>\n          <Button\n            ref={closeRef}\n            variant=\"simple\"\n            size={variant === \"navigation\" ? \"lg\" : \"sm\"}\n            isIconOnly\n            iconStart=\"x\"\n            className={variant === \"navigation\" ? \"ds-drawer__close\" : undefined}\n            aria-label={closeLabel}\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-drawer__body\">{children}</div>\n        {footer && <footer className=\"ds-drawer__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    portalContainer ?? document.body,\n  );\n});\n"],"mappings":"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"}

package/dist/components/Drawer/style.css

@@ -117,6 +117,108 @@
     border-block-start: var(--rule-width) solid var(--rule-color);
   }
 
+  .ds-drawer-scrim[data-variant="navigation"] {
+    overflow: clip;
+    opacity: 1;
+    animation: none;
+    transition: opacity var(--duration-panel) var(--ease-panel);
+  }
+
+  /* Portaled into a positioned container, navigation covers only that box. */
+  .ds-drawer-scrim[data-variant="navigation"][data-contained] {
+    position: absolute;
+    z-index: 20;
+  }
+
+  .ds-drawer[data-variant="navigation"] {
+    --drawer-hidden-transform: translateX(100%);
+
+    box-sizing: border-box;
+    min-block-size: 0;
+    border-radius: 0;
+    box-shadow: none;
+    transform: none;
+    animation: none;
+    transition: transform var(--duration-panel) var(--ease-panel);
+  }
+
+  .ds-drawer[data-variant="navigation"]:is([data-side="end"], [data-side="start"]) {
+    block-size: 100%;
+    inline-size: min(var(--sidenav-width), 85%);
+    max-inline-size: none;
+    border: 0;
+  }
+
+  /* A closed panel leaves through its own edge, mirrored for right-to-left. */
+  .ds-drawer[data-variant="navigation"][data-side="end"] {
+    border-inline-start: var(--frame-width) solid var(--frame-color);
+  }
+
+  .ds-drawer[data-variant="navigation"][data-side="start"] {
+    --drawer-hidden-transform: translateX(-100%);
+
+    border-inline-end: var(--frame-width) solid var(--frame-color);
+  }
+
+  .ds-drawer[data-variant="navigation"][data-side="end"]:dir(rtl) {
+    --drawer-hidden-transform: translateX(-100%);
+  }
+
+  .ds-drawer[data-variant="navigation"][data-side="start"]:dir(rtl) {
+    --drawer-hidden-transform: translateX(100%);
+  }
+
+  .ds-drawer[data-variant="navigation"][data-side="bottom"] {
+    --drawer-hidden-transform: translateY(100%);
+  }
+
+  .ds-drawer-scrim[data-variant="navigation"][data-state="closed"] {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  .ds-drawer-scrim[data-variant="navigation"][data-state="closed"] .ds-drawer {
+    transform: var(--drawer-hidden-transform);
+  }
+
+  @starting-style {
+    .ds-drawer-scrim[data-variant="navigation"][data-state="open"] { opacity: 0; }
+    .ds-drawer[data-variant="navigation"] { transform: var(--drawer-hidden-transform); }
+  }
+
+  .ds-drawer[data-variant="navigation"] .ds-drawer__head {
+    box-sizing: border-box;
+    flex: none;
+    align-items: center;
+    gap: var(--space-3);
+    min-block-size: var(--topnav-height);
+    padding: 0 var(--space-4);
+  }
+
+  .ds-drawer[data-variant="navigation"] .ds-drawer__title {
+    font-size: var(--font-size-md);
+  }
+
+  .ds-drawer__close {
+    margin-inline-end: calc(-1 * var(--space-2));
+  }
+
+  /* Content that doesn't scroll itself, unlike AppShell's SideNav, still can. */
+  .ds-drawer[data-variant="navigation"] .ds-drawer__body {
+    display: flex;
+    min-block-size: 0;
+    padding: 0;
+    overflow: hidden auto;
+  }
+
+  .ds-drawer[data-variant="navigation"] .ds-drawer__footer {
+    display: block;
+    flex: none;
+    padding: 0;
+    border: 0;
+    background: var(--color-surface);
+  }
+
   @keyframes ds-drawer-in-end {
     from {
       translate: var(--space-8) 0;
@@ -143,5 +245,9 @@
     .ds-drawer {
       animation: none;
     }
+    .ds-drawer-scrim[data-variant="navigation"],
+    .ds-drawer[data-variant="navigation"] {
+      transition-duration: 0s;
+    }
   }
 }

package/dist/components/EntryPicker/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs"),n=require("../Modal/index.cjs"),r=require("../Badge/index.cjs"),i=require("../SearchField/index.cjs"),a=require("../SortableList/index.cjs");let o=require("react"),s=require("react/jsx-runtime");function c(...e){return e.filter(Boolean).join(` `)}function l(e,t){return!t||[e.title,e.subtitle,...e.keywords??[]].filter(Boolean).join(` `).toLowerCase().includes(t.toLowerCase())}function u({item:t}){return(0,s.jsx)(`span`,{className:`ds-entry__thumb`,children:t.imageUrl?(0,s.jsx)(`img`,{src:t.imageUrl,alt:``,loading:`lazy`}):(0,s.jsx)(e.t,{name:`file-text`,size:20})})}function d({items:d,value:f,defaultValue:p=[],onValueChange:m,mode:h=`multiple`,max:g,label:_=`Entries`,emptyLabel:v=`Nothing selected yet.`,addLabel:y=`Choose entries`,isReorderable:b=!0,isDisabled:x=!1,className:S}){let[C,w]=(0,o.useState)(p),T=f??C,[E,D]=(0,o.useState)(!1),[O,k]=(0,o.useState)(``),A=(0,o.useMemo)(()=>new Map(d.map(e=>[e.id,e])),[d]),j=(0,o.useMemo)(()=>d.filter(e=>l(e,O)),[d,O]),M=h===`multiple`&&g!==void 0&&T.length>=g,N=e=>{x||(f===void 0&&w(e),m?.(e))},P=e=>{h===`single`?(N(T[0]===e?[]:[e]),D(!1)):T.includes(e)?N(T.filter(t=>t!==e)):M||N([...T,e])},F=T.map(e=>A.get(e)??{id:e,title:e}),I=!x&&b&&h===`multiple`&&F.length>1,L=e=>(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(u,{item:e}),(0,s.jsxs)(`span`,{className:`ds-entry__body`,children:[(0,s.jsx)(`span`,{className:`ds-entry__title`,children:e.title}),e.subtitle&&(0,s.jsx)(`span`,{className:`ds-entry__subtitle`,children:e.subtitle})]})]});return(0,s.jsxs)(`div`,{className:c(`ds-entry-picker`,S),children:[(0,s.jsxs)(`div`,{className:`ds-entry-picker__head`,children:[(0,s.jsx)(`span`,{className:`ds-entry-picker__label`,children:_}),(0,s.jsx)(r.Badge,{shape:`count`,children:T.length})]}),F.length===0?(0,s.jsx)(`p`,{className:`ds-entry-picker__empty`,children:v}):I?(0,s.jsx)(a.SortableList,{items:T,onReorder:N,renderDragOverlay:e=>{let t=A.get(e);return t?(0,s.jsx)(`div`,{className:`ds-entry`,children:L(t)}):null},children:F.map(e=>(0,s.jsx)(a.SortableListItem,{id:e.id,label:e.title,action:(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:x,onClick:()=>N(T.filter(t=>t!==e.id))}),children:(0,s.jsx)(`div`,{className:`ds-entry`,children:L(e)})},e.id))}):(0,s.jsx)(`ul`,{className:`ds-entry-picker__list`,children:F.map(e=>(0,s.jsxs)(`li`,{className:`ds-entry-picker__row`,children:[(0,s.jsx)(`div`,{className:`ds-entry`,children:L(e)}),(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:x,onClick:()=>N(T.filter(t=>t!==e.id))})]},e.id))}),(0,s.jsxs)(`div`,{className:`ds-entry-picker__actions`,children:[(0,s.jsx)(t.Button,{variant:`neutral`,size:`sm`,iconStart:`plus`,isDisabled:x,onClick:()=>D(!0),children:y}),T.length>0&&(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isDisabled:x,onClick:()=>N([]),children:`Clear`})]}),(0,s.jsxs)(n.Modal,{isOpen:E,onClose:()=>D(!1),title:y,description:h===`single`?`Choose one entry.`:g===void 0?`Choose as many entries as you need.`:`Choose up to ${g} entries.`,footer:(0,s.jsx)(t.Button,{variant:`primary`,onClick:()=>D(!1),children:`Done`}),children:[(0,s.jsx)(`div`,{className:`ds-entry-picker__search`,children:(0,s.jsx)(i.SearchField,{value:O,placeholder:`Search entries`,onChange:e=>k(e.target.value),onClear:()=>k(``)})}),(0,s.jsxs)(`ul`,{className:`ds-entry-picker__results`,children:[j.map(t=>{let n=T.includes(t.id),r=x||t.isDisabled||!n&&M;return(0,s.jsx)(`li`,{children:(0,s.jsxs)(`button`,{type:`button`,className:`ds-entry-picker__result`,"aria-pressed":n,disabled:r||void 0,onClick:()=>P(t.id),children:[(0,s.jsx)(`div`,{className:`ds-entry`,children:L(t)}),n&&(0,s.jsx)(e.t,{name:`check`,size:20})]})},t.id)}),j.length===0&&(0,s.jsxs)(`li`,{className:`ds-entry-picker__no-results`,children:[`No entries match “`,O,`”.`]})]})]})]})}exports.EntryPicker=d;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs"),n=require("../Modal/index.cjs"),r=require("../Badge/index.cjs"),i=require("../SearchField/index.cjs"),a=require("../SortableList/index.cjs");let o=require("react"),s=require("react/jsx-runtime");function c(...e){return e.filter(Boolean).join(` `)}function l(e,t){return!t||[e.title,e.subtitle,...e.keywords??[]].filter(Boolean).join(` `).toLowerCase().includes(t.toLowerCase())}function u({item:t}){return(0,s.jsx)(`span`,{className:`ds-entry__thumb`,children:t.imageUrl?(0,s.jsx)(`img`,{src:t.imageUrl,alt:``,loading:`lazy`}):(0,s.jsx)(e.t,{name:`file-text`,size:20})})}function d({items:d,value:f,defaultValue:p=[],onValueChange:m,mode:h=`multiple`,max:g,label:_=`Entries`,emptyLabel:v=`Nothing selected yet.`,addLabel:y=`Choose entries`,isReorderable:b=!0,isDisabled:x=!1,className:S}){let[C,w]=(0,o.useState)(p),T=f??C,[E,D]=(0,o.useState)(!1),[O,k]=(0,o.useState)(``),A=(0,o.useMemo)(()=>new Map(d.map(e=>[e.id,e])),[d]),j=(0,o.useMemo)(()=>d.filter(e=>l(e,O)),[d,O]),M=h===`multiple`&&g!==void 0&&T.length>=g,N=e=>{x||(f===void 0&&w(e),m?.(e))},P=e=>{h===`single`?(N(T[0]===e?[]:[e]),D(!1)):T.includes(e)?N(T.filter(t=>t!==e)):M||N([...T,e])},F=T.map(e=>A.get(e)??{id:e,title:e}),I=!x&&b&&h===`multiple`&&F.length>1,L=e=>(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(u,{item:e}),(0,s.jsxs)(`span`,{className:`ds-entry__body`,children:[(0,s.jsx)(`span`,{className:`ds-entry__title`,children:e.title}),e.subtitle&&(0,s.jsx)(`span`,{className:`ds-entry__subtitle`,children:e.subtitle})]})]});return(0,s.jsxs)(`div`,{className:c(`ds-entry-picker`,S),children:[(0,s.jsxs)(`div`,{className:`ds-entry-picker__head`,children:[(0,s.jsx)(`span`,{className:`ds-entry-picker__label`,children:_}),(0,s.jsx)(r.Badge,{shape:`count`,children:T.length})]}),F.length===0?(0,s.jsx)(`p`,{className:`ds-entry-picker__empty`,children:v}):I?(0,s.jsx)(a.SortableList,{items:T,onReorder:N,renderDragOverlay:e=>{let t=A.get(e);return t?(0,s.jsx)(`div`,{className:`ds-entry`,children:L(t)}):null},children:F.map(e=>(0,s.jsx)(a.SortableListItem,{id:e.id,label:e.title,action:(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:x,onClick:()=>N(T.filter(t=>t!==e.id))}),children:(0,s.jsx)(`div`,{className:`ds-entry`,children:L(e)})},e.id))}):(0,s.jsx)(`ul`,{className:`ds-entry-picker__list`,children:F.map(e=>(0,s.jsxs)(`li`,{className:`ds-entry-picker__row`,children:[(0,s.jsx)(`div`,{className:`ds-entry`,children:L(e)}),(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:x,onClick:()=>N(T.filter(t=>t!==e.id))})]},e.id))}),(0,s.jsxs)(`div`,{className:`ds-entry-picker__actions`,children:[(0,s.jsx)(t.Button,{variant:`neutral`,size:`sm`,iconStart:`plus`,isDisabled:x,onClick:()=>D(!0),children:y}),T.length>0&&(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isDisabled:x,onClick:()=>N([]),children:`Clear`})]}),(0,s.jsxs)(n.Modal,{isOpen:E,onClose:()=>D(!1),title:y,description:h===`single`?`Choose one entry.`:g===void 0?`Choose as many entries as you need.`:`Choose up to ${g} entries.`,footer:(0,s.jsx)(t.Button,{variant:`primary`,onClick:()=>D(!1),children:`Done`}),children:[(0,s.jsx)(`div`,{className:`ds-entry-picker__search`,children:(0,s.jsx)(i.SearchField,{value:O,placeholder:`Search entries`,onChange:e=>k(e.target.value),onClear:()=>k(``)})}),(0,s.jsxs)(`ul`,{className:`ds-entry-picker__results`,children:[j.map(n=>{let r=T.includes(n.id),i=x||n.isDisabled||!r&&M;return(0,s.jsx)(`li`,{children:(0,s.jsxs)(t.Button,{variant:r?`active`:`simple`,size:`lg`,className:`ds-entry-picker__result`,"aria-pressed":r,isDisabled:!!i,onClick:()=>P(n.id),children:[(0,s.jsx)(`span`,{className:`ds-entry`,children:L(n)}),r&&(0,s.jsx)(e.t,{name:`check`,size:20})]})},n.id)}),j.length===0&&(0,s.jsxs)(`li`,{className:`ds-entry-picker__no-results`,children:[`No entries match “`,O,`”.`]})]})]})]})}exports.EntryPicker=d;
 //# sourceMappingURL=index.cjs.map

package/dist/components/EntryPicker/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["Icon","useState","useMemo","_Fragment","Badge","SortableList","SortableListItem","Button","Modal","SearchField","require_Icon","require_components_Button_index","require_components_Modal_index","require_components_Badge_index","require_components_SearchField_index","require_components_SortableList_index","react","react_jsx_runtime","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","emptyLabel","addLabel","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n  id: string;\n  title: string;\n  /** Second line — a content type, a path, a file size. */\n  subtitle?: string;\n  /** Main image: an asset thumbnail, or the entry's hero. */\n  imageUrl?: string;\n  /** Words the search matches on top of the title and subtitle. */\n  keywords?: string[];\n  isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n  items: EntryItem[];\n  /** Selected ids, in the order they will be stored. */\n  value?: string[];\n  defaultValue?: string[];\n  onValueChange?: (value: string[]) => void;\n  mode?: EntryPickerMode;\n  /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n  max?: number;\n  label?: string;\n  /** Copy shown when nothing is picked yet. */\n  emptyLabel?: string;\n  addLabel?: string;\n  /** Multiple selections are reorderable by default — the stored order is the shown order. */\n  isReorderable?: boolean;\n  isDisabled?: boolean;\n  className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n  if (!query) return true;\n  const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n    .filter(Boolean)\n    .join(\" \")\n    .toLowerCase();\n  return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n  return (\n    <span className=\"ds-entry__thumb\">\n      {item.imageUrl ? (\n        <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n      ) : (\n        <Icon name=\"file-text\" size={20} />\n      )}\n    </span>\n  );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n  items,\n  value,\n  defaultValue = [],\n  onValueChange,\n  mode = \"multiple\",\n  max,\n  label = \"Entries\",\n  emptyLabel = \"Nothing selected yet.\",\n  addLabel = \"Choose entries\",\n  isReorderable = true,\n  isDisabled = false,\n  className,\n}: EntryPickerProps) {\n  const [internal, setInternal] = useState<string[]>(defaultValue);\n  const selected = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [query, setQuery] = useState(\"\");\n\n  const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n  const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n  const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n  const commit = (next: string[]) => {\n    if (isDisabled) return;\n    if (value === undefined) setInternal(next);\n    onValueChange?.(next);\n  };\n\n  const toggle = (id: string) => {\n    if (mode === \"single\") {\n      commit(selected[0] === id ? [] : [id]);\n      setOpen(false);\n      return;\n    }\n    if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n    else if (!atMax) commit([...selected, id]);\n  };\n\n  const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n  const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n  const row = (item: EntryItem): ReactNode => (\n    <>\n      <Thumb item={item} />\n      <span className=\"ds-entry__body\">\n        <span className=\"ds-entry__title\">{item.title}</span>\n        {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div className={cx(\"ds-entry-picker\", className)}>\n      <div className=\"ds-entry-picker__head\">\n        <span className=\"ds-entry-picker__label\">{label}</span>\n        <Badge shape=\"count\">{selected.length}</Badge>\n      </div>\n\n      {chosen.length === 0 ? (\n        <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n      ) : canReorder ? (\n        <SortableList\n          items={selected}\n          onReorder={commit}\n          renderDragOverlay={(id) => {\n            const item = byId.get(id);\n            return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n          }}\n        >\n          {chosen.map((item) => (\n            <SortableListItem\n              key={item.id}\n              id={item.id}\n              label={item.title}\n              action={\n                <Button\n                  variant=\"simple\"\n                  size=\"sm\"\n                  isIconOnly\n                  iconStart=\"x\"\n                  aria-label={`Remove ${item.title}`}\n                  isDisabled={isDisabled}\n                  onClick={() => commit(selected.filter((id) => id !== item.id))}\n                />\n              }\n            >\n              <div className=\"ds-entry\">{row(item)}</div>\n            </SortableListItem>\n          ))}\n        </SortableList>\n      ) : (\n        <ul className=\"ds-entry-picker__list\">\n          {chosen.map((item) => (\n            <li key={item.id} className=\"ds-entry-picker__row\">\n              <div className=\"ds-entry\">{row(item)}</div>\n              <Button\n                variant=\"simple\"\n                size=\"sm\"\n                isIconOnly\n                iconStart=\"x\"\n                aria-label={`Remove ${item.title}`}\n                isDisabled={isDisabled}\n                onClick={() => commit(selected.filter((id) => id !== item.id))}\n              />\n            </li>\n          ))}\n        </ul>\n      )}\n\n      <div className=\"ds-entry-picker__actions\">\n        <Button\n          variant=\"neutral\"\n          size=\"sm\"\n          iconStart=\"plus\"\n          isDisabled={isDisabled}\n          onClick={() => setOpen(true)}\n        >\n          {addLabel}\n        </Button>\n        {selected.length > 0 && (\n          <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n            Clear\n          </Button>\n        )}\n      </div>\n\n      <Modal\n        isOpen={isOpen}\n        onClose={() => setOpen(false)}\n        title={addLabel}\n        description={\n          mode === \"single\"\n            ? \"Choose one entry.\"\n            : max !== undefined\n              ? `Choose up to ${max} entries.`\n              : \"Choose as many entries as you need.\"\n        }\n        footer={\n          <Button variant=\"primary\" onClick={() => setOpen(false)}>\n            Done\n          </Button>\n        }\n      >\n        <div className=\"ds-entry-picker__search\">\n          <SearchField\n            value={query}\n            placeholder=\"Search entries\"\n            onChange={(event) => setQuery(event.target.value)}\n            onClear={() => setQuery(\"\")}\n          />\n        </div>\n        <ul className=\"ds-entry-picker__results\">\n          {results.map((item) => {\n            const isSelected = selected.includes(item.id);\n            const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n            return (\n              <li key={item.id}>\n                <button\n                  type=\"button\"\n                  className=\"ds-entry-picker__result\"\n                  aria-pressed={isSelected}\n                  disabled={isBlocked || undefined}\n                  onClick={() => toggle(item.id)}\n                >\n                  <div className=\"ds-entry\">{row(item)}</div>\n                  {isSelected && <Icon name=\"check\" size={20} />}\n                </button>\n              </li>\n            );\n          })}\n          {results.length === 0 && (\n            <li className=\"ds-entry-picker__no-results\">No entries match “{query}”.</li>\n          )}\n        </ul>\n      </Modal>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["Icon","useState","useMemo","_Fragment","Badge","SortableList","SortableListItem","Button","Modal","SearchField","require_Icon","require_components_Button_index","require_components_Modal_index","require_components_Badge_index","require_components_SearchField_index","require_components_SortableList_index","react","react_jsx_runtime","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","emptyLabel","addLabel","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n  id: string;\n  title: string;\n  /** Second line — a content type, a path, a file size. */\n  subtitle?: string;\n  /** Main image: an asset thumbnail, or the entry's hero. */\n  imageUrl?: string;\n  /** Words the search matches on top of the title and subtitle. */\n  keywords?: string[];\n  isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n  items: EntryItem[];\n  /** Selected ids, in the order they will be stored. */\n  value?: string[];\n  defaultValue?: string[];\n  onValueChange?: (value: string[]) => void;\n  mode?: EntryPickerMode;\n  /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n  max?: number;\n  label?: string;\n  /** Copy shown when nothing is picked yet. */\n  emptyLabel?: string;\n  addLabel?: string;\n  /** Multiple selections are reorderable by default — the stored order is the shown order. */\n  isReorderable?: boolean;\n  isDisabled?: boolean;\n  className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n  if (!query) return true;\n  const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n    .filter(Boolean)\n    .join(\" \")\n    .toLowerCase();\n  return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n  return (\n    <span className=\"ds-entry__thumb\">\n      {item.imageUrl ? (\n        <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n      ) : (\n        <Icon name=\"file-text\" size={20} />\n      )}\n    </span>\n  );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n  items,\n  value,\n  defaultValue = [],\n  onValueChange,\n  mode = \"multiple\",\n  max,\n  label = \"Entries\",\n  emptyLabel = \"Nothing selected yet.\",\n  addLabel = \"Choose entries\",\n  isReorderable = true,\n  isDisabled = false,\n  className,\n}: EntryPickerProps) {\n  const [internal, setInternal] = useState<string[]>(defaultValue);\n  const selected = value ?? internal;\n  const [isOpen, setOpen] = useState(false);\n  const [query, setQuery] = useState(\"\");\n\n  const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n  const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n  const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n  const commit = (next: string[]) => {\n    if (isDisabled) return;\n    if (value === undefined) setInternal(next);\n    onValueChange?.(next);\n  };\n\n  const toggle = (id: string) => {\n    if (mode === \"single\") {\n      commit(selected[0] === id ? [] : [id]);\n      setOpen(false);\n      return;\n    }\n    if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n    else if (!atMax) commit([...selected, id]);\n  };\n\n  const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n  const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n  const row = (item: EntryItem): ReactNode => (\n    <>\n      <Thumb item={item} />\n      <span className=\"ds-entry__body\">\n        <span className=\"ds-entry__title\">{item.title}</span>\n        {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div className={cx(\"ds-entry-picker\", className)}>\n      <div className=\"ds-entry-picker__head\">\n        <span className=\"ds-entry-picker__label\">{label}</span>\n        <Badge shape=\"count\">{selected.length}</Badge>\n      </div>\n\n      {chosen.length === 0 ? (\n        <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n      ) : canReorder ? (\n        <SortableList\n          items={selected}\n          onReorder={commit}\n          renderDragOverlay={(id) => {\n            const item = byId.get(id);\n            return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n          }}\n        >\n          {chosen.map((item) => (\n            <SortableListItem\n              key={item.id}\n              id={item.id}\n              label={item.title}\n              action={\n                <Button\n                  variant=\"simple\"\n                  size=\"sm\"\n                  isIconOnly\n                  iconStart=\"x\"\n                  aria-label={`Remove ${item.title}`}\n                  isDisabled={isDisabled}\n                  onClick={() => commit(selected.filter((id) => id !== item.id))}\n                />\n              }\n            >\n              <div className=\"ds-entry\">{row(item)}</div>\n            </SortableListItem>\n          ))}\n        </SortableList>\n      ) : (\n        <ul className=\"ds-entry-picker__list\">\n          {chosen.map((item) => (\n            <li key={item.id} className=\"ds-entry-picker__row\">\n              <div className=\"ds-entry\">{row(item)}</div>\n              <Button\n                variant=\"simple\"\n                size=\"sm\"\n                isIconOnly\n                iconStart=\"x\"\n                aria-label={`Remove ${item.title}`}\n                isDisabled={isDisabled}\n                onClick={() => commit(selected.filter((id) => id !== item.id))}\n              />\n            </li>\n          ))}\n        </ul>\n      )}\n\n      <div className=\"ds-entry-picker__actions\">\n        <Button\n          variant=\"neutral\"\n          size=\"sm\"\n          iconStart=\"plus\"\n          isDisabled={isDisabled}\n          onClick={() => setOpen(true)}\n        >\n          {addLabel}\n        </Button>\n        {selected.length > 0 && (\n          <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n            Clear\n          </Button>\n        )}\n      </div>\n\n      <Modal\n        isOpen={isOpen}\n        onClose={() => setOpen(false)}\n        title={addLabel}\n        description={\n          mode === \"single\"\n            ? \"Choose one entry.\"\n            : max !== undefined\n              ? `Choose up to ${max} entries.`\n              : \"Choose as many entries as you need.\"\n        }\n        footer={\n          <Button variant=\"primary\" onClick={() => setOpen(false)}>\n            Done\n          </Button>\n        }\n      >\n        <div className=\"ds-entry-picker__search\">\n          <SearchField\n            value={query}\n            placeholder=\"Search entries\"\n            onChange={(event) => setQuery(event.target.value)}\n            onClear={() => setQuery(\"\")}\n          />\n        </div>\n        <ul className=\"ds-entry-picker__results\">\n          {results.map((item) => {\n            const isSelected = selected.includes(item.id);\n            const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n            return (\n              <li key={item.id}>\n                <Button\n                  variant={isSelected ? \"active\" : \"simple\"}\n                  size=\"lg\"\n                  className=\"ds-entry-picker__result\"\n                  aria-pressed={isSelected}\n                  isDisabled={Boolean(isBlocked)}\n                  onClick={() => toggle(item.id)}\n                >\n                  <span className=\"ds-entry\">{row(item)}</span>\n                  {isSelected && <Icon name=\"check\" size={20} />}\n                </Button>\n              </li>\n            );\n          })}\n          {results.length === 0 && (\n            <li className=\"ds-entry-picker__no-results\">No entries match “{query}”.</li>\n          )}\n        </ul>\n      </Modal>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/EntryPicker/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAqKlB"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}

package/dist/components/EntryPicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAqKlB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}

package/dist/components/EntryPicker/index.js

@@ -146,22 +146,23 @@ function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y
 					})
 				}), /* @__PURE__ */ d("ul", {
 					className: "ds-entry-picker__results",
-					children: [F.map((t) => {
-						let n = k.includes(t.id), r = T || t.isDisabled || !n && I;
-						return /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d("button", {
-							type: "button",
+					children: [F.map((n) => {
+						let r = k.includes(n.id), i = T || n.isDisabled || !r && I;
+						return /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d(t, {
+							variant: r ? "active" : "simple",
+							size: "lg",
 							className: "ds-entry-picker__result",
-							"aria-pressed": n,
-							disabled: r || void 0,
-							onClick: () => R(t.id),
-							children: [/* @__PURE__ */ u("div", {
+							"aria-pressed": r,
+							isDisabled: !!i,
+							onClick: () => R(n.id),
+							children: [/* @__PURE__ */ u("span", {
 								className: "ds-entry",
-								children: V(t)
-							}), n && /* @__PURE__ */ u(e, {
+								children: V(n)
+							}), r && /* @__PURE__ */ u(e, {
 								name: "check",
 								size: 20
 							})]
-						}) }, t.id);
+						}) }, n.id);
 					}), F.length === 0 && /* @__PURE__ */ d("li", {
 						className: "ds-entry-picker__no-results",
 						children: [