@flanksource/clicky-ui 0.3.28 → 0.3.30

package/dist/overlay/CommandPaletteList.d.ts

@@ -1,4 +1,4 @@
-import { RefObject } from 'react';
+import { RefObject } from '../../../../node_modules/@types/react/index.d.ts';
 import { CommandGroup, CommandItem } from './CommandPalette.model';
 export type CommandPaletteListProps = {
     groups: CommandGroup[];
@@ -9,7 +9,7 @@ export type CommandPaletteListProps = {
     optionId: (item: CommandItem) => string;
     onActivate: (item: CommandItem) => void;
     onHover: (index: number) => void;
-    listRef: RefObject<HTMLDivElement>;
+    listRef: RefObject<HTMLDivElement | null>;
     loading?: boolean | undefined;
     emptyState?: React.ReactNode;
     listMaxHeight: string | number;
@@ -19,5 +19,5 @@ export type CommandPaletteListProps = {
  * option index space stays contiguous — the same trick Combobox uses to scroll
  * by `[role="option"]` index.
  */
-export declare function CommandPaletteList({ groups, items, activeIndex, listId, optionId, onActivate, onHover, listRef, loading, emptyState, listMaxHeight, }: CommandPaletteListProps): import("react/jsx-runtime").JSX.Element;
+export declare function CommandPaletteList({ groups, items, activeIndex, listId, optionId, onActivate, onHover, listRef, loading, emptyState, listMaxHeight, }: CommandPaletteListProps): import("react").JSX.Element;
 //# sourceMappingURL=CommandPaletteList.d.ts.map

package/dist/overlay/CommandPaletteList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPaletteList.d.ts","sourceRoot":"","sources":["../../src/overlay/CommandPaletteList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjD,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAExE,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,uEAAuE;IACvE,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,MAAM,CAAC;IACxC,UAAU,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACnC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,aAAa,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,KAAK,EACL,WAAW,EACX,MAAM,EACN,QAAQ,EACR,UAAU,EACV,OAAO,EACP,OAAO,EACP,OAAO,EACP,UAAU,EACV,aAAa,GACd,EAAE,uBAAuB,2CA8FzB"}
+{"version":3,"file":"CommandPaletteList.d.ts","sourceRoot":"","sources":["../../src/overlay/CommandPaletteList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjD,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAExE,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,uEAAuE;IACvE,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,MAAM,CAAC;IACxC,UAAU,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC1C,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,aAAa,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,MAAM,EACN,KAAK,EACL,WAAW,EACX,MAAM,EACN,QAAQ,EACR,UAAU,EACV,OAAO,EACP,OAAO,EACP,OAAO,EACP,UAAU,EACV,aAAa,GACd,EAAE,uBAAuB,+BA8FzB"}

package/dist/overlay/CommandPaletteList.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPaletteList.js","sources":["../../src/overlay/CommandPaletteList.tsx"],"sourcesContent":["import { Fragment, type RefObject } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport type { CommandGroup, CommandItem } from \"./CommandPalette.model\";\n\nexport type CommandPaletteListProps = {\n  groups: CommandGroup[];\n  /** Flattened rows, in render order — index space for `activeIndex`. */\n  items: CommandItem[];\n  activeIndex: number;\n  listId: string;\n  optionId: (item: CommandItem) => string;\n  onActivate: (item: CommandItem) => void;\n  onHover: (index: number) => void;\n  listRef: RefObject<HTMLDivElement>;\n  loading?: boolean | undefined;\n  emptyState?: React.ReactNode;\n  listMaxHeight: string | number;\n};\n\n/**\n * The palette's grouped listbox. Headings are `role=\"presentation\"` so the\n * option index space stays contiguous — the same trick Combobox uses to scroll\n * by `[role=\"option\"]` index.\n */\nexport function CommandPaletteList({\n  groups,\n  items,\n  activeIndex,\n  listId,\n  optionId,\n  onActivate,\n  onHover,\n  listRef,\n  loading,\n  emptyState,\n  listMaxHeight,\n}: CommandPaletteListProps) {\n  // A flat cursor walked alongside the nested render so each row knows its index\n  // in the flattened list without a lookup.\n  let flatIndex = -1;\n\n  return (\n    <div\n      ref={listRef}\n      id={listId}\n      role=\"listbox\"\n      aria-label=\"Commands\"\n      className=\"overflow-y-auto overscroll-contain py-density-1\"\n      style={{ maxHeight: listMaxHeight }}\n    >\n      {loading ? (\n        <div className=\"px-density-3 py-density-3 text-sm text-muted-foreground\">Searching…</div>\n      ) : items.length === 0 ? (\n        <div className=\"px-density-3 py-density-4 text-center text-sm text-muted-foreground\">\n          {emptyState ?? \"No results\"}\n        </div>\n      ) : (\n        groups.map((group) => {\n          const headingId = `${listId}-group-${group.id}`;\n          return (\n            <Fragment key={group.id}>\n              <div role=\"group\" aria-labelledby={group.heading ? headingId : undefined}>\n                {group.heading && (\n                  <div\n                    id={headingId}\n                    role=\"presentation\"\n                    className=\"px-density-3 pb-1 pt-density-2 text-[10px] font-semibold uppercase tracking-[0.18em] text-muted-foreground\"\n                  >\n                    {group.heading}\n                  </div>\n                )}\n                {group.items.map((item) => {\n                  flatIndex += 1;\n                  const index = flatIndex;\n                  const active = index === activeIndex;\n                  return (\n                    <div\n                      key={item.id}\n                      id={optionId(item)}\n                      role=\"option\"\n                      aria-selected={active}\n                      aria-disabled={item.disabled || undefined}\n                      // onMouseMove, not onMouseEnter: keyboard navigation\n                      // scrolls rows under a stationary cursor, and mouseenter\n                      // would yank the highlight back to wherever it sits.\n                      onMouseMove={() => {\n                        if (!item.disabled) onHover(index);\n                      }}\n                      onClick={() => {\n                        if (!item.disabled) onActivate(item);\n                      }}\n                      className={cn(\n                        \"mx-density-1 flex cursor-pointer items-center gap-density-2 rounded-md px-density-2 py-1.5 text-sm\",\n                        active && \"bg-accent text-accent-foreground\",\n                        item.disabled && \"cursor-not-allowed opacity-50\",\n                      )}\n                    >\n                      {item.icon !== undefined && (\n                        <span className=\"flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground\">\n                          <Icon\n                            {...(typeof item.icon === \"string\"\n                              ? { name: item.icon }\n                              : { icon: item.icon })}\n                          />\n                        </span>\n                      )}\n                      <span className=\"min-w-0 flex-1 truncate\">\n                        {item.label}\n                        {item.description && (\n                          <span className=\"ml-density-2 text-xs text-muted-foreground\">\n                            {item.description}\n                          </span>\n                        )}\n                      </span>\n                      {item.trailing}\n                      {item.shortcut && (\n                        <kbd className=\"shrink-0 rounded border border-border bg-muted px-1.5 py-0.5 font-mono text-[10px] text-muted-foreground\">\n                          {item.shortcut}\n                        </kbd>\n                      )}\n                    </div>\n                  );\n                })}\n              </div>\n            </Fragment>\n          );\n        })\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAyBO,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAG1B,MAAI,YAAY;AAEhB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,cAAW;AAAA,MACX,WAAU;AAAA,MACV,OAAO,EAAE,WAAW,cAAA;AAAA,MAEnB,UAAA,8BACE,OAAA,EAAI,WAAU,2DAA0D,UAAA,aAAA,CAAU,IACjF,MAAM,WAAW,wBAClB,OAAA,EAAI,WAAU,uEACZ,UAAA,cAAc,aAAA,CACjB,IAEA,OAAO,IAAI,CAAC,UAAU;AACpB,cAAM,YAAY,GAAG,MAAM,UAAU,MAAM,EAAE;AAC7C,eACE,oBAAC,UAAA,EACC,UAAA,qBAAC,OAAA,EAAI,MAAK,SAAQ,mBAAiB,MAAM,UAAU,YAAY,QAC5D,UAAA;AAAA,UAAA,MAAM,WACL;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,WAAU;AAAA,cAET,UAAA,MAAM;AAAA,YAAA;AAAA,UAAA;AAAA,UAGV,MAAM,MAAM,IAAI,CAAC,SAAS;AACzB,yBAAa;AACb,kBAAM,QAAQ;AACd,kBAAM,SAAS,UAAU;AACzB,mBACE;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,IAAI,SAAS,IAAI;AAAA,gBACjB,MAAK;AAAA,gBACL,iBAAe;AAAA,gBACf,iBAAe,KAAK,YAAY;AAAA,gBAIhC,aAAa,MAAM;AACjB,sBAAI,CAAC,KAAK,SAAU,SAAQ,KAAK;AAAA,gBACnC;AAAA,gBACA,SAAS,MAAM;AACb,sBAAI,CAAC,KAAK,SAAU,YAAW,IAAI;AAAA,gBACrC;AAAA,gBACA,WAAW;AAAA,kBACT;AAAA,kBACA,UAAU;AAAA,kBACV,KAAK,YAAY;AAAA,gBAAA;AAAA,gBAGlB,UAAA;AAAA,kBAAA,KAAK,SAAS,UACb,oBAAC,QAAA,EAAK,WAAU,2EACd,UAAA;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACE,GAAI,OAAO,KAAK,SAAS,WACtB,EAAE,MAAM,KAAK,KAAA,IACb,EAAE,MAAM,KAAK,KAAA;AAAA,oBAAK;AAAA,kBAAA,GAE1B;AAAA,kBAEF,qBAAC,QAAA,EAAK,WAAU,2BACb,UAAA;AAAA,oBAAA,KAAK;AAAA,oBACL,KAAK,eACJ,oBAAC,UAAK,WAAU,8CACb,eAAK,YAAA,CACR;AAAA,kBAAA,GAEJ;AAAA,kBACC,KAAK;AAAA,kBACL,KAAK,YACJ,oBAAC,SAAI,WAAU,4GACZ,eAAK,SAAA,CACR;AAAA,gBAAA;AAAA,cAAA;AAAA,cAzCG,KAAK;AAAA,YAAA;AAAA,UA6ChB,CAAC;AAAA,QAAA,GACH,EAAA,GA/Da,MAAM,EAgErB;AAAA,MAEJ,CAAC;AAAA,IAAA;AAAA,EAAA;AAIT;"}
+{"version":3,"file":"CommandPaletteList.js","sources":["../../src/overlay/CommandPaletteList.tsx"],"sourcesContent":["import { Fragment, type RefObject } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport type { CommandGroup, CommandItem } from \"./CommandPalette.model\";\n\nexport type CommandPaletteListProps = {\n  groups: CommandGroup[];\n  /** Flattened rows, in render order — index space for `activeIndex`. */\n  items: CommandItem[];\n  activeIndex: number;\n  listId: string;\n  optionId: (item: CommandItem) => string;\n  onActivate: (item: CommandItem) => void;\n  onHover: (index: number) => void;\n  listRef: RefObject<HTMLDivElement | null>;\n  loading?: boolean | undefined;\n  emptyState?: React.ReactNode;\n  listMaxHeight: string | number;\n};\n\n/**\n * The palette's grouped listbox. Headings are `role=\"presentation\"` so the\n * option index space stays contiguous — the same trick Combobox uses to scroll\n * by `[role=\"option\"]` index.\n */\nexport function CommandPaletteList({\n  groups,\n  items,\n  activeIndex,\n  listId,\n  optionId,\n  onActivate,\n  onHover,\n  listRef,\n  loading,\n  emptyState,\n  listMaxHeight,\n}: CommandPaletteListProps) {\n  // A flat cursor walked alongside the nested render so each row knows its index\n  // in the flattened list without a lookup.\n  let flatIndex = -1;\n\n  return (\n    <div\n      ref={listRef}\n      id={listId}\n      role=\"listbox\"\n      aria-label=\"Commands\"\n      className=\"overflow-y-auto overscroll-contain py-density-1\"\n      style={{ maxHeight: listMaxHeight }}\n    >\n      {loading ? (\n        <div className=\"px-density-3 py-density-3 text-sm text-muted-foreground\">Searching…</div>\n      ) : items.length === 0 ? (\n        <div className=\"px-density-3 py-density-4 text-center text-sm text-muted-foreground\">\n          {emptyState ?? \"No results\"}\n        </div>\n      ) : (\n        groups.map((group) => {\n          const headingId = `${listId}-group-${group.id}`;\n          return (\n            <Fragment key={group.id}>\n              <div role=\"group\" aria-labelledby={group.heading ? headingId : undefined}>\n                {group.heading && (\n                  <div\n                    id={headingId}\n                    role=\"presentation\"\n                    className=\"px-density-3 pb-1 pt-density-2 text-[10px] font-semibold uppercase tracking-[0.18em] text-muted-foreground\"\n                  >\n                    {group.heading}\n                  </div>\n                )}\n                {group.items.map((item) => {\n                  flatIndex += 1;\n                  const index = flatIndex;\n                  const active = index === activeIndex;\n                  return (\n                    <div\n                      key={item.id}\n                      id={optionId(item)}\n                      role=\"option\"\n                      aria-selected={active}\n                      aria-disabled={item.disabled || undefined}\n                      // onMouseMove, not onMouseEnter: keyboard navigation\n                      // scrolls rows under a stationary cursor, and mouseenter\n                      // would yank the highlight back to wherever it sits.\n                      onMouseMove={() => {\n                        if (!item.disabled) onHover(index);\n                      }}\n                      onClick={() => {\n                        if (!item.disabled) onActivate(item);\n                      }}\n                      className={cn(\n                        \"mx-density-1 flex cursor-pointer items-center gap-density-2 rounded-md px-density-2 py-1.5 text-sm\",\n                        active && \"bg-accent text-accent-foreground\",\n                        item.disabled && \"cursor-not-allowed opacity-50\",\n                      )}\n                    >\n                      {item.icon !== undefined && (\n                        <span className=\"flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground\">\n                          <Icon\n                            {...(typeof item.icon === \"string\"\n                              ? { name: item.icon }\n                              : { icon: item.icon })}\n                          />\n                        </span>\n                      )}\n                      <span className=\"min-w-0 flex-1 truncate\">\n                        {item.label}\n                        {item.description && (\n                          <span className=\"ml-density-2 text-xs text-muted-foreground\">\n                            {item.description}\n                          </span>\n                        )}\n                      </span>\n                      {item.trailing}\n                      {item.shortcut && (\n                        <kbd className=\"shrink-0 rounded border border-border bg-muted px-1.5 py-0.5 font-mono text-[10px] text-muted-foreground\">\n                          {item.shortcut}\n                        </kbd>\n                      )}\n                    </div>\n                  );\n                })}\n              </div>\n            </Fragment>\n          );\n        })\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAyBO,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAG1B,MAAI,YAAY;AAEhB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,cAAW;AAAA,MACX,WAAU;AAAA,MACV,OAAO,EAAE,WAAW,cAAA;AAAA,MAEnB,UAAA,8BACE,OAAA,EAAI,WAAU,2DAA0D,UAAA,aAAA,CAAU,IACjF,MAAM,WAAW,wBAClB,OAAA,EAAI,WAAU,uEACZ,UAAA,cAAc,aAAA,CACjB,IAEA,OAAO,IAAI,CAAC,UAAU;AACpB,cAAM,YAAY,GAAG,MAAM,UAAU,MAAM,EAAE;AAC7C,eACE,oBAAC,UAAA,EACC,UAAA,qBAAC,OAAA,EAAI,MAAK,SAAQ,mBAAiB,MAAM,UAAU,YAAY,QAC5D,UAAA;AAAA,UAAA,MAAM,WACL;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,WAAU;AAAA,cAET,UAAA,MAAM;AAAA,YAAA;AAAA,UAAA;AAAA,UAGV,MAAM,MAAM,IAAI,CAAC,SAAS;AACzB,yBAAa;AACb,kBAAM,QAAQ;AACd,kBAAM,SAAS,UAAU;AACzB,mBACE;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,IAAI,SAAS,IAAI;AAAA,gBACjB,MAAK;AAAA,gBACL,iBAAe;AAAA,gBACf,iBAAe,KAAK,YAAY;AAAA,gBAIhC,aAAa,MAAM;AACjB,sBAAI,CAAC,KAAK,SAAU,SAAQ,KAAK;AAAA,gBACnC;AAAA,gBACA,SAAS,MAAM;AACb,sBAAI,CAAC,KAAK,SAAU,YAAW,IAAI;AAAA,gBACrC;AAAA,gBACA,WAAW;AAAA,kBACT;AAAA,kBACA,UAAU;AAAA,kBACV,KAAK,YAAY;AAAA,gBAAA;AAAA,gBAGlB,UAAA;AAAA,kBAAA,KAAK,SAAS,UACb,oBAAC,QAAA,EAAK,WAAU,2EACd,UAAA;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACE,GAAI,OAAO,KAAK,SAAS,WACtB,EAAE,MAAM,KAAK,KAAA,IACb,EAAE,MAAM,KAAK,KAAA;AAAA,oBAAK;AAAA,kBAAA,GAE1B;AAAA,kBAEF,qBAAC,QAAA,EAAK,WAAU,2BACb,UAAA;AAAA,oBAAA,KAAK;AAAA,oBACL,KAAK,eACJ,oBAAC,UAAK,WAAU,8CACb,eAAK,YAAA,CACR;AAAA,kBAAA,GAEJ;AAAA,kBACC,KAAK;AAAA,kBACL,KAAK,YACJ,oBAAC,SAAI,WAAU,4GACZ,eAAK,SAAA,CACR;AAAA,gBAAA;AAAA,cAAA;AAAA,cAzCG,KAAK;AAAA,YAAA;AAAA,UA6ChB,CAAC;AAAA,QAAA,GACH,EAAA,GA/Da,MAAM,EAgErB;AAAA,MAEJ,CAAC;AAAA,IAAA;AAAA,EAAA;AAIT;"}

package/dist/overlay/CommandPaletteTrigger.d.ts

@@ -18,5 +18,5 @@ export type CommandPaletteTriggerProps = {
  * screen readers as a searchbox that does not search, and typing into it does
  * nothing.
  */
-export declare function CommandPaletteTrigger({ onClick, open, label, hotkey, className, }: CommandPaletteTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare function CommandPaletteTrigger({ onClick, open, label, hotkey, className, }: CommandPaletteTriggerProps): import("react").JSX.Element;
 //# sourceMappingURL=CommandPaletteTrigger.d.ts.map

package/dist/overlay/CommandPaletteTrigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommandPaletteTrigger.d.ts","sourceRoot":"","sources":["../../src/overlay/CommandPaletteTrigger.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,0BAA0B,GAAG;IACvC,yBAAyB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wFAAwF;IACxF,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,MAAgB,EAChB,SAAS,GACV,EAAE,0BAA0B,2CAsB5B"}
+{"version":3,"file":"CommandPaletteTrigger.d.ts","sourceRoot":"","sources":["../../src/overlay/CommandPaletteTrigger.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,0BAA0B,GAAG;IACvC,yBAAyB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wFAAwF;IACxF,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,OAAO,EACP,IAAI,EACJ,KAAiB,EACjB,MAAgB,EAChB,SAAS,GACV,EAAE,0BAA0B,+BAsB5B"}

package/dist/overlay/ContextMenu.d.ts

@@ -4,5 +4,5 @@ export type ContextMenuProps = {
     menuLabel: string;
     menuItems: DropdownMenuItem[];
 };
-export declare function ContextMenu(props: ContextMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare function ContextMenu(props: ContextMenuProps): import("react").JSX.Element;
 //# sourceMappingURL=ContextMenu.d.ts.map

package/dist/overlay/ContextMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/overlay/ContextMenu.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAKvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC;IAClC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,gBAAgB,EAAE,CAAC;CAC/B,CAAC;AAwJF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAMlD"}
+{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/overlay/ContextMenu.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAKvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC;IAClC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,gBAAgB,EAAE,CAAC;CAC/B,CAAC;AAwJF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BAMlD"}

package/dist/overlay/DropdownMenu.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
 import { ButtonProps } from '../components/button';
 import { StaticIconComponent } from '../data/Icon';
 export type DropdownMenuItem = {
@@ -66,5 +66,5 @@ export type DropdownMenuProps = {
  * `children` opens a flyout submenu. The FloatingTree lets every level cooperate
  * on focus and dismissal, so selecting any leaf closes the whole menu.
  */
-export declare function DropdownMenu(props: DropdownMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare function DropdownMenu(props: DropdownMenuProps): import("react").JSX.Element;
 //# sourceMappingURL=DropdownMenu.d.ts.map

package/dist/overlay/DropdownMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/overlay/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAqBpE,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAM9D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,qBAAqB;IACrB,KAAK,EAAE,SAAS,CAAC;IACjB,4EAA4E;IAC5E,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,+EAA+E;IAC/E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yBAAyB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,yDAAyD;IACzD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,wDAAwD;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC,oDAAoD;IACpD,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,kFAAkF;IAClF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oEAAoE;IACpE,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,IAAI,KAAK,SAAS,CAAC;IAChD,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+FAA+F;IAC/F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,kDAAkD;IAClD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAMpD"}
+{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/overlay/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAqBpE,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAM9D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,qBAAqB;IACrB,KAAK,EAAE,SAAS,CAAC;IACjB,4EAA4E;IAC5E,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,+EAA+E;IAC/E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yBAAyB;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,yDAAyD;IACzD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,wDAAwD;IACxD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC,oDAAoD;IACpD,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,kFAAkF;IAClF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oEAAoE;IACpE,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,IAAI,KAAK,SAAS,CAAC;IAChD,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,+FAA+F;IAC/F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,kDAAkD;IAClD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAMpD"}

package/dist/overlay/DropdownMenuSubmenu.d.ts

@@ -8,5 +8,5 @@ import { DropdownMenuItem } from './DropdownMenu';
  */
 export declare function MenuItemList({ items }: {
     items: DropdownMenuItem[];
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 //# sourceMappingURL=DropdownMenuSubmenu.d.ts.map

package/dist/overlay/DropdownMenuSubmenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenuSubmenu.d.ts","sourceRoot":"","sources":["../../src/overlay/DropdownMenuSubmenu.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA4NvD;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,gBAAgB,EAAE,CAAA;CAAE,2CAwBpE"}
+{"version":3,"file":"DropdownMenuSubmenu.d.ts","sourceRoot":"","sources":["../../src/overlay/DropdownMenuSubmenu.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA4NvD;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,gBAAgB,EAAE,CAAA;CAAE,+BAwBpE"}

package/dist/overlay/HoverCard.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
 export type HoverCardPlacement = "top" | "bottom" | "left" | "right";
 export type HoverCardProps = {
     /** Trigger content that opens the card on hover/focus. */
@@ -16,5 +16,5 @@ export type HoverCardProps = {
     /** Classes applied to the floating card. */
     cardClassName?: string | undefined;
 };
-export declare function HoverCard({ trigger, children, placement, delay, arrow, className, cardClassName, }: HoverCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function HoverCard({ trigger, children, placement, delay, arrow, className, cardClassName, }: HoverCardProps): import("react").JSX.Element;
 //# sourceMappingURL=HoverCard.d.ts.map

package/dist/overlay/HoverCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../src/overlay/HoverCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrF,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG;IAC3B,0DAA0D;IAC1D,OAAO,EAAE,SAAS,CAAC;IACnB,6BAA6B;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kCAAkC;IAClC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC,CAAC;AAUF,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,SAAiB,EACjB,KAAS,EACT,KAAY,EACZ,SAAS,EACT,aAAa,GACd,EAAE,cAAc,2CAgIhB"}
+{"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../src/overlay/HoverCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKrF,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG;IAC3B,0DAA0D;IAC1D,OAAO,EAAE,SAAS,CAAC;IACnB,6BAA6B;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kCAAkC;IAClC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC,CAAC;AAUF,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,SAAiB,EACjB,KAAS,EACT,KAAY,EACZ,SAAS,EACT,aAAa,GACd,EAAE,cAAc,+BAgIhB"}

package/dist/overlay/Modal.cjs

@@ -8,6 +8,7 @@ const Icon = require("../data/Icon.cjs");
 const button = require("../components/button.cjs");
 const modalStack = require("./modalStack.cjs");
 const zIndex = require("./zIndex.cjs");
+const UiArrowLeft = require("../icons/components/UiArrowLeft.cjs");
 const UiFullscreen = require("../icons/components/UiFullscreen.cjs");
 const UiClose = require("../icons/components/UiClose.cjs");
 const sizeClass = {
@@ -24,6 +25,25 @@ const DEFAULT_CONFIRM = {
   confirmLabel: "Discard",
   cancelLabel: "Keep editing"
 };
+const MOBILE_QUERY = "(max-width: 639px)";
+const REDUCED_MOTION_QUERY = "(prefers-reduced-motion: reduce)";
+const MOBILE_TRANSITION_MS = 200;
+const FOCUSABLE_SELECTOR = [
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  "[tabindex]:not([tabindex='-1'])"
+].join(",");
+function visibleFocusableElements(container) {
+  return Array.from(
+    container.querySelectorAll(FOCUSABLE_SELECTOR)
+  ).filter((element) => {
+    const style = window.getComputedStyle(element);
+    return !element.hidden && style.display !== "none" && style.visibility !== "hidden";
+  });
+}
 function Modal({
   open,
   onClose,
@@ -42,13 +62,46 @@ function Modal({
   children
 }) {
   const dialogRef = react.useRef(null);
-  const { depth } = modalStack.useModalStack(open);
+  const closeTimerRef = react.useRef(void 0);
+  const openFrameRef = react.useRef(void 0);
+  const [present, setPresent] = react.useState(open);
+  const [mobileVisible, setMobileVisible] = react.useState(false);
+  const { depth } = modalStack.useModalStack(present);
   const [expanded, setExpanded] = react.useState(false);
   const [confirming, setConfirming] = react.useState(false);
   const requestClose = () => {
     if (confirmClose) setConfirming(true);
     else onClose();
   };
+  react.useEffect(() => {
+    window.clearTimeout(closeTimerRef.current);
+    window.cancelAnimationFrame(openFrameRef.current ?? 0);
+    const animateMobile = window.matchMedia(MOBILE_QUERY).matches && !window.matchMedia(REDUCED_MOTION_QUERY).matches;
+    if (open) {
+      setPresent(true);
+      if (animateMobile) {
+        setMobileVisible(false);
+        openFrameRef.current = window.requestAnimationFrame(() => {
+          setMobileVisible(true);
+        });
+      } else {
+        setMobileVisible(true);
+      }
+    } else if (animateMobile) {
+      setMobileVisible(false);
+      closeTimerRef.current = window.setTimeout(
+        () => setPresent(false),
+        MOBILE_TRANSITION_MS
+      );
+    } else {
+      setMobileVisible(false);
+      setPresent(false);
+    }
+    return () => {
+      window.clearTimeout(closeTimerRef.current);
+      window.cancelAnimationFrame(openFrameRef.current ?? 0);
+    };
+  }, [open]);
   react.useEffect(() => {
     if (!open) {
       setExpanded(false);
@@ -58,14 +111,11 @@ function Modal({
   react.useEffect(() => {
     if (!confirmClose) setConfirming(false);
   }, [confirmClose]);
-  modalStack.useEscapeLayer(
-    open,
-    () => {
-      if (confirming) setConfirming(false);
-      else requestClose();
-    },
-    closeOnEsc
-  );
+  modalStack.useEscapeLayer(present, () => {
+    if (!open || !closeOnEsc) return;
+    if (confirming) setConfirming(false);
+    else requestClose();
+  });
   react.useEffect(() => {
     var _a;
     if (!open) return;
@@ -76,12 +126,12 @@ function Modal({
       return (_a2 = prev == null ? void 0 : prev.focus) == null ? void 0 : _a2.call(prev);
     };
   }, [open]);
-  if (!open) return null;
+  if (!present) return null;
   const overlay = /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       className: utils.cn(
-        "fixed inset-0 flex items-center justify-center p-density-2 sm:p-density-4",
+        "fixed inset-0 flex items-center justify-center p-density-2 sm:p-density-4 max-sm:items-stretch max-sm:justify-end max-sm:p-0 max-sm:!bg-transparent",
         // Nested modals dim less so the dialog they opened over stays visible.
         depth === 0 ? "bg-black/40" : "bg-black/20"
       ),
@@ -96,8 +146,12 @@ function Modal({
           role: "dialog",
           "aria-modal": "true",
           "aria-label": typeof title === "string" ? title : void 0,
+          "data-state": mobileVisible ? "open" : "closed",
           className: utils.cn(
             "relative flex w-full flex-col overflow-hidden rounded-lg border border-border bg-background shadow-xl",
+            "max-sm:!h-dvh max-sm:!max-h-dvh max-sm:!max-w-none max-sm:!rounded-none max-sm:!border-0 max-sm:shadow-none",
+            "max-sm:transition-transform max-sm:duration-200 max-sm:ease-out max-sm:motion-reduce:transition-none",
+            "max-sm:data-[state=closed]:translate-x-full max-sm:data-[state=open]:translate-x-0",
             expanded ? sizeClass.full : sizeClass[size],
             className
           ),
@@ -106,10 +160,43 @@ function Modal({
             ...expanded ? { height: "calc(100dvh - 2rem)" } : {}
           },
           onClick: (e) => e.stopPropagation(),
+          onKeyDown: (event) => {
+            var _a;
+            if (event.key !== "Tab") return;
+            const scope = confirming ? (_a = dialogRef.current) == null ? void 0 : _a.querySelector(
+              "[role='alertdialog']"
+            ) : dialogRef.current;
+            if (!scope) return;
+            const focusable = visibleFocusableElements(scope);
+            const first = focusable[0];
+            const last = focusable[focusable.length - 1];
+            if (!first || !last) {
+              event.preventDefault();
+              scope.focus();
+            } else if (event.shiftKey && document.activeElement === first) {
+              event.preventDefault();
+              last.focus();
+            } else if (!event.shiftKey && document.activeElement === last) {
+              event.preventDefault();
+              first.focus();
+            }
+          },
           children: [
-            (title || subtitle || headerSlot || expandable || !hideClose) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "shrink-0 px-density-4 py-density-3 border-b border-border", children: [
+            (title || subtitle || headerSlot || expandable || !hideClose) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "shrink-0 px-density-4 py-density-3 border-b border-border max-sm:min-h-14 max-sm:bg-background", children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-density-2", children: [
-                title ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm font-semibold flex-1", children: title }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1" }),
+                !hideClose && /* @__PURE__ */ jsxRuntime.jsx(
+                  button.Button,
+                  {
+                    type: "button",
+                    onClick: requestClose,
+                    variant: "ghost",
+                    size: "icon",
+                    "aria-label": "Back",
+                    className: "-ml-2 text-foreground sm:hidden",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiArrowLeft.UiArrowLeft })
+                  }
+                ),
+                title ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-sm font-semibold flex-1 max-sm:text-base max-sm:leading-6", children: title }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1" }),
                 headerSlot,
                 expandable && /* @__PURE__ */ jsxRuntime.jsx(
                   "button",
@@ -117,7 +204,7 @@ function Modal({
                     type: "button",
                     onClick: () => setExpanded((v) => !v),
                     "aria-label": expanded ? "Restore size" : "Expand to fullscreen",
-                    className: "text-muted-foreground hover:text-foreground",
+                    className: "text-muted-foreground hover:text-foreground max-sm:hidden",
                     children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: expanded ? UiFullscreen.UiFullscreenFilled : UiFullscreen.UiFullscreen })
                   }
                 ),
@@ -127,7 +214,7 @@ function Modal({
                     type: "button",
                     onClick: requestClose,
                     "aria-label": "Close",
-                    className: "text-muted-foreground hover:text-foreground",
+                    className: "text-muted-foreground hover:text-foreground max-sm:hidden",
                     children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiClose.UiClose })
                   }
                 )
@@ -139,7 +226,7 @@ function Modal({
               {
                 "data-slot": "modal-body",
                 className: utils.cn(
-                  "min-h-0 flex-1 px-density-4 py-density-3",
+                  "min-h-0 flex-1 px-density-4 py-density-3 max-sm:py-density-4",
                   scrollBody ? "overflow-auto" : "flex flex-col overflow-hidden"
                 ),
                 children
@@ -149,7 +236,7 @@ function Modal({
               "div",
               {
                 "data-slot": "modal-footer",
-                className: "shrink-0 px-density-4 py-density-3 border-t border-border",
+                className: "shrink-0 px-density-4 py-density-3 border-t border-border max-sm:py-density-4",
                 children: footer
               }
             ),
@@ -179,7 +266,7 @@ function ConfirmClosePrompt({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: "absolute inset-0 z-10 flex items-center justify-center rounded-lg bg-background/80 p-density-4",
+      className: "absolute inset-0 z-10 flex items-center justify-center rounded-lg bg-background/80 p-density-4 max-sm:rounded-none",
       role: "alertdialog",
       "aria-modal": "true",
       "aria-label": typeof options.title === "string" ? options.title : "Confirm close",

package/dist/overlay/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":["../../src/overlay/Modal.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { Button } from \"../components/button\";\nimport { UiClose, UiFullscreen, UiFullscreenFilled } from \"../icons\";\nimport { useEscapeLayer, useModalStack } from \"./modalStack\";\nimport { zIndex } from \"./zIndex\";\n\nexport type ModalSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"full\";\n\n/** Copy for the discard-confirmation prompt shown before a guarded close. */\nexport type ConfirmCloseOptions = {\n  /** Heading of the confirmation prompt. */\n  title?: ReactNode;\n  /** Body explaining what is lost on close. */\n  message?: ReactNode;\n  /** Label of the button that proceeds with closing. */\n  confirmLabel?: string;\n  /** Label of the button that dismisses the prompt and keeps the modal open. */\n  cancelLabel?: string;\n};\n\nexport type ModalProps = {\n  /** Controls whether the modal is mounted. */\n  open: boolean;\n  /** Called when the modal requests to close. */\n  onClose: () => void;\n  /**\n   * Guard every close path (close button, Escape, backdrop) behind a discard\n   * confirmation. `true` uses the default copy; pass options to customise it.\n   * `onClose` only fires once the user confirms. Set this while the modal holds\n   * unsaved edits and clear it (or pass `false`) once there is nothing to lose.\n   */\n  confirmClose?: boolean | ConfirmCloseOptions;\n  /** Header title and accessible dialog label when it is a string. */\n  title?: ReactNode;\n  /**\n   * Secondary header content rendered on its own row directly beneath the title.\n   * The title stays a single row alongside the expand/close buttons, so a tall\n   * subtitle (e.g. a tab switcher) never pushes those buttons down.\n   */\n  subtitle?: ReactNode;\n  /** Width/height preset for the dialog. */\n  size?: ModalSize;\n  /** Close when the backdrop is clicked. Off by default; close via Escape or the close button. */\n  closeOnBackdrop?: boolean;\n  /** Close when Escape is pressed. */\n  closeOnEsc?: boolean;\n  /** Hide the close button. */\n  hideClose?: boolean;\n  /** Show an expand/restore button. */\n  expandable?: boolean;\n  /** Classes applied to the dialog panel. */\n  className?: string;\n  /** Extra header content rendered before the expand/close buttons. */\n  headerSlot?: ReactNode;\n  /** Footer content pinned below the scrollable body. */\n  footer?: ReactNode;\n  /**\n   * Whether the body scrolls its overflow. Default `true`. Set `false` when the\n   * body owns a single fill-height child that scrolls internally (e.g. a\n   * DataTable with a sticky header): the body becomes a non-scrolling flex\n   * column, so only that child's own scroll region moves.\n   */\n  scrollBody?: boolean;\n  /** Modal body content. */\n  children: ReactNode;\n};\n\nconst sizeClass: Record<ModalSize, string> = {\n  sm: \"max-w-sm\",\n  md: \"max-w-md\",\n  lg: \"max-w-2xl\",\n  xl: \"max-w-4xl\",\n  \"2xl\": \"max-w-6xl\",\n  full: \"max-w-[95vw]\",\n};\n\nconst DEFAULT_CONFIRM: Required<ConfirmCloseOptions> = {\n  title: \"Discard changes?\",\n  message: \"You have unsaved changes. Closing now will discard them.\",\n  confirmLabel: \"Discard\",\n  cancelLabel: \"Keep editing\",\n};\n\nexport function Modal({\n  open,\n  onClose,\n  confirmClose = false,\n  title,\n  subtitle,\n  size = \"md\",\n  closeOnBackdrop = false,\n  closeOnEsc = true,\n  hideClose = false,\n  expandable = true,\n  className,\n  headerSlot,\n  footer,\n  scrollBody = true,\n  children,\n}: ModalProps) {\n  const dialogRef = useRef<HTMLDivElement>(null);\n  const { depth } = useModalStack(open);\n  const [expanded, setExpanded] = useState(false);\n  // When confirmClose is active, a close request opens this prompt instead of\n  // closing outright; onClose only fires once the user confirms the discard.\n  const [confirming, setConfirming] = useState(false);\n\n  // requestClose is the single entry point for every close affordance. With the\n  // guard on, it surfaces the confirmation; otherwise it closes immediately.\n  const requestClose = () => {\n    if (confirmClose) setConfirming(true);\n    else onClose();\n  };\n\n  useEffect(() => {\n    if (!open) {\n      setExpanded(false);\n      setConfirming(false);\n    }\n  }, [open]);\n\n  // A close guard that disappears mid-prompt (changes saved/reverted) should\n  // not leave a stale confirmation dialog up.\n  useEffect(() => {\n    if (!confirmClose) setConfirming(false);\n  }, [confirmClose]);\n\n  useEscapeLayer(\n    open,\n    () => {\n      // While the prompt is up, Escape dismisses the prompt rather than the modal.\n      if (confirming) setConfirming(false);\n      else requestClose();\n    },\n    closeOnEsc,\n  );\n\n  useEffect(() => {\n    if (!open) return;\n    const prev = document.activeElement as HTMLElement | null;\n    dialogRef.current?.focus();\n    return () => prev?.focus?.();\n  }, [open]);\n\n  if (!open) return null;\n\n  const overlay = (\n    <div\n      className={cn(\n        \"fixed inset-0 flex items-center justify-center p-density-2 sm:p-density-4\",\n        // Nested modals dim less so the dialog they opened over stays visible.\n        depth === 0 ? \"bg-black/40\" : \"bg-black/20\",\n      )}\n      // Sits in the modal band of the centralized z-index scale; +depth keeps\n      // nested modals above their parent. Floating content (dropdowns, tooltips)\n      // computes its z relative to this via useFloatingZIndex so it clears the\n      // modal instead of rendering behind it.\n      style={{ zIndex: zIndex.modal + depth * zIndex.modalStep }}\n      onClick={closeOnBackdrop ? requestClose : undefined}\n      role=\"presentation\"\n    >\n      <div\n        ref={dialogRef}\n        tabIndex={-1}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={typeof title === \"string\" ? title : undefined}\n        className={cn(\n          \"relative flex w-full flex-col overflow-hidden rounded-lg border border-border bg-background shadow-xl\",\n          expanded ? sizeClass.full : sizeClass[size],\n          className,\n        )}\n        // Inline maxHeight (not an arbitrary Tailwind class) so the panel stays\n        // viewport-bounded even when a consumer's Tailwind build can't generate\n        // the dvh utility — e.g. www aliases clicky-ui to source but scans the\n        // published dist. When expanded, fill the viewport.\n        style={{\n          maxHeight: \"calc(100dvh - 2rem)\",\n          ...(expanded ? { height: \"calc(100dvh - 2rem)\" } : {}),\n        }}\n        onClick={(e) => e.stopPropagation()}\n      >\n        {(title || subtitle || headerSlot || expandable || !hideClose) && (\n          <div className=\"shrink-0 px-density-4 py-density-3 border-b border-border\">\n            <div className=\"flex items-center gap-density-2\">\n              {title ? (\n                <h2 className=\"text-sm font-semibold flex-1\">{title}</h2>\n              ) : (\n                <span className=\"flex-1\" />\n              )}\n              {headerSlot}\n              {expandable && (\n                <button\n                  type=\"button\"\n                  onClick={() => setExpanded((v) => !v)}\n                  aria-label={\n                    expanded ? \"Restore size\" : \"Expand to fullscreen\"\n                  }\n                  className=\"text-muted-foreground hover:text-foreground\"\n                >\n                  <Icon icon={expanded ? UiFullscreenFilled : UiFullscreen} />\n                </button>\n              )}\n              {!hideClose && (\n                <button\n                  type=\"button\"\n                  onClick={requestClose}\n                  aria-label=\"Close\"\n                  className=\"text-muted-foreground hover:text-foreground\"\n                >\n                  <Icon icon={UiClose} />\n                </button>\n              )}\n            </div>\n            {subtitle ? <div className=\"mt-density-2\">{subtitle}</div> : null}\n          </div>\n        )}\n        <div\n          data-slot=\"modal-body\"\n          className={cn(\n            \"min-h-0 flex-1 px-density-4 py-density-3\",\n            scrollBody\n              ? \"overflow-auto\"\n              : \"flex flex-col overflow-hidden\",\n          )}\n        >\n          {children}\n        </div>\n        {footer && (\n          <div\n            data-slot=\"modal-footer\"\n            className=\"shrink-0 px-density-4 py-density-3 border-t border-border\"\n          >\n            {footer}\n          </div>\n        )}\n        {confirming && (\n          <ConfirmClosePrompt\n            options={\n              confirmClose === true\n                ? DEFAULT_CONFIRM\n                : { ...DEFAULT_CONFIRM, ...confirmClose }\n            }\n            onConfirm={() => {\n              setConfirming(false);\n              onClose();\n            }}\n            onCancel={() => setConfirming(false)}\n          />\n        )}\n      </div>\n    </div>\n  );\n\n  // Render into document.body so the fixed-position overlay escapes any ancestor\n  // transform/overflow (e.g. a dropdown menu positioned via a CSS transform),\n  // which would otherwise trap position:fixed inside that ancestor's box and clip\n  // the modal to it.\n  return typeof document !== \"undefined\"\n    ? createPortal(overlay, document.body)\n    : null;\n}\n\nfunction ConfirmClosePrompt({\n  options,\n  onConfirm,\n  onCancel,\n}: {\n  options: Required<ConfirmCloseOptions>;\n  onConfirm: () => void;\n  onCancel: () => void;\n}) {\n  return (\n    <div\n      className=\"absolute inset-0 z-10 flex items-center justify-center rounded-lg bg-background/80 p-density-4\"\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      aria-label={\n        typeof options.title === \"string\" ? options.title : \"Confirm close\"\n      }\n      onClick={(e) => e.stopPropagation()}\n    >\n      <div className=\"w-full max-w-sm rounded-lg border border-border bg-background p-density-4 shadow-xl\">\n        <h3 className=\"text-sm font-semibold\">{options.title}</h3>\n        <p className=\"mt-density-2 text-sm text-muted-foreground\">\n          {options.message}\n        </p>\n        <div className=\"mt-density-4 flex justify-end gap-density-2\">\n          <Button variant=\"ghost\" size=\"sm\" onClick={onCancel}>\n            {options.cancelLabel}\n          </Button>\n          <Button variant=\"destructive\" size=\"sm\" onClick={onConfirm}>\n            {options.confirmLabel}\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["useRef","useModalStack","useState","useEffect","useEscapeLayer","_a","jsx","cn","zIndex","jsxs","Icon","UiFullscreenFilled","UiFullscreen","UiClose","createPortal","Button"],"mappings":"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"}
+{"version":3,"file":"Modal.cjs","sources":["../../src/overlay/Modal.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { Button } from \"../components/button\";\nimport {\n  UiArrowLeft,\n  UiClose,\n  UiFullscreen,\n  UiFullscreenFilled,\n} from \"../icons\";\nimport { useEscapeLayer, useModalStack } from \"./modalStack\";\nimport { zIndex } from \"./zIndex\";\n\nexport type ModalSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"full\";\n\n/** Copy for the discard-confirmation prompt shown before a guarded close. */\nexport type ConfirmCloseOptions = {\n  /** Heading of the confirmation prompt. */\n  title?: ReactNode;\n  /** Body explaining what is lost on close. */\n  message?: ReactNode;\n  /** Label of the button that proceeds with closing. */\n  confirmLabel?: string;\n  /** Label of the button that dismisses the prompt and keeps the modal open. */\n  cancelLabel?: string;\n};\n\nexport type ModalProps = {\n  /** Controls whether the modal is mounted. */\n  open: boolean;\n  /** Called when the modal requests to close. */\n  onClose: () => void;\n  /**\n   * Guard every close path (close button, Escape, backdrop) behind a discard\n   * confirmation. `true` uses the default copy; pass options to customise it.\n   * `onClose` only fires once the user confirms. Set this while the modal holds\n   * unsaved edits and clear it (or pass `false`) once there is nothing to lose.\n   */\n  confirmClose?: boolean | ConfirmCloseOptions;\n  /** Header title and accessible dialog label when it is a string. */\n  title?: ReactNode;\n  /**\n   * Secondary header content rendered on its own row directly beneath the title.\n   * The title stays a single row alongside the expand/close buttons, so a tall\n   * subtitle (e.g. a tab switcher) never pushes those buttons down.\n   */\n  subtitle?: ReactNode;\n  /** Width/height preset for the dialog. */\n  size?: ModalSize;\n  /** Close when the backdrop is clicked. Off by default; close via Escape or the close button. */\n  closeOnBackdrop?: boolean;\n  /** Close when Escape is pressed. */\n  closeOnEsc?: boolean;\n  /** Hide the close button. */\n  hideClose?: boolean;\n  /** Show an expand/restore button. */\n  expandable?: boolean;\n  /** Classes applied to the dialog panel. */\n  className?: string;\n  /** Extra header content rendered before the expand/close buttons. */\n  headerSlot?: ReactNode;\n  /** Footer content pinned below the scrollable body. */\n  footer?: ReactNode;\n  /**\n   * Whether the body scrolls its overflow. Default `true`. Set `false` when the\n   * body owns a single fill-height child that scrolls internally (e.g. a\n   * DataTable with a sticky header): the body becomes a non-scrolling flex\n   * column, so only that child's own scroll region moves.\n   */\n  scrollBody?: boolean;\n  /** Modal body content. */\n  children: ReactNode;\n};\n\nconst sizeClass: Record<ModalSize, string> = {\n  sm: \"max-w-sm\",\n  md: \"max-w-md\",\n  lg: \"max-w-2xl\",\n  xl: \"max-w-4xl\",\n  \"2xl\": \"max-w-6xl\",\n  full: \"max-w-[95vw]\",\n};\n\nconst DEFAULT_CONFIRM: Required<ConfirmCloseOptions> = {\n  title: \"Discard changes?\",\n  message: \"You have unsaved changes. Closing now will discard them.\",\n  confirmLabel: \"Discard\",\n  cancelLabel: \"Keep editing\",\n};\n\nconst MOBILE_QUERY = \"(max-width: 639px)\";\nconst REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst MOBILE_TRANSITION_MS = 200;\nconst FOCUSABLE_SELECTOR = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  \"input:not([disabled])\",\n  \"select:not([disabled])\",\n  \"textarea:not([disabled])\",\n  \"[tabindex]:not([tabindex='-1'])\",\n].join(\",\");\n\nfunction visibleFocusableElements(container: HTMLElement): HTMLElement[] {\n  return Array.from(\n    container.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR),\n  ).filter((element) => {\n    const style = window.getComputedStyle(element);\n    return (\n      !element.hidden &&\n      style.display !== \"none\" &&\n      style.visibility !== \"hidden\"\n    );\n  });\n}\n\nexport function Modal({\n  open,\n  onClose,\n  confirmClose = false,\n  title,\n  subtitle,\n  size = \"md\",\n  closeOnBackdrop = false,\n  closeOnEsc = true,\n  hideClose = false,\n  expandable = true,\n  className,\n  headerSlot,\n  footer,\n  scrollBody = true,\n  children,\n}: ModalProps) {\n  const dialogRef = useRef<HTMLDivElement>(null);\n  const closeTimerRef = useRef<number | undefined>(undefined);\n  const openFrameRef = useRef<number | undefined>(undefined);\n  const [present, setPresent] = useState(open);\n  const [mobileVisible, setMobileVisible] = useState(false);\n  const { depth } = useModalStack(present);\n  const [expanded, setExpanded] = useState(false);\n  // When confirmClose is active, a close request opens this prompt instead of\n  // closing outright; onClose only fires once the user confirms the discard.\n  const [confirming, setConfirming] = useState(false);\n\n  // requestClose is the single entry point for every close affordance. With the\n  // guard on, it surfaces the confirmation; otherwise it closes immediately.\n  const requestClose = () => {\n    if (confirmClose) setConfirming(true);\n    else onClose();\n  };\n\n  useEffect(() => {\n    window.clearTimeout(closeTimerRef.current);\n    window.cancelAnimationFrame(openFrameRef.current ?? 0);\n    const animateMobile =\n      window.matchMedia(MOBILE_QUERY).matches &&\n      !window.matchMedia(REDUCED_MOTION_QUERY).matches;\n\n    if (open) {\n      setPresent(true);\n      if (animateMobile) {\n        setMobileVisible(false);\n        openFrameRef.current = window.requestAnimationFrame(() => {\n          setMobileVisible(true);\n        });\n      } else {\n        setMobileVisible(true);\n      }\n    } else if (animateMobile) {\n      setMobileVisible(false);\n      closeTimerRef.current = window.setTimeout(\n        () => setPresent(false),\n        MOBILE_TRANSITION_MS,\n      );\n    } else {\n      setMobileVisible(false);\n      setPresent(false);\n    }\n\n    return () => {\n      window.clearTimeout(closeTimerRef.current);\n      window.cancelAnimationFrame(openFrameRef.current ?? 0);\n    };\n  }, [open]);\n\n  useEffect(() => {\n    if (!open) {\n      setExpanded(false);\n      setConfirming(false);\n    }\n  }, [open]);\n\n  // A close guard that disappears mid-prompt (changes saved/reverted) should\n  // not leave a stale confirmation dialog up.\n  useEffect(() => {\n    if (!confirmClose) setConfirming(false);\n  }, [confirmClose]);\n\n  useEscapeLayer(present, () => {\n    if (!open || !closeOnEsc) return;\n    // While the prompt is up, Escape dismisses the prompt rather than the modal.\n    if (confirming) setConfirming(false);\n    else requestClose();\n  });\n\n  useEffect(() => {\n    if (!open) return;\n    const prev = document.activeElement as HTMLElement | null;\n    dialogRef.current?.focus();\n    return () => prev?.focus?.();\n  }, [open]);\n\n  if (!present) return null;\n\n  const overlay = (\n    <div\n      className={cn(\n        \"fixed inset-0 flex items-center justify-center p-density-2 sm:p-density-4 max-sm:items-stretch max-sm:justify-end max-sm:p-0 max-sm:!bg-transparent\",\n        // Nested modals dim less so the dialog they opened over stays visible.\n        depth === 0 ? \"bg-black/40\" : \"bg-black/20\",\n      )}\n      // Sits in the modal band of the centralized z-index scale; +depth keeps\n      // nested modals above their parent. Floating content (dropdowns, tooltips)\n      // computes its z relative to this via useFloatingZIndex so it clears the\n      // modal instead of rendering behind it.\n      style={{ zIndex: zIndex.modal + depth * zIndex.modalStep }}\n      onClick={closeOnBackdrop ? requestClose : undefined}\n      role=\"presentation\"\n    >\n      <div\n        ref={dialogRef}\n        tabIndex={-1}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={typeof title === \"string\" ? title : undefined}\n        data-state={mobileVisible ? \"open\" : \"closed\"}\n        className={cn(\n          \"relative flex w-full flex-col overflow-hidden rounded-lg border border-border bg-background shadow-xl\",\n          \"max-sm:!h-dvh max-sm:!max-h-dvh max-sm:!max-w-none max-sm:!rounded-none max-sm:!border-0 max-sm:shadow-none\",\n          \"max-sm:transition-transform max-sm:duration-200 max-sm:ease-out max-sm:motion-reduce:transition-none\",\n          \"max-sm:data-[state=closed]:translate-x-full max-sm:data-[state=open]:translate-x-0\",\n          expanded ? sizeClass.full : sizeClass[size],\n          className,\n        )}\n        // Inline maxHeight (not an arbitrary Tailwind class) so the panel stays\n        // viewport-bounded even when a consumer's Tailwind build can't generate\n        // the dvh utility — e.g. www aliases clicky-ui to source but scans the\n        // published dist. When expanded, fill the viewport.\n        style={{\n          maxHeight: \"calc(100dvh - 2rem)\",\n          ...(expanded ? { height: \"calc(100dvh - 2rem)\" } : {}),\n        }}\n        onClick={(e) => e.stopPropagation()}\n        onKeyDown={(event) => {\n          if (event.key !== \"Tab\") return;\n          const scope = confirming\n            ? dialogRef.current?.querySelector<HTMLElement>(\n                \"[role='alertdialog']\",\n              )\n            : dialogRef.current;\n          if (!scope) return;\n          const focusable = visibleFocusableElements(scope);\n          const first = focusable[0];\n          const last = focusable[focusable.length - 1];\n          if (!first || !last) {\n            event.preventDefault();\n            scope.focus();\n          } else 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        {(title || subtitle || headerSlot || expandable || !hideClose) && (\n          <div className=\"shrink-0 px-density-4 py-density-3 border-b border-border max-sm:min-h-14 max-sm:bg-background\">\n            <div className=\"flex items-center gap-density-2\">\n              {!hideClose && (\n                <Button\n                  type=\"button\"\n                  onClick={requestClose}\n                  variant=\"ghost\"\n                  size=\"icon\"\n                  aria-label=\"Back\"\n                  className=\"-ml-2 text-foreground sm:hidden\"\n                >\n                  <Icon icon={UiArrowLeft} />\n                </Button>\n              )}\n              {title ? (\n                <h2 className=\"text-sm font-semibold flex-1 max-sm:text-base max-sm:leading-6\">\n                  {title}\n                </h2>\n              ) : (\n                <span className=\"flex-1\" />\n              )}\n              {headerSlot}\n              {expandable && (\n                <button\n                  type=\"button\"\n                  onClick={() => setExpanded((v) => !v)}\n                  aria-label={\n                    expanded ? \"Restore size\" : \"Expand to fullscreen\"\n                  }\n                  className=\"text-muted-foreground hover:text-foreground max-sm:hidden\"\n                >\n                  <Icon icon={expanded ? UiFullscreenFilled : UiFullscreen} />\n                </button>\n              )}\n              {!hideClose && (\n                <button\n                  type=\"button\"\n                  onClick={requestClose}\n                  aria-label=\"Close\"\n                  className=\"text-muted-foreground hover:text-foreground max-sm:hidden\"\n                >\n                  <Icon icon={UiClose} />\n                </button>\n              )}\n            </div>\n            {subtitle ? <div className=\"mt-density-2\">{subtitle}</div> : null}\n          </div>\n        )}\n        <div\n          data-slot=\"modal-body\"\n          className={cn(\n            \"min-h-0 flex-1 px-density-4 py-density-3 max-sm:py-density-4\",\n            scrollBody ? \"overflow-auto\" : \"flex flex-col overflow-hidden\",\n          )}\n        >\n          {children}\n        </div>\n        {footer && (\n          <div\n            data-slot=\"modal-footer\"\n            className=\"shrink-0 px-density-4 py-density-3 border-t border-border max-sm:py-density-4\"\n          >\n            {footer}\n          </div>\n        )}\n        {confirming && (\n          <ConfirmClosePrompt\n            options={\n              confirmClose === true\n                ? DEFAULT_CONFIRM\n                : { ...DEFAULT_CONFIRM, ...confirmClose }\n            }\n            onConfirm={() => {\n              setConfirming(false);\n              onClose();\n            }}\n            onCancel={() => setConfirming(false)}\n          />\n        )}\n      </div>\n    </div>\n  );\n\n  // Render into document.body so the fixed-position overlay escapes any ancestor\n  // transform/overflow (e.g. a dropdown menu positioned via a CSS transform),\n  // which would otherwise trap position:fixed inside that ancestor's box and clip\n  // the modal to it.\n  return typeof document !== \"undefined\"\n    ? createPortal(overlay, document.body)\n    : null;\n}\n\nfunction ConfirmClosePrompt({\n  options,\n  onConfirm,\n  onCancel,\n}: {\n  options: Required<ConfirmCloseOptions>;\n  onConfirm: () => void;\n  onCancel: () => void;\n}) {\n  return (\n    <div\n      className=\"absolute inset-0 z-10 flex items-center justify-center rounded-lg bg-background/80 p-density-4 max-sm:rounded-none\"\n      role=\"alertdialog\"\n      aria-modal=\"true\"\n      aria-label={\n        typeof options.title === \"string\" ? options.title : \"Confirm close\"\n      }\n      onClick={(e) => e.stopPropagation()}\n    >\n      <div className=\"w-full max-w-sm rounded-lg border border-border bg-background p-density-4 shadow-xl\">\n        <h3 className=\"text-sm font-semibold\">{options.title}</h3>\n        <p className=\"mt-density-2 text-sm text-muted-foreground\">\n          {options.message}\n        </p>\n        <div className=\"mt-density-4 flex justify-end gap-density-2\">\n          <Button variant=\"ghost\" size=\"sm\" onClick={onCancel}>\n            {options.cancelLabel}\n          </Button>\n          <Button variant=\"destructive\" size=\"sm\" onClick={onConfirm}>\n            {options.confirmLabel}\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["useRef","useState","useModalStack","useEffect","useEscapeLayer","_a","jsx","cn","zIndex","jsxs","Button","Icon","UiArrowLeft","UiFullscreenFilled","UiFullscreen","UiClose","createPortal"],"mappings":"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"}

package/dist/overlay/Modal.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
 export type ModalSize = "sm" | "md" | "lg" | "xl" | "2xl" | "full";
 /** Copy for the discard-confirmation prompt shown before a guarded close. */
 export type ConfirmCloseOptions = {
@@ -57,5 +57,5 @@ export type ModalProps = {
     /** Modal body content. */
     children: ReactNode;
 };
-export declare function Modal({ open, onClose, confirmClose, title, subtitle, size, closeOnBackdrop, closeOnEsc, hideClose, expandable, className, headerSlot, footer, scrollBody, children, }: ModalProps): import('react').ReactPortal | null;
+export declare function Modal({ open, onClose, confirmClose, title, subtitle, size, closeOnBackdrop, closeOnEsc, hideClose, expandable, className, headerSlot, footer, scrollBody, children, }: ModalProps): import('../../../../node_modules/@types/react/index.d.ts').ReactPortal | null;
 //# sourceMappingURL=Modal.d.ts.map

package/dist/overlay/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/overlay/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASpE,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM,CAAC;AAEnE,6EAA6E;AAC7E,MAAM,MAAM,mBAAmB,GAAG;IAChC,0CAA0C;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,6CAA6C;IAC7C,IAAI,EAAE,OAAO,CAAC;IACd,+CAA+C;IAC/C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;IAC7C,oEAAoE;IACpE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,gGAAgG;IAChG,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oCAAoC;IACpC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAkBF,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,OAAO,EACP,YAAoB,EACpB,KAAK,EACL,QAAQ,EACR,IAAW,EACX,eAAuB,EACvB,UAAiB,EACjB,SAAiB,EACjB,UAAiB,EACjB,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAiB,EACjB,QAAQ,GACT,EAAE,UAAU,sCAkKZ"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/overlay/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAcpE,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM,CAAC;AAEnE,6EAA6E;AAC7E,MAAM,MAAM,mBAAmB,GAAG;IAChC,0CAA0C;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,6CAA6C;IAC7C,IAAI,EAAE,OAAO,CAAC;IACd,+CAA+C;IAC/C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;IAC7C,oEAAoE;IACpE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,gGAAgG;IAChG,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oCAAoC;IACpC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qEAAqE;IACrE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AA2CF,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,OAAO,EACP,YAAoB,EACpB,KAAK,EACL,QAAQ,EACR,IAAW,EACX,eAAuB,EACvB,UAAiB,EACjB,SAAiB,EACjB,UAAiB,EACjB,SAAS,EACT,UAAU,EACV,MAAM,EACN,UAAiB,EACjB,QAAQ,GACT,EAAE,UAAU,sCA2OZ"}