@namroodinc/liquid-editorial 0.1.6 → 0.1.8

package/dist/components/EntryPicker/style.css

@@ -119,39 +119,12 @@
     list-style: none;
   }
 
-  .ds-entry-picker__result {
-    display: flex;
-    align-items: center;
+  .ds-entry-picker__result.ds-button {
     justify-content: space-between;
-    gap: var(--space-3);
     inline-size: 100%;
-    padding: var(--space-2) var(--space-3);
-    border: var(--control-border-width) solid transparent;
-    border-radius: var(--radius-md);
-    background: transparent;
-    color: var(--color-text);
+    height: auto;
+    min-block-size: var(--field-height-lg);
     text-align: start;
-    cursor: pointer;
-    transition: background-color var(--duration-fast) var(--ease-standard);
-  }
-
-  .ds-entry-picker__result:hover:not(:disabled) {
-    background: var(--field-hover);
-  }
-
-  .ds-entry-picker__result:focus-visible {
-    outline: var(--control-border-width) solid var(--color-focus);
-    outline-offset: 2px;
-  }
-
-  .ds-entry-picker__result[aria-pressed="true"] {
-    background: var(--color-primary-soft);
-    box-shadow: inset var(--rail-width) 0 0 0 var(--rail-color);
-  }
-
-  .ds-entry-picker__result:disabled {
-    opacity: 45%;
-    cursor: not-allowed;
   }
 
   .ds-entry-picker__no-results {

package/dist/components/Field/style.css

@@ -11,6 +11,11 @@
     transition: background-color var(--duration-fast) var(--ease-standard);
   }
 
+  .ds-button.ds-field-skin {
+    font-weight: var(--font-weight-regular);
+    line-height: normal;
+  }
+
   .ds-field-skin::placeholder {
     color: var(--color-text-muted);
   }
@@ -43,19 +48,22 @@
     cursor: default;
   }
 
-  input.ds-field-skin[data-size="sm"] {
+  input.ds-field-skin[data-size="sm"],
+  .ds-button.ds-field-skin[data-size="sm"] {
     block-size: var(--field-height-sm);
     padding: 0 10px;
     font-size: var(--field-font-size-sm);
   }
 
-  input.ds-field-skin[data-size="md"] {
+  input.ds-field-skin[data-size="md"],
+  .ds-button.ds-field-skin[data-size="md"] {
     block-size: var(--field-height-md);
     padding: 0 10px;
     font-size: var(--field-font-size-md);
   }
 
-  input.ds-field-skin[data-size="lg"] {
+  input.ds-field-skin[data-size="lg"],
+  .ds-button.ds-field-skin[data-size="lg"] {
     block-size: var(--field-height-lg);
     padding: 0 10px;
     font-size: var(--field-font-size-md);

package/dist/components/Menu/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Popover/index.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(...e){return e.filter(Boolean).join(` `)}var a=(0,n.forwardRef)(function({trigger:e,align:a=`start`,className:o,children:s,onClick:c,onKeyDown:l,...u},d){let[f,p]=(0,n.useState)(!1),m=(0,n.useRef)(null),h=(0,n.useRef)(null),g=(0,n.useRef)(null),_=(0,n.useId)(),v=(0,n.useCallback)(()=>p(!1),[]),y=(0,n.useCallback)(()=>{(h.current?.querySelector(`button, [href], [tabindex]`)??h.current)?.focus()},[]);(0,n.useEffect)(()=>{typeof d==`function`?d(g.current):d&&(d.current=g.current)},[f,d]),(0,n.useEffect)(()=>{if(!f)return;let e=e=>{let t=e.target;!m.current?.contains(t)&&!g.current?.contains(t)&&v()},t=e=>{e.key===`Escape`&&(v(),y())};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),g.current?.querySelector(`button:not(:disabled)`)?.focus(),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[f,v,y]);let b=e=>{if(e.key!==`ArrowDown`&&e.key!==`ArrowUp`)return;e.preventDefault();let t=Array.from(g.current?.querySelectorAll(`button:not(:disabled)`)??[]);if(t.length===0)return;let n=t.indexOf(document.activeElement);(e.key===`ArrowDown`?t[(n+1)%t.length]:t[(n-1+t.length)%t.length])?.focus()};return(0,r.jsxs)(`div`,{className:`ds-menu-root`,ref:m,children:[(0,r.jsx)(`span`,{ref:h,className:`ds-menu-root`,children:e({"aria-haspopup":`menu`,"aria-expanded":f,"aria-controls":f?_:void 0,onClick:()=>p(e=>!e)})}),(0,r.jsx)(t.Popover,{anchorRef:h,isOpen:f,align:a,offset:8,id:_,role:`menu`,className:i(`ds-surface-raised`,`ds-menu`,o),panelRef:g,children:(0,r.jsx)(`div`,{className:`ds-menu__list`,onKeyDown:e=>{l?.(e),e.defaultPrevented||b(e)},onClick:e=>{c?.(e),e.defaultPrevented||(v(),y())},...u,children:s})})]})}),o=(0,n.forwardRef)(function({icon:t,tone:n=`neutral`,shortcut:a,isDisabled:o=!1,className:s,children:c,...l},u){return(0,r.jsxs)(`button`,{ref:u,type:`button`,role:`menuitem`,disabled:o,"data-tone":n===`danger`?`danger`:void 0,className:i(`ds-menu-item`,s),...l,children:[t&&(0,r.jsx)(e.t,{name:t,size:16}),c,a&&(0,r.jsx)(`span`,{className:`ds-menu-item__shortcut`,children:a})]})});function s(){return(0,r.jsx)(`div`,{className:`ds-menu-separator`,role:`separator`})}function c({children:e}){return(0,r.jsx)(`div`,{className:`ds-menu-label`,children:e})}exports.Menu=a,exports.MenuItem=o,exports.MenuLabel=c,exports.MenuSeparator=s;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../Button/index.cjs"),t=require("../Popover/index.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(...e){return e.filter(Boolean).join(` `)}var a=(0,n.forwardRef)(function({trigger:e,align:a=`start`,className:o,children:s,onClick:c,onKeyDown:l,...u},d){let[f,p]=(0,n.useState)(!1),m=(0,n.useRef)(null),h=(0,n.useRef)(null),g=(0,n.useRef)(null),_=(0,n.useId)(),v=(0,n.useCallback)(()=>p(!1),[]),y=(0,n.useCallback)(()=>{(h.current?.querySelector(`button, [href], [tabindex]`)??h.current)?.focus()},[]);(0,n.useEffect)(()=>{typeof d==`function`?d(g.current):d&&(d.current=g.current)},[f,d]),(0,n.useEffect)(()=>{if(!f)return;let e=e=>{let t=e.target;!m.current?.contains(t)&&!g.current?.contains(t)&&v()},t=e=>{e.key===`Escape`&&(e.preventDefault(),v(),y())};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),g.current?.querySelector(`button:not(:disabled)`)?.focus(),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[f,v,y]);let b=e=>{if(e.key!==`ArrowDown`&&e.key!==`ArrowUp`)return;e.preventDefault();let t=Array.from(g.current?.querySelectorAll(`button:not(:disabled)`)??[]);if(t.length===0)return;let n=t.indexOf(document.activeElement);(e.key===`ArrowDown`?t[(n+1)%t.length]:t[(n-1+t.length)%t.length])?.focus()};return(0,r.jsxs)(`div`,{className:`ds-menu-root`,ref:m,children:[(0,r.jsx)(`span`,{ref:h,className:`ds-menu-root`,children:e({"aria-haspopup":`menu`,"aria-expanded":f,"aria-controls":f?_:void 0,onClick:()=>p(e=>!e)})}),(0,r.jsx)(t.Popover,{anchorRef:h,isOpen:f,align:a,offset:8,id:_,role:`menu`,className:i(`ds-surface-raised`,`ds-menu`,o),panelRef:g,children:(0,r.jsx)(`div`,{className:`ds-menu__list`,onKeyDown:e=>{l?.(e),e.defaultPrevented||b(e)},onClick:e=>{c?.(e),e.defaultPrevented||(v(),y())},...u,children:s})})]})}),o=(0,n.forwardRef)(function({icon:t,tone:n=`neutral`,shortcut:a,isDisabled:o=!1,className:s,children:c,...l},u){return(0,r.jsxs)(e.Button,{ref:u,variant:n===`danger`?`danger`:`simple`,size:`sm`,iconStart:t,role:`menuitem`,isDisabled:o,"data-tone":n===`danger`?`danger`:void 0,className:i(`ds-menu-item`,s),...l,children:[c,a&&(0,r.jsx)(`span`,{className:`ds-menu-item__shortcut`,children:a})]})});function s(){return(0,r.jsx)(`div`,{className:`ds-menu-separator`,role:`separator`})}function c({children:e}){return(0,r.jsx)(`div`,{className:`ds-menu-label`,children:e})}exports.Menu=a,exports.MenuItem=o,exports.MenuLabel=c,exports.MenuSeparator=s;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useId","useCallback","Popover","Icon","require_Icon","require_components_Popover_index","react","react_jsx_runtime","cx","parts","Menu","rest","isOpen","setOpen","rootRef","triggerRef","listRef","menuId","close","restoreTriggerFocus","ref","onPointerDown","target","event","onKeyDown","onListKeyDown","items","index","trigger","open","className","onClick","MenuItem","isDisabled","tone","icon","children","shortcut","MenuSeparator","MenuLabel"],"sources":["../../../src/components/Menu/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Popover } from \"../Popover\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport type MenuAlign = \"start\" | \"end\";\n\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /** Receives the props that open the menu — usually a `Button`. */\n  trigger: (props: {\n    \"aria-haspopup\": \"menu\";\n    \"aria-expanded\": boolean;\n    \"aria-controls\"?: string;\n    onClick: () => void;\n  }) => ReactElement;\n  align?: MenuAlign;\n  /** Menu items, labels and separators. */\n  children: ReactNode;\n}\n\n/**\n * A short list of actions attached to a control. Closes on Escape, on outside\n * click and after any item is chosen; arrow keys walk the items.\n */\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu(\n  { trigger, align = \"start\", className, children, onClick, onKeyDown, ...rest },\n  ref,\n) {\n  const [isOpen, setOpen] = useState(false);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const menuId = useId();\n\n  const close = useCallback(() => setOpen(false), []);\n  const restoreTriggerFocus = useCallback(() => {\n    const focusTarget =\n      triggerRef.current?.querySelector<HTMLElement>(\"button, [href], [tabindex]\") ??\n      triggerRef.current;\n    focusTarget?.focus();\n  }, []);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") ref(listRef.current);\n    else if (ref) ref.current = listRef.current;\n  }, [isOpen, ref]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) close();\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        close();\n        restoreTriggerFocus();\n      }\n    };\n\n    document.addEventListener(\"mousedown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    listRef.current?.querySelector<HTMLButtonElement>(\"button:not(:disabled)\")?.focus();\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [isOpen, close, restoreTriggerFocus]);\n\n  const onListKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key !== \"ArrowDown\" && event.key !== \"ArrowUp\") return;\n    event.preventDefault();\n    const items = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\"button:not(:disabled)\") ?? [],\n    );\n    if (items.length === 0) return;\n    const index = items.indexOf(document.activeElement as HTMLButtonElement);\n    const next =\n      event.key === \"ArrowDown\"\n        ? items[(index + 1) % items.length]\n        : items[(index - 1 + items.length) % items.length];\n    next?.focus();\n  };\n\n  return (\n    <div className=\"ds-menu-root\" ref={rootRef}>\n      <span ref={triggerRef} className=\"ds-menu-root\">\n        {trigger({\n          \"aria-haspopup\": \"menu\",\n          \"aria-expanded\": isOpen,\n          \"aria-controls\": isOpen ? menuId : undefined,\n          onClick: () => setOpen((open) => !open),\n        })}\n      </span>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isOpen}\n        align={align}\n        offset={8}\n        id={menuId}\n        role=\"menu\"\n        className={cx(\"ds-surface-raised\", \"ds-menu\", className)}\n        panelRef={listRef}\n      >\n        <div\n          className=\"ds-menu__list\"\n          onKeyDown={(event) => {\n            onKeyDown?.(event);\n            if (!event.defaultPrevented) onListKeyDown(event);\n          }}\n          onClick={(event) => {\n            onClick?.(event);\n            if (!event.defaultPrevented) {\n              close();\n              restoreTriggerFocus();\n            }\n          }}\n          {...rest}\n        >\n          {children}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n\nexport type MenuItemTone = \"neutral\" | \"danger\";\n\nexport interface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n  icon?: IconName;\n  tone?: MenuItemTone;\n  /** Rendered right-aligned and muted, e.g. \"⌘K\". */\n  shortcut?: string;\n  isDisabled?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  { icon, tone = \"neutral\", shortcut, isDisabled = false, className, children, ...rest },\n  ref,\n) {\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      role=\"menuitem\"\n      disabled={isDisabled}\n      data-tone={tone === \"danger\" ? \"danger\" : undefined}\n      className={cx(\"ds-menu-item\", className)}\n      {...rest}\n    >\n      {icon && <Icon name={icon} size={16} />}\n      {children}\n      {shortcut && <span className=\"ds-menu-item__shortcut\">{shortcut}</span>}\n    </button>\n  );\n});\n\nexport function MenuSeparator() {\n  return <div className=\"ds-menu-separator\" role=\"separator\" />;\n}\n\nexport function MenuLabel({ children }: { children: ReactNode }) {\n  return <div className=\"ds-menu-label\">{children}</div>;\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useId","useCallback","Popover","Button","require_components_Button_index","require_components_Popover_index","react","react_jsx_runtime","cx","parts","Menu","rest","isOpen","setOpen","rootRef","triggerRef","listRef","menuId","close","restoreTriggerFocus","ref","onPointerDown","target","event","onKeyDown","onListKeyDown","items","index","trigger","open","className","onClick","MenuItem","tone","icon","children","shortcut","MenuSeparator","MenuLabel"],"sources":["../../../src/components/Menu/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { Button } from \"../Button\";\nimport { Popover } from \"../Popover\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport type MenuAlign = \"start\" | \"end\";\n\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /** Receives the props that open the menu — usually a `Button`. */\n  trigger: (props: {\n    \"aria-haspopup\": \"menu\";\n    \"aria-expanded\": boolean;\n    \"aria-controls\"?: string;\n    onClick: () => void;\n  }) => ReactElement;\n  align?: MenuAlign;\n  /** Menu items, labels and separators. */\n  children: ReactNode;\n}\n\n/**\n * A short list of actions attached to a control. Closes on Escape, on outside\n * click and after any item is chosen; arrow keys walk the items.\n */\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu(\n  { trigger, align = \"start\", className, children, onClick, onKeyDown, ...rest },\n  ref,\n) {\n  const [isOpen, setOpen] = useState(false);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const menuId = useId();\n\n  const close = useCallback(() => setOpen(false), []);\n  const restoreTriggerFocus = useCallback(() => {\n    const focusTarget =\n      triggerRef.current?.querySelector<HTMLElement>(\"button, [href], [tabindex]\") ??\n      triggerRef.current;\n    focusTarget?.focus();\n  }, []);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") ref(listRef.current);\n    else if (ref) ref.current = listRef.current;\n  }, [isOpen, ref]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) close();\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close();\n        restoreTriggerFocus();\n      }\n    };\n\n    document.addEventListener(\"mousedown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    listRef.current?.querySelector<HTMLButtonElement>(\"button:not(:disabled)\")?.focus();\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [isOpen, close, restoreTriggerFocus]);\n\n  const onListKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key !== \"ArrowDown\" && event.key !== \"ArrowUp\") return;\n    event.preventDefault();\n    const items = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\"button:not(:disabled)\") ?? [],\n    );\n    if (items.length === 0) return;\n    const index = items.indexOf(document.activeElement as HTMLButtonElement);\n    const next =\n      event.key === \"ArrowDown\"\n        ? items[(index + 1) % items.length]\n        : items[(index - 1 + items.length) % items.length];\n    next?.focus();\n  };\n\n  return (\n    <div className=\"ds-menu-root\" ref={rootRef}>\n      <span ref={triggerRef} className=\"ds-menu-root\">\n        {trigger({\n          \"aria-haspopup\": \"menu\",\n          \"aria-expanded\": isOpen,\n          \"aria-controls\": isOpen ? menuId : undefined,\n          onClick: () => setOpen((open) => !open),\n        })}\n      </span>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isOpen}\n        align={align}\n        offset={8}\n        id={menuId}\n        role=\"menu\"\n        className={cx(\"ds-surface-raised\", \"ds-menu\", className)}\n        panelRef={listRef}\n      >\n        <div\n          className=\"ds-menu__list\"\n          onKeyDown={(event) => {\n            onKeyDown?.(event);\n            if (!event.defaultPrevented) onListKeyDown(event);\n          }}\n          onClick={(event) => {\n            onClick?.(event);\n            if (!event.defaultPrevented) {\n              close();\n              restoreTriggerFocus();\n            }\n          }}\n          {...rest}\n        >\n          {children}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n\nexport type MenuItemTone = \"neutral\" | \"danger\";\n\nexport interface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n  icon?: IconName;\n  tone?: MenuItemTone;\n  /** Rendered right-aligned and muted, e.g. \"⌘K\". */\n  shortcut?: string;\n  isDisabled?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  { icon, tone = \"neutral\", shortcut, isDisabled = false, className, children, ...rest },\n  ref,\n) {\n  return (\n    <Button\n      ref={ref}\n      variant={tone === \"danger\" ? \"danger\" : \"simple\"}\n      size=\"sm\"\n      iconStart={icon}\n      role=\"menuitem\"\n      isDisabled={isDisabled}\n      data-tone={tone === \"danger\" ? \"danger\" : undefined}\n      className={cx(\"ds-menu-item\", className)}\n      {...rest}\n    >\n      {children}\n      {shortcut && <span className=\"ds-menu-item__shortcut\">{shortcut}</span>}\n    </Button>\n  );\n});\n\nexport function MenuSeparator() {\n  return <div className=\"ds-menu-separator\" role=\"separator\" />;\n}\n\nexport function MenuLabel({ children }: { children: ReactNode }) {\n  return <div className=\"ds-menu-label\">{children}</div>;\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAMrB,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACjF,kEAAkE;IAClE,OAAO,EAAE,CAAC,KAAK,EAAE;QACf,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,OAAO,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,KAAK,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,sGAsGf,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC9F,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,6GAmBnB,CAAC;AAEH,wBAAgB,aAAa,gCAE5B;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAE9D"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAMrB,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACjF,kEAAkE;IAClE,OAAO,EAAE,CAAC,KAAK,EAAE;QACf,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,OAAO,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,KAAK,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,sGAuGf,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC9F,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,6GAoBnB,CAAC;AAEH,wBAAgB,aAAa,gCAE5B;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAE9D"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAMrB,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACjF,kEAAkE;IAClE,OAAO,EAAE,CAAC,KAAK,EAAE;QACf,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,OAAO,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,KAAK,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,sGAsGf,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC9F,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,6GAmBnB,CAAC;AAEH,wBAAgB,aAAa,gCAE5B;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAE9D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,aAAa,CAAC;AAMrB,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;AAExC,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACjF,kEAAkE;IAClE,OAAO,EAAE,CAAC,KAAK,EAAE;QACf,eAAe,EAAE,MAAM,CAAC;QACxB,eAAe,EAAE,OAAO,CAAC;QACzB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,KAAK,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,yCAAyC;IACzC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,sGAuGf,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEhD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC9F,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,6GAoBnB,CAAC;AAEH,wBAAgB,aAAa,gCAE5B;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAE9D"}

package/dist/components/Menu/index.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../chunks/Icon-CGY1FNXT.js";
+import { Button as e } from "../Button/index.js";
 import { Popover as t } from "../Popover/index.js";
 import { forwardRef as n, useCallback as r, useEffect as i, useId as a, useRef as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
@@ -18,7 +18,7 @@ var d = n(function({ trigger: e, align: n = "start", className: d, children: f,
 			let t = e.target;
 			!y.current?.contains(t) && !x.current?.contains(t) && C();
 		}, t = (e) => {
-			e.key === "Escape" && (C(), w());
+			e.key === "Escape" && (e.preventDefault(), C(), w());
 		};
 		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), x.current?.querySelector("button:not(:disabled)")?.focus(), () => {
 			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
@@ -71,25 +71,20 @@ var d = n(function({ trigger: e, align: n = "start", className: d, children: f,
 		})]
 	});
 }), f = n(function({ icon: t, tone: n = "neutral", shortcut: r, isDisabled: i = !1, className: a, children: o, ...s }, d) {
-	return /* @__PURE__ */ l("button", {
+	return /* @__PURE__ */ l(e, {
 		ref: d,
-		type: "button",
+		variant: n === "danger" ? "danger" : "simple",
+		size: "sm",
+		iconStart: t,
 		role: "menuitem",
-		disabled: i,
+		isDisabled: i,
 		"data-tone": n === "danger" ? "danger" : void 0,
 		className: u("ds-menu-item", a),
 		...s,
-		children: [
-			t && /* @__PURE__ */ c(e, {
-				name: t,
-				size: 16
-			}),
-			o,
-			r && /* @__PURE__ */ c("span", {
-				className: "ds-menu-item__shortcut",
-				children: r
-			})
-		]
+		children: [o, r && /* @__PURE__ */ c("span", {
+			className: "ds-menu-item__shortcut",
+			children: r
+		})]
 	});
 });
 function p() {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Icon","cx","parts","Menu","forwardRef","rest","isOpen","setOpen","useState","rootRef","useRef","triggerRef","listRef","menuId","useId","close","useCallback","restoreTriggerFocus","useEffect","ref","onPointerDown","target","event","onKeyDown","onListKeyDown","items","index","trigger","open","Popover","className","onClick","MenuItem","isDisabled","tone","icon","children","shortcut","MenuSeparator","MenuLabel"],"sources":["../../../src/components/Menu/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { Popover } from \"../Popover\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport type MenuAlign = \"start\" | \"end\";\n\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /** Receives the props that open the menu — usually a `Button`. */\n  trigger: (props: {\n    \"aria-haspopup\": \"menu\";\n    \"aria-expanded\": boolean;\n    \"aria-controls\"?: string;\n    onClick: () => void;\n  }) => ReactElement;\n  align?: MenuAlign;\n  /** Menu items, labels and separators. */\n  children: ReactNode;\n}\n\n/**\n * A short list of actions attached to a control. Closes on Escape, on outside\n * click and after any item is chosen; arrow keys walk the items.\n */\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu(\n  { trigger, align = \"start\", className, children, onClick, onKeyDown, ...rest },\n  ref,\n) {\n  const [isOpen, setOpen] = useState(false);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const menuId = useId();\n\n  const close = useCallback(() => setOpen(false), []);\n  const restoreTriggerFocus = useCallback(() => {\n    const focusTarget =\n      triggerRef.current?.querySelector<HTMLElement>(\"button, [href], [tabindex]\") ??\n      triggerRef.current;\n    focusTarget?.focus();\n  }, []);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") ref(listRef.current);\n    else if (ref) ref.current = listRef.current;\n  }, [isOpen, ref]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) close();\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        close();\n        restoreTriggerFocus();\n      }\n    };\n\n    document.addEventListener(\"mousedown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    listRef.current?.querySelector<HTMLButtonElement>(\"button:not(:disabled)\")?.focus();\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [isOpen, close, restoreTriggerFocus]);\n\n  const onListKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key !== \"ArrowDown\" && event.key !== \"ArrowUp\") return;\n    event.preventDefault();\n    const items = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\"button:not(:disabled)\") ?? [],\n    );\n    if (items.length === 0) return;\n    const index = items.indexOf(document.activeElement as HTMLButtonElement);\n    const next =\n      event.key === \"ArrowDown\"\n        ? items[(index + 1) % items.length]\n        : items[(index - 1 + items.length) % items.length];\n    next?.focus();\n  };\n\n  return (\n    <div className=\"ds-menu-root\" ref={rootRef}>\n      <span ref={triggerRef} className=\"ds-menu-root\">\n        {trigger({\n          \"aria-haspopup\": \"menu\",\n          \"aria-expanded\": isOpen,\n          \"aria-controls\": isOpen ? menuId : undefined,\n          onClick: () => setOpen((open) => !open),\n        })}\n      </span>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isOpen}\n        align={align}\n        offset={8}\n        id={menuId}\n        role=\"menu\"\n        className={cx(\"ds-surface-raised\", \"ds-menu\", className)}\n        panelRef={listRef}\n      >\n        <div\n          className=\"ds-menu__list\"\n          onKeyDown={(event) => {\n            onKeyDown?.(event);\n            if (!event.defaultPrevented) onListKeyDown(event);\n          }}\n          onClick={(event) => {\n            onClick?.(event);\n            if (!event.defaultPrevented) {\n              close();\n              restoreTriggerFocus();\n            }\n          }}\n          {...rest}\n        >\n          {children}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n\nexport type MenuItemTone = \"neutral\" | \"danger\";\n\nexport interface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n  icon?: IconName;\n  tone?: MenuItemTone;\n  /** Rendered right-aligned and muted, e.g. \"⌘K\". */\n  shortcut?: string;\n  isDisabled?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  { icon, tone = \"neutral\", shortcut, isDisabled = false, className, children, ...rest },\n  ref,\n) {\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      role=\"menuitem\"\n      disabled={isDisabled}\n      data-tone={tone === \"danger\" ? \"danger\" : undefined}\n      className={cx(\"ds-menu-item\", className)}\n      {...rest}\n    >\n      {icon && <Icon name={icon} size={16} />}\n      {children}\n      {shortcut && <span className=\"ds-menu-item__shortcut\">{shortcut}</span>}\n    </button>\n  );\n});\n\nexport function MenuSeparator() {\n  return <div className=\"ds-menu-separator\" role=\"separator\" />;\n}\n\nexport function MenuLabel({ children }: { children: ReactNode }) {\n  return <div className=\"ds-menu-label\">{children}</div>;\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["cx","parts","Menu","forwardRef","rest","isOpen","setOpen","useState","rootRef","useRef","triggerRef","listRef","menuId","useId","close","useCallback","restoreTriggerFocus","useEffect","ref","onPointerDown","target","event","onKeyDown","onListKeyDown","items","index","trigger","open","Popover","className","onClick","MenuItem","Button","tone","icon","children","shortcut","MenuSeparator","MenuLabel"],"sources":["../../../src/components/Menu/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type ButtonHTMLAttributes,\n  type HTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n} from \"react\";\nimport { Button } from \"../Button\";\nimport { Popover } from \"../Popover\";\nimport type { IconName } from \"../Icon/icons\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport type MenuAlign = \"start\" | \"end\";\n\nexport interface MenuProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n  /** Receives the props that open the menu — usually a `Button`. */\n  trigger: (props: {\n    \"aria-haspopup\": \"menu\";\n    \"aria-expanded\": boolean;\n    \"aria-controls\"?: string;\n    onClick: () => void;\n  }) => ReactElement;\n  align?: MenuAlign;\n  /** Menu items, labels and separators. */\n  children: ReactNode;\n}\n\n/**\n * A short list of actions attached to a control. Closes on Escape, on outside\n * click and after any item is chosen; arrow keys walk the items.\n */\nexport const Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu(\n  { trigger, align = \"start\", className, children, onClick, onKeyDown, ...rest },\n  ref,\n) {\n  const [isOpen, setOpen] = useState(false);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const listRef = useRef<HTMLDivElement | null>(null);\n  const menuId = useId();\n\n  const close = useCallback(() => setOpen(false), []);\n  const restoreTriggerFocus = useCallback(() => {\n    const focusTarget =\n      triggerRef.current?.querySelector<HTMLElement>(\"button, [href], [tabindex]\") ??\n      triggerRef.current;\n    focusTarget?.focus();\n  }, []);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") ref(listRef.current);\n    else if (ref) ref.current = listRef.current;\n  }, [isOpen, ref]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n\n    const onPointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (!rootRef.current?.contains(target) && !listRef.current?.contains(target)) close();\n    };\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close();\n        restoreTriggerFocus();\n      }\n    };\n\n    document.addEventListener(\"mousedown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    listRef.current?.querySelector<HTMLButtonElement>(\"button:not(:disabled)\")?.focus();\n\n    return () => {\n      document.removeEventListener(\"mousedown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [isOpen, close, restoreTriggerFocus]);\n\n  const onListKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key !== \"ArrowDown\" && event.key !== \"ArrowUp\") return;\n    event.preventDefault();\n    const items = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\"button:not(:disabled)\") ?? [],\n    );\n    if (items.length === 0) return;\n    const index = items.indexOf(document.activeElement as HTMLButtonElement);\n    const next =\n      event.key === \"ArrowDown\"\n        ? items[(index + 1) % items.length]\n        : items[(index - 1 + items.length) % items.length];\n    next?.focus();\n  };\n\n  return (\n    <div className=\"ds-menu-root\" ref={rootRef}>\n      <span ref={triggerRef} className=\"ds-menu-root\">\n        {trigger({\n          \"aria-haspopup\": \"menu\",\n          \"aria-expanded\": isOpen,\n          \"aria-controls\": isOpen ? menuId : undefined,\n          onClick: () => setOpen((open) => !open),\n        })}\n      </span>\n      <Popover\n        anchorRef={triggerRef}\n        isOpen={isOpen}\n        align={align}\n        offset={8}\n        id={menuId}\n        role=\"menu\"\n        className={cx(\"ds-surface-raised\", \"ds-menu\", className)}\n        panelRef={listRef}\n      >\n        <div\n          className=\"ds-menu__list\"\n          onKeyDown={(event) => {\n            onKeyDown?.(event);\n            if (!event.defaultPrevented) onListKeyDown(event);\n          }}\n          onClick={(event) => {\n            onClick?.(event);\n            if (!event.defaultPrevented) {\n              close();\n              restoreTriggerFocus();\n            }\n          }}\n          {...rest}\n        >\n          {children}\n        </div>\n      </Popover>\n    </div>\n  );\n});\n\nexport type MenuItemTone = \"neutral\" | \"danger\";\n\nexport interface MenuItemProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n  icon?: IconName;\n  tone?: MenuItemTone;\n  /** Rendered right-aligned and muted, e.g. \"⌘K\". */\n  shortcut?: string;\n  isDisabled?: boolean;\n  children?: ReactNode;\n}\n\nexport const MenuItem = forwardRef<HTMLButtonElement, MenuItemProps>(function MenuItem(\n  { icon, tone = \"neutral\", shortcut, isDisabled = false, className, children, ...rest },\n  ref,\n) {\n  return (\n    <Button\n      ref={ref}\n      variant={tone === \"danger\" ? \"danger\" : \"simple\"}\n      size=\"sm\"\n      iconStart={icon}\n      role=\"menuitem\"\n      isDisabled={isDisabled}\n      data-tone={tone === \"danger\" ? \"danger\" : undefined}\n      className={cx(\"ds-menu-item\", className)}\n      {...rest}\n    >\n      {children}\n      {shortcut && <span className=\"ds-menu-item__shortcut\">{shortcut}</span>}\n    </Button>\n  );\n});\n\nexport function MenuSeparator() {\n  return <div className=\"ds-menu-separator\" role=\"separator\" />;\n}\n\nexport function MenuLabel({ children }: { children: ReactNode }) {\n  return <div className=\"ds-menu-label\">{children}</div>;\n}\n"],"mappings":"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"}

package/dist/components/Menu/style.css

@@ -16,50 +16,12 @@
   }
 
 
-  .ds-menu-item {
-    display: flex;
-    align-items: center;
-    gap: var(--space-2);
+  .ds-menu-item.ds-button {
     inline-size: 100%;
+    height: auto;
     min-block-size: var(--field-height-sm);
-    padding: var(--space-1) var(--space-3);
-    border: var(--control-border-width) solid transparent;
-    border-radius: var(--radius-sm);
-    background: transparent;
-    color: var(--color-text);
-    font-family: var(--font-sans);
-    font-size: var(--font-size-sm);
-    font-weight: var(--font-weight-medium);
-    line-height: var(--line-height-tight);
+    justify-content: flex-start;
     text-align: start;
-    cursor: pointer;
-    transition: background-color var(--duration-fast) var(--ease-standard);
-  }
-
-  .ds-menu-item:hover:not(:disabled) {
-    background: var(--field-hover);
-  }
-
-  .ds-menu-item:active:not(:disabled) {
-    background: var(--field-pressed);
-  }
-
-  .ds-menu-item:focus-visible {
-    outline: var(--control-border-width) solid var(--color-focus);
-    outline-offset: 2px;
-  }
-
-  .ds-menu-item[data-tone="danger"] {
-    color: var(--color-danger-text);
-  }
-
-  .ds-menu-item[data-tone="danger"]:hover:not(:disabled) {
-    background: var(--color-danger-soft);
-  }
-
-  .ds-menu-item:disabled {
-    opacity: 45%;
-    cursor: not-allowed;
   }
 
   .ds-menu-item__shortcut {
@@ -70,6 +32,10 @@
     font-weight: var(--font-weight-regular);
   }
 
+  .ds-menu-item[data-tone="danger"] .ds-menu-item__shortcut {
+    color: inherit;
+  }
+
   .ds-menu-separator {
     block-size: var(--rule-width);
     margin: var(--space-1) calc(var(--space-2) * -1);

package/dist/components/Modal/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../Button/index.cjs");let t=require("react"),n=require("react/jsx-runtime"),r=require("react-dom");var i=(0,t.forwardRef)(function({isOpen:i,onClose:a,title:o,description:s,size:c=`md`,footer:l,className:u,children:d,...f},p){let m=(0,t.useRef)(null),h=(0,t.useRef)(a),g=(0,t.useId)(),_=(0,t.useId)();return(0,t.useEffect)(()=>{h.current=a},[a]),(0,t.useEffect)(()=>{if(!i)return;let e=document.activeElement;(m.current?.querySelector(`:is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])`)??m.current)?.focus();let t=e=>{if(e.key===`Escape`){h.current();return}if(e.key!==`Tab`)return;let t=Array.from(m.current?.querySelectorAll(`:is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])`)??[]);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())};document.addEventListener(`keydown`,t);let n=document.body.style.overflow;return document.body.style.overflow=`hidden`,()=>{document.removeEventListener(`keydown`,t),document.body.style.overflow=n,e?.focus()}},[i]),!i||typeof document>`u`?null:(0,r.createPortal)((0,n.jsx)(`div`,{className:`ds-scrim`,onMouseDown:e=>e.target===e.currentTarget&&h.current(),children:(0,n.jsxs)(`div`,{...f,ref:e=>{m.current=e,typeof p==`function`?p(e):p&&(p.current=e)},role:`dialog`,"aria-modal":`true`,"aria-labelledby":g,"aria-describedby":s?_:void 0,tabIndex:-1,"data-size":c,className:[`ds-modal`,u].filter(Boolean).join(` `),children:[(0,n.jsxs)(`header`,{className:`ds-modal__head`,children:[(0,n.jsxs)(`div`,{className:`ds-modal__titles`,children:[(0,n.jsx)(`h2`,{id:g,className:`ds-modal__title`,children:o}),s&&(0,n.jsx)(`p`,{id:_,className:`ds-modal__description`,children:s})]}),(0,n.jsx)(e.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Close`,className:`ds-modal__close`,onClick:()=>h.current()})]}),(0,n.jsx)(`div`,{className:`ds-modal__body`,children:d}),l&&(0,n.jsx)(`footer`,{className:`ds-modal__footer`,children:l})]})}),document.body)});exports.Modal=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../Button/index.cjs");let t=require("react"),n=require("react-dom"),r=require("react/jsx-runtime");var i=(0,t.forwardRef)(function({isOpen:i,onClose:a,title:o,description:s,size:c=`md`,footer:l,className:u,children:d,...f},p){let m=(0,t.useRef)(null),h=(0,t.useRef)(a),g=(0,t.useId)(),_=(0,t.useId)();return(0,t.useEffect)(()=>{h.current=a},[a]),(0,t.useEffect)(()=>{if(!i)return;let e=document.activeElement;(m.current?.querySelector(`:is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])`)??m.current)?.focus();let t=e=>{if(e.key===`Escape`){e.preventDefault(),h.current();return}if(e.key!==`Tab`)return;let t=Array.from(m.current?.querySelectorAll(`:is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])`)??[]);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())};document.addEventListener(`keydown`,t);let n=document.body.style.overflow;return document.body.style.overflow=`hidden`,()=>{document.removeEventListener(`keydown`,t),document.body.style.overflow=n,e?.focus()}},[i]),!i||typeof document>`u`?null:(0,n.createPortal)((0,r.jsx)(`div`,{className:`ds-scrim`,onMouseDown:e=>e.target===e.currentTarget&&h.current(),children:(0,r.jsxs)(`div`,{...f,ref:e=>{m.current=e,typeof p==`function`?p(e):p&&(p.current=e)},role:`dialog`,"aria-modal":`true`,"aria-labelledby":g,"aria-describedby":s?_:void 0,tabIndex:-1,"data-size":c,className:[`ds-modal`,u].filter(Boolean).join(` `),children:[(0,r.jsxs)(`header`,{className:`ds-modal__head`,children:[(0,r.jsxs)(`div`,{className:`ds-modal__titles`,children:[(0,r.jsx)(`h2`,{id:g,className:`ds-modal__title`,children:o}),s&&(0,r.jsx)(`p`,{id:_,className:`ds-modal__description`,children:s})]}),(0,r.jsx)(e.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Close`,className:`ds-modal__close`,onClick:()=>h.current()})]}),(0,r.jsx)(`div`,{className:`ds-modal__body`,children:d}),l&&(0,r.jsx)(`footer`,{className:`ds-modal__footer`,children:l})]})}),document.body)});exports.Modal=i;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Modal/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","Modal","rest","panelRef","onCloseRef","onClose","titleId","descriptionId","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","node","ref","description","size","className","title","footer"],"sources":["../../../src/components/Modal/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 ModalSize = \"dialog\" | \"md\" | \"wide\";\n\nexport interface ModalProps 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  size?: ModalSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A focused task on top of the page. Heavy frame, hairline rules, a quiet\n * footer band — the collection frame, floated. Focus is trapped while open.\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n  { isOpen, onClose, title, description, size = \"md\", footer, className, children, ...rest },\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      \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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          \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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 className=\"ds-scrim\" onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}>\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-size={size}\n        className={[\"ds-modal\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-modal__head\">\n          <div className=\"ds-modal__titles\">\n            <h2 id={titleId} className=\"ds-modal__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-modal__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            className=\"ds-modal__close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-modal__body\">{children}</div>\n        {footer && <footer className=\"ds-modal__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","createPortal","Button","require_components_Button_index","react","react_dom","react_jsx_runtime","Modal","rest","panelRef","onCloseRef","onClose","titleId","descriptionId","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","node","ref","description","size","className","title","footer"],"sources":["../../../src/components/Modal/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 ModalSize = \"dialog\" | \"md\" | \"wide\";\n\nexport interface ModalProps 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  size?: ModalSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A focused task on top of the page. Heavy frame, hairline rules, a quiet\n * footer band — the collection frame, floated. Focus is trapped while open.\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n  { isOpen, onClose, title, description, size = \"md\", footer, className, children, ...rest },\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      \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])\",\n    );\n    (initialFocus ?? panelRef.current)?.focus();\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\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          \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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 className=\"ds-scrim\" onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}>\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-size={size}\n        className={[\"ds-modal\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-modal__head\">\n          <div className=\"ds-modal__titles\">\n            <h2 id={titleId} className=\"ds-modal__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-modal__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            className=\"ds-modal__close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-modal__body\">{children}</div>\n        {footer && <footer className=\"ds-modal__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    document.body,\n  );\n});\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,MAAM,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC/E,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAsGhB,CAAC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,MAAM,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC/E,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAuGhB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,MAAM,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC/E,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAsGhB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwC,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,IAAI,GAAG,MAAM,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC/E,MAAM,EAAE,OAAO,CAAC;IAChB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAuGhB,CAAC"}

package/dist/components/Modal/index.js

@@ -1,7 +1,7 @@
 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 { createPortal as a } from "react-dom";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/Modal/index.tsx
 var c = t(function({ isOpen: t, onClose: c, title: l, description: u, size: d = "md", footer: f, className: p, children: m, ...h }, g) {
 	let _ = i(null), v = i(c), y = r(), b = r();
@@ -13,7 +13,7 @@ var c = t(function({ isOpen: t, onClose: c, title: l, description: u, size: d =
 		(_.current?.querySelector(":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])") ?? _.current)?.focus();
 		let n = (e) => {
 			if (e.key === "Escape") {
-				v.current();
+				e.preventDefault(), v.current();
 				return;
 			}
 			if (e.key !== "Tab") return;
@@ -27,10 +27,10 @@ var c = t(function({ isOpen: t, onClose: c, title: l, description: u, size: d =
 		return document.body.style.overflow = "hidden", () => {
 			document.removeEventListener("keydown", n), document.body.style.overflow = r, e?.focus();
 		};
-	}, [t]), !t || typeof document > "u" ? null : s(/* @__PURE__ */ a("div", {
+	}, [t]), !t || typeof document > "u" ? null : a(/* @__PURE__ */ o("div", {
 		className: "ds-scrim",
 		onMouseDown: (e) => e.target === e.currentTarget && v.current(),
-		children: /* @__PURE__ */ o("div", {
+		children: /* @__PURE__ */ s("div", {
 			...h,
 			ref: (e) => {
 				_.current = e, typeof g == "function" ? g(e) : g && (g.current = e);
@@ -43,20 +43,20 @@ var c = t(function({ isOpen: t, onClose: c, title: l, description: u, size: d =
 			"data-size": d,
 			className: ["ds-modal", p].filter(Boolean).join(" "),
 			children: [
-				/* @__PURE__ */ o("header", {
+				/* @__PURE__ */ s("header", {
 					className: "ds-modal__head",
-					children: [/* @__PURE__ */ o("div", {
+					children: [/* @__PURE__ */ s("div", {
 						className: "ds-modal__titles",
-						children: [/* @__PURE__ */ a("h2", {
+						children: [/* @__PURE__ */ o("h2", {
 							id: y,
 							className: "ds-modal__title",
 							children: l
-						}), u && /* @__PURE__ */ a("p", {
+						}), u && /* @__PURE__ */ o("p", {
 							id: b,
 							className: "ds-modal__description",
 							children: u
 						})]
-					}), /* @__PURE__ */ a(e, {
+					}), /* @__PURE__ */ o(e, {
 						variant: "simple",
 						size: "sm",
 						isIconOnly: !0,
@@ -66,11 +66,11 @@ var c = t(function({ isOpen: t, onClose: c, title: l, description: u, size: d =
 						onClick: () => v.current()
 					})]
 				}),
-				/* @__PURE__ */ a("div", {
+				/* @__PURE__ */ o("div", {
 					className: "ds-modal__body",
 					children: m
 				}),
-				f && /* @__PURE__ */ a("footer", {
+				f && /* @__PURE__ */ o("footer", {
 					className: "ds-modal__footer",
 					children: f
 				})

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Modal","forwardRef","rest","panelRef","useRef","onCloseRef","onClose","titleId","useId","descriptionId","useEffect","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","createPortal","node","ref","description","size","className","title","Button","footer"],"sources":["../../../src/components/Modal/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 ModalSize = \"dialog\" | \"md\" | \"wide\";\n\nexport interface ModalProps 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  size?: ModalSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A focused task on top of the page. Heavy frame, hairline rules, a quiet\n * footer band — the collection frame, floated. Focus is trapped while open.\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n  { isOpen, onClose, title, description, size = \"md\", footer, className, children, ...rest },\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      \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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          \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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 className=\"ds-scrim\" onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}>\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-size={size}\n        className={[\"ds-modal\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-modal__head\">\n          <div className=\"ds-modal__titles\">\n            <h2 id={titleId} className=\"ds-modal__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-modal__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            className=\"ds-modal__close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-modal__body\">{children}</div>\n        {footer && <footer className=\"ds-modal__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    document.body,\n  );\n});\n"],"mappings":";;;;;AAuBA,IAAaA,IAAQC,EAAuC,SAC1D,EAAE,WAAQ,YAAS,UAAO,gBAAa,UAAO,MAAM,WAAQ,cAAW,aAAU,GAAGC,KACpF,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,8FACF,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,8FACF,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;EAAK,WAAU;EAAW,cAAc,MAAUL,EAAM,WAAWA,EAAM,iBAAiBT,EAAW,QAAQ;EAC3G,UAAA,kBAAC,OAAD;GACE,GAAIH;GACJ,MAAM,MAAS;IAEb,AADA,EAAS,UAAUkB,GACf,OAAOC,KAAQ,aAAYA,EAAID,CAAI,IAC9BC,MAAK,EAAI,UAAUD;GAC9B;GACA,MAAK;GACL,cAAW;GACX,mBAAiBb;GACjB,oBAAkBe,IAAcb,IAAgB,KAAA;GAChD,UAAU;GACV,aAAWc;GACX,WAAW,CAAC,YAAYC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;GAb7D,UAAA;IAeE,kBAAC,UAAD;KAAQ,WAAU;KAAlB,UAAA,CACE,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,kBAAC,MAAD;OAAI,IAAIjB;OAAS,WAAU;OACxB,UAAAkB;MACC,CAAA,GACHH,KACC,kBAAC,KAAD;OAAG,IAAIb;OAAe,WAAU;OAC7B,UAAAa;MACA,CAAA,CAEF;KACL,CAAA,GAAA,kBAACI,GAAD;MACE,SAAQ;MACR,MAAK;MACL,YAAA;MACA,WAAU;MACV,cAAW;MACX,WAAU;MACV,eAAerB,EAAW,QAAQ;KACnC,CAAA,CACK;;IACR,kBAAC,OAAD;KAAK,WAAU;KAAkB;IAAc,CAAA;IAC9CsB,KAAU,kBAAC,UAAD;KAAQ,WAAU;KAAoB,UAAAA;IAAe,CAAA;GAC7D;;CACF,CAAA,GACL,SAAS,IACX;AACF,CAAC"}
+{"version":3,"file":"index.js","names":["Modal","forwardRef","rest","panelRef","useRef","onCloseRef","onClose","titleId","useId","descriptionId","useEffect","isOpen","previous","onKeyDown","event","focusable","first","last","overflow","createPortal","node","ref","description","size","className","title","Button","footer"],"sources":["../../../src/components/Modal/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 ModalSize = \"dialog\" | \"md\" | \"wide\";\n\nexport interface ModalProps 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  size?: ModalSize;\n  /** Actions, right-aligned. The confirming action goes last. */\n  footer?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * A focused task on top of the page. Heavy frame, hairline rules, a quiet\n * footer band — the collection frame, floated. Focus is trapped while open.\n */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(function Modal(\n  { isOpen, onClose, title, description, size = \"md\", footer, className, children, ...rest },\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      \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):not([tabindex='-1'])\",\n    );\n    (initialFocus ?? panelRef.current)?.focus();\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\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          \":is(button, [href], input, select, textarea, [tabindex]):not(:disabled):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 className=\"ds-scrim\" onMouseDown={(event) => event.target === event.currentTarget && onCloseRef.current()}>\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-size={size}\n        className={[\"ds-modal\", className].filter(Boolean).join(\" \")}\n      >\n        <header className=\"ds-modal__head\">\n          <div className=\"ds-modal__titles\">\n            <h2 id={titleId} className=\"ds-modal__title\">\n              {title}\n            </h2>\n            {description && (\n              <p id={descriptionId} className=\"ds-modal__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            className=\"ds-modal__close\"\n            onClick={() => onCloseRef.current()}\n          />\n        </header>\n        <div className=\"ds-modal__body\">{children}</div>\n        {footer && <footer className=\"ds-modal__footer\">{footer}</footer>}\n      </div>\n    </div>,\n    document.body,\n  );\n});\n"],"mappings":";;;;;AAuBA,IAAaA,IAAQC,EAAuC,SAC1D,EAAE,WAAQ,YAAS,UAAO,gBAAa,UAAO,MAAM,WAAQ,cAAW,aAAU,GAAGC,KACpF,GACA;CACA,IAAMC,IAAWC,EAA8B,IAAI,GAC7CC,IAAaD,EAAOE,CAAO,GAC3BC,IAAUC,EAAM,GAChBC,IAAgBD,EAAM;CAoD5B,OAlDAE,QAAgB;EACd,EAAW,UAAUJ;CACvB,GAAG,CAACA,CAAO,CAAC,GAEZI,QAAgB;EACd,IAAI,CAACC,GAAQ;EAEb,IAAMC,IAAW,SAAS;EAI1B,CAHqBT,EAAS,SAAS,cACrC,8FACF,KACiBA,EAAS,QAAA,EAAU,MAAM;EAE1C,IAAMU,KAAa,MAAyB;GAC1C,IAAIC,EAAM,QAAQ,UAAU;IAE1B,AADAA,EAAM,eAAe,GACrBT,EAAW,QAAQ;IACnB;GACF;GACA,IAAIS,EAAM,QAAQ,OAAO;GACzB,IAAMC,IAAY,MAAM,KACtBZ,EAAS,SAAS,iBAChB,8FACF,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;EAAK,WAAU;EAAW,cAAc,MAAUL,EAAM,WAAWA,EAAM,iBAAiBT,EAAW,QAAQ;EAC3G,UAAA,kBAAC,OAAD;GACE,GAAIH;GACJ,MAAM,MAAS;IAEb,AADA,EAAS,UAAUkB,GACf,OAAOC,KAAQ,aAAYA,EAAID,CAAI,IAC9BC,MAAK,EAAI,UAAUD;GAC9B;GACA,MAAK;GACL,cAAW;GACX,mBAAiBb;GACjB,oBAAkBe,IAAcb,IAAgB,KAAA;GAChD,UAAU;GACV,aAAWc;GACX,WAAW,CAAC,YAAYC,CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;GAb7D,UAAA;IAeE,kBAAC,UAAD;KAAQ,WAAU;KAAlB,UAAA,CACE,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACE,kBAAC,MAAD;OAAI,IAAIjB;OAAS,WAAU;OACxB,UAAAkB;MACC,CAAA,GACHH,KACC,kBAAC,KAAD;OAAG,IAAIb;OAAe,WAAU;OAC7B,UAAAa;MACA,CAAA,CAEF;KACL,CAAA,GAAA,kBAACI,GAAD;MACE,SAAQ;MACR,MAAK;MACL,YAAA;MACA,WAAU;MACV,cAAW;MACX,WAAU;MACV,eAAerB,EAAW,QAAQ;KACnC,CAAA,CACK;;IACR,kBAAC,OAAD;KAAK,WAAU;KAAkB;IAAc,CAAA;IAC9CsB,KAAU,kBAAC,UAAD;KAAQ,WAAU;KAAoB,UAAAA;IAAe,CAAA;GAC7D;;CACF,CAAA,GACL,SAAS,IACX;AACF,CAAC"}

package/dist/components/NumberField/index.cjs

@@ -1,2 +1,2 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs");;/* empty css                            */const t=require("../FieldAffix/index.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(...e){return e.filter(Boolean).join(` `)}var a=(0,n.forwardRef)(function({size:a=`md`,value:o,defaultValue:s=``,onValueChange:c,min:l,max:u,step:d=1,prefix:f,suffix:p,isDisabled:m=!1,isInvalid:h=!1,hasSteppers:g=!0,className:_,disabled:v,"aria-invalid":y,...b},x){let[S,C]=(0,n.useState)(s),w=o??S,T=(0,n.useRef)(null),E=(0,n.useCallback)(e=>{o===void 0&&C(e),c?.(e)},[c,o]),D=e=>{let t=(w===``?l??0:w)+e*(d===`any`?1:d);l!==void 0&&(t=Math.max(l,t)),u!==void 0&&(t=Math.min(u,t)),t=Number(t.toFixed(10)),E(t),T.current?.focus()},O=w!==``&&(l!==void 0&&w<l||u!==void 0&&w>u);return(0,r.jsxs)(`div`,{className:i(`ds-number`,_),"data-size":a,children:[g&&(0,r.jsx)(`button`,{type:`button`,className:`ds-number__step`,"aria-label":`Decrease`,disabled:m||v||l!==void 0&&w!==``&&w<=l,onClick:()=>D(-1),children:(0,r.jsx)(e.t,{name:`minus`,size:16})}),(0,r.jsx)(t.FieldAffix,{className:`ds-number__body`,lead:f,trail:p,children:(0,r.jsx)(`input`,{ref:e=>{T.current=e,typeof x==`function`?x(e):x&&(x.current=e)},type:`number`,inputMode:`decimal`,value:w,min:l,max:u,step:d,disabled:m||v,"aria-invalid":h||O||y||void 0,"data-size":a,className:`ds-field-skin ds-number__input`,onChange:e=>{let t=e.target.value;E(t===``?``:Number(t))},...b})}),g&&(0,r.jsx)(`button`,{type:`button`,className:`ds-number__step`,"aria-label":`Increase`,disabled:m||v||u!==void 0&&w!==``&&w>=u,onClick:()=>D(1),children:(0,r.jsx)(e.t,{name:`plus`,size:16})})]})});function o({value:e,defaultValue:t={min:``,max:``},onValueChange:i,size:o=`md`,min:s,max:c,step:l=1,prefix:u,suffix:d,isDisabled:f=!1,minLabel:p=`Minimum`,maxLabel:m=`Maximum`}){let[h,g]=(0,n.useState)(t),_=e??h,v=t=>{e===void 0&&g(t),i?.(t)},y=_.min!==``&&_.max!==``&&_.min>_.max;return(0,r.jsxs)(`div`,{className:`ds-number-range`,children:[(0,r.jsx)(a,{"aria-label":p,size:o,value:_.min,min:s,max:c,step:l,prefix:u,suffix:d,isDisabled:f,isInvalid:y,onValueChange:e=>v({..._,min:e})}),(0,r.jsx)(`span`,{className:`ds-number-range__dash`,"aria-hidden":`true`,children:`–`}),(0,r.jsx)(a,{"aria-label":m,size:o,value:_.max,min:s,max:c,step:l,prefix:u,suffix:d,isDisabled:f,isInvalid:y,onValueChange:e=>v({..._,max:e})})]})}exports.NumberField=a,exports.NumberRangeField=o;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../Button/index.cjs");;/* empty css                            */const t=require("../FieldAffix/index.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(...e){return e.filter(Boolean).join(` `)}var a=(0,n.forwardRef)(function({size:a=`md`,value:o,defaultValue:s=``,onValueChange:c,min:l,max:u,step:d=1,prefix:f,suffix:p,isDisabled:m=!1,isInvalid:h=!1,hasSteppers:g=!0,className:_,disabled:v,"aria-invalid":y,...b},x){let[S,C]=(0,n.useState)(s),w=o??S,T=(0,n.useRef)(null),E=(0,n.useCallback)(e=>{o===void 0&&C(e),c?.(e)},[c,o]),D=e=>{let t=(w===``?l??0:w)+e*(d===`any`?1:d);l!==void 0&&(t=Math.max(l,t)),u!==void 0&&(t=Math.min(u,t)),t=Number(t.toFixed(10)),E(t),T.current?.focus()},O=w!==``&&(l!==void 0&&w<l||u!==void 0&&w>u);return(0,r.jsxs)(`div`,{className:i(`ds-number`,_),"data-size":a,children:[g&&(0,r.jsx)(e.Button,{size:a,isIconOnly:!0,iconStart:`minus`,className:`ds-number__step`,"aria-label":`Decrease`,isDisabled:m||v||l!==void 0&&w!==``&&w<=l,onClick:()=>D(-1)}),(0,r.jsx)(t.FieldAffix,{className:`ds-number__body`,lead:f,trail:p,children:(0,r.jsx)(`input`,{ref:e=>{T.current=e,typeof x==`function`?x(e):x&&(x.current=e)},type:`number`,inputMode:`decimal`,value:w,min:l,max:u,step:d,disabled:m||v,"aria-invalid":h||O||y||void 0,"data-size":a,className:`ds-field-skin ds-number__input`,onChange:e=>{let t=e.target.value;E(t===``?``:Number(t))},...b})}),g&&(0,r.jsx)(e.Button,{size:a,isIconOnly:!0,iconStart:`plus`,className:`ds-number__step`,"aria-label":`Increase`,isDisabled:m||v||u!==void 0&&w!==``&&w>=u,onClick:()=>D(1)})]})});function o({value:e,defaultValue:t={min:``,max:``},onValueChange:i,size:o=`md`,min:s,max:c,step:l=1,prefix:u,suffix:d,isDisabled:f=!1,minLabel:p=`Minimum`,maxLabel:m=`Maximum`}){let[h,g]=(0,n.useState)(t),_=e??h,v=t=>{e===void 0&&g(t),i?.(t)},y=_.min!==``&&_.max!==``&&_.min>_.max;return(0,r.jsxs)(`div`,{className:`ds-number-range`,children:[(0,r.jsx)(a,{"aria-label":p,size:o,value:_.min,min:s,max:c,step:l,prefix:u,suffix:d,isDisabled:f,isInvalid:y,onValueChange:e=>v({..._,min:e})}),(0,r.jsx)(`span`,{className:`ds-number-range__dash`,"aria-hidden":`true`,children:`–`}),(0,r.jsx)(a,{"aria-label":m,size:o,value:_.max,min:s,max:c,step:l,prefix:u,suffix:d,isDisabled:f,isInvalid:y,onValueChange:e=>v({..._,max:e})})]})}exports.NumberField=a,exports.NumberRangeField=o;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useCallback","Icon","FieldAffix","require_Icon","require_components_FieldAffix_index","react","react_jsx_runtime","cx","parts","NumberField","ariaInvalid","rest","internal","setInternal","defaultValue","current","value","inputRef","commit","next","onValueChange","nudge","min","direction","step","max","outOfRange","className","size","hasSteppers","isDisabled","disabled","prefix","suffix","node","ref","isInvalid","raw","event","NumberRangeField","crossed","minLabel","maxLabel"],"sources":["../../../src/components/NumberField/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useRef,\n  useState,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Icon } from \"../Icon\";\nimport { FieldAffix } from \"../FieldAffix\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface NumberFieldProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\" | \"type\" | \"value\" | \"defaultValue\" | \"onChange\" | \"prefix\"> {\n  size?: FieldSize;\n  value?: number | \"\";\n  defaultValue?: number | \"\";\n  onValueChange?: (value: number | \"\") => void;\n  min?: number;\n  max?: number;\n  step?: number | \"any\";\n  /** Rendered inside the field, before the number — \"£\", \"$\", a glyph. */\n  prefix?: ReactNode;\n  /** Rendered inside the field, after the number — \"kg\", \"%\", \"px\". */\n  suffix?: ReactNode;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Hide the − / + steppers and keep typing only. */\n  hasSteppers?: boolean;\n}\n\n\n/**\n * A quantity, bounded by `min` and `max`. Steppers move by `step` and stop at\n * the bounds; typing is never blocked, an out-of-range value reads invalid.\n */\nexport const NumberField = forwardRef<HTMLInputElement, NumberFieldProps>(function NumberField(\n  {\n    size = \"md\",\n    value,\n    defaultValue = \"\",\n    onValueChange,\n    min,\n    max,\n    step = 1,\n    prefix,\n    suffix,\n\n    isDisabled = false,\n    isInvalid = false,\n    hasSteppers = true,\n    className,\n    disabled,\n    \"aria-invalid\": ariaInvalid,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState<number | \"\">(defaultValue);\n  const current = value ?? internal;\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const commit = useCallback(\n    (next: number | \"\") => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    },\n    [onValueChange, value],\n  );\n\n  const nudge = (direction: 1 | -1) => {\n    const base = current === \"\" ? (min ?? 0) : current;\n    let next = base + direction * (step === \"any\" ? 1 : step);\n    if (min !== undefined) next = Math.max(min, next);\n    if (max !== undefined) next = Math.min(max, next);\n    next = Number(next.toFixed(10));\n    commit(next);\n    inputRef.current?.focus();\n  };\n\n  const outOfRange =\n    current !== \"\" &&\n    ((min !== undefined && current < min) || (max !== undefined && current > max));\n\n  return (\n    <div className={cx(\"ds-number\", className)} data-size={size}>\n      {hasSteppers && (\n        <button\n          type=\"button\"\n          className=\"ds-number__step\"\n          aria-label=\"Decrease\"\n          disabled={isDisabled || disabled || (min !== undefined && current !== \"\" && current <= min)}\n          onClick={() => nudge(-1)}\n        >\n          <Icon name=\"minus\" size={16} />\n        </button>\n      )}\n      <FieldAffix className=\"ds-number__body\" lead={prefix} trail={suffix}>\n        <input\n          ref={(node) => {\n            inputRef.current = node;\n            if (typeof ref === \"function\") ref(node);\n            else if (ref) ref.current = node;\n          }}\n          type=\"number\"\n          inputMode=\"decimal\"\n          value={current}\n          min={min}\n          max={max}\n          step={step}\n          disabled={isDisabled || disabled}\n          aria-invalid={isInvalid || outOfRange || ariaInvalid || undefined}\n          data-size={size}\n          className=\"ds-field-skin ds-number__input\"\n          onChange={(event) => {\n            const raw = event.target.value;\n            commit(raw === \"\" ? \"\" : Number(raw));\n          }}\n          {...rest}\n        />\n      </FieldAffix>\n\n      {hasSteppers && (\n        <button\n          type=\"button\"\n          className=\"ds-number__step\"\n          aria-label=\"Increase\"\n          disabled={isDisabled || disabled || (max !== undefined && current !== \"\" && current >= max)}\n          onClick={() => nudge(1)}\n        >\n          <Icon name=\"plus\" size={16} />\n        </button>\n      )}\n    </div>\n  );\n});\n\nexport interface NumberRangeValue {\n  min: number | \"\";\n  max: number | \"\";\n}\n\nexport interface NumberRangeFieldProps {\n  value?: NumberRangeValue;\n  defaultValue?: NumberRangeValue;\n  onValueChange?: (value: NumberRangeValue) => void;\n  size?: FieldSize;\n  /** Hard bounds both ends are clamped to. */\n  min?: number;\n  max?: number;\n  step?: number;\n  /** Rendered inside both fields, before the number. */\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  isDisabled?: boolean;\n  minLabel?: string;\n  maxLabel?: string;\n}\n\n/**\n * A lower and an upper bound, typed. The pair reads invalid when the minimum\n * passes the maximum — neither field is rewritten behind the user.\n */\nexport function NumberRangeField({\n  value,\n  defaultValue = { min: \"\", max: \"\" },\n  onValueChange,\n  size = \"md\",\n  min,\n  max,\n  step = 1,\n  prefix,\n  suffix,\n  isDisabled = false,\n  minLabel = \"Minimum\",\n  maxLabel = \"Maximum\",\n}: NumberRangeFieldProps) {\n  const [internal, setInternal] = useState<NumberRangeValue>(defaultValue);\n  const current = value ?? internal;\n\n  const commit = (next: NumberRangeValue) => {\n    if (value === undefined) setInternal(next);\n    onValueChange?.(next);\n  };\n\n  const crossed = current.min !== \"\" && current.max !== \"\" && current.min > current.max;\n\n  return (\n    <div className=\"ds-number-range\">\n      <NumberField\n        aria-label={minLabel}\n        size={size}\n        value={current.min}\n        min={min}\n        max={max}\n        step={step}\n        prefix={prefix}\n        suffix={suffix}\n        isDisabled={isDisabled}\n        isInvalid={crossed}\n        onValueChange={(next) => commit({ ...current, min: next })}\n      />\n      <span className=\"ds-number-range__dash\" aria-hidden=\"true\">\n        –\n      </span>\n      <NumberField\n        aria-label={maxLabel}\n        size={size}\n        value={current.max}\n        min={min}\n        max={max}\n        step={step}\n        prefix={prefix}\n        suffix={suffix}\n        isDisabled={isDisabled}\n        isInvalid={crossed}\n        onValueChange={(next) => commit({ ...current, max: next })}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.cjs","names":["forwardRef","useState","useRef","useCallback","Button","FieldAffix","require_components_Button_index","require_components_FieldAffix_index","react","react_jsx_runtime","cx","parts","NumberField","ariaInvalid","rest","internal","setInternal","defaultValue","current","value","inputRef","commit","next","onValueChange","nudge","min","direction","step","max","outOfRange","className","size","hasSteppers","isDisabled","disabled","prefix","suffix","node","ref","isInvalid","raw","event","NumberRangeField","crossed","minLabel","maxLabel"],"sources":["../../../src/components/NumberField/index.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useRef,\n  useState,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from \"react\";\nimport { Button } from \"../Button\";\nimport { FieldAffix } from \"../FieldAffix\";\nimport type { FieldSize } from \"../Field\";\nimport \"../Field/style.css\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n  return parts.filter(Boolean).join(\" \");\n}\n\nexport interface NumberFieldProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\" | \"type\" | \"value\" | \"defaultValue\" | \"onChange\" | \"prefix\"> {\n  size?: FieldSize;\n  value?: number | \"\";\n  defaultValue?: number | \"\";\n  onValueChange?: (value: number | \"\") => void;\n  min?: number;\n  max?: number;\n  step?: number | \"any\";\n  /** Rendered inside the field, before the number — \"£\", \"$\", a glyph. */\n  prefix?: ReactNode;\n  /** Rendered inside the field, after the number — \"kg\", \"%\", \"px\". */\n  suffix?: ReactNode;\n  isDisabled?: boolean;\n  isInvalid?: boolean;\n  /** Hide the − / + steppers and keep typing only. */\n  hasSteppers?: boolean;\n}\n\n\n/**\n * A quantity, bounded by `min` and `max`. Steppers move by `step` and stop at\n * the bounds; typing is never blocked, an out-of-range value reads invalid.\n */\nexport const NumberField = forwardRef<HTMLInputElement, NumberFieldProps>(function NumberField(\n  {\n    size = \"md\",\n    value,\n    defaultValue = \"\",\n    onValueChange,\n    min,\n    max,\n    step = 1,\n    prefix,\n    suffix,\n\n    isDisabled = false,\n    isInvalid = false,\n    hasSteppers = true,\n    className,\n    disabled,\n    \"aria-invalid\": ariaInvalid,\n    ...rest\n  },\n  ref,\n) {\n  const [internal, setInternal] = useState<number | \"\">(defaultValue);\n  const current = value ?? internal;\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const commit = useCallback(\n    (next: number | \"\") => {\n      if (value === undefined) setInternal(next);\n      onValueChange?.(next);\n    },\n    [onValueChange, value],\n  );\n\n  const nudge = (direction: 1 | -1) => {\n    const base = current === \"\" ? (min ?? 0) : current;\n    let next = base + direction * (step === \"any\" ? 1 : step);\n    if (min !== undefined) next = Math.max(min, next);\n    if (max !== undefined) next = Math.min(max, next);\n    next = Number(next.toFixed(10));\n    commit(next);\n    inputRef.current?.focus();\n  };\n\n  const outOfRange =\n    current !== \"\" &&\n    ((min !== undefined && current < min) || (max !== undefined && current > max));\n\n  return (\n    <div className={cx(\"ds-number\", className)} data-size={size}>\n      {hasSteppers && (\n        <Button\n          size={size}\n          isIconOnly\n          iconStart=\"minus\"\n          className=\"ds-number__step\"\n          aria-label=\"Decrease\"\n          isDisabled={isDisabled || disabled || (min !== undefined && current !== \"\" && current <= min)}\n          onClick={() => nudge(-1)}\n        />\n      )}\n      <FieldAffix className=\"ds-number__body\" lead={prefix} trail={suffix}>\n        <input\n          ref={(node) => {\n            inputRef.current = node;\n            if (typeof ref === \"function\") ref(node);\n            else if (ref) ref.current = node;\n          }}\n          type=\"number\"\n          inputMode=\"decimal\"\n          value={current}\n          min={min}\n          max={max}\n          step={step}\n          disabled={isDisabled || disabled}\n          aria-invalid={isInvalid || outOfRange || ariaInvalid || undefined}\n          data-size={size}\n          className=\"ds-field-skin ds-number__input\"\n          onChange={(event) => {\n            const raw = event.target.value;\n            commit(raw === \"\" ? \"\" : Number(raw));\n          }}\n          {...rest}\n        />\n      </FieldAffix>\n\n      {hasSteppers && (\n        <Button\n          size={size}\n          isIconOnly\n          iconStart=\"plus\"\n          className=\"ds-number__step\"\n          aria-label=\"Increase\"\n          isDisabled={isDisabled || disabled || (max !== undefined && current !== \"\" && current >= max)}\n          onClick={() => nudge(1)}\n        />\n      )}\n    </div>\n  );\n});\n\nexport interface NumberRangeValue {\n  min: number | \"\";\n  max: number | \"\";\n}\n\nexport interface NumberRangeFieldProps {\n  value?: NumberRangeValue;\n  defaultValue?: NumberRangeValue;\n  onValueChange?: (value: NumberRangeValue) => void;\n  size?: FieldSize;\n  /** Hard bounds both ends are clamped to. */\n  min?: number;\n  max?: number;\n  step?: number;\n  /** Rendered inside both fields, before the number. */\n  prefix?: ReactNode;\n  suffix?: ReactNode;\n  isDisabled?: boolean;\n  minLabel?: string;\n  maxLabel?: string;\n}\n\n/**\n * A lower and an upper bound, typed. The pair reads invalid when the minimum\n * passes the maximum — neither field is rewritten behind the user.\n */\nexport function NumberRangeField({\n  value,\n  defaultValue = { min: \"\", max: \"\" },\n  onValueChange,\n  size = \"md\",\n  min,\n  max,\n  step = 1,\n  prefix,\n  suffix,\n  isDisabled = false,\n  minLabel = \"Minimum\",\n  maxLabel = \"Maximum\",\n}: NumberRangeFieldProps) {\n  const [internal, setInternal] = useState<NumberRangeValue>(defaultValue);\n  const current = value ?? internal;\n\n  const commit = (next: NumberRangeValue) => {\n    if (value === undefined) setInternal(next);\n    onValueChange?.(next);\n  };\n\n  const crossed = current.min !== \"\" && current.max !== \"\" && current.min > current.max;\n\n  return (\n    <div className=\"ds-number-range\">\n      <NumberField\n        aria-label={minLabel}\n        size={size}\n        value={current.min}\n        min={min}\n        max={max}\n        step={step}\n        prefix={prefix}\n        suffix={suffix}\n        isDisabled={isDisabled}\n        isInvalid={crossed}\n        onValueChange={(next) => commit({ ...current, min: next })}\n      />\n      <span className=\"ds-number-range__dash\" aria-hidden=\"true\">\n        –\n      </span>\n      <NumberField\n        aria-label={maxLabel}\n        size={size}\n        value={current.max}\n        min={min}\n        max={max}\n        step={step}\n        prefix={prefix}\n        suffix={suffix}\n        isDisabled={isDisabled}\n        isInvalid={crossed}\n        onValueChange={(next) => commit({ ...current, max: next })}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}