@womp/kookie-ui 0.30.0 → 0.31.0

package/components.css

@@ -15335,6 +15335,12 @@
   -ms-flex-negative: 1;
       flex-shrink: 1;
 }
+.kui-ToolbarTitle:where([data-mirror]) {
+  opacity: 0;
+}
+.kui-ToolbarTitle:where([data-mirror][data-collapsed]) {
+  opacity: 1;
+}
 :where(.kui-Toolbar) .kui-ToolbarTitle:where(:not(:first-child)) {
   -webkit-margin-start: calc(var(--toolbar-title-gap) - var(--toolbar-gap));
           margin-inline-start: calc(var(--toolbar-title-gap) - var(--toolbar-gap));
@@ -15437,6 +15443,41 @@
   outline: 2px solid var(--focus-8);
   outline-offset: -2px;
 }
+.kui-Page {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  gap: var(--layout-space-8);
+  -webkit-padding-before: var(--layout-space-7);
+          padding-block-start: var(--layout-space-7);
+}
+.kui-PageHeader {
+  position: relative;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  gap: var(--layout-space-6);
+}
+.kui-PageMark {
+  -webkit-margin-after: calc(var(--layout-space-4) - var(--layout-space-6));
+          margin-block-end: calc(var(--layout-space-4) - var(--layout-space-6));
+}
+.kui-PageMarker {
+  position: absolute;
+  inset-block-end: var(--kui-pane-inset-start, 0px);
+  inset-inline-start: 0;
+  block-size: 1px;
+  inline-size: 100%;
+  pointer-events: none;
+}
 .kui-TooltipContent {
   -webkit-box-sizing: border-box;
           box-sizing: border-box;

package/dist/cjs/components/_internal/page-scope.d.ts

@@ -0,0 +1,48 @@
+import * as React from 'react';
+/**
+ * What page is in a pane, and whether its title has scrolled away (from v2, 2026-11-03).
+ *
+ * A page's large title lives inside the scroller and the band that shows it again lives beside
+ * it, so context, which only flows down, cannot carry it from one to the other. The store sits
+ * at their common ancestor, the pane. Each pane provides its own, so two panes can each hold a
+ * titled page; `Shell.Header` provides none, so a `Toolbar.Title` there always speaks for itself.
+ * Outside a Shell there is no scope: a `Page` still draws its heading and a `Toolbar.Title` still
+ * shows its own words.
+ */
+type PageStore = {
+    /** The words of the page in this pane, or null while nothing has claimed it. */
+    title: string | null;
+    /** Every `Toolbar.Title` mirroring this pane's page, as elements: the collapse is written onto them. */
+    mirrors: Set<HTMLElement>;
+    /** Whether the page's own title has scrolled up behind the band. */
+    collapsed: boolean;
+    listeners: Set<() => void>;
+    /** What a subscriber reads: a stable value between notifications. */
+    version: number;
+};
+/**
+ * The collapse is an attribute write, not a render: only CSS reads it, and an observer sends it
+ * twice per visit to a page.
+ */
+declare function setPageCollapsed(store: PageStore, collapsed: boolean): void;
+/** Every pane renders one. It draws nothing. */
+declare function PageScope({ children }: {
+    children: React.ReactNode;
+}): React.JSX.Element;
+/** Cuts the scope off below a portal: a panel over a pane is not in it, so its title must not take the pane's band. */
+declare function NoPageScope({ children }: {
+    children: React.ReactNode;
+}): React.JSX.Element;
+declare function usePageScope(): PageStore | null;
+/** A `Page` claims the pane it is in, in an effect, so no subscriber's snapshot changes mid-render. */
+declare function useClaimPage(store: PageStore | null, title: string): void;
+/** What a `Toolbar.Title` shows when it is given no words of its own. */
+declare function usePageTitle(store: PageStore | null): string | null;
+/**
+ * Registers a mirroring title's element, stamped with what the page is doing now: a title that
+ * mounts after its page has scrolled arrives collapsed.
+ */
+declare function usePageMirror(store: PageStore | null): React.RefCallback<HTMLElement>;
+export { PageScope, NoPageScope, usePageScope, useClaimPage, usePageTitle, usePageMirror, setPageCollapsed };
+export type { PageStore };
+//# sourceMappingURL=page-scope.d.ts.map

package/dist/cjs/components/_internal/page-scope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-scope.d.ts","sourceRoot":"","sources":["../../../../src/components/_internal/page-scope.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;;;;;;GASG;AACH,KAAK,SAAS,GAAG;IACf,gFAAgF;IAChF,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,wGAAwG;IACxG,OAAO,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IAC1B,oEAAoE;IACpE,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,GAAG,CAAC,MAAM,IAAI,CAAC,CAAC;IAC3B,qEAAqE;IACrE,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AASF;;;GAGG;AACH,iBAAS,gBAAgB,CAAC,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,GAAG,IAAI,CAOpE;AAED,gDAAgD;AAChD,iBAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,qBAG7D;AAED,uHAAuH;AACvH,iBAAS,WAAW,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,qBAE/D;AAED,iBAAS,YAAY,IAAI,SAAS,GAAG,IAAI,CAExC;AAED,uGAAuG;AACvG,iBAAS,YAAY,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAYlE;AAED,yEAAyE;AACzE,iBAAS,YAAY,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAkB5D;AAED;;;GAGG;AACH,iBAAS,aAAa,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,CAc9E;AAED,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,CAAC;AAC7G,YAAY,EAAE,SAAS,EAAE,CAAC"}

package/dist/cjs/components/_internal/page-scope.js

@@ -0,0 +1,3 @@
+"use client";
+"use strict";"use client";var s=Object.create;var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var P=Object.getPrototypeOf,g=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var n in t)a(e,n,{get:t[n],enumerable:!0})},u=(e,t,n,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of f(t))!g.call(e,l)&&l!==n&&a(e,l,{get:()=>t[l],enumerable:!(i=d(t,l))||i.enumerable});return e};var p=(e,t,n)=>(n=e!=null?s(P(e)):{},u(t||!e||!e.__esModule?a(n,"default",{value:e,enumerable:!0}):n,e)),m=e=>u(a({},"__esModule",{value:!0}),e);var T={};S(T,{NoPageScope:()=>b,PageScope:()=>R,setPageCollapsed:()=>v,useClaimPage:()=>x,usePageMirror:()=>M,usePageScope:()=>C,usePageTitle:()=>E});module.exports=m(T);var r=p(require("react")),o=r.createContext(null);function c(e){e.version+=1;for(let t of e.listeners)t()}function v(e,t){if(e.collapsed!==t){e.collapsed=t;for(let n of e.mirrors)t?n.setAttribute("data-collapsed",""):n.removeAttribute("data-collapsed")}}function R({children:e}){let t=r.useMemo(()=>({title:null,mirrors:new Set,collapsed:!1,listeners:new Set,version:0}),[]);return r.createElement(o.Provider,{value:t},e)}function b({children:e}){return r.createElement(o.Provider,{value:null},e)}function C(){return r.useContext(o)}function x(e,t){r.useEffect(()=>{if(e)return e.title=t,c(e),()=>{e.title===t&&(e.title=null,c(e))}},[e,t])}function E(e){let t=r.useCallback(n=>e?(e.listeners.add(n),()=>{e.listeners.delete(n)}):()=>{},[e]);return r.useSyncExternalStore(t,()=>e?.version??0,()=>0),e?.title??null}function M(e){let t=r.useRef(null);return r.useCallback(n=>{e&&(t.current&&e.mirrors.delete(t.current),t.current=n,n&&(e.mirrors.add(n),e.collapsed?n.setAttribute("data-collapsed",""):n.removeAttribute("data-collapsed")))},[e])}
+//# sourceMappingURL=page-scope.js.map

package/dist/cjs/components/_internal/page-scope.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/_internal/page-scope.tsx"],
+  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\n\n/**\n * What page is in a pane, and whether its title has scrolled away (from v2, 2026-11-03).\n *\n * A page's large title lives inside the scroller and the band that shows it again lives beside\n * it, so context, which only flows down, cannot carry it from one to the other. The store sits\n * at their common ancestor, the pane. Each pane provides its own, so two panes can each hold a\n * titled page; `Shell.Header` provides none, so a `Toolbar.Title` there always speaks for itself.\n * Outside a Shell there is no scope: a `Page` still draws its heading and a `Toolbar.Title` still\n * shows its own words.\n */\ntype PageStore = {\n  /** The words of the page in this pane, or null while nothing has claimed it. */\n  title: string | null;\n  /** Every `Toolbar.Title` mirroring this pane's page, as elements: the collapse is written onto them. */\n  mirrors: Set<HTMLElement>;\n  /** Whether the page's own title has scrolled up behind the band. */\n  collapsed: boolean;\n  listeners: Set<() => void>;\n  /** What a subscriber reads: a stable value between notifications. */\n  version: number;\n};\n\nconst PageScopeContext = React.createContext<PageStore | null>(null);\n\nfunction notify(store: PageStore) {\n  store.version += 1;\n  for (const listener of store.listeners) listener();\n}\n\n/**\n * The collapse is an attribute write, not a render: only CSS reads it, and an observer sends it\n * twice per visit to a page.\n */\nfunction setPageCollapsed(store: PageStore, collapsed: boolean): void {\n  if (store.collapsed === collapsed) return;\n  store.collapsed = collapsed;\n  for (const el of store.mirrors) {\n    if (collapsed) el.setAttribute('data-collapsed', '');\n    else el.removeAttribute('data-collapsed');\n  }\n}\n\n/** Every pane renders one. It draws nothing. */\nfunction PageScope({ children }: { children: React.ReactNode }) {\n  const store = React.useMemo<PageStore>(() => ({ title: null, mirrors: new Set(), collapsed: false, listeners: new Set(), version: 0 }), []);\n  return <PageScopeContext.Provider value={store}>{children}</PageScopeContext.Provider>;\n}\n\n/** Cuts the scope off below a portal: a panel over a pane is not in it, so its title must not take the pane's band. */\nfunction NoPageScope({ children }: { children: React.ReactNode }) {\n  return <PageScopeContext.Provider value={null}>{children}</PageScopeContext.Provider>;\n}\n\nfunction usePageScope(): PageStore | null {\n  return React.useContext(PageScopeContext);\n}\n\n/** A `Page` claims the pane it is in, in an effect, so no subscriber's snapshot changes mid-render. */\nfunction useClaimPage(store: PageStore | null, title: string): void {\n  React.useEffect(() => {\n    if (!store) return;\n    store.title = title;\n    notify(store);\n    return () => {\n      if (store.title === title) {\n        store.title = null;\n        notify(store);\n      }\n    };\n  }, [store, title]);\n}\n\n/** What a `Toolbar.Title` shows when it is given no words of its own. */\nfunction usePageTitle(store: PageStore | null): string | null {\n  const subscribe = React.useCallback(\n    (cb: () => void) => {\n      if (!store) return () => {};\n      store.listeners.add(cb);\n      return () => {\n        store.listeners.delete(cb);\n      };\n    },\n    [store],\n  );\n  // The version is read so the subscription re-renders this consumer; the title itself is the value.\n  React.useSyncExternalStore(\n    subscribe,\n    () => store?.version ?? 0,\n    () => 0,\n  );\n  return store?.title ?? null;\n}\n\n/**\n * Registers a mirroring title's element, stamped with what the page is doing now: a title that\n * mounts after its page has scrolled arrives collapsed.\n */\nfunction usePageMirror(store: PageStore | null): React.RefCallback<HTMLElement> {\n  const current = React.useRef<HTMLElement | null>(null);\n  return React.useCallback(\n    (el: HTMLElement | null) => {\n      if (!store) return;\n      if (current.current) store.mirrors.delete(current.current);\n      current.current = el;\n      if (!el) return;\n      store.mirrors.add(el);\n      if (store.collapsed) el.setAttribute('data-collapsed', '');\n      else el.removeAttribute('data-collapsed');\n    },\n    [store],\n  );\n}\n\nexport { PageScope, NoPageScope, usePageScope, useClaimPage, usePageTitle, usePageMirror, setPageCollapsed };\nexport type { PageStore };\n"],
+  "mappings": ";ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,iBAAAE,EAAA,cAAAC,EAAA,qBAAAC,EAAA,iBAAAC,EAAA,kBAAAC,EAAA,iBAAAC,EAAA,iBAAAC,IAAA,eAAAC,EAAAT,GAEA,IAAAU,EAAuB,oBAwBjBC,EAAyB,gBAAgC,IAAI,EAEnE,SAASC,EAAOC,EAAkB,CAChCA,EAAM,SAAW,EACjB,QAAWC,KAAYD,EAAM,UAAWC,EAAS,CACnD,CAMA,SAASV,EAAiBS,EAAkBE,EAA0B,CACpE,GAAIF,EAAM,YAAcE,EACxB,CAAAF,EAAM,UAAYE,EAClB,QAAWC,KAAMH,EAAM,QACjBE,EAAWC,EAAG,aAAa,iBAAkB,EAAE,EAC9CA,EAAG,gBAAgB,gBAAgB,EAE5C,CAGA,SAASb,EAAU,CAAE,SAAAc,CAAS,EAAkC,CAC9D,IAAMJ,EAAc,UAAmB,KAAO,CAAE,MAAO,KAAM,QAAS,IAAI,IAAO,UAAW,GAAO,UAAW,IAAI,IAAO,QAAS,CAAE,GAAI,CAAC,CAAC,EAC1I,OAAO,gBAACF,EAAiB,SAAjB,CAA0B,MAAOE,GAAQI,CAAS,CAC5D,CAGA,SAASf,EAAY,CAAE,SAAAe,CAAS,EAAkC,CAChE,OAAO,gBAACN,EAAiB,SAAjB,CAA0B,MAAO,MAAOM,CAAS,CAC3D,CAEA,SAASV,GAAiC,CACxC,OAAa,aAAWI,CAAgB,CAC1C,CAGA,SAASN,EAAaQ,EAAyBK,EAAqB,CAC5D,YAAU,IAAM,CACpB,GAAKL,EACL,OAAAA,EAAM,MAAQK,EACdN,EAAOC,CAAK,EACL,IAAM,CACPA,EAAM,QAAUK,IAClBL,EAAM,MAAQ,KACdD,EAAOC,CAAK,EAEhB,CACF,EAAG,CAACA,EAAOK,CAAK,CAAC,CACnB,CAGA,SAASV,EAAaK,EAAwC,CAC5D,IAAMM,EAAkB,cACrBC,GACMP,GACLA,EAAM,UAAU,IAAIO,CAAE,EACf,IAAM,CACXP,EAAM,UAAU,OAAOO,CAAE,CAC3B,GAJmB,IAAM,CAAC,EAM5B,CAACP,CAAK,CACR,EAEA,OAAM,uBACJM,EACA,IAAMN,GAAO,SAAW,EACxB,IAAM,CACR,EACOA,GAAO,OAAS,IACzB,CAMA,SAASP,EAAcO,EAAyD,CAC9E,IAAMQ,EAAgB,SAA2B,IAAI,EACrD,OAAa,cACVL,GAA2B,CACrBH,IACDQ,EAAQ,SAASR,EAAM,QAAQ,OAAOQ,EAAQ,OAAO,EACzDA,EAAQ,QAAUL,EACbA,IACLH,EAAM,QAAQ,IAAIG,CAAE,EAChBH,EAAM,UAAWG,EAAG,aAAa,iBAAkB,EAAE,EACpDA,EAAG,gBAAgB,gBAAgB,GAC1C,EACA,CAACH,CAAK,CACR,CACF",
+  "names": ["page_scope_exports", "__export", "NoPageScope", "PageScope", "setPageCollapsed", "useClaimPage", "usePageMirror", "usePageScope", "usePageTitle", "__toCommonJS", "React", "PageScopeContext", "notify", "store", "listener", "collapsed", "el", "children", "title", "subscribe", "cb", "current"]
+}

package/dist/cjs/components/_internal/portal-theme.d.ts

@@ -2,7 +2,8 @@ import * as React from 'react';
 /**
  * The Theme at the root of a portalled surface (Popover, Dialog, Sheet, menus, Tooltip). The
  * surface renders outside any Shell pane even though context flows into it, so a Toolbar in it
- * does not take the pane's band size. A `Theme asChild` an app nests in a pane keeps the band.
+ * does not take the pane's band size, and a title in it does not take over the pane's page. A
+ * `Theme asChild` an app nests in a pane keeps both.
  */
 declare const PortalTheme: React.ForwardRefExoticComponent<Omit<import("../theme.js").ThemeProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { PortalTheme };

package/dist/cjs/components/_internal/portal-theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"portal-theme.d.ts","sourceRoot":"","sources":["../../../../src/components/_internal/portal-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;GAIG;AACH,QAAA,MAAM,WAAW,4JAIf,CAAC;AAGH,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"portal-theme.d.ts","sourceRoot":"","sources":["../../../../src/components/_internal/portal-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B;;;;;GAKG;AACH,QAAA,MAAM,WAAW,4JAMf,CAAC;AAGH,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/cjs/components/_internal/portal-theme.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";var X=Object.create;var A=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames;var ee=Object.getPrototypeOf,oe=Object.prototype.hasOwnProperty;var ae=(e,a)=>{for(var o in a)A(e,o,{get:a[o],enumerable:!0})},V=(e,a,o,i)=>{if(a&&typeof a=="object"||typeof a=="function")for(let s of $(a))!oe.call(e,s)&&s!==o&&A(e,s,{get:()=>a[s],enumerable:!(i=Y(a,s))||i.enumerable});return e};var u=(e,a,o)=>(o=e!=null?X(ee(e)):{},V(a||!e||!e.__esModule?A(o,"default",{value:e,enumerable:!0}):o,e)),te=e=>V(A({},"__esModule",{value:!0}),e);var se={};ae(se,{PortalTheme:()=>Q});module.exports=te(se);var P=u(require("react"));var n=u(require("react")),Z=u(require("classnames")),g=require("radix-ui");function M(e){switch(e){case"tomato":case"red":case"ruby":case"crimson":case"pink":case"plum":case"purple":case"violet":return"mauve";case"iris":case"indigo":case"blue":case"sky":case"cyan":return"slate";case"teal":case"jade":case"mint":case"green":return"sage";case"grass":case"lime":return"olive";case"yellow":case"amber":case"orange":case"brown":case"gold":case"bronze":return"sand";case"gray":return"gray"}}var B=u(require("react"));var H=B.createContext("2");H.displayName="ThemeSizeContext";var w=u(require("react"));function l(e){let[a,o]=w.useState(e),[i,s]=w.useState(e);return Object.is(e,i)||(s(e),o(e)),[a,o]}var O={asChild:{type:"boolean"}};var W=["gray","gold","bronze","brown","yellow","amber","orange","tomato","red","ruby","crimson","pink","plum","purple","violet","iris","indigo","blue","cyan","teal","jade","green","grass","lime","mint","sky"],L=["auto","gray","mauve","slate","sage","olive","sand"];var _=["none","small","medium","large","full"];var ne=["inherit","light","dark"],U=["sans","mono","serif"],re=["1","2","3","4"],t={...O,hasBackground:{type:"boolean",default:!0},appearance:{type:"enum",values:ne,default:"inherit"},accentColor:{type:"enum",values:W,default:"gray"},grayColor:{type:"enum",values:L,default:"gray"},radius:{type:"enum",values:_,default:"full"},fontFamily:{type:"enum",values:U,default:"sans"},headingFontFamily:{type:"enum",values:U},size:{type:"enum",values:re,default:"2"}};var r=()=>{},ze={appearance:t.appearance.default,accentColor:t.accentColor.default,grayColor:t.grayColor.default,resolvedGrayColor:t.grayColor.default,radius:t.radius.default,fontFamily:t.fontFamily.default,headingFontFamily:void 0,size:t.size.default,onAppearanceChange:r,onAccentColorChange:r,onGrayColorChange:r,onRadiusChange:r,onFontFamilyChange:r,onHeadingFontFamilyChange:r,onSizeChange:r},j=n.createContext(void 0);var E=n.forwardRef((e,a)=>{let o=n.useContext(j),i=g.Direction.useDirection();return o===void 0?n.createElement(g.Direction.Provider,{dir:i},n.createElement(q,{...e,ref:a})):n.createElement(N,{...e,ref:a})});E.displayName="Theme";var q=n.forwardRef((e,a)=>{let{appearance:o=t.appearance.default,accentColor:i=t.accentColor.default,grayColor:s=t.grayColor.default,radius:F=t.radius.default,fontFamily:m=t.fontFamily.default,headingFontFamily:c,size:p=t.size.default,hasBackground:d=t.hasBackground.default,...f}=e,[h,y]=l(o),[T,v]=l(i),[z,x]=l(s),[R,b]=l(F),[D,S]=l(m),[k,C]=l(c),[G,I]=l(p);return n.createElement(N,{...f,ref:a,isRoot:!0,hasBackground:d,appearance:h,accentColor:T,grayColor:z,radius:R,fontFamily:D,headingFontFamily:k,size:G,onAppearanceChange:y,onAccentColorChange:v,onGrayColorChange:x,onRadiusChange:b,onFontFamilyChange:S,onHeadingFontFamilyChange:C,onSizeChange:I})});q.displayName="ThemeRoot";var N=n.forwardRef((e,a)=>{let o=n.useContext(j),{asChild:i,isRoot:s,hasBackground:F,appearance:m=e.appearance??o?.appearance??t.appearance.default,accentColor:c=e.accentColor??o?.accentColor??t.accentColor.default,grayColor:p=e.grayColor??o?.resolvedGrayColor??t.grayColor.default,radius:d=e.radius??o?.radius??t.radius.default,fontFamily:f=e.fontFamily??o?.fontFamily??t.fontFamily.default,headingFontFamily:h=e.headingFontFamily??o?.headingFontFamily,size:y=e.size??o?.size??t.size.default,onAppearanceChange:T=o?.onAppearanceChange??r,onAccentColorChange:v=o?.onAccentColorChange??r,onGrayColorChange:z=o?.onGrayColorChange??r,onRadiusChange:x=o?.onRadiusChange??r,onFontFamilyChange:R=o?.onFontFamilyChange??r,onHeadingFontFamilyChange:b=o?.onHeadingFontFamilyChange??r,onSizeChange:D=o?.onSizeChange??r,...S}=e,k=i?g.Slot.Root:"div",C=p==="auto"?M(c):p,G=e.appearance==="light"||e.appearance==="dark",I=F===void 0?s||G:F;return n.createElement(j.Provider,{value:n.useMemo(()=>({appearance:m,accentColor:c,grayColor:p,resolvedGrayColor:C,radius:d,fontFamily:f,headingFontFamily:h,size:y,onAppearanceChange:T,onAccentColorChange:v,onGrayColorChange:z,onRadiusChange:x,onFontFamilyChange:R,onHeadingFontFamilyChange:b,onSizeChange:D}),[m,c,p,C,d,f,h,y,T,v,z,x,R,b,D])},n.createElement(H.Provider,{value:y},n.createElement(k,{"data-is-root-theme":s?"true":"false","data-accent-color":c,"data-gray-color":C,"data-has-background":I?"true":"false","data-radius":d,"data-font-family":f,"data-heading-font-family":h,ref:a,...S,className:(0,Z.default)("kui-theme",{light:m==="light",dark:m==="dark"},S.className)})))});N.displayName="ThemeImpl";var J=u(require("react")),K=J.createContext(void 0);var Q=P.forwardRef((e,a)=>P.createElement(K.Provider,{value:null},P.createElement(E,{...e,ref:a})));Q.displayName="PortalTheme";
+"use strict";var $=Object.create;var k=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var oe=Object.getOwnPropertyNames;var ae=Object.getPrototypeOf,te=Object.prototype.hasOwnProperty;var ne=(e,a)=>{for(var o in a)k(e,o,{get:a[o],enumerable:!0})},V=(e,a,o,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of oe(a))!te.call(e,i)&&i!==o&&k(e,i,{get:()=>a[i],enumerable:!(s=ee(a,i))||s.enumerable});return e};var m=(e,a,o)=>(o=e!=null?$(ae(e)):{},V(a||!e||!e.__esModule?k(o,"default",{value:e,enumerable:!0}):o,e)),re=e=>V(k({},"__esModule",{value:!0}),e);var ce={};ne(ce,{PortalTheme:()=>Y});module.exports=re(ce);var f=m(require("react"));var n=m(require("react")),q=m(require("classnames")),T=require("radix-ui");function L(e){switch(e){case"tomato":case"red":case"ruby":case"crimson":case"pink":case"plum":case"purple":case"violet":return"mauve";case"iris":case"indigo":case"blue":case"sky":case"cyan":return"slate";case"teal":case"jade":case"mint":case"green":return"sage";case"grass":case"lime":return"olive";case"yellow":case"amber":case"orange":case"brown":case"gold":case"bronze":return"sand";case"gray":return"gray"}}var w=m(require("react"));var I=w.createContext("2");I.displayName="ThemeSizeContext";var B=m(require("react"));function c(e){let[a,o]=B.useState(e),[s,i]=B.useState(e);return Object.is(e,s)||(i(e),o(e)),[a,o]}var O={asChild:{type:"boolean"}};var W=["gray","gold","bronze","brown","yellow","amber","orange","tomato","red","ruby","crimson","pink","plum","purple","violet","iris","indigo","blue","cyan","teal","jade","green","grass","lime","mint","sky"],_=["auto","gray","mauve","slate","sage","olive","sand"];var U=["none","small","medium","large","full"];var ie=["inherit","light","dark"],Z=["sans","mono","serif"],se=["1","2","3","4"],t={...O,hasBackground:{type:"boolean",default:!0},appearance:{type:"enum",values:ie,default:"inherit"},accentColor:{type:"enum",values:W,default:"gray"},grayColor:{type:"enum",values:_,default:"gray"},radius:{type:"enum",values:U,default:"full"},fontFamily:{type:"enum",values:Z,default:"sans"},headingFontFamily:{type:"enum",values:Z},size:{type:"enum",values:se,default:"2"}};var r=()=>{},xe={appearance:t.appearance.default,accentColor:t.accentColor.default,grayColor:t.grayColor.default,resolvedGrayColor:t.grayColor.default,radius:t.radius.default,fontFamily:t.fontFamily.default,headingFontFamily:void 0,size:t.size.default,onAppearanceChange:r,onAccentColorChange:r,onGrayColorChange:r,onRadiusChange:r,onFontFamilyChange:r,onHeadingFontFamilyChange:r,onSizeChange:r},N=n.createContext(void 0);var j=n.forwardRef((e,a)=>{let o=n.useContext(N),s=T.Direction.useDirection();return o===void 0?n.createElement(T.Direction.Provider,{dir:s},n.createElement(J,{...e,ref:a})):n.createElement(M,{...e,ref:a})});j.displayName="Theme";var J=n.forwardRef((e,a)=>{let{appearance:o=t.appearance.default,accentColor:s=t.accentColor.default,grayColor:i=t.grayColor.default,radius:F=t.radius.default,fontFamily:u=t.fontFamily.default,headingFontFamily:p,size:d=t.size.default,hasBackground:y=t.hasBackground.default,...h}=e,[C,g]=c(o),[v,R]=c(s),[S,b]=c(i),[x,z]=c(F),[D,A]=c(u),[G,P]=c(p),[H,E]=c(d);return n.createElement(M,{...h,ref:a,isRoot:!0,hasBackground:y,appearance:C,accentColor:v,grayColor:S,radius:x,fontFamily:D,headingFontFamily:G,size:H,onAppearanceChange:g,onAccentColorChange:R,onGrayColorChange:b,onRadiusChange:z,onFontFamilyChange:A,onHeadingFontFamilyChange:P,onSizeChange:E})});J.displayName="ThemeRoot";var M=n.forwardRef((e,a)=>{let o=n.useContext(N),{asChild:s,isRoot:i,hasBackground:F,appearance:u=e.appearance??o?.appearance??t.appearance.default,accentColor:p=e.accentColor??o?.accentColor??t.accentColor.default,grayColor:d=e.grayColor??o?.resolvedGrayColor??t.grayColor.default,radius:y=e.radius??o?.radius??t.radius.default,fontFamily:h=e.fontFamily??o?.fontFamily??t.fontFamily.default,headingFontFamily:C=e.headingFontFamily??o?.headingFontFamily,size:g=e.size??o?.size??t.size.default,onAppearanceChange:v=o?.onAppearanceChange??r,onAccentColorChange:R=o?.onAccentColorChange??r,onGrayColorChange:S=o?.onGrayColorChange??r,onRadiusChange:b=o?.onRadiusChange??r,onFontFamilyChange:x=o?.onFontFamilyChange??r,onHeadingFontFamilyChange:z=o?.onHeadingFontFamilyChange??r,onSizeChange:D=o?.onSizeChange??r,...A}=e,G=s?T.Slot.Root:"div",P=d==="auto"?L(p):d,H=e.appearance==="light"||e.appearance==="dark",E=F===void 0?i||H:F;return n.createElement(N.Provider,{value:n.useMemo(()=>({appearance:u,accentColor:p,grayColor:d,resolvedGrayColor:P,radius:y,fontFamily:h,headingFontFamily:C,size:g,onAppearanceChange:v,onAccentColorChange:R,onGrayColorChange:S,onRadiusChange:b,onFontFamilyChange:x,onHeadingFontFamilyChange:z,onSizeChange:D}),[u,p,d,P,y,h,C,g,v,R,S,b,x,z,D])},n.createElement(I.Provider,{value:g},n.createElement(G,{"data-is-root-theme":i?"true":"false","data-accent-color":p,"data-gray-color":P,"data-has-background":E?"true":"false","data-radius":y,"data-font-family":h,"data-heading-font-family":C,ref:a,...A,className:(0,q.default)("kui-theme",{light:u==="light",dark:u==="dark"},A.className)})))});M.displayName="ThemeImpl";var K=m(require("react")),Q=K.createContext(void 0);var l=m(require("react")),le=l.createContext(null);function X({children:e}){return l.createElement(le.Provider,{value:null},e)}var Y=f.forwardRef((e,a)=>f.createElement(Q.Provider,{value:null},f.createElement(X,null,f.createElement(j,{...e,ref:a}))));Y.displayName="PortalTheme";
 //# sourceMappingURL=portal-theme.js.map

package/dist/cjs/components/_internal/portal-theme.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../../src/components/_internal/portal-theme.tsx", "../../../../src/components/theme.tsx", "../../../../src/helpers/get-matching-gray-color.ts", "../../../../src/hooks/theme-size.ts", "../../../../src/hooks/use-prop-synced-state.ts", "../../../../src/props/as-child.prop.ts", "../../../../src/props/color.prop.ts", "../../../../src/props/radius.prop.ts", "../../../../src/components/theme.props.tsx", "../../../../src/components/_internal/pane-band-context.ts"],
-  "sourcesContent": ["import * as React from 'react';\n\nimport { Theme } from '../theme.js';\nimport { PaneBandSizeContext } from './pane-band-context.js';\n\n/**\n * The Theme at the root of a portalled surface (Popover, Dialog, Sheet, menus, Tooltip). The\n * surface renders outside any Shell pane even though context flows into it, so a Toolbar in it\n * does not take the pane's band size. A `Theme asChild` an app nests in a pane keeps the band.\n */\nconst PortalTheme = React.forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<typeof Theme>>((props, forwardedRef) => (\n  <PaneBandSizeContext.Provider value={null}>\n    <Theme {...props} ref={forwardedRef} />\n  </PaneBandSizeContext.Provider>\n));\nPortalTheme.displayName = 'PortalTheme';\n\nexport { PortalTheme };\n", "'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Direction, Slot } from 'radix-ui';\n\nimport { getMatchingGrayColor } from '../helpers/get-matching-gray-color.js';\nimport { ThemeSizeContext } from '../hooks/theme-size.js';\nimport { usePropSyncedState } from '../hooks/use-prop-synced-state.js';\nimport { themePropDefs } from './theme.props.js';\n\nimport type { ThemeOwnProps } from './theme.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\n\nconst noop = () => {};\n\ntype ThemeAppearance = (typeof themePropDefs.appearance.values)[number];\ntype ThemeAccentColor = (typeof themePropDefs.accentColor.values)[number];\ntype ThemeGrayColor = (typeof themePropDefs.grayColor.values)[number];\ntype ThemeRadius = (typeof themePropDefs.radius.values)[number];\ntype ThemeFontFamily = (typeof themePropDefs.fontFamily.values)[number];\ntype ThemeSize = (typeof themePropDefs.size.values)[number];\n// Headings follow the body font until something sets this, so `undefined` is a\n// meaningful value here rather than a missing one.\ntype ThemeHeadingFontFamily = ThemeFontFamily | undefined;\n\ninterface ThemeChangeHandlers {\n  onAppearanceChange: (appearance: ThemeAppearance) => void;\n  onAccentColorChange: (accentColor: ThemeAccentColor) => void;\n  onGrayColorChange: (grayColor: ThemeGrayColor) => void;\n  onRadiusChange: (radius: ThemeRadius) => void;\n  onFontFamilyChange: (fontFamily: ThemeFontFamily) => void;\n  onHeadingFontFamilyChange: (headingFontFamily: ThemeHeadingFontFamily) => void;\n  onSizeChange: (size: ThemeSize) => void;\n}\n\ninterface ThemeContextValue extends ThemeChangeHandlers {\n  appearance: ThemeAppearance;\n  accentColor: ThemeAccentColor;\n  grayColor: ThemeGrayColor;\n  resolvedGrayColor: ThemeGrayColor;\n  radius: ThemeRadius;\n  fontFamily: ThemeFontFamily;\n  headingFontFamily: ThemeHeadingFontFamily;\n  size: ThemeSize;\n}\n// Default theme values used when components render outside a Theme provider\nconst defaultThemeContext: ThemeContextValue = {\n  appearance: themePropDefs.appearance.default,\n  accentColor: themePropDefs.accentColor.default,\n  grayColor: themePropDefs.grayColor.default,\n  resolvedGrayColor: themePropDefs.grayColor.default,\n  radius: themePropDefs.radius.default,\n  fontFamily: themePropDefs.fontFamily.default,\n  headingFontFamily: undefined,\n  size: themePropDefs.size.default,\n  onAppearanceChange: noop,\n  onAccentColorChange: noop,\n  onGrayColorChange: noop,\n  onRadiusChange: noop,\n  onFontFamilyChange: noop,\n  onHeadingFontFamilyChange: noop,\n  onSizeChange: noop,\n};\n\nconst ThemeContext = React.createContext<ThemeContextValue | undefined>(undefined);\n\nfunction useThemeContext() {\n  const context = React.useContext(ThemeContext);\n  // Return default context if used outside Theme provider (e.g., during SSR)\n  return context ?? defaultThemeContext;\n}\n\ninterface ThemeProps extends ThemeImplPublicProps {}\nconst Theme = React.forwardRef<ThemeImplElement, ThemeProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  // Direction is inherited: a Radix DirectionProvider above the Theme (for a right-to-left app)\n  // wins, and left-to-right stays the default when there is none.\n  const dir = Direction.useDirection();\n  const isRoot = context === undefined;\n  if (isRoot) {\n    return (\n      <Direction.Provider dir={dir}>\n        <ThemeRoot {...props} ref={forwardedRef} />\n      </Direction.Provider>\n    );\n  }\n  return <ThemeImpl {...props} ref={forwardedRef} />;\n});\nTheme.displayName = 'Theme';\n\nconst ThemeRoot = React.forwardRef<ThemeImplElement, ThemeImplPublicProps>((props, forwardedRef) => {\n  const {\n    appearance: appearanceProp = themePropDefs.appearance.default,\n    accentColor: accentColorProp = themePropDefs.accentColor.default,\n    grayColor: grayColorProp = themePropDefs.grayColor.default,\n    radius: radiusProp = themePropDefs.radius.default,\n    fontFamily: fontFamilyProp = themePropDefs.fontFamily.default,\n    headingFontFamily: headingFontFamilyProp,\n    size: sizeProp = themePropDefs.size.default,\n    hasBackground = themePropDefs.hasBackground.default,\n    ...rootProps\n  } = props;\n\n  // Each of these follows its prop but stays independently settable, so\n  // the context setters can change the theme at runtime. Syncing during render\n  // rather than in an effect matters here: an effect would commit the old\n  // theme first and re-render every consumer of the context a second time.\n  const [appearance, setAppearance] = usePropSyncedState(appearanceProp);\n  const [accentColor, setAccentColor] = usePropSyncedState(accentColorProp);\n  const [grayColor, setGrayColor] = usePropSyncedState(grayColorProp);\n  const [radius, setRadius] = usePropSyncedState(radiusProp);\n  const [fontFamily, setFontFamily] = usePropSyncedState(fontFamilyProp);\n  const [headingFontFamily, setHeadingFontFamily] = usePropSyncedState(headingFontFamilyProp);\n  const [size, setSize] = usePropSyncedState(sizeProp);\n\n  return (\n    <ThemeImpl\n      {...rootProps}\n      ref={forwardedRef}\n      isRoot\n      hasBackground={hasBackground}\n      //\n      appearance={appearance}\n      accentColor={accentColor}\n      grayColor={grayColor}\n      radius={radius}\n      fontFamily={fontFamily}\n      headingFontFamily={headingFontFamily}\n      size={size}\n      //\n      onAppearanceChange={setAppearance}\n      onAccentColorChange={setAccentColor}\n      onGrayColorChange={setGrayColor}\n      onRadiusChange={setRadius}\n      onFontFamilyChange={setFontFamily}\n      onHeadingFontFamilyChange={setHeadingFontFamily}\n      onSizeChange={setSize}\n    />\n  );\n});\nThemeRoot.displayName = 'ThemeRoot';\n\ntype ThemeImplElement = React.ElementRef<'div'>;\ninterface ThemeImplProps extends ThemeImplPublicProps, ThemeImplPrivateProps {}\ninterface ThemeImplPublicProps extends ComponentPropsWithout<'div', RemovedProps | 'dir'>, ThemeOwnProps {}\ninterface ThemeImplPrivateProps extends Partial<ThemeChangeHandlers> {\n  isRoot?: boolean;\n}\nconst ThemeImpl = React.forwardRef<ThemeImplElement, ThemeImplProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  const {\n    asChild,\n    isRoot,\n    hasBackground: hasBackgroundProp,\n    //\n    appearance = props.appearance ?? context?.appearance ?? themePropDefs.appearance.default,\n    accentColor = props.accentColor ?? context?.accentColor ?? themePropDefs.accentColor.default,\n    grayColor = props.grayColor ?? context?.resolvedGrayColor ?? themePropDefs.grayColor.default,\n    radius = props.radius ?? context?.radius ?? themePropDefs.radius.default,\n    fontFamily = props.fontFamily ?? context?.fontFamily ?? themePropDefs.fontFamily.default,\n    headingFontFamily = props.headingFontFamily ?? context?.headingFontFamily,\n    size = props.size ?? context?.size ?? themePropDefs.size.default,\n    // A nested Theme forwards changes to the one above it, so a switcher\n    // inside a portal (Dialog, Popover, menus) still reaches the root.\n    onAppearanceChange = context?.onAppearanceChange ?? noop,\n    onAccentColorChange = context?.onAccentColorChange ?? noop,\n    onGrayColorChange = context?.onGrayColorChange ?? noop,\n    onRadiusChange = context?.onRadiusChange ?? noop,\n    onFontFamilyChange = context?.onFontFamilyChange ?? noop,\n    onHeadingFontFamilyChange = context?.onHeadingFontFamilyChange ?? noop,\n    onSizeChange = context?.onSizeChange ?? noop,\n    //\n    ...themeProps\n  } = props;\n  const Comp = asChild ? Slot.Root : 'div';\n  const resolvedGrayColor = grayColor === 'auto' ? getMatchingGrayColor(accentColor) : grayColor;\n  const isExplicitAppearance = props.appearance === 'light' || props.appearance === 'dark';\n  const hasBackground = hasBackgroundProp === undefined ? isRoot || isExplicitAppearance : hasBackgroundProp;\n\n  return (\n    <ThemeContext.Provider\n      value={React.useMemo(\n        () => ({\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          radius,\n          fontFamily,\n          headingFontFamily,\n          size,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onRadiusChange,\n          onFontFamilyChange,\n          onHeadingFontFamilyChange,\n          onSizeChange,\n        }),\n        [\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          radius,\n          fontFamily,\n          headingFontFamily,\n          size,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onRadiusChange,\n          onFontFamilyChange,\n          onHeadingFontFamilyChange,\n          onSizeChange,\n        ],\n      )}\n    >\n      {/* Size travels on its own context as a bare string, so the components\n          that read it do not re-render when another theme value changes. */}\n      <ThemeSizeContext.Provider value={size}>\n        <Comp\n          data-is-root-theme={isRoot ? 'true' : 'false'}\n          data-accent-color={accentColor}\n          data-gray-color={resolvedGrayColor}\n          // for nested `Theme` background\n          data-has-background={hasBackground ? 'true' : 'false'}\n          data-radius={radius}\n          data-font-family={fontFamily}\n          data-heading-font-family={headingFontFamily}\n          ref={forwardedRef}\n          {...themeProps}\n          className={classNames(\n            'kui-theme',\n            {\n              light: appearance === 'light',\n              dark: appearance === 'dark',\n            },\n            themeProps.className,\n          )}\n        />\n      </ThemeSizeContext.Provider>\n    </ThemeContext.Provider>\n  );\n});\nThemeImpl.displayName = 'ThemeImpl';\n\nexport { Theme, ThemeContext, useThemeContext };\nexport type { ThemeProps, ThemeContextValue };\n", "import type { accentColors } from '../props/color.prop.js';\n\ntype ThemeAccentColor = (typeof accentColors)[number];\n\nexport function getMatchingGrayColor(accentColor: ThemeAccentColor) {\n  switch (accentColor) {\n    case 'tomato':\n    case 'red':\n    case 'ruby':\n    case 'crimson':\n    case 'pink':\n    case 'plum':\n    case 'purple':\n    case 'violet':\n      return 'mauve';\n    case 'iris':\n    case 'indigo':\n    case 'blue':\n    case 'sky':\n    case 'cyan':\n      return 'slate';\n    case 'teal':\n    case 'jade':\n    case 'mint':\n    case 'green':\n      return 'sage';\n    case 'grass':\n    case 'lime':\n      return 'olive';\n    case 'yellow':\n    case 'amber':\n    case 'orange':\n    case 'brown':\n    case 'gold':\n    case 'bronze':\n      return 'sand';\n    case 'gray':\n      return 'gray';\n  }\n}\n", "'use client';\n\nimport * as React from 'react';\n\nimport { THEME_SIZE_DEFAULT, clampSize } from '../helpers/theme-size.js';\nimport type { ThemeSize } from '../helpers/theme-size.js';\n\n/**\n * The app-wide size index, provided by `Theme` beside `ThemeContext`.\n *\n * It is its own context, holding one string, so a component that only needs\n * the size does not re-render when the accent colour or appearance changes.\n */\nconst ThemeSizeContext = React.createContext<ThemeSize>(THEME_SIZE_DEFAULT);\nThemeSizeContext.displayName = 'ThemeSizeContext';\n\ninterface SizePropDef {\n  values: readonly string[];\n  default?: string;\n}\n\n/**\n * The size a component on the 1-4 index takes: what the caller said, else the\n * nearest Theme's size, mapped into the component's range.\n */\nfunction useThemeSize<V>(explicit: V | undefined, propDef: SizePropDef): V {\n  const themeSize = React.useContext(ThemeSizeContext);\n  if (explicit !== undefined) return explicit;\n  // The clamped value is one of `propDef.values`, which is what `V` ranges over.\n  return clampSize(themeSize, propDef.values) as V;\n}\n\n/**\n * Fills `size` from the nearest Theme when the caller left it unset, so the\n * result can go straight into `extractProps`. An explicit size, responsive\n * object included, wins.\n *\n * Returns the same props object when there is nothing to fill: when a size is\n * set, or when the theme size resolves to the prop def's own default (the\n * common case, a Theme with no size), so `extractProps` applies it as before.\n */\nfunction useThemeSizeProps<P extends { size?: unknown }>(props: P, propDef: SizePropDef): P {\n  const themeSize = React.useContext(ThemeSizeContext);\n  if (props.size !== undefined) return props;\n  const size = clampSize(themeSize, propDef.values);\n  if (size === propDef.default) return props;\n  return { ...props, size };\n}\n\nexport { ThemeSizeContext, useThemeSize, useThemeSizeProps };\n", "import * as React from 'react';\n\n/**\n * State that tracks a prop but can also be set imperatively \u2014 the shape `Theme`\n * needs, where a prop sets the value and the context setters can change it at runtime.\n *\n * Adjusts state during render rather than syncing in a `useEffect`. An effect\n * would commit one render carrying the *old* value and schedule a second one,\n * which for a provider means every consumer renders twice and the browser can\n * paint the stale value in between.\n *\n * @see https://react.dev/reference/react/useState#storing-information-from-previous-renders\n */\nexport function usePropSyncedState<T>(propValue: T) {\n  const [value, setValue] = React.useState(propValue);\n  const [previousPropValue, setPreviousPropValue] = React.useState(propValue);\n\n  if (!Object.is(propValue, previousPropValue)) {\n    setPreviousPropValue(propValue);\n    setValue(propValue);\n  }\n\n  return [value, setValue] as const;\n}\n", "import type { PropDef } from './prop-def.js';\n\nconst asChildPropDef = {\n  /**\n   * Composes the component into its immediate child instead of rendering its own HTML element.\n   * You\u2019ll have to provide a single React Element child.\n   */\n  asChild: {\n    type: 'boolean',\n  },\n} satisfies {\n  asChild: PropDef<boolean>;\n};\n\nexport { asChildPropDef };\n", "import type { PropDef } from './prop-def.js';\n\n// prettier-ignore\nconst accentColors = ['gray', 'gold', 'bronze', 'brown', 'yellow', 'amber', 'orange', 'tomato', 'red', 'ruby', 'crimson', 'pink', 'plum', 'purple', 'violet', 'iris', 'indigo', 'blue', 'cyan', 'teal', 'jade', 'green', 'grass', 'lime', 'mint', 'sky'] as const;\n\nconst grayColors = ['auto', 'gray', 'mauve', 'slate', 'sage', 'olive', 'sand'] as const;\n\nconst colorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: undefined as (typeof accentColors)[number] | undefined,\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// 1. When used on components that compose Text, sets the color of the text to the current accent.\n// 2. Re-declares the accent role tokens (`--accent-ink`, `--accent-solid`, ...) that descendants read.\nconst accentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: '' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// For components whose colour comes from their content (Chip, Avatar, Code): they rest gray, and `color` picks a category when it means something.\nconst grayAccentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: 'gray' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\nexport {\n  accentColorPropDef,\n  grayAccentColorPropDef,\n  colorPropDef,\n  //\n  accentColors,\n  grayColors,\n};\n", "import type { PropDef } from './prop-def.js';\n\nconst radii = ['none', 'small', 'medium', 'large', 'full'] as const;\n\nconst radiusPropDef = {\n  radius: {\n    type: 'enum',\n    values: radii,\n    default: undefined,\n  },\n} satisfies {\n  radius: PropDef<(typeof radii)[number]>;\n};\n\nexport { radiusPropDef, radii };\n", "import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColors, grayColors } from '../props/color.prop.js';\nimport { radii } from '../props/radius.prop.js';\n\nimport type { GetPropDefTypes, PropDef } from '../props/prop-def.js';\n\nconst appearances = ['inherit', 'light', 'dark'] as const;\nconst fontFamilies = ['sans', 'mono', 'serif'] as const;\nconst sizes = ['1', '2', '3', '4'] as const;\n\nconst themePropDefs = {\n  ...asChildPropDef,\n  /**\n   * Whether to apply background color to the Theme element.\n   *\n   * Defaults to true for the root Theme and for Theme elements that\n   * have an explicit light or dark appearance prop.\n   */\n  hasBackground: { type: 'boolean', default: true },\n  /**\n   * Sets the color scheme of the theme, typcially referred to as light and dark mode.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/dark-mode\n   */\n  appearance: { type: 'enum', values: appearances, default: 'inherit' },\n  /**\n   * Selects one of the accent color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  accentColor: { type: 'enum', values: accentColors, default: 'gray' },\n  /**\n   * Selects one of the gray color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  grayColor: { type: 'enum', values: grayColors, default: 'gray' },\n  /**\n   * Sets the default radius of the components.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/visual-style\n   */\n  radius: { type: 'enum', values: radii, default: 'full' },\n  /**\n   * Sets the font family used for body text in the theme.\n   *\n   * Headings follow this unless `headingFontFamily` (or the `--font-heading`\n   * token) says otherwise.\n   *\n   * @default 'sans'\n   */\n  fontFamily: { type: 'enum', values: fontFamilies, default: 'sans' },\n  /**\n   * Sets the font family used for `Heading`, independently of body text.\n   *\n   * Deliberately has no default: when it is left unset no attribute is\n   * emitted and `--font-heading` keeps following `--font-body`, so a\n   * `--font-heading` override in your own CSS survives a `fontFamily` switch.\n   */\n  headingFontFamily: { type: 'enum', values: fontFamilies },\n  /**\n   * The app-wide size index. Every component on the 1-4 control and surface\n   * scale that states no `size` of its own takes this one; an explicit\n   * `size` always wins. Nested Themes override it for their subtree.\n   *\n   * @default '2'\n   */\n  size: { type: 'enum', values: sizes, default: '2' },\n} satisfies {\n  hasBackground: PropDef<boolean>;\n  appearance: PropDef<(typeof appearances)[number]>;\n  accentColor: PropDef<(typeof accentColors)[number]>;\n  grayColor: PropDef<(typeof grayColors)[number]>;\n  radius: PropDef<(typeof radii)[number]>;\n  fontFamily: PropDef<(typeof fontFamilies)[number]>;\n  headingFontFamily: PropDef<(typeof fontFamilies)[number]>;\n  size: PropDef<(typeof sizes)[number]>;\n};\n\ntype ThemeOwnProps = GetPropDefTypes<typeof themePropDefs & typeof asChildPropDef>;\n\nexport { themePropDefs };\nexport type { ThemeOwnProps };\n", "import * as React from 'react';\n\ntype BandSize = '1' | '2' | '3' | '4';\n\n/**\n * Set by `Shell.PaneHeader` and `Shell.PaneFooter` to their band size, and by `Shell.Scroll` to\n * null (a scrolling list has no band). `PortalTheme`, the root of every portalled surface\n * (Popover, Dialog, Sheet, menus), sets null too, so a Toolbar in one does not take the Shell's\n * step; a `Theme asChild` an app nests in a pane leaves it alone. `Shell.Root` clears it again.\n * Unset (`undefined`) everywhere else.\n *\n * Its own module so PortalTheme can reset it without bringing the Shell.\n */\nconst PaneBandSizeContext = React.createContext<BandSize | null | undefined>(undefined);\n\nexport { PaneBandSizeContext };\nexport type { BandSize };\n"],
-  "mappings": "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",
-  "names": ["portal_theme_exports", "__export", "PortalTheme", "__toCommonJS", "React", "React", "import_classnames", "import_radix_ui", "getMatchingGrayColor", "accentColor", "React", "ThemeSizeContext", "React", "usePropSyncedState", "propValue", "value", "setValue", "previousPropValue", "setPreviousPropValue", "asChildPropDef", "accentColors", "grayColors", "radii", "appearances", "fontFamilies", "sizes", "themePropDefs", "asChildPropDef", "accentColors", "grayColors", "radii", "noop", "defaultThemeContext", "themePropDefs", "ThemeContext", "Theme", "props", "forwardedRef", "context", "ThemeContext", "dir", "ThemeRoot", "ThemeImpl", "appearanceProp", "themePropDefs", "accentColorProp", "grayColorProp", "radiusProp", "fontFamilyProp", "headingFontFamilyProp", "sizeProp", "hasBackground", "rootProps", "appearance", "setAppearance", "usePropSyncedState", "accentColor", "setAccentColor", "grayColor", "setGrayColor", "radius", "setRadius", "fontFamily", "setFontFamily", "headingFontFamily", "setHeadingFontFamily", "size", "setSize", "asChild", "isRoot", "hasBackgroundProp", "onAppearanceChange", "noop", "onAccentColorChange", "onGrayColorChange", "onRadiusChange", "onFontFamilyChange", "onHeadingFontFamilyChange", "onSizeChange", "themeProps", "Comp", "resolvedGrayColor", "getMatchingGrayColor", "isExplicitAppearance", "ThemeSizeContext", "classNames", "React", "PaneBandSizeContext", "PortalTheme", "props", "forwardedRef", "PaneBandSizeContext", "Theme"]
+  "sources": ["../../../../src/components/_internal/portal-theme.tsx", "../../../../src/components/theme.tsx", "../../../../src/helpers/get-matching-gray-color.ts", "../../../../src/hooks/theme-size.ts", "../../../../src/hooks/use-prop-synced-state.ts", "../../../../src/props/as-child.prop.ts", "../../../../src/props/color.prop.ts", "../../../../src/props/radius.prop.ts", "../../../../src/components/theme.props.tsx", "../../../../src/components/_internal/pane-band-context.ts", "../../../../src/components/_internal/page-scope.tsx"],
+  "sourcesContent": ["import * as React from 'react';\n\nimport { Theme } from '../theme.js';\nimport { PaneBandSizeContext } from './pane-band-context.js';\nimport { NoPageScope } from './page-scope.js';\n\n/**\n * The Theme at the root of a portalled surface (Popover, Dialog, Sheet, menus, Tooltip). The\n * surface renders outside any Shell pane even though context flows into it, so a Toolbar in it\n * does not take the pane's band size, and a title in it does not take over the pane's page. A\n * `Theme asChild` an app nests in a pane keeps both.\n */\nconst PortalTheme = React.forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<typeof Theme>>((props, forwardedRef) => (\n  <PaneBandSizeContext.Provider value={null}>\n    <NoPageScope>\n      <Theme {...props} ref={forwardedRef} />\n    </NoPageScope>\n  </PaneBandSizeContext.Provider>\n));\nPortalTheme.displayName = 'PortalTheme';\n\nexport { PortalTheme };\n", "'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Direction, Slot } from 'radix-ui';\n\nimport { getMatchingGrayColor } from '../helpers/get-matching-gray-color.js';\nimport { ThemeSizeContext } from '../hooks/theme-size.js';\nimport { usePropSyncedState } from '../hooks/use-prop-synced-state.js';\nimport { themePropDefs } from './theme.props.js';\n\nimport type { ThemeOwnProps } from './theme.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\n\nconst noop = () => {};\n\ntype ThemeAppearance = (typeof themePropDefs.appearance.values)[number];\ntype ThemeAccentColor = (typeof themePropDefs.accentColor.values)[number];\ntype ThemeGrayColor = (typeof themePropDefs.grayColor.values)[number];\ntype ThemeRadius = (typeof themePropDefs.radius.values)[number];\ntype ThemeFontFamily = (typeof themePropDefs.fontFamily.values)[number];\ntype ThemeSize = (typeof themePropDefs.size.values)[number];\n// Headings follow the body font until something sets this, so `undefined` is a\n// meaningful value here rather than a missing one.\ntype ThemeHeadingFontFamily = ThemeFontFamily | undefined;\n\ninterface ThemeChangeHandlers {\n  onAppearanceChange: (appearance: ThemeAppearance) => void;\n  onAccentColorChange: (accentColor: ThemeAccentColor) => void;\n  onGrayColorChange: (grayColor: ThemeGrayColor) => void;\n  onRadiusChange: (radius: ThemeRadius) => void;\n  onFontFamilyChange: (fontFamily: ThemeFontFamily) => void;\n  onHeadingFontFamilyChange: (headingFontFamily: ThemeHeadingFontFamily) => void;\n  onSizeChange: (size: ThemeSize) => void;\n}\n\ninterface ThemeContextValue extends ThemeChangeHandlers {\n  appearance: ThemeAppearance;\n  accentColor: ThemeAccentColor;\n  grayColor: ThemeGrayColor;\n  resolvedGrayColor: ThemeGrayColor;\n  radius: ThemeRadius;\n  fontFamily: ThemeFontFamily;\n  headingFontFamily: ThemeHeadingFontFamily;\n  size: ThemeSize;\n}\n// Default theme values used when components render outside a Theme provider\nconst defaultThemeContext: ThemeContextValue = {\n  appearance: themePropDefs.appearance.default,\n  accentColor: themePropDefs.accentColor.default,\n  grayColor: themePropDefs.grayColor.default,\n  resolvedGrayColor: themePropDefs.grayColor.default,\n  radius: themePropDefs.radius.default,\n  fontFamily: themePropDefs.fontFamily.default,\n  headingFontFamily: undefined,\n  size: themePropDefs.size.default,\n  onAppearanceChange: noop,\n  onAccentColorChange: noop,\n  onGrayColorChange: noop,\n  onRadiusChange: noop,\n  onFontFamilyChange: noop,\n  onHeadingFontFamilyChange: noop,\n  onSizeChange: noop,\n};\n\nconst ThemeContext = React.createContext<ThemeContextValue | undefined>(undefined);\n\nfunction useThemeContext() {\n  const context = React.useContext(ThemeContext);\n  // Return default context if used outside Theme provider (e.g., during SSR)\n  return context ?? defaultThemeContext;\n}\n\ninterface ThemeProps extends ThemeImplPublicProps {}\nconst Theme = React.forwardRef<ThemeImplElement, ThemeProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  // Direction is inherited: a Radix DirectionProvider above the Theme (for a right-to-left app)\n  // wins, and left-to-right stays the default when there is none.\n  const dir = Direction.useDirection();\n  const isRoot = context === undefined;\n  if (isRoot) {\n    return (\n      <Direction.Provider dir={dir}>\n        <ThemeRoot {...props} ref={forwardedRef} />\n      </Direction.Provider>\n    );\n  }\n  return <ThemeImpl {...props} ref={forwardedRef} />;\n});\nTheme.displayName = 'Theme';\n\nconst ThemeRoot = React.forwardRef<ThemeImplElement, ThemeImplPublicProps>((props, forwardedRef) => {\n  const {\n    appearance: appearanceProp = themePropDefs.appearance.default,\n    accentColor: accentColorProp = themePropDefs.accentColor.default,\n    grayColor: grayColorProp = themePropDefs.grayColor.default,\n    radius: radiusProp = themePropDefs.radius.default,\n    fontFamily: fontFamilyProp = themePropDefs.fontFamily.default,\n    headingFontFamily: headingFontFamilyProp,\n    size: sizeProp = themePropDefs.size.default,\n    hasBackground = themePropDefs.hasBackground.default,\n    ...rootProps\n  } = props;\n\n  // Each of these follows its prop but stays independently settable, so\n  // the context setters can change the theme at runtime. Syncing during render\n  // rather than in an effect matters here: an effect would commit the old\n  // theme first and re-render every consumer of the context a second time.\n  const [appearance, setAppearance] = usePropSyncedState(appearanceProp);\n  const [accentColor, setAccentColor] = usePropSyncedState(accentColorProp);\n  const [grayColor, setGrayColor] = usePropSyncedState(grayColorProp);\n  const [radius, setRadius] = usePropSyncedState(radiusProp);\n  const [fontFamily, setFontFamily] = usePropSyncedState(fontFamilyProp);\n  const [headingFontFamily, setHeadingFontFamily] = usePropSyncedState(headingFontFamilyProp);\n  const [size, setSize] = usePropSyncedState(sizeProp);\n\n  return (\n    <ThemeImpl\n      {...rootProps}\n      ref={forwardedRef}\n      isRoot\n      hasBackground={hasBackground}\n      //\n      appearance={appearance}\n      accentColor={accentColor}\n      grayColor={grayColor}\n      radius={radius}\n      fontFamily={fontFamily}\n      headingFontFamily={headingFontFamily}\n      size={size}\n      //\n      onAppearanceChange={setAppearance}\n      onAccentColorChange={setAccentColor}\n      onGrayColorChange={setGrayColor}\n      onRadiusChange={setRadius}\n      onFontFamilyChange={setFontFamily}\n      onHeadingFontFamilyChange={setHeadingFontFamily}\n      onSizeChange={setSize}\n    />\n  );\n});\nThemeRoot.displayName = 'ThemeRoot';\n\ntype ThemeImplElement = React.ElementRef<'div'>;\ninterface ThemeImplProps extends ThemeImplPublicProps, ThemeImplPrivateProps {}\ninterface ThemeImplPublicProps extends ComponentPropsWithout<'div', RemovedProps | 'dir'>, ThemeOwnProps {}\ninterface ThemeImplPrivateProps extends Partial<ThemeChangeHandlers> {\n  isRoot?: boolean;\n}\nconst ThemeImpl = React.forwardRef<ThemeImplElement, ThemeImplProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  const {\n    asChild,\n    isRoot,\n    hasBackground: hasBackgroundProp,\n    //\n    appearance = props.appearance ?? context?.appearance ?? themePropDefs.appearance.default,\n    accentColor = props.accentColor ?? context?.accentColor ?? themePropDefs.accentColor.default,\n    grayColor = props.grayColor ?? context?.resolvedGrayColor ?? themePropDefs.grayColor.default,\n    radius = props.radius ?? context?.radius ?? themePropDefs.radius.default,\n    fontFamily = props.fontFamily ?? context?.fontFamily ?? themePropDefs.fontFamily.default,\n    headingFontFamily = props.headingFontFamily ?? context?.headingFontFamily,\n    size = props.size ?? context?.size ?? themePropDefs.size.default,\n    // A nested Theme forwards changes to the one above it, so a switcher\n    // inside a portal (Dialog, Popover, menus) still reaches the root.\n    onAppearanceChange = context?.onAppearanceChange ?? noop,\n    onAccentColorChange = context?.onAccentColorChange ?? noop,\n    onGrayColorChange = context?.onGrayColorChange ?? noop,\n    onRadiusChange = context?.onRadiusChange ?? noop,\n    onFontFamilyChange = context?.onFontFamilyChange ?? noop,\n    onHeadingFontFamilyChange = context?.onHeadingFontFamilyChange ?? noop,\n    onSizeChange = context?.onSizeChange ?? noop,\n    //\n    ...themeProps\n  } = props;\n  const Comp = asChild ? Slot.Root : 'div';\n  const resolvedGrayColor = grayColor === 'auto' ? getMatchingGrayColor(accentColor) : grayColor;\n  const isExplicitAppearance = props.appearance === 'light' || props.appearance === 'dark';\n  const hasBackground = hasBackgroundProp === undefined ? isRoot || isExplicitAppearance : hasBackgroundProp;\n\n  return (\n    <ThemeContext.Provider\n      value={React.useMemo(\n        () => ({\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          radius,\n          fontFamily,\n          headingFontFamily,\n          size,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onRadiusChange,\n          onFontFamilyChange,\n          onHeadingFontFamilyChange,\n          onSizeChange,\n        }),\n        [\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          radius,\n          fontFamily,\n          headingFontFamily,\n          size,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onRadiusChange,\n          onFontFamilyChange,\n          onHeadingFontFamilyChange,\n          onSizeChange,\n        ],\n      )}\n    >\n      {/* Size travels on its own context as a bare string, so the components\n          that read it do not re-render when another theme value changes. */}\n      <ThemeSizeContext.Provider value={size}>\n        <Comp\n          data-is-root-theme={isRoot ? 'true' : 'false'}\n          data-accent-color={accentColor}\n          data-gray-color={resolvedGrayColor}\n          // for nested `Theme` background\n          data-has-background={hasBackground ? 'true' : 'false'}\n          data-radius={radius}\n          data-font-family={fontFamily}\n          data-heading-font-family={headingFontFamily}\n          ref={forwardedRef}\n          {...themeProps}\n          className={classNames(\n            'kui-theme',\n            {\n              light: appearance === 'light',\n              dark: appearance === 'dark',\n            },\n            themeProps.className,\n          )}\n        />\n      </ThemeSizeContext.Provider>\n    </ThemeContext.Provider>\n  );\n});\nThemeImpl.displayName = 'ThemeImpl';\n\nexport { Theme, ThemeContext, useThemeContext };\nexport type { ThemeProps, ThemeContextValue };\n", "import type { accentColors } from '../props/color.prop.js';\n\ntype ThemeAccentColor = (typeof accentColors)[number];\n\nexport function getMatchingGrayColor(accentColor: ThemeAccentColor) {\n  switch (accentColor) {\n    case 'tomato':\n    case 'red':\n    case 'ruby':\n    case 'crimson':\n    case 'pink':\n    case 'plum':\n    case 'purple':\n    case 'violet':\n      return 'mauve';\n    case 'iris':\n    case 'indigo':\n    case 'blue':\n    case 'sky':\n    case 'cyan':\n      return 'slate';\n    case 'teal':\n    case 'jade':\n    case 'mint':\n    case 'green':\n      return 'sage';\n    case 'grass':\n    case 'lime':\n      return 'olive';\n    case 'yellow':\n    case 'amber':\n    case 'orange':\n    case 'brown':\n    case 'gold':\n    case 'bronze':\n      return 'sand';\n    case 'gray':\n      return 'gray';\n  }\n}\n", "'use client';\n\nimport * as React from 'react';\n\nimport { THEME_SIZE_DEFAULT, clampSize } from '../helpers/theme-size.js';\nimport type { ThemeSize } from '../helpers/theme-size.js';\n\n/**\n * The app-wide size index, provided by `Theme` beside `ThemeContext`.\n *\n * It is its own context, holding one string, so a component that only needs\n * the size does not re-render when the accent colour or appearance changes.\n */\nconst ThemeSizeContext = React.createContext<ThemeSize>(THEME_SIZE_DEFAULT);\nThemeSizeContext.displayName = 'ThemeSizeContext';\n\ninterface SizePropDef {\n  values: readonly string[];\n  default?: string;\n}\n\n/**\n * The size a component on the 1-4 index takes: what the caller said, else the\n * nearest Theme's size, mapped into the component's range.\n */\nfunction useThemeSize<V>(explicit: V | undefined, propDef: SizePropDef): V {\n  const themeSize = React.useContext(ThemeSizeContext);\n  if (explicit !== undefined) return explicit;\n  // The clamped value is one of `propDef.values`, which is what `V` ranges over.\n  return clampSize(themeSize, propDef.values) as V;\n}\n\n/**\n * Fills `size` from the nearest Theme when the caller left it unset, so the\n * result can go straight into `extractProps`. An explicit size, responsive\n * object included, wins.\n *\n * Returns the same props object when there is nothing to fill: when a size is\n * set, or when the theme size resolves to the prop def's own default (the\n * common case, a Theme with no size), so `extractProps` applies it as before.\n */\nfunction useThemeSizeProps<P extends { size?: unknown }>(props: P, propDef: SizePropDef): P {\n  const themeSize = React.useContext(ThemeSizeContext);\n  if (props.size !== undefined) return props;\n  const size = clampSize(themeSize, propDef.values);\n  if (size === propDef.default) return props;\n  return { ...props, size };\n}\n\nexport { ThemeSizeContext, useThemeSize, useThemeSizeProps };\n", "import * as React from 'react';\n\n/**\n * State that tracks a prop but can also be set imperatively \u2014 the shape `Theme`\n * needs, where a prop sets the value and the context setters can change it at runtime.\n *\n * Adjusts state during render rather than syncing in a `useEffect`. An effect\n * would commit one render carrying the *old* value and schedule a second one,\n * which for a provider means every consumer renders twice and the browser can\n * paint the stale value in between.\n *\n * @see https://react.dev/reference/react/useState#storing-information-from-previous-renders\n */\nexport function usePropSyncedState<T>(propValue: T) {\n  const [value, setValue] = React.useState(propValue);\n  const [previousPropValue, setPreviousPropValue] = React.useState(propValue);\n\n  if (!Object.is(propValue, previousPropValue)) {\n    setPreviousPropValue(propValue);\n    setValue(propValue);\n  }\n\n  return [value, setValue] as const;\n}\n", "import type { PropDef } from './prop-def.js';\n\nconst asChildPropDef = {\n  /**\n   * Composes the component into its immediate child instead of rendering its own HTML element.\n   * You\u2019ll have to provide a single React Element child.\n   */\n  asChild: {\n    type: 'boolean',\n  },\n} satisfies {\n  asChild: PropDef<boolean>;\n};\n\nexport { asChildPropDef };\n", "import type { PropDef } from './prop-def.js';\n\n// prettier-ignore\nconst accentColors = ['gray', 'gold', 'bronze', 'brown', 'yellow', 'amber', 'orange', 'tomato', 'red', 'ruby', 'crimson', 'pink', 'plum', 'purple', 'violet', 'iris', 'indigo', 'blue', 'cyan', 'teal', 'jade', 'green', 'grass', 'lime', 'mint', 'sky'] as const;\n\nconst grayColors = ['auto', 'gray', 'mauve', 'slate', 'sage', 'olive', 'sand'] as const;\n\nconst colorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: undefined as (typeof accentColors)[number] | undefined,\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// 1. When used on components that compose Text, sets the color of the text to the current accent.\n// 2. Re-declares the accent role tokens (`--accent-ink`, `--accent-solid`, ...) that descendants read.\nconst accentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: '' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// For components whose colour comes from their content (Chip, Avatar, Code): they rest gray, and `color` picks a category when it means something.\nconst grayAccentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: 'gray' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\nexport {\n  accentColorPropDef,\n  grayAccentColorPropDef,\n  colorPropDef,\n  //\n  accentColors,\n  grayColors,\n};\n", "import type { PropDef } from './prop-def.js';\n\nconst radii = ['none', 'small', 'medium', 'large', 'full'] as const;\n\nconst radiusPropDef = {\n  radius: {\n    type: 'enum',\n    values: radii,\n    default: undefined,\n  },\n} satisfies {\n  radius: PropDef<(typeof radii)[number]>;\n};\n\nexport { radiusPropDef, radii };\n", "import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColors, grayColors } from '../props/color.prop.js';\nimport { radii } from '../props/radius.prop.js';\n\nimport type { GetPropDefTypes, PropDef } from '../props/prop-def.js';\n\nconst appearances = ['inherit', 'light', 'dark'] as const;\nconst fontFamilies = ['sans', 'mono', 'serif'] as const;\nconst sizes = ['1', '2', '3', '4'] as const;\n\nconst themePropDefs = {\n  ...asChildPropDef,\n  /**\n   * Whether to apply background color to the Theme element.\n   *\n   * Defaults to true for the root Theme and for Theme elements that\n   * have an explicit light or dark appearance prop.\n   */\n  hasBackground: { type: 'boolean', default: true },\n  /**\n   * Sets the color scheme of the theme, typcially referred to as light and dark mode.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/dark-mode\n   */\n  appearance: { type: 'enum', values: appearances, default: 'inherit' },\n  /**\n   * Selects one of the accent color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  accentColor: { type: 'enum', values: accentColors, default: 'gray' },\n  /**\n   * Selects one of the gray color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  grayColor: { type: 'enum', values: grayColors, default: 'gray' },\n  /**\n   * Sets the default radius of the components.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/visual-style\n   */\n  radius: { type: 'enum', values: radii, default: 'full' },\n  /**\n   * Sets the font family used for body text in the theme.\n   *\n   * Headings follow this unless `headingFontFamily` (or the `--font-heading`\n   * token) says otherwise.\n   *\n   * @default 'sans'\n   */\n  fontFamily: { type: 'enum', values: fontFamilies, default: 'sans' },\n  /**\n   * Sets the font family used for `Heading`, independently of body text.\n   *\n   * Deliberately has no default: when it is left unset no attribute is\n   * emitted and `--font-heading` keeps following `--font-body`, so a\n   * `--font-heading` override in your own CSS survives a `fontFamily` switch.\n   */\n  headingFontFamily: { type: 'enum', values: fontFamilies },\n  /**\n   * The app-wide size index. Every component on the 1-4 control and surface\n   * scale that states no `size` of its own takes this one; an explicit\n   * `size` always wins. Nested Themes override it for their subtree.\n   *\n   * @default '2'\n   */\n  size: { type: 'enum', values: sizes, default: '2' },\n} satisfies {\n  hasBackground: PropDef<boolean>;\n  appearance: PropDef<(typeof appearances)[number]>;\n  accentColor: PropDef<(typeof accentColors)[number]>;\n  grayColor: PropDef<(typeof grayColors)[number]>;\n  radius: PropDef<(typeof radii)[number]>;\n  fontFamily: PropDef<(typeof fontFamilies)[number]>;\n  headingFontFamily: PropDef<(typeof fontFamilies)[number]>;\n  size: PropDef<(typeof sizes)[number]>;\n};\n\ntype ThemeOwnProps = GetPropDefTypes<typeof themePropDefs & typeof asChildPropDef>;\n\nexport { themePropDefs };\nexport type { ThemeOwnProps };\n", "import * as React from 'react';\n\ntype BandSize = '1' | '2' | '3' | '4';\n\n/**\n * Set by `Shell.PaneHeader` and `Shell.PaneFooter` to their band size, and by `Shell.Scroll` to\n * null (a scrolling list has no band). `PortalTheme`, the root of every portalled surface\n * (Popover, Dialog, Sheet, menus), sets null too, so a Toolbar in one does not take the Shell's\n * step; a `Theme asChild` an app nests in a pane leaves it alone. `Shell.Root` clears it again.\n * Unset (`undefined`) everywhere else.\n *\n * Its own module so PortalTheme can reset it without bringing the Shell.\n */\nconst PaneBandSizeContext = React.createContext<BandSize | null | undefined>(undefined);\n\nexport { PaneBandSizeContext };\nexport type { BandSize };\n", "'use client';\n\nimport * as React from 'react';\n\n/**\n * What page is in a pane, and whether its title has scrolled away (from v2, 2026-11-03).\n *\n * A page's large title lives inside the scroller and the band that shows it again lives beside\n * it, so context, which only flows down, cannot carry it from one to the other. The store sits\n * at their common ancestor, the pane. Each pane provides its own, so two panes can each hold a\n * titled page; `Shell.Header` provides none, so a `Toolbar.Title` there always speaks for itself.\n * Outside a Shell there is no scope: a `Page` still draws its heading and a `Toolbar.Title` still\n * shows its own words.\n */\ntype PageStore = {\n  /** The words of the page in this pane, or null while nothing has claimed it. */\n  title: string | null;\n  /** Every `Toolbar.Title` mirroring this pane's page, as elements: the collapse is written onto them. */\n  mirrors: Set<HTMLElement>;\n  /** Whether the page's own title has scrolled up behind the band. */\n  collapsed: boolean;\n  listeners: Set<() => void>;\n  /** What a subscriber reads: a stable value between notifications. */\n  version: number;\n};\n\nconst PageScopeContext = React.createContext<PageStore | null>(null);\n\nfunction notify(store: PageStore) {\n  store.version += 1;\n  for (const listener of store.listeners) listener();\n}\n\n/**\n * The collapse is an attribute write, not a render: only CSS reads it, and an observer sends it\n * twice per visit to a page.\n */\nfunction setPageCollapsed(store: PageStore, collapsed: boolean): void {\n  if (store.collapsed === collapsed) return;\n  store.collapsed = collapsed;\n  for (const el of store.mirrors) {\n    if (collapsed) el.setAttribute('data-collapsed', '');\n    else el.removeAttribute('data-collapsed');\n  }\n}\n\n/** Every pane renders one. It draws nothing. */\nfunction PageScope({ children }: { children: React.ReactNode }) {\n  const store = React.useMemo<PageStore>(() => ({ title: null, mirrors: new Set(), collapsed: false, listeners: new Set(), version: 0 }), []);\n  return <PageScopeContext.Provider value={store}>{children}</PageScopeContext.Provider>;\n}\n\n/** Cuts the scope off below a portal: a panel over a pane is not in it, so its title must not take the pane's band. */\nfunction NoPageScope({ children }: { children: React.ReactNode }) {\n  return <PageScopeContext.Provider value={null}>{children}</PageScopeContext.Provider>;\n}\n\nfunction usePageScope(): PageStore | null {\n  return React.useContext(PageScopeContext);\n}\n\n/** A `Page` claims the pane it is in, in an effect, so no subscriber's snapshot changes mid-render. */\nfunction useClaimPage(store: PageStore | null, title: string): void {\n  React.useEffect(() => {\n    if (!store) return;\n    store.title = title;\n    notify(store);\n    return () => {\n      if (store.title === title) {\n        store.title = null;\n        notify(store);\n      }\n    };\n  }, [store, title]);\n}\n\n/** What a `Toolbar.Title` shows when it is given no words of its own. */\nfunction usePageTitle(store: PageStore | null): string | null {\n  const subscribe = React.useCallback(\n    (cb: () => void) => {\n      if (!store) return () => {};\n      store.listeners.add(cb);\n      return () => {\n        store.listeners.delete(cb);\n      };\n    },\n    [store],\n  );\n  // The version is read so the subscription re-renders this consumer; the title itself is the value.\n  React.useSyncExternalStore(\n    subscribe,\n    () => store?.version ?? 0,\n    () => 0,\n  );\n  return store?.title ?? null;\n}\n\n/**\n * Registers a mirroring title's element, stamped with what the page is doing now: a title that\n * mounts after its page has scrolled arrives collapsed.\n */\nfunction usePageMirror(store: PageStore | null): React.RefCallback<HTMLElement> {\n  const current = React.useRef<HTMLElement | null>(null);\n  return React.useCallback(\n    (el: HTMLElement | null) => {\n      if (!store) return;\n      if (current.current) store.mirrors.delete(current.current);\n      current.current = el;\n      if (!el) return;\n      store.mirrors.add(el);\n      if (store.collapsed) el.setAttribute('data-collapsed', '');\n      else el.removeAttribute('data-collapsed');\n    },\n    [store],\n  );\n}\n\nexport { PageScope, NoPageScope, usePageScope, useClaimPage, usePageTitle, usePageMirror, setPageCollapsed };\nexport type { PageStore };\n"],
+  "mappings": "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",
+  "names": ["portal_theme_exports", "__export", "PortalTheme", "__toCommonJS", "React", "React", "import_classnames", "import_radix_ui", "getMatchingGrayColor", "accentColor", "React", "ThemeSizeContext", "React", "usePropSyncedState", "propValue", "value", "setValue", "previousPropValue", "setPreviousPropValue", "asChildPropDef", "accentColors", "grayColors", "radii", "appearances", "fontFamilies", "sizes", "themePropDefs", "asChildPropDef", "accentColors", "grayColors", "radii", "noop", "defaultThemeContext", "themePropDefs", "ThemeContext", "Theme", "props", "forwardedRef", "context", "ThemeContext", "dir", "ThemeRoot", "ThemeImpl", "appearanceProp", "themePropDefs", "accentColorProp", "grayColorProp", "radiusProp", "fontFamilyProp", "headingFontFamilyProp", "sizeProp", "hasBackground", "rootProps", "appearance", "setAppearance", "usePropSyncedState", "accentColor", "setAccentColor", "grayColor", "setGrayColor", "radius", "setRadius", "fontFamily", "setFontFamily", "headingFontFamily", "setHeadingFontFamily", "size", "setSize", "asChild", "isRoot", "hasBackgroundProp", "onAppearanceChange", "noop", "onAccentColorChange", "onGrayColorChange", "onRadiusChange", "onFontFamilyChange", "onHeadingFontFamilyChange", "onSizeChange", "themeProps", "Comp", "resolvedGrayColor", "getMatchingGrayColor", "isExplicitAppearance", "ThemeSizeContext", "classNames", "React", "PaneBandSizeContext", "React", "PageScopeContext", "NoPageScope", "children", "PageScopeContext", "PortalTheme", "props", "forwardedRef", "PaneBandSizeContext", "NoPageScope", "Theme"]
 }

package/dist/cjs/components/_internal/shell-bottom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shell-bottom.d.ts","sourceRoot":"","sources":["../../../../src/components/_internal/shell-bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAc,MAAM,oBAAoB,CAAC;AAE9D,OAAO,EAAsD,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAI/G,OAAO,KAAK,EAAE,UAAU,EAAyB,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAE1F,KAAK,oBAAoB,GAAG;IAAE,MAAM,EAAE,MAAM,GAAG,QAAQ,GAAG,YAAY,GAAG,SAAS,CAAA;CAAE,CAAC;AACrF,KAAK,qBAAqB,GAAG;IAAE,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAC/K,qGAAqG;AACrG,KAAK,uBAAuB,GAAG;IAAE,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAClL,KAAK,yBAAyB,GAAG;IAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAChF,KAAK,2BAA2B,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AACnF,KAAK,iBAAiB,GAAG,aAAa,GACpC,CAAC,qBAAqB,GAAG,uBAAuB,CAAC,GACjD,CAAC,yBAAyB,GAAG,2BAA2B,CAAC,GAAG;IAC1D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC5D,UAAU,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEJ,KAAK,eAAe,GAAG,KAAK,CAAC,yBAAyB,CAAC,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC,GAAG;IAAE,MAAM,EAAE,OAAO,YAAY,CAAA;CAAE,CAAC;AAIlJ,eAAO,MAAM,MAAM,EAwHb,eAAe,CAAC;AAKtB,YAAY,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"shell-bottom.d.ts","sourceRoot":"","sources":["../../../../src/components/_internal/shell-bottom.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAc,MAAM,oBAAoB,CAAC;AAE9D,OAAO,EAAsD,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAK/G,OAAO,KAAK,EAAE,UAAU,EAAyB,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAE1F,KAAK,oBAAoB,GAAG;IAAE,MAAM,EAAE,MAAM,GAAG,QAAQ,GAAG,YAAY,GAAG,SAAS,CAAA;CAAE,CAAC;AACrF,KAAK,qBAAqB,GAAG;IAAE,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAC/K,qGAAqG;AACrG,KAAK,uBAAuB,GAAG;IAAE,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAAC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAClL,KAAK,yBAAyB,GAAG;IAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AAChF,KAAK,2BAA2B,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC;AACnF,KAAK,iBAAiB,GAAG,aAAa,GACpC,CAAC,qBAAqB,GAAG,uBAAuB,CAAC,GACjD,CAAC,yBAAyB,GAAG,2BAA2B,CAAC,GAAG;IAC1D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC5D,UAAU,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,CAAC;AAEJ,KAAK,eAAe,GAAG,KAAK,CAAC,yBAAyB,CAAC,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC,GAAG;IAAE,MAAM,EAAE,OAAO,YAAY,CAAA;CAAE,CAAC;AAIlJ,eAAO,MAAM,MAAM,EA0Hb,eAAe,CAAC;AAKtB,YAAY,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/cjs/components/_internal/shell-bottom.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";"use client";var dt=Object.create;var pe=Object.defineProperty;var ct=Object.getOwnPropertyDescriptor;var pt=Object.getOwnPropertyNames;var ft=Object.getPrototypeOf,mt=Object.prototype.hasOwnProperty;var bt=(e,t)=>{for(var n in t)pe(e,n,{get:t[n],enumerable:!0})},He=(e,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of pt(t))!mt.call(e,a)&&a!==n&&pe(e,a,{get:()=>t[a],enumerable:!(r=ct(t,a))||r.enumerable});return e};var J=(e,t,n)=>(n=e!=null?dt(ft(e)):{},He(t||!e||!e.__esModule?pe(n,"default",{value:e,enumerable:!0}):n,e)),ht=e=>He(pe({},"__esModule",{value:!0}),e);var Nt={};bt(Nt,{Bottom:()=>Le});module.exports=ht(Nt);var _=J(require("react")),it=J(require("classnames")),st=require("radix-ui/internal");var fe=J(require("react")),Se=fe.createContext(null);function Ae(){let e=fe.useContext(Se);if(!e)throw new Error("Shell.Handle must be used within a resizable pane");return e}var S=J(require("react")),De=require("radix-ui/internal"),$e=J(require("classnames"));var ee=S.forwardRef(({className:e,children:t,...n},r)=>{let{containerRef:a,controls:l,cssVarName:m,minSize:N,maxSize:E,defaultSize:z,orientation:x,edge:F,growth:b,onResize:T,onResizeStart:Y,onResizeEnd:I,snapPoints:k,snapTolerance:g,collapseThreshold:O,collapsible:A,target:B,requestCollapse:j,requestToggle:L}=Ae(),M=S.useRef(null),U=S.useCallback(o=>{M.current=o,typeof r=="function"?r(o):r&&(r.current=o)},[r]),P=S.useRef(null);S.useEffect(()=>()=>{P.current?.(),P.current=null},[]);let i=S.useCallback(()=>{let o=a.current;if(!o)return z;let d=Number.parseFloat(getComputedStyle(o).getPropertyValue(m));return Number.isFinite(d)?d:z},[a,m,z]),u=S.useCallback(()=>{let o=a.current,d=M.current,p=o?.closest(".kui-ShellRoot")?.getBoundingClientRect();if(!o||!p||!d)return E;let R=o.getBoundingClientRect(),V=d.getBoundingClientRect(),C=b(getComputedStyle(o).direction==="rtl"),f;x==="vertical"?f=C>0?p.right-R.left:R.right-p.left:f=C>0?p.bottom-R.top:R.bottom-p.top;let K=x==="vertical"?V.width:V.height;return!(p.width>0&&p.height>0)||!Number.isFinite(f)?E:Math.max(N,Math.min(E,Math.round(f-K)))},[a,b,E,N,x]),y=()=>{M.current?.setAttribute("aria-valuemax",String(u()))};(0,De.useLayoutEffect)(()=>{M.current?.setAttribute("aria-valuenow",String(Math.round(i())))},[i]);let h=(o,d)=>{o.style.setProperty(m,`${d}px`),M.current?.setAttribute("aria-valuenow",String(Math.round(d)))},D=B.charAt(0).toUpperCase()+B.slice(1);return S.createElement("div",{ref:U,className:(0,$e.default)("kui-ShellResizer",e),"data-orientation":x,"data-edge":F,role:"separator",tabIndex:0,"aria-label":`Resize ${D} pane`,"aria-controls":l,"aria-orientation":x,"aria-valuemin":N,"aria-valuemax":E,...n,onPointerDown:o=>{n.onPointerDown?.(o);let d=a.current;if(!d||o.defaultPrevented||o.button!==0)return;o.preventDefault();let p=o.currentTarget,R=o.pointerId;P.current?.();try{p.setPointerCapture(R)}catch{}let V=getComputedStyle(d),C=Number.parseFloat(V.getPropertyValue(m)),f=Number.isFinite(C)?C:z,K=x==="vertical"?o.clientX:o.clientY,s=b(V.direction==="rtl"),$=u();p.setAttribute("aria-valuemax",String($));let W=w=>Math.min(Math.max(w,N),$);d.setAttribute("data-resizing",""),p.setAttribute("data-dragging","");let Q=document.body,ge=Q.style.cursor,lt=Q.style.userSelect;Q.style.cursor=x==="vertical"?"col-resize":"row-resize",Q.style.userSelect="none",Y?.(f);let Z=f,Pe=f,q=0,ae=null,Ve=()=>{if(q=0,ae===null)return;let w=ae;ae=null,T?.(w)},Ne=null,Be=!1,ut=(w,ne)=>{if(w.type===ne)Be=!0;else if(Be)return!1;return!0},G=w=>{if(!ut(w,"pointermove")||w===Ne)return;Ne=w;let ne=x==="vertical"?w.clientX:w.clientY;Pe=f+(ne-K)*s,Z=W(Pe),h(d,Z),ae=Z,q||(q=requestAnimationFrame(Ve))},ce=()=>{q&&cancelAnimationFrame(q),q=0;try{p.releasePointerCapture(R)}catch{}window.removeEventListener("pointermove",G),document.removeEventListener("pointermove",G),window.removeEventListener("mousemove",G),document.removeEventListener("mousemove",G),p.removeEventListener("pointermove",G),window.removeEventListener("pointerup",H),document.removeEventListener("pointerup",H),window.removeEventListener("mouseup",H),document.removeEventListener("mouseup",H),window.removeEventListener("pointercancel",H),document.removeEventListener("pointercancel",H),window.removeEventListener("keydown",Me),p.removeEventListener("lostpointercapture",H),d.removeAttribute("data-resizing"),p.removeAttribute("data-dragging"),Q.style.cursor=ge,Q.style.userSelect=lt,P.current=null},ye=!1,H=()=>{if(ye)return;if(ye=!0,q&&cancelAnimationFrame(q),Ve(),A&&typeof O=="number"&&Pe<=O){h(d,f),T?.(f),ce(),j?.(),I?.(f);return}let w=Z;if(k&&k.length){let ne=k.reduce((Ie,Oe)=>Math.abs(Oe-Z)<Math.abs(Ie-Z)?Oe:Ie,k[0]);Math.abs(ne-Z)<=g&&(w=W(ne),h(d,w),T?.(w))}I?.(w),ce()},Me=w=>{w.key==="Escape"&&(q&&cancelAnimationFrame(q),q=0,ae=null,h(d,f),T?.(f),ye=!0,I?.(f),ce())};window.addEventListener("pointermove",G),document.addEventListener("pointermove",G),window.addEventListener("mousemove",G),document.addEventListener("mousemove",G),p.addEventListener("pointermove",G),window.addEventListener("pointerup",H),document.addEventListener("pointerup",H),window.addEventListener("mouseup",H),document.addEventListener("mouseup",H),window.addEventListener("pointercancel",H),document.addEventListener("pointercancel",H),window.addEventListener("keydown",Me),p.addEventListener("lostpointercapture",H),P.current=ce},onDoubleClick:o=>{n.onDoubleClick?.(o),!o.defaultPrevented&&A&&L?.()},onFocus:o=>{n.onFocus?.(o),y()},onKeyDown:o=>{n.onKeyDown?.(o);let d=a.current;if(!d||o.defaultPrevented)return;if(o.key==="Enter"){A&&L&&(o.preventDefault(),L());return}let p=i(),R=u(),V=f=>Math.min(Math.max(f,N),R),C;if(o.key==="Home")C=V(N);else if(o.key==="End")C=V(R);else{let f=x==="vertical"?o.key==="ArrowRight"?1:o.key==="ArrowLeft"?-1:0:o.key==="ArrowDown"?1:o.key==="ArrowUp"?-1:0;if(f===0)return;let K=o.shiftKey?32:8;C=V(p+f*K*b(getComputedStyle(d).direction==="rtl"))}o.preventDefault(),Y?.(p),h(d,C),T?.(C),I?.(C)}},t)});ee.displayName="Shell.Handle";var Rt=S.forwardRef((e,t)=>S.createElement(ee,{...e,ref:t}));Rt.displayName="Shell.Panel.Handle";var vt=S.forwardRef((e,t)=>S.createElement(ee,{...e,ref:t}));vt.displayName="Shell.Sidebar.Handle";var gt=S.forwardRef((e,t)=>S.createElement(ee,{...e,ref:t}));gt.displayName="Shell.Inspector.Handle";var me=S.forwardRef((e,t)=>S.createElement(ee,{...e,ref:t}));me.displayName="Shell.Bottom.Handle";var v=J(require("react")),de=require("radix-ui/internal");var se=J(require("react"));var Fe={xs:"(min-width: 520px)",sm:"(min-width: 768px)",md:"(min-width: 1024px)",lg:"(min-width: 1280px)",xl:"(min-width: 1640px)"},be=["initial","xs","sm","md","lg","xl"];var Pt=Object.entries(Fe),xe=null,ie=new Set,te=null;function ze(){return xe??(xe=Pt.map(([e,t])=>[e,window.matchMedia(t)])),xe}function Re(){let e="initial";for(let[t,n]of ze())n.matches&&(e=t);return e}function he(){let e=Re();e!==te&&(te=e,ie.forEach(t=>t()))}function je(e){if(typeof window>"u")return()=>{};if(ie.size===0){te=Re();for(let[,t]of ze())typeof t.addEventListener=="function"?t.addEventListener("change",he):t.addListener?.(he)}return ie.add(e),()=>{if(ie.delete(e),!(ie.size>0)){for(let[,t]of ze())try{typeof t.removeEventListener=="function"?t.removeEventListener("change",he):t.removeListener?.(he)}catch{}te=null}}}function yt(){return typeof window>"u"?"initial":(te??(te=Re()),te)}function St(){return"initial"}function le(){return typeof window>"u"?"initial":Re()}var xt=()=>!0,zt=()=>!1,Ue=()=>()=>{},Et=()=>"initial";function qe(e=!0){let t=se.useSyncExternalStore(e?je:Ue,e?yt:Et,St),n=se.useSyncExternalStore(e?je:Ue,xt,zt);return se.useMemo(()=>({breakpoint:t,ready:n}),[t,n])}var X=J(require("react")),Ke=require("radix-ui/internal");function _e(e){return typeof e=="object"&&e!==null}function ue(e,t){let n={},r=null;for(let a of be){if(e!==void 0&&!_e(e)){n[a]=e;continue}let l=_e(e)?e[a]:void 0;l!==void 0&&(r={value:l}),n[a]=r?r.value:t(a)}return n}function re(e){let t=e.initial;return be.every(n=>e[n]===t)?t:void 0}function Ee(e,t){let n=re(t);if(n!==void 0)return{[`data-${e}`]:n};let r={};for(let a of be)r[`data-${e}-${a}`]=t[a];return r}function we(e){return typeof e=="object"&&e!==null?JSON.stringify(e):String(e)}var Ft=ue("fixed",()=>"fixed");function Ce(e){e.version+=1;for(let t of e.listeners)t()}function wt(e,t){return e.listeners.add(t),()=>{e.listeners.delete(t)}}var Ct=X.createContext(null);function We(e){let t=X.useContext(Ct);if(!t)throw new Error(`${e} must be used within <Shell.Root>`);return t}function Qe(e,t){let n=X.useCallback(r=>wt(e,r),[e]);return X.useSyncExternalStore(n,()=>e.peek===t,()=>!1)}var Tt=X.createContext(null);function Ge(e,t){let n=X.useContext(Tt);if(!n)throw new Error("Shell panes must be used within <Shell.Root>");let{registerInset:r,unregisterInset:a}=n;(0,Ke.useLayoutEffect)(()=>{if(t)return r(e),()=>a(e)},[e,t,r,a])}var Te=e=>typeof e=="object"&&e!==null;function Lt(e){for(let t of["initial","xs","sm","md","lg","xl"]){let n=e[t];if(n!==void 0)return n}return"closed"}function Xe(e){let{name:t,label:n,propNames:r,presentationTable:a,builtIn:l}=e,m=We(`Shell.${n}`),N=v.useId(),E=e.id??`shell-${t}${N}`,z=e.controlled!==void 0,x=Te(e.controlled);x&&(`${n}${r.controlled}${r.default}`,void 0);let F=x?e.controlled:void 0,b=F??(Te(e.defaultValue)?e.defaultValue:void 0),T=we(b),[Y,I]=v.useState(()=>typeof e.defaultValue=="string"?e.defaultValue:"auto"),k=v.useMemo(()=>F?ue(F,()=>Lt(F)):ue(b,s=>l(a[s])),[T,x,a,l]),g=Y;z&&(g=F?"auto":e.controlled);let O=re(a)===void 0||g==="auto"&&re(k)===void 0,{breakpoint:A,ready:B}=qe(O),j=s=>{let $=re(s);return $!==void 0?$:B?s[A]:void 0},L=g==="auto"?j(k):g,M=j(a),U=M==="overlay",P=L===void 0?void 0:L!=="closed",i=P===!0&&U,u=e.defaultValue,y=v.useRef({state:g,value:L,autoTable:k,defaultValue:u,controlled:z,onChange:e.onChange,toggleNext:e.toggleNext});(0,de.useLayoutEffect)(()=>{y.current={state:g,value:L,autoTable:k,defaultValue:u,controlled:z,onChange:e.onChange,toggleNext:e.toggleNext}});let h=v.useCallback(()=>{let s=y.current;return s.value!==void 0?s.value:s.state==="auto"?s.autoTable[le()]:void 0},[]),D=v.useCallback(()=>{let s=y.current;return typeof s.defaultValue=="string"?s.defaultValue:Te(s.defaultValue)?s.autoTable[le()]:void 0},[]),o=v.useCallback((s,$)=>{let W=y.current;h()!==s&&(W.onChange?.(s,$),W.controlled||I(s))},[h]),d=v.useCallback(s=>{let $=y.current,W=h()??"closed",Q=$.toggleNext?$.toggleNext(W,D()):W==="closed"?"open":"closed";o(Q,s)},[o,h,D]),p=v.useRef(null),R=v.useCallback(s=>{p.current=s},[]);(0,de.useLayoutEffect)(()=>{let s={name:t,id:E,el:p.current,value:L,presentation:M,presentationTable:a,overlayLive:i,size:e.size,setValue:o,toggle:d};return m.entries.set(t,s),Ce(m),()=>{m.entries.get(t)===s&&(m.entries.delete(t),Ce(m))}},[m,t,E,L,M,a,i,e.size,o,d]);let V=v.useRef({onExpand:e.onExpand,onCollapse:e.onCollapse});(0,de.useLayoutEffect)(()=>{V.current={onExpand:e.onExpand,onCollapse:e.onCollapse}});let C=v.useRef({state:g,shown:P});v.useEffect(()=>{let s=C.current;s.state!==g&&s.shown!==void 0&&P!==void 0&&s.shown!==P&&(P?V.current.onExpand?.():V.current.onCollapse?.()),C.current={state:g,shown:P}},[g,P]),(0,de.useLayoutEffect)(()=>{},[]);let f=v.useRef(z);v.useEffect(()=>{},[z,n,r.controlled]);let K=Qe(m,t)&&P===!1&&!U;return{store:m,id:E,state:g,value:L,shown:P,presentation:M,overlaying:U,overlayLive:i,peeking:K,ready:B,breakpoint:A,autoTable:k,setValue:o,toggle:d,defaultHereNow:D,setElement:R}}function Ye(e,t){let{state:n,value:r,presentation:a,shown:l}=e;return{...t,"data-state":n,...n==="auto"?Ee("auto",e.autoTable):{},"data-presentation":a,"data-mode":r===void 0?void 0:r==="closed"?"collapsed":"expanded","data-open":a==="stacked"&&l?"":void 0,"data-peek":e.peeking?"":void 0}}function Je(e,t){let n=we(e),r=v.useMemo(()=>ue(e,()=>t),[n,t]),a=v.useMemo(()=>re(r)===void 0?Ee("presentation",r):{},[r]);return{table:r,attributes:a}}var c=J(require("react")),oe=require("radix-ui/internal");function Ze(e,t="horizontal"){if(e==null)return;if(typeof e=="number"&&Number.isFinite(e))return e;let n=String(e).trim();if(!n)return;if(n.endsWith("px"))return Number.parseFloat(n);if(n.endsWith("rem")){let a=Number.parseFloat(getComputedStyle(document.documentElement).fontSize||"16")||16;return Number.parseFloat(n)*a}if(n.endsWith("%")){let a=Number.parseFloat(n),l=t==="horizontal"?document.documentElement.clientWidth||window.innerWidth||0:document.documentElement.clientHeight||window.innerHeight||0;return a/100*l}let r=Number.parseFloat(n);return Number.isFinite(r)?r:void 0}var ve=(e,t,n)=>Math.max(t??e,Math.min(n??e,e));function et(e,t,n,r){let[a]=c.useState(()=>{let l=e??t;return typeof l=="number"&&Number.isFinite(l)?`${ve(l,n,r)}px`:void 0});return a}function tt(e){let{name:t,elementRef:n,cssVarName:r,orientation:a,minSize:l,maxSize:m,resizable:N,size:E,defaultSize:z,paneId:x,persistence:F}=e,b=c.useRef(e);(0,oe.useLayoutEffect)(()=>{b.current=e});let T=c.useRef(null),Y=c.useRef(0);c.useEffect(()=>()=>{T.current&&clearTimeout(T.current)},[]);let I=c.useCallback((i,u)=>{let{onSizeChange:y,sizeUpdate:h,sizeUpdateMs:D}=b.current;if(y){if(h==="debounce"){T.current&&clearTimeout(T.current),T.current=setTimeout(()=>{T.current=null,b.current.onSizeChange?.(i,u)},D);return}if(h==="throttle"){let o=Date.now();if(o-Y.current<D)return;Y.current=o}y(i,u)}},[]),k=c.useCallback(i=>Ze(i,a==="vertical"?"horizontal":"vertical"),[a]),g=c.useRef(!1),O=c.useCallback((i,u)=>{let y=n.current;if(y){y.style.setProperty(r,`${i}px`);for(let h of y.querySelectorAll(":scope > .kui-ShellResizer"))h.setAttribute("aria-valuenow",String(Math.round(i)));u&&(g.current=!0)}},[n,r]);(0,oe.useLayoutEffect)(()=>{g.current||O(e.expandedSize,!1)},[e.expandedSize,O]),(0,oe.useLayoutEffect)(()=>{if(E!==void 0||z===void 0)return;let i=k(z);if(typeof i!="number"||!Number.isFinite(i))return;let u=ve(i,l,m);O(u,!0),I(u,{reason:"init"})},[]),(0,oe.useLayoutEffect)(()=>{if(E===void 0||b.current.overlayingNow())return;let i=k(E);if(typeof i!="number"||!Number.isFinite(i))return;let u=ve(i,l,m);O(u,!0),I(u,{reason:"controlled"})},[E,l,m,e.overlaying,k,O,I]);let A=F!==void 0,B=c.useMemo(()=>{if(A)return{load:()=>b.current.persistence?.load?.(),save:u=>b.current.persistence?.save?.(u)};if(!x)return;let i=`kookie-ui:shell:${t}:${x}`;return{load:()=>{if(!(typeof window>"u"))try{let u=window.localStorage.getItem(i);return u?Number(u):void 0}catch{return}},save:u=>{if(!(typeof window>"u"))try{window.localStorage.setItem(i,String(u))}catch{}}}},[t,x,A]);(0,oe.useLayoutEffect)(()=>{if(!N||!B?.load||b.current.overlayingNow())return;let i=!0,u=h=>{if(!i||typeof h!="number"||!Number.isFinite(h))return;let D=ve(h,l,m);O(D,!0),b.current.onResize?.(D)},y=B.load();return y instanceof Promise?y.then(u).catch(h=>{}):u(y),()=>{i=!1}},[N,B,e.overlaying,O,l,m,t]);let j=c.useCallback(i=>b.current.onResize?.(i),[]),L=c.useCallback(i=>{g.current=!0,b.current.onResizeStart?.(i)},[]),M=c.useCallback(i=>{b.current.onResizeEnd?.(i),I(i,{reason:"resize"}),B?.save?.(i)},[I,B]),U=c.useCallback(()=>b.current.requestCollapse(),[]),P=c.useCallback(()=>b.current.requestToggle(),[]);return c.useMemo(()=>({containerRef:n,controls:e.elementId,cssVarName:r,minSize:l,maxSize:m,defaultSize:e.expandedSize,orientation:a,edge:e.edge,growth:e.growth,onResize:j,onResizeStart:L,onResizeEnd:M,target:t,collapsible:e.collapsible,snapPoints:e.snapPoints,snapTolerance:e.snapTolerance??8,collapseThreshold:e.collapseThreshold,requestCollapse:U,requestToggle:P}),[n,e.elementId,r,l,m,e.expandedSize,a,e.edge,e.growth,j,L,M,t,e.collapsible,e.snapPoints,e.snapTolerance,e.collapseThreshold,U,P])}function nt(e,t){let n=c.Children.toArray(e),r=n.filter(l=>c.isValidElement(l)&&l.type===t),a=n.filter(l=>!(c.isValidElement(l)&&l.type===t));return{handles:r,content:a}}function ke(e){if(e===void 0)return;if(typeof e=="boolean")return e?"open":"closed";let t={};for(let[n,r]of Object.entries(e))typeof r=="boolean"&&(t[n]=r?"open":"closed");return t}var rt=()=>"closed";var ot=()=>-1;function at(e){if(!("height"in e)&&!("resizer"in e))return e;let{height:t,resizer:n,...r}=e;return r}var Vt={controlled:"open",default:"defaultOpen"},Le=_.forwardRef((e,t)=>{let{className:n,presentation:r="fixed",defaultOpen:a,open:l,onOpenChange:m,expandedSize:N=200,minSize:E=100,maxSize:z=400,resizable:x=!1,collapsible:F=!0,onExpand:b,onCollapse:T,onResize:Y,onResizeStart:I,onResizeEnd:k,snapPoints:g,snapTolerance:O,collapseThreshold:A,paneId:B,persistence:j,children:L,style:M,size:U,defaultSize:P,onSizeChange:i,sizeUpdate:u,sizeUpdateMs:y=50,inset:h,id:D,...o}=e,{table:d,attributes:p}=Je(r,"fixed"),R=Xe({name:"bottom",label:"Bottom",propNames:Vt,id:D,controlled:ke(l),defaultValue:ke(a),presentationTable:d,builtIn:rt,onChange:(Q,ge)=>m?.(Q!=="closed",{reason:ge}),onExpand:b,onCollapse:T,size:N});Ge("bottom",h),_.useEffect(()=>{(g!==void 0||A!==void 0||B!==void 0||j!==void 0)&&void 0},[g,A,B,j]);let V=_.useRef(null),C=(0,st.useComposedRefs)(t,R.setElement,V),f=tt({name:"bottom",elementId:R.id,elementRef:V,cssVarName:"--bottom-size",orientation:"horizontal",edge:"start",growth:ot,expandedSize:N,minSize:E,maxSize:z,resizable:x,collapsible:F,size:U,defaultSize:P,onSizeChange:i,sizeUpdate:u,sizeUpdateMs:y,onResize:Y,onResizeStart:I,onResizeEnd:k,snapPoints:g,snapTolerance:O,collapseThreshold:A,paneId:B,persistence:j,overlaying:R.overlaying,overlayingNow:()=>d[le()]==="overlay",requestCollapse:()=>R.setValue("closed","toggle"),requestToggle:()=>R.toggle("toggle")}),K=et(U,P,E,z),{handles:s,content:$}=nt(L,me),W=x&&R.shown!==!1&&!R.overlaying?_.createElement(Se.Provider,{value:f},s.length>0?s:_.createElement(ee,null)):null;return _.createElement("div",{...at(o),id:R.id,ref:C,className:(0,it.default)("kui-ShellPane","kui-ShellBottom",n),...Ye(R,p),"data-inset":h||void 0,tabIndex:R.overlaying?-1:o.tabIndex,style:{...M,"--bottom-expanded-size":`${N}px`,...K?{"--bottom-size":K}:{},"--bottom-min-size":`${E}px`,"--bottom-max-size":`${z}px`}},_.createElement("div",{className:"kui-ShellBottomContent"},$),W)});Le.displayName="Shell.Bottom";Le.Handle=me;
+"use strict";"use client";var pt=Object.create;var fe=Object.defineProperty;var ft=Object.getOwnPropertyDescriptor;var mt=Object.getOwnPropertyNames;var bt=Object.getPrototypeOf,gt=Object.prototype.hasOwnProperty;var Rt=(e,t)=>{for(var n in t)fe(e,n,{get:t[n],enumerable:!0})},Ae=(e,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of mt(t))!gt.call(e,a)&&a!==n&&fe(e,a,{get:()=>t[a],enumerable:!(r=ft(t,a))||r.enumerable});return e};var Y=(e,t,n)=>(n=e!=null?pt(bt(e)):{},Ae(t||!e||!e.__esModule?fe(n,"default",{value:e,enumerable:!0}):n,e)),vt=e=>Ae(fe({},"__esModule",{value:!0}),e);var It={};Rt(It,{Bottom:()=>Ve});module.exports=vt(It);var F=Y(require("react")),lt=Y(require("classnames")),ut=require("radix-ui/internal");var me=Y(require("react")),xe=me.createContext(null);function De(){let e=me.useContext(xe);if(!e)throw new Error("Shell.Handle must be used within a resizable pane");return e}var y=Y(require("react")),$e=require("radix-ui/internal"),Fe=Y(require("classnames"));var te=y.forwardRef(({className:e,children:t,...n},r)=>{let{containerRef:a,controls:l,cssVarName:m,minSize:N,maxSize:z,defaultSize:E,orientation:x,edge:j,growth:b,onResize:T,onResizeStart:Z,onResizeEnd:I,snapPoints:k,snapTolerance:h,collapseThreshold:O,collapsible:A,target:B,requestCollapse:U,requestToggle:L}=De(),M=y.useRef(null),q=y.useCallback(o=>{M.current=o,typeof r=="function"?r(o):r&&(r.current=o)},[r]),P=y.useRef(null);y.useEffect(()=>()=>{P.current?.(),P.current=null},[]);let i=y.useCallback(()=>{let o=a.current;if(!o)return E;let c=Number.parseFloat(getComputedStyle(o).getPropertyValue(m));return Number.isFinite(c)?c:E},[a,m,E]),u=y.useCallback(()=>{let o=a.current,c=M.current,p=o?.closest(".kui-ShellRoot")?.getBoundingClientRect();if(!o||!p||!c)return z;let R=o.getBoundingClientRect(),V=c.getBoundingClientRect(),C=b(getComputedStyle(o).direction==="rtl"),f;x==="vertical"?f=C>0?p.right-R.left:R.right-p.left:f=C>0?p.bottom-R.top:R.bottom-p.top;let W=x==="vertical"?V.width:V.height;return!(p.width>0&&p.height>0)||!Number.isFinite(f)?z:Math.max(N,Math.min(z,Math.round(f-W)))},[a,b,z,N,x]),S=()=>{M.current?.setAttribute("aria-valuemax",String(u()))};(0,$e.useLayoutEffect)(()=>{M.current?.setAttribute("aria-valuenow",String(Math.round(i())))},[i]);let g=(o,c)=>{o.style.setProperty(m,`${c}px`),M.current?.setAttribute("aria-valuenow",String(Math.round(c)))},D=B.charAt(0).toUpperCase()+B.slice(1);return y.createElement("div",{ref:q,className:(0,Fe.default)("kui-ShellResizer",e),"data-orientation":x,"data-edge":j,role:"separator",tabIndex:0,"aria-label":`Resize ${D} pane`,"aria-controls":l,"aria-orientation":x,"aria-valuemin":N,"aria-valuemax":z,...n,onPointerDown:o=>{n.onPointerDown?.(o);let c=a.current;if(!c||o.defaultPrevented||o.button!==0)return;o.preventDefault();let p=o.currentTarget,R=o.pointerId;P.current?.();try{p.setPointerCapture(R)}catch{}let V=getComputedStyle(c),C=Number.parseFloat(V.getPropertyValue(m)),f=Number.isFinite(C)?C:E,W=x==="vertical"?o.clientX:o.clientY,s=b(V.direction==="rtl"),$=u();p.setAttribute("aria-valuemax",String($));let Q=w=>Math.min(Math.max(w,N),$);c.setAttribute("data-resizing",""),p.setAttribute("data-dragging","");let G=document.body,Pe=G.style.cursor,ct=G.style.userSelect;G.style.cursor=x==="vertical"?"col-resize":"row-resize",G.style.userSelect="none",Z?.(f);let ee=f,Se=f,_=0,ie=null,Ne=()=>{if(_=0,ie===null)return;let w=ie;ie=null,T?.(w)},Be=null,Me=!1,dt=(w,re)=>{if(w.type===re)Me=!0;else if(Me)return!1;return!0},X=w=>{if(!dt(w,"pointermove")||w===Be)return;Be=w;let re=x==="vertical"?w.clientX:w.clientY;Se=f+(re-W)*s,ee=Q(Se),g(c,ee),ie=ee,_||(_=requestAnimationFrame(Ne))},pe=()=>{_&&cancelAnimationFrame(_),_=0;try{p.releasePointerCapture(R)}catch{}window.removeEventListener("pointermove",X),document.removeEventListener("pointermove",X),window.removeEventListener("mousemove",X),document.removeEventListener("mousemove",X),p.removeEventListener("pointermove",X),window.removeEventListener("pointerup",H),document.removeEventListener("pointerup",H),window.removeEventListener("mouseup",H),document.removeEventListener("mouseup",H),window.removeEventListener("pointercancel",H),document.removeEventListener("pointercancel",H),window.removeEventListener("keydown",Ie),p.removeEventListener("lostpointercapture",H),c.removeAttribute("data-resizing"),p.removeAttribute("data-dragging"),G.style.cursor=Pe,G.style.userSelect=ct,P.current=null},ye=!1,H=()=>{if(ye)return;if(ye=!0,_&&cancelAnimationFrame(_),Ne(),A&&typeof O=="number"&&Se<=O){g(c,f),T?.(f),pe(),U?.(),I?.(f);return}let w=ee;if(k&&k.length){let re=k.reduce((Oe,He)=>Math.abs(He-ee)<Math.abs(Oe-ee)?He:Oe,k[0]);Math.abs(re-ee)<=h&&(w=Q(re),g(c,w),T?.(w))}I?.(w),pe()},Ie=w=>{w.key==="Escape"&&(_&&cancelAnimationFrame(_),_=0,ie=null,g(c,f),T?.(f),ye=!0,I?.(f),pe())};window.addEventListener("pointermove",X),document.addEventListener("pointermove",X),window.addEventListener("mousemove",X),document.addEventListener("mousemove",X),p.addEventListener("pointermove",X),window.addEventListener("pointerup",H),document.addEventListener("pointerup",H),window.addEventListener("mouseup",H),document.addEventListener("mouseup",H),window.addEventListener("pointercancel",H),document.addEventListener("pointercancel",H),window.addEventListener("keydown",Ie),p.addEventListener("lostpointercapture",H),P.current=pe},onDoubleClick:o=>{n.onDoubleClick?.(o),!o.defaultPrevented&&A&&L?.()},onFocus:o=>{n.onFocus?.(o),S()},onKeyDown:o=>{n.onKeyDown?.(o);let c=a.current;if(!c||o.defaultPrevented)return;if(o.key==="Enter"){A&&L&&(o.preventDefault(),L());return}let p=i(),R=u(),V=f=>Math.min(Math.max(f,N),R),C;if(o.key==="Home")C=V(N);else if(o.key==="End")C=V(R);else{let f=x==="vertical"?o.key==="ArrowRight"?1:o.key==="ArrowLeft"?-1:0:o.key==="ArrowDown"?1:o.key==="ArrowUp"?-1:0;if(f===0)return;let W=o.shiftKey?32:8;C=V(p+f*W*b(getComputedStyle(c).direction==="rtl"))}o.preventDefault(),Z?.(p),g(c,C),T?.(C),I?.(C)}},t)});te.displayName="Shell.Handle";var ht=y.forwardRef((e,t)=>y.createElement(te,{...e,ref:t}));ht.displayName="Shell.Panel.Handle";var Pt=y.forwardRef((e,t)=>y.createElement(te,{...e,ref:t}));Pt.displayName="Shell.Sidebar.Handle";var St=y.forwardRef((e,t)=>y.createElement(te,{...e,ref:t}));St.displayName="Shell.Inspector.Handle";var be=y.forwardRef((e,t)=>y.createElement(te,{...e,ref:t}));be.displayName="Shell.Bottom.Handle";var v=Y(require("react")),de=require("radix-ui/internal");var le=Y(require("react"));var je={xs:"(min-width: 520px)",sm:"(min-width: 768px)",md:"(min-width: 1024px)",lg:"(min-width: 1280px)",xl:"(min-width: 1640px)"},ge=["initial","xs","sm","md","lg","xl"];var yt=Object.entries(je),Ee=null,se=new Set,ne=null;function ze(){return Ee??(Ee=yt.map(([e,t])=>[e,window.matchMedia(t)])),Ee}function ve(){let e="initial";for(let[t,n]of ze())n.matches&&(e=t);return e}function Re(){let e=ve();e!==ne&&(ne=e,se.forEach(t=>t()))}function Ue(e){if(typeof window>"u")return()=>{};if(se.size===0){ne=ve();for(let[,t]of ze())typeof t.addEventListener=="function"?t.addEventListener("change",Re):t.addListener?.(Re)}return se.add(e),()=>{if(se.delete(e),!(se.size>0)){for(let[,t]of ze())try{typeof t.removeEventListener=="function"?t.removeEventListener("change",Re):t.removeListener?.(Re)}catch{}ne=null}}}function xt(){return typeof window>"u"?"initial":(ne??(ne=ve()),ne)}function Et(){return"initial"}function ue(){return typeof window>"u"?"initial":ve()}var zt=()=>!0,wt=()=>!1,qe=()=>()=>{},Ct=()=>"initial";function _e(e=!0){let t=le.useSyncExternalStore(e?Ue:qe,e?xt:Ct,Et),n=le.useSyncExternalStore(e?Ue:qe,zt,wt);return le.useMemo(()=>({breakpoint:t,ready:n}),[t,n])}var J=Y(require("react")),We=require("radix-ui/internal");function Ke(e){return typeof e=="object"&&e!==null}function ce(e,t){let n={},r=null;for(let a of ge){if(e!==void 0&&!Ke(e)){n[a]=e;continue}let l=Ke(e)?e[a]:void 0;l!==void 0&&(r={value:l}),n[a]=r?r.value:t(a)}return n}function oe(e){let t=e.initial;return ge.every(n=>e[n]===t)?t:void 0}function we(e,t){let n=oe(t);if(n!==void 0)return{[`data-${e}`]:n};let r={};for(let a of ge)r[`data-${e}-${a}`]=t[a];return r}function Ce(e){return typeof e=="object"&&e!==null?JSON.stringify(e):String(e)}var qt=ce("fixed",()=>"fixed");function Te(e){e.version+=1;for(let t of e.listeners)t()}function Tt(e,t){return e.listeners.add(t),()=>{e.listeners.delete(t)}}var kt=J.createContext(null);function Qe(e){let t=J.useContext(kt);if(!t)throw new Error(`${e} must be used within <Shell.Root>`);return t}function Ge(e,t){let n=J.useCallback(r=>Tt(e,r),[e]);return J.useSyncExternalStore(n,()=>e.peek===t,()=>!1)}var Lt=J.createContext(null);function Xe(e,t){let n=J.useContext(Lt);if(!n)throw new Error("Shell panes must be used within <Shell.Root>");let{registerInset:r,unregisterInset:a}=n;(0,We.useLayoutEffect)(()=>{if(t)return r(e),()=>a(e)},[e,t,r,a])}var ke=e=>typeof e=="object"&&e!==null;function Nt(e){for(let t of["initial","xs","sm","md","lg","xl"]){let n=e[t];if(n!==void 0)return n}return"closed"}function Ye(e){let{name:t,label:n,propNames:r,presentationTable:a,builtIn:l}=e,m=Qe(`Shell.${n}`),N=v.useId(),z=e.id??`shell-${t}${N}`,E=e.controlled!==void 0,x=ke(e.controlled);x&&(`${n}${r.controlled}${r.default}`,void 0);let j=x?e.controlled:void 0,b=j??(ke(e.defaultValue)?e.defaultValue:void 0),T=Ce(b),[Z,I]=v.useState(()=>typeof e.defaultValue=="string"?e.defaultValue:"auto"),k=v.useMemo(()=>j?ce(j,()=>Nt(j)):ce(b,s=>l(a[s])),[T,x,a,l]),h=Z;E&&(h=j?"auto":e.controlled);let O=oe(a)===void 0||h==="auto"&&oe(k)===void 0,{breakpoint:A,ready:B}=_e(O),U=s=>{let $=oe(s);return $!==void 0?$:B?s[A]:void 0},L=h==="auto"?U(k):h,M=U(a),q=M==="overlay",P=L===void 0?void 0:L!=="closed",i=P===!0&&q,u=e.defaultValue,S=v.useRef({state:h,value:L,autoTable:k,defaultValue:u,controlled:E,onChange:e.onChange,toggleNext:e.toggleNext});(0,de.useLayoutEffect)(()=>{S.current={state:h,value:L,autoTable:k,defaultValue:u,controlled:E,onChange:e.onChange,toggleNext:e.toggleNext}});let g=v.useCallback(()=>{let s=S.current;return s.value!==void 0?s.value:s.state==="auto"?s.autoTable[ue()]:void 0},[]),D=v.useCallback(()=>{let s=S.current;return typeof s.defaultValue=="string"?s.defaultValue:ke(s.defaultValue)?s.autoTable[ue()]:void 0},[]),o=v.useCallback((s,$)=>{let Q=S.current;g()!==s&&(Q.onChange?.(s,$),Q.controlled||I(s))},[g]),c=v.useCallback(s=>{let $=S.current,Q=g()??"closed",G=$.toggleNext?$.toggleNext(Q,D()):Q==="closed"?"open":"closed";o(G,s)},[o,g,D]),p=v.useRef(null),R=v.useCallback(s=>{p.current=s},[]);(0,de.useLayoutEffect)(()=>{let s={name:t,id:z,el:p.current,value:L,presentation:M,presentationTable:a,overlayLive:i,size:e.size,setValue:o,toggle:c};return m.entries.set(t,s),Te(m),()=>{m.entries.get(t)===s&&(m.entries.delete(t),Te(m))}},[m,t,z,L,M,a,i,e.size,o,c]);let V=v.useRef({onExpand:e.onExpand,onCollapse:e.onCollapse});(0,de.useLayoutEffect)(()=>{V.current={onExpand:e.onExpand,onCollapse:e.onCollapse}});let C=v.useRef({state:h,shown:P});v.useEffect(()=>{let s=C.current;s.state!==h&&s.shown!==void 0&&P!==void 0&&s.shown!==P&&(P?V.current.onExpand?.():V.current.onCollapse?.()),C.current={state:h,shown:P}},[h,P]),(0,de.useLayoutEffect)(()=>{},[]);let f=v.useRef(E);v.useEffect(()=>{},[E,n,r.controlled]);let W=Ge(m,t)&&P===!1&&!q;return{store:m,id:z,state:h,value:L,shown:P,presentation:M,overlaying:q,overlayLive:i,peeking:W,ready:B,breakpoint:A,autoTable:k,setValue:o,toggle:c,defaultHereNow:D,setElement:R}}function Je(e,t){let{state:n,value:r,presentation:a,shown:l}=e;return{...t,"data-state":n,...n==="auto"?we("auto",e.autoTable):{},"data-presentation":a,"data-mode":r===void 0?void 0:r==="closed"?"collapsed":"expanded","data-open":a==="stacked"&&l?"":void 0,"data-peek":e.peeking?"":void 0}}function Ze(e,t){let n=Ce(e),r=v.useMemo(()=>ce(e,()=>t),[n,t]),a=v.useMemo(()=>oe(r)===void 0?we("presentation",r):{},[r]);return{table:r,attributes:a}}var d=Y(require("react")),ae=require("radix-ui/internal");function et(e,t="horizontal"){if(e==null)return;if(typeof e=="number"&&Number.isFinite(e))return e;let n=String(e).trim();if(!n)return;if(n.endsWith("px"))return Number.parseFloat(n);if(n.endsWith("rem")){let a=Number.parseFloat(getComputedStyle(document.documentElement).fontSize||"16")||16;return Number.parseFloat(n)*a}if(n.endsWith("%")){let a=Number.parseFloat(n),l=t==="horizontal"?document.documentElement.clientWidth||window.innerWidth||0:document.documentElement.clientHeight||window.innerHeight||0;return a/100*l}let r=Number.parseFloat(n);return Number.isFinite(r)?r:void 0}var he=(e,t,n)=>Math.max(t??e,Math.min(n??e,e));function tt(e,t,n,r){let[a]=d.useState(()=>{let l=e??t;return typeof l=="number"&&Number.isFinite(l)?`${he(l,n,r)}px`:void 0});return a}function nt(e){let{name:t,elementRef:n,cssVarName:r,orientation:a,minSize:l,maxSize:m,resizable:N,size:z,defaultSize:E,paneId:x,persistence:j}=e,b=d.useRef(e);(0,ae.useLayoutEffect)(()=>{b.current=e});let T=d.useRef(null),Z=d.useRef(0);d.useEffect(()=>()=>{T.current&&clearTimeout(T.current)},[]);let I=d.useCallback((i,u)=>{let{onSizeChange:S,sizeUpdate:g,sizeUpdateMs:D}=b.current;if(S){if(g==="debounce"){T.current&&clearTimeout(T.current),T.current=setTimeout(()=>{T.current=null,b.current.onSizeChange?.(i,u)},D);return}if(g==="throttle"){let o=Date.now();if(o-Z.current<D)return;Z.current=o}S(i,u)}},[]),k=d.useCallback(i=>et(i,a==="vertical"?"horizontal":"vertical"),[a]),h=d.useRef(!1),O=d.useCallback((i,u)=>{let S=n.current;if(S){S.style.setProperty(r,`${i}px`);for(let g of S.querySelectorAll(":scope > .kui-ShellResizer"))g.setAttribute("aria-valuenow",String(Math.round(i)));u&&(h.current=!0)}},[n,r]);(0,ae.useLayoutEffect)(()=>{h.current||O(e.expandedSize,!1)},[e.expandedSize,O]),(0,ae.useLayoutEffect)(()=>{if(z!==void 0||E===void 0)return;let i=k(E);if(typeof i!="number"||!Number.isFinite(i))return;let u=he(i,l,m);O(u,!0),I(u,{reason:"init"})},[]),(0,ae.useLayoutEffect)(()=>{if(z===void 0||b.current.overlayingNow())return;let i=k(z);if(typeof i!="number"||!Number.isFinite(i))return;let u=he(i,l,m);O(u,!0),I(u,{reason:"controlled"})},[z,l,m,e.overlaying,k,O,I]);let A=j!==void 0,B=d.useMemo(()=>{if(A)return{load:()=>b.current.persistence?.load?.(),save:u=>b.current.persistence?.save?.(u)};if(!x)return;let i=`kookie-ui:shell:${t}:${x}`;return{load:()=>{if(!(typeof window>"u"))try{let u=window.localStorage.getItem(i);return u?Number(u):void 0}catch{return}},save:u=>{if(!(typeof window>"u"))try{window.localStorage.setItem(i,String(u))}catch{}}}},[t,x,A]);(0,ae.useLayoutEffect)(()=>{if(!N||!B?.load||b.current.overlayingNow())return;let i=!0,u=g=>{if(!i||typeof g!="number"||!Number.isFinite(g))return;let D=he(g,l,m);O(D,!0),b.current.onResize?.(D)},S=B.load();return S instanceof Promise?S.then(u).catch(g=>{}):u(S),()=>{i=!1}},[N,B,e.overlaying,O,l,m,t]);let U=d.useCallback(i=>b.current.onResize?.(i),[]),L=d.useCallback(i=>{h.current=!0,b.current.onResizeStart?.(i)},[]),M=d.useCallback(i=>{b.current.onResizeEnd?.(i),I(i,{reason:"resize"}),B?.save?.(i)},[I,B]),q=d.useCallback(()=>b.current.requestCollapse(),[]),P=d.useCallback(()=>b.current.requestToggle(),[]);return d.useMemo(()=>({containerRef:n,controls:e.elementId,cssVarName:r,minSize:l,maxSize:m,defaultSize:e.expandedSize,orientation:a,edge:e.edge,growth:e.growth,onResize:U,onResizeStart:L,onResizeEnd:M,target:t,collapsible:e.collapsible,snapPoints:e.snapPoints,snapTolerance:e.snapTolerance??8,collapseThreshold:e.collapseThreshold,requestCollapse:q,requestToggle:P}),[n,e.elementId,r,l,m,e.expandedSize,a,e.edge,e.growth,U,L,M,t,e.collapsible,e.snapPoints,e.snapTolerance,e.collapseThreshold,q,P])}function rt(e,t){let n=d.Children.toArray(e),r=n.filter(l=>d.isValidElement(l)&&l.type===t),a=n.filter(l=>!(d.isValidElement(l)&&l.type===t));return{handles:r,content:a}}function Le(e){if(e===void 0)return;if(typeof e=="boolean")return e?"open":"closed";let t={};for(let[n,r]of Object.entries(e))typeof r=="boolean"&&(t[n]=r?"open":"closed");return t}var ot=()=>"closed";var at=()=>-1;function it(e){if(!("height"in e)&&!("resizer"in e))return e;let{height:t,resizer:n,...r}=e;return r}var K=Y(require("react")),Bt=K.createContext(null);function st({children:e}){let t=K.useMemo(()=>({title:null,mirrors:new Set,collapsed:!1,listeners:new Set,version:0}),[]);return K.createElement(Bt.Provider,{value:t},e)}var Mt={controlled:"open",default:"defaultOpen"},Ve=F.forwardRef((e,t)=>{let{className:n,presentation:r="fixed",defaultOpen:a,open:l,onOpenChange:m,expandedSize:N=200,minSize:z=100,maxSize:E=400,resizable:x=!1,collapsible:j=!0,onExpand:b,onCollapse:T,onResize:Z,onResizeStart:I,onResizeEnd:k,snapPoints:h,snapTolerance:O,collapseThreshold:A,paneId:B,persistence:U,children:L,style:M,size:q,defaultSize:P,onSizeChange:i,sizeUpdate:u,sizeUpdateMs:S=50,inset:g,id:D,...o}=e,{table:c,attributes:p}=Ze(r,"fixed"),R=Ye({name:"bottom",label:"Bottom",propNames:Mt,id:D,controlled:Le(l),defaultValue:Le(a),presentationTable:c,builtIn:ot,onChange:(G,Pe)=>m?.(G!=="closed",{reason:Pe}),onExpand:b,onCollapse:T,size:N});Xe("bottom",g),F.useEffect(()=>{(h!==void 0||A!==void 0||B!==void 0||U!==void 0)&&void 0},[h,A,B,U]);let V=F.useRef(null),C=(0,ut.useComposedRefs)(t,R.setElement,V),f=nt({name:"bottom",elementId:R.id,elementRef:V,cssVarName:"--bottom-size",orientation:"horizontal",edge:"start",growth:at,expandedSize:N,minSize:z,maxSize:E,resizable:x,collapsible:j,size:q,defaultSize:P,onSizeChange:i,sizeUpdate:u,sizeUpdateMs:S,onResize:Z,onResizeStart:I,onResizeEnd:k,snapPoints:h,snapTolerance:O,collapseThreshold:A,paneId:B,persistence:U,overlaying:R.overlaying,overlayingNow:()=>c[ue()]==="overlay",requestCollapse:()=>R.setValue("closed","toggle"),requestToggle:()=>R.toggle("toggle")}),W=tt(q,P,z,E),{handles:s,content:$}=rt(L,be),Q=x&&R.shown!==!1&&!R.overlaying?F.createElement(xe.Provider,{value:f},s.length>0?s:F.createElement(te,null)):null;return F.createElement("div",{...it(o),id:R.id,ref:C,className:(0,lt.default)("kui-ShellPane","kui-ShellBottom",n),...Je(R,p),"data-inset":g||void 0,tabIndex:R.overlaying?-1:o.tabIndex,style:{...M,"--bottom-expanded-size":`${N}px`,...W?{"--bottom-size":W}:{},"--bottom-min-size":`${z}px`,"--bottom-max-size":`${E}px`}},F.createElement("div",{className:"kui-ShellBottomContent"},F.createElement(st,null,$)),Q)});Ve.displayName="Shell.Bottom";Ve.Handle=be;
 //# sourceMappingURL=shell-bottom.js.map