@adea-ai/ui 0.122.0 → 0.122.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -30,7 +30,10 @@ export type ContextualSidebarProps = {
30
30
  /** Pass the host's initial viewport seed to distinguish stale desktop state. */
31
31
  wideViewportAtLoad?: boolean;
32
32
  resizeLabel?: string;
33
- /** The resize edge's grip: the default bordered chip, or the quieter rung. */
33
+ /**
34
+ * The resize edge's grip: the quieter rung by default, or the bordered chip
35
+ * for hosts that want the heavier affordance.
36
+ */
34
37
  resizeGrip?: 'chip' | 'rung';
35
38
  /** Stable external opener used when the modal mobile sheet closes. */
36
39
  restoreFocusRef?: Accessor<HTMLElement | undefined>;
@@ -1 +1 @@
1
- {"version":3,"file":"contextual-sidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/contextual-sidebar/contextual-sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAe7C,MAAM,MAAM,8BAA8B,GAAG;IAC3C,wEAAwE;IACxE,MAAM,EAAE,OAAO,CAAA;IACf,qFAAqF;IACrF,WAAW,IAAI,WAAW,GAAG,SAAS,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,eAAe,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;IACrC,8EAA8E;IAC9E,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;IACjC,sEAAsE;IACtE,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,sEAAsE;IACtE,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;IACnD,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,SAAS,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9E,+DAA+D;IAC/D,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACnD,iEAAiE;IACjE,MAAM,CAAC,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,0EAA0E;IAC1E,OAAO,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,oEAAoE;IACpE,MAAM,CAAC,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC,aAAa,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CACpC,CAAA;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAoJ9D"}
1
+ {"version":3,"file":"contextual-sidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/contextual-sidebar/contextual-sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,UAAU,CAAA;AAe7C,MAAM,MAAM,8BAA8B,GAAG;IAC3C,wEAAwE;IACxE,MAAM,EAAE,OAAO,CAAA;IACf,qFAAqF;IACrF,WAAW,IAAI,WAAW,GAAG,SAAS,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,qDAAqD;IACrD,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,wDAAwD;IACxD,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,eAAe,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;IACrC,8EAA8E;IAC9E,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;IACjC,sEAAsE;IACtE,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,sEAAsE;IACtE,eAAe,CAAC,EAAE,QAAQ,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;IACnD,iFAAiF;IACjF,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,SAAS,EAAE,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9E,+DAA+D;IAC/D,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACnD,iEAAiE;IACjE,MAAM,CAAC,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,0EAA0E;IAC1E,OAAO,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,oEAAoE;IACpE,MAAM,CAAC,CAAC,OAAO,EAAE,8BAA8B,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7D,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC,aAAa,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CACpC,CAAA;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAoJ9D"}
@@ -120,7 +120,7 @@ function ContextualSidebar(props) {
120
120
  return resizeLabel();
121
121
  },
122
122
  get grip() {
123
- return props.resizeGrip;
123
+ return props.resizeGrip ?? "rung";
124
124
  },
125
125
  controls: navigationId,
126
126
  get onChange() {
@@ -1 +1 @@
1
- {"version":3,"file":"contextual-sidebar.js","names":["Accessor","JSX","Show","createSignal","createUniqueId","onCleanup","onMount","cn","SidebarNav","SidebarNavContent","SidebarNavFooter","SidebarNavHeader","SidebarNavTitle","PixelResizeHandle","MobileModule","MobileLoad","error","ContextualSidebarRenderContext","mobile","portalMount","HTMLElement","ContextualSidebarProps","id","label","title","titleVisibility","open","onOpenChange","width","minimum","maximum","step","wideViewportAtLoad","resizeLabel","resizeGrip","restoreFocusRef","onSidebarElement","element","sidebarClass","sheetClass","headerClass","contentClass","footerClass","headingAs","header","context","Element","content","footer","onWidthChange","onWidthCommit","ContextualSidebar","props","isNarrowViewport","setIsNarrowViewport","mobileLoad","setMobileLoad","mobileRequested","loadMobile","then","module","mobileMount","setMobileMount","connected","mount","isConnected","undefined","media","window","matchMedia","updateViewport","wasNarrow","matches","addEventListener","removeEventListener","renderSidebar","navigationId","_$createComponent","as","aria-label","aria-hidden","inert","data-open","String","ref","node","queueMicrotask","class","children","when","side","value","grip","controls","onChange","onCommit","fallback","_$memo","_wide","keyed","loaded","MobileSidebar","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/contextual-sidebar/contextual-sidebar.tsx"],"sourcesContent":["import type { Accessor, JSX } from 'solid-js'\nimport { Show, createSignal, createUniqueId, onCleanup, onMount } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport {\n SidebarNav,\n SidebarNavContent,\n SidebarNavFooter,\n SidebarNavHeader,\n SidebarNavTitle,\n} from '../sidebar-nav/sidebar-nav'\nimport { PixelResizeHandle } from '../pixel-resize-handle/pixel-resize-handle'\n\ntype MobileModule = typeof import('./mobile-contextual-sidebar')\ntype MobileLoad = MobileModule | { error: unknown }\n\nexport type ContextualSidebarRenderContext = {\n /** Whether the slot is being rendered inside the modal mobile sheet. */\n mobile: boolean\n /** Mount nested popovers and menus inside the mobile dialog's accessibility tree. */\n portalMount(): HTMLElement | undefined\n}\n\nexport type ContextualSidebarProps = {\n /** Stable host id prefix; generated when omitted. */\n id?: string\n /** Landmark name shared by the desktop and mobile navigation. */\n label: string\n /** Visible navigation title and mobile dialog title. */\n title: string\n /**\n * Where the title row shows. `always` (default) draws it on desktop and in\n * the mobile sheet; `mobile` keeps the desktop title for assistive\n * technology only and drops the desktop row, for hosts whose top bar\n * already names the context. A `header` slot keeps the row visible.\n */\n titleVisibility?: 'always' | 'mobile'\n /** Host-controlled expanded state for the desktop panel and mobile dialog. */\n open: boolean\n onOpenChange(open: boolean): void\n /** Current host-owned pixel width, reflected by the resize handle. */\n width: number\n minimum: number\n maximum: number\n step?: number\n /** Pass the host's initial viewport seed to distinguish stale desktop state. */\n wideViewportAtLoad?: boolean\n resizeLabel?: string\n /** The resize edge's grip: the default bordered chip, or the quieter rung. */\n resizeGrip?: 'chip' | 'rung'\n /** Stable external opener used when the modal mobile sheet closes. */\n restoreFocusRef?: Accessor<HTMLElement | undefined>\n /** Called with the nav node so a host can project width onto its layout root. */\n onSidebarElement?: (element: HTMLElement | undefined, mobile: boolean) => void\n /** Host-owned layout classes applied to both nav instances. */\n sidebarClass?: string\n /** Host-owned responsive constraints for the modal sheet. */\n sheetClass?: string\n headerClass?: string\n contentClass?: string\n footerClass?: string\n headingAs?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n /** Optional action/content slot alongside the shared heading. */\n header?(context: ContextualSidebarRenderContext): JSX.Element\n /** View-specific navigation rows, projects, rooms, files, or sessions. */\n content(context: ContextualSidebarRenderContext): JSX.Element\n /** Optional view-specific footer, such as an archive affordance. */\n footer?(context: ContextualSidebarRenderContext): JSX.Element\n onWidthChange(width: number): void\n onWidthCommit?(width: number): void\n}\n\n/**\n * ContextualSidebar.\n *\n * Shared navigation geometry and interaction policy for an application's\n * contextual sidebar. The host keeps ownership of the actual grid width,\n * persisted preference, open state, and view-specific navigation content.\n */\nexport function ContextualSidebar(props: ContextualSidebarProps) {\n const [isNarrowViewport, setIsNarrowViewport] = createSignal(false)\n const [mobileLoad, setMobileLoad] = createSignal<MobileLoad>()\n let mobileRequested = false\n // Keep the resolved component mounted across viewport changes for Sheet cleanup.\n const loadMobile = () => {\n if (mobileRequested) return\n mobileRequested = true\n // Native module caching shares successful loads without keeping a rejected promise.\n void import('./mobile-contextual-sidebar').then(\n (module) => {\n if (mobileRequested) setMobileLoad(module)\n },\n (error: unknown) => {\n if (mobileRequested) setMobileLoad({ error })\n }\n )\n }\n const [mobileMount, setMobileMount] = createSignal<\n { element: HTMLElement; connected: boolean } | undefined\n >()\n const id = props.id ?? `contextual-sidebar-${createUniqueId()}`\n const resizeLabel = () => props.resizeLabel ?? `Resize ${props.label}`\n const portalMount = () => {\n const mount = mobileMount()\n return mount?.connected && mount.element.isConnected ? mount.element : undefined\n }\n\n onMount(() => {\n const media = window.matchMedia('(max-width: 48rem)')\n const updateViewport = () => {\n const wasNarrow = isNarrowViewport()\n if (media.matches) loadMobile()\n // Close before mounting a modal. A desktop-expanded host state is not\n // mobile intent, and opening the Sheet for one frame can steal focus.\n if (media.matches && !wasNarrow) props.onOpenChange(false)\n setIsNarrowViewport(media.matches)\n }\n\n // A route can mount after a wide-loaded host crosses into mobile. Clear\n // that stale seed, but preserve a sidebar intentionally opened at a\n // narrow boot viewport.\n if (media.matches) loadMobile()\n if (media.matches && props.wideViewportAtLoad && props.open) props.onOpenChange(false)\n setIsNarrowViewport(media.matches)\n media.addEventListener('change', updateViewport)\n onCleanup(() => {\n mobileRequested = false\n media.removeEventListener('change', updateViewport)\n })\n })\n\n const renderSidebar = (mobile: boolean) => {\n let element: HTMLElement | undefined\n const context: ContextualSidebarRenderContext = {\n mobile,\n portalMount: () => (mobile ? portalMount() : undefined),\n }\n const navigationId = `${id}-${mobile ? 'mobile' : 'desktop'}`\n\n onCleanup(() => {\n if (mobile && mobileMount()?.element === element) setMobileMount(undefined)\n element = undefined\n props.onSidebarElement?.(undefined, mobile)\n })\n\n return (\n <SidebarNav\n as=\"aside\"\n id={navigationId}\n aria-label={props.label}\n aria-hidden={!mobile && !props.open ? 'true' : undefined}\n inert={!mobile && !props.open}\n data-contextual-sidebar={mobile ? 'mobile' : 'desktop'}\n data-open={mobile ? undefined : String(props.open)}\n ref={(node) => {\n element = node\n if (mobile) {\n setMobileMount({ element: node, connected: node.isConnected })\n queueMicrotask(() => {\n if (node.isConnected && mobileMount()?.element === node)\n setMobileMount({ element: node, connected: true })\n })\n }\n props.onSidebarElement?.(node, mobile)\n }}\n class={cn('relative h-full w-full max-w-full', props.sidebarClass)}\n >\n <Show when={!mobile && props.open}>\n <PixelResizeHandle\n // The ruler spans the sidebar as a pointer-events-none overlay; lift\n // it above the neighbouring pane so the edge stays grabbable.\n class=\"z-(--z-docked)\"\n side=\"left\"\n value={props.width}\n minimum={props.minimum}\n maximum={props.maximum}\n step={props.step}\n label={resizeLabel()}\n grip={props.resizeGrip}\n controls={navigationId}\n onChange={props.onWidthChange}\n onCommit={props.onWidthCommit}\n />\n </Show>\n <Show when={!mobile || mobileMount()?.connected}>\n <Show\n when={mobile || props.titleVisibility !== 'mobile' || props.header}\n fallback={\n <SidebarNavTitle as={props.headingAs ?? 'h2'} class=\"sr-only\">\n {props.title}\n </SidebarNavTitle>\n }\n >\n <SidebarNavHeader class={cn(mobile && 'pe-12', props.headerClass)}>\n <SidebarNavTitle as={props.headingAs ?? 'h2'}>{props.title}</SidebarNavTitle>\n {props.header?.(context)}\n </SidebarNavHeader>\n </Show>\n <SidebarNavContent class={props.contentClass}>{props.content(context)}</SidebarNavContent>\n {props.footer ? (\n <SidebarNavFooter class={props.footerClass}>{props.footer(context)}</SidebarNavFooter>\n ) : null}\n </Show>\n </SidebarNav>\n )\n }\n\n return (\n <>\n <Show when={!isNarrowViewport()}>{(_wide) => renderSidebar(false)}</Show>\n <Show when={mobileLoad()} keyed>\n {(loaded) => {\n if ('error' in loaded) throw loaded.error\n return (\n <loaded.MobileSidebar\n open={isNarrowViewport() && props.open}\n onOpenChange={props.onOpenChange}\n label={props.label}\n sheetClass={props.sheetClass}\n restoreFocusRef={props.restoreFocusRef}\n renderSidebar={() => renderSidebar(true)}\n />\n )\n }}\n </Show>\n </>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"contextual-sidebar.js","names":["Accessor","JSX","Show","createSignal","createUniqueId","onCleanup","onMount","cn","SidebarNav","SidebarNavContent","SidebarNavFooter","SidebarNavHeader","SidebarNavTitle","PixelResizeHandle","MobileModule","MobileLoad","error","ContextualSidebarRenderContext","mobile","portalMount","HTMLElement","ContextualSidebarProps","id","label","title","titleVisibility","open","onOpenChange","width","minimum","maximum","step","wideViewportAtLoad","resizeLabel","resizeGrip","restoreFocusRef","onSidebarElement","element","sidebarClass","sheetClass","headerClass","contentClass","footerClass","headingAs","header","context","Element","content","footer","onWidthChange","onWidthCommit","ContextualSidebar","props","isNarrowViewport","setIsNarrowViewport","mobileLoad","setMobileLoad","mobileRequested","loadMobile","then","module","mobileMount","setMobileMount","connected","mount","isConnected","undefined","media","window","matchMedia","updateViewport","wasNarrow","matches","addEventListener","removeEventListener","renderSidebar","navigationId","_$createComponent","as","aria-label","aria-hidden","inert","data-open","String","ref","node","queueMicrotask","class","children","when","side","value","grip","controls","onChange","onCommit","fallback","_$memo","_wide","keyed","loaded","MobileSidebar","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/contextual-sidebar/contextual-sidebar.tsx"],"sourcesContent":["import type { Accessor, JSX } from 'solid-js'\nimport { Show, createSignal, createUniqueId, onCleanup, onMount } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport {\n SidebarNav,\n SidebarNavContent,\n SidebarNavFooter,\n SidebarNavHeader,\n SidebarNavTitle,\n} from '../sidebar-nav/sidebar-nav'\nimport { PixelResizeHandle } from '../pixel-resize-handle/pixel-resize-handle'\n\ntype MobileModule = typeof import('./mobile-contextual-sidebar')\ntype MobileLoad = MobileModule | { error: unknown }\n\nexport type ContextualSidebarRenderContext = {\n /** Whether the slot is being rendered inside the modal mobile sheet. */\n mobile: boolean\n /** Mount nested popovers and menus inside the mobile dialog's accessibility tree. */\n portalMount(): HTMLElement | undefined\n}\n\nexport type ContextualSidebarProps = {\n /** Stable host id prefix; generated when omitted. */\n id?: string\n /** Landmark name shared by the desktop and mobile navigation. */\n label: string\n /** Visible navigation title and mobile dialog title. */\n title: string\n /**\n * Where the title row shows. `always` (default) draws it on desktop and in\n * the mobile sheet; `mobile` keeps the desktop title for assistive\n * technology only and drops the desktop row, for hosts whose top bar\n * already names the context. A `header` slot keeps the row visible.\n */\n titleVisibility?: 'always' | 'mobile'\n /** Host-controlled expanded state for the desktop panel and mobile dialog. */\n open: boolean\n onOpenChange(open: boolean): void\n /** Current host-owned pixel width, reflected by the resize handle. */\n width: number\n minimum: number\n maximum: number\n step?: number\n /** Pass the host's initial viewport seed to distinguish stale desktop state. */\n wideViewportAtLoad?: boolean\n resizeLabel?: string\n /**\n * The resize edge's grip: the quieter rung by default, or the bordered chip\n * for hosts that want the heavier affordance.\n */\n resizeGrip?: 'chip' | 'rung'\n /** Stable external opener used when the modal mobile sheet closes. */\n restoreFocusRef?: Accessor<HTMLElement | undefined>\n /** Called with the nav node so a host can project width onto its layout root. */\n onSidebarElement?: (element: HTMLElement | undefined, mobile: boolean) => void\n /** Host-owned layout classes applied to both nav instances. */\n sidebarClass?: string\n /** Host-owned responsive constraints for the modal sheet. */\n sheetClass?: string\n headerClass?: string\n contentClass?: string\n footerClass?: string\n headingAs?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n /** Optional action/content slot alongside the shared heading. */\n header?(context: ContextualSidebarRenderContext): JSX.Element\n /** View-specific navigation rows, projects, rooms, files, or sessions. */\n content(context: ContextualSidebarRenderContext): JSX.Element\n /** Optional view-specific footer, such as an archive affordance. */\n footer?(context: ContextualSidebarRenderContext): JSX.Element\n onWidthChange(width: number): void\n onWidthCommit?(width: number): void\n}\n\n/**\n * ContextualSidebar.\n *\n * Shared navigation geometry and interaction policy for an application's\n * contextual sidebar. The host keeps ownership of the actual grid width,\n * persisted preference, open state, and view-specific navigation content.\n */\nexport function ContextualSidebar(props: ContextualSidebarProps) {\n const [isNarrowViewport, setIsNarrowViewport] = createSignal(false)\n const [mobileLoad, setMobileLoad] = createSignal<MobileLoad>()\n let mobileRequested = false\n // Keep the resolved component mounted across viewport changes for Sheet cleanup.\n const loadMobile = () => {\n if (mobileRequested) return\n mobileRequested = true\n // Native module caching shares successful loads without keeping a rejected promise.\n void import('./mobile-contextual-sidebar').then(\n (module) => {\n if (mobileRequested) setMobileLoad(module)\n },\n (error: unknown) => {\n if (mobileRequested) setMobileLoad({ error })\n }\n )\n }\n const [mobileMount, setMobileMount] = createSignal<\n { element: HTMLElement; connected: boolean } | undefined\n >()\n const id = props.id ?? `contextual-sidebar-${createUniqueId()}`\n const resizeLabel = () => props.resizeLabel ?? `Resize ${props.label}`\n const portalMount = () => {\n const mount = mobileMount()\n return mount?.connected && mount.element.isConnected ? mount.element : undefined\n }\n\n onMount(() => {\n const media = window.matchMedia('(max-width: 48rem)')\n const updateViewport = () => {\n const wasNarrow = isNarrowViewport()\n if (media.matches) loadMobile()\n // Close before mounting a modal. A desktop-expanded host state is not\n // mobile intent, and opening the Sheet for one frame can steal focus.\n if (media.matches && !wasNarrow) props.onOpenChange(false)\n setIsNarrowViewport(media.matches)\n }\n\n // A route can mount after a wide-loaded host crosses into mobile. Clear\n // that stale seed, but preserve a sidebar intentionally opened at a\n // narrow boot viewport.\n if (media.matches) loadMobile()\n if (media.matches && props.wideViewportAtLoad && props.open) props.onOpenChange(false)\n setIsNarrowViewport(media.matches)\n media.addEventListener('change', updateViewport)\n onCleanup(() => {\n mobileRequested = false\n media.removeEventListener('change', updateViewport)\n })\n })\n\n const renderSidebar = (mobile: boolean) => {\n let element: HTMLElement | undefined\n const context: ContextualSidebarRenderContext = {\n mobile,\n portalMount: () => (mobile ? portalMount() : undefined),\n }\n const navigationId = `${id}-${mobile ? 'mobile' : 'desktop'}`\n\n onCleanup(() => {\n if (mobile && mobileMount()?.element === element) setMobileMount(undefined)\n element = undefined\n props.onSidebarElement?.(undefined, mobile)\n })\n\n return (\n <SidebarNav\n as=\"aside\"\n id={navigationId}\n aria-label={props.label}\n aria-hidden={!mobile && !props.open ? 'true' : undefined}\n inert={!mobile && !props.open}\n data-contextual-sidebar={mobile ? 'mobile' : 'desktop'}\n data-open={mobile ? undefined : String(props.open)}\n ref={(node) => {\n element = node\n if (mobile) {\n setMobileMount({ element: node, connected: node.isConnected })\n queueMicrotask(() => {\n if (node.isConnected && mobileMount()?.element === node)\n setMobileMount({ element: node, connected: true })\n })\n }\n props.onSidebarElement?.(node, mobile)\n }}\n class={cn('relative h-full w-full max-w-full', props.sidebarClass)}\n >\n <Show when={!mobile && props.open}>\n <PixelResizeHandle\n // The ruler spans the sidebar as a pointer-events-none overlay; lift\n // it above the neighbouring pane so the edge stays grabbable.\n class=\"z-(--z-docked)\"\n side=\"left\"\n value={props.width}\n minimum={props.minimum}\n maximum={props.maximum}\n step={props.step}\n label={resizeLabel()}\n grip={props.resizeGrip ?? 'rung'}\n controls={navigationId}\n onChange={props.onWidthChange}\n onCommit={props.onWidthCommit}\n />\n </Show>\n <Show when={!mobile || mobileMount()?.connected}>\n <Show\n when={mobile || props.titleVisibility !== 'mobile' || props.header}\n fallback={\n <SidebarNavTitle as={props.headingAs ?? 'h2'} class=\"sr-only\">\n {props.title}\n </SidebarNavTitle>\n }\n >\n <SidebarNavHeader class={cn(mobile && 'pe-12', props.headerClass)}>\n <SidebarNavTitle as={props.headingAs ?? 'h2'}>{props.title}</SidebarNavTitle>\n {props.header?.(context)}\n </SidebarNavHeader>\n </Show>\n <SidebarNavContent class={props.contentClass}>{props.content(context)}</SidebarNavContent>\n {props.footer ? (\n <SidebarNavFooter class={props.footerClass}>{props.footer(context)}</SidebarNavFooter>\n ) : null}\n </Show>\n </SidebarNav>\n )\n }\n\n return (\n <>\n <Show when={!isNarrowViewport()}>{(_wide) => renderSidebar(false)}</Show>\n <Show when={mobileLoad()} keyed>\n {(loaded) => {\n if ('error' in loaded) throw loaded.error\n return (\n <loaded.MobileSidebar\n open={isNarrowViewport() && props.open}\n onOpenChange={props.onOpenChange}\n label={props.label}\n sheetClass={props.sheetClass}\n restoreFocusRef={props.restoreFocusRef}\n renderSidebar={() => renderSidebar(true)}\n />\n )\n }}\n </Show>\n </>\n )\n}\n"],"mappings":"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"}
@@ -9,7 +9,10 @@ export type PixelResizeHandleProps = {
9
9
  label?: string;
10
10
  controls?: string;
11
11
  class?: string;
12
- /** The grip drawn on the edge: the default bordered chip, or the quieter rung. */
12
+ /**
13
+ * The grip drawn on the edge: the quieter rung by default, or the bordered
14
+ * chip for hosts that want the heavier affordance.
15
+ */
13
16
  grip?: 'chip' | 'rung';
14
17
  onChange(value: number): void;
15
18
  onCommit?(value: number): void;
@@ -1 +1 @@
1
- {"version":3,"file":"pixel-resize-handle.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,sBAAsB,GAAG;IACnC,6EAA6E;IAC7E,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;IACtB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,kFAAkF;IAClF,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,kCAgJ9D"}
1
+ {"version":3,"file":"pixel-resize-handle.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,sBAAsB,GAAG;IACnC,6EAA6E;IAC7E,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;IACtB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,kCAgJ9D"}
@@ -77,7 +77,7 @@ function PixelResizeHandle(props) {
77
77
  }),
78
78
  createComponent(ResizableHandle, {
79
79
  get withHandle() {
80
- return props.grip === "rung" ? "rung" : true;
80
+ return props.grip === "chip" ? true : "rung";
81
81
  },
82
82
  get label() {
83
83
  return props.label ?? `Resize ${props.side} pane`;
@@ -1 +1 @@
1
- {"version":3,"file":"pixel-resize-handle.js","names":["ResizableHandle","ResizablePanel","ResizablePanelGroup","createSignal","onCleanup","cn","PixelResizeHandleProps","side","value","minimum","maximum","step","label","controls","class","grip","onChange","onCommit","PixelResizeHandle","props","Math","max","min","round","ratio","isRight","rulerSizes","commit","interacting","drag","setDrag","pointerId","startX","startValue","handle","HTMLElement","endPointer","shouldCommit","current","undefined","hasPointerCapture","releasePointerCapture","endKeyboard","wasInteracting","_$createComponent","orientation","dir","sizes","keyboardDelta","style","width","onSizesChange","length","next","bounded","children","minSize","_$memo","maxSize","withHandle","aria-controls","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext","data-dragging","onHandleDragStart","event","preventDefault","button","isPrimary","currentTarget","focus","setPointerCapture","clientX","onPointerMove","PointerEvent","delta","onPointerUp","onPointerCancel","onLostPointerCapture","onBlur","onKeyDown","includes","key","onKeyUp","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"sourcesContent":["import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '../../ui/resizable'\nimport { createSignal, onCleanup } from 'solid-js'\nimport { cn } from '#lib/utils'\n\nexport type PixelResizeHandleProps = {\n /** Which physical edge of the ruler the resizable surface is attached to. */\n side: 'left' | 'right'\n /** Current width in CSS pixels. */\n value: number\n minimum: number\n maximum: number\n step?: number\n label?: string\n controls?: string\n class?: string\n /** The grip drawn on the edge: the default bordered chip, or the quieter rung. */\n grip?: 'chip' | 'rung'\n onChange(value: number): void\n onCommit?(value: number): void\n}\n\n/**\n * PixelResizeHandle.\n *\n * A keyboard- and pointer-operable edge ruler for a host-owned pane. Keep the\n * pane's actual width and any persistence in its layout owner; this component\n * reports a bounded pixel value and places the shared resizable grip at the\n * matching left or right edge.\n *\n * Corvu 0.2.5 supplies geometry, keyboard resizing, ARIA and the shared grip,\n * but its global drag handler does not end on pointer cancellation. Prevent\n * that handler through its public start hook and use local pointer capture\n * for bounded pixel gestures, including cancellation and lost capture.\n */\nexport function PixelResizeHandle(props: PixelResizeHandleProps) {\n const maximum = () => Math.max(1, props.maximum)\n const minimum = () => Math.min(maximum(), Math.max(0, props.minimum))\n const value = () => Math.min(maximum(), Math.max(minimum(), Math.round(props.value)))\n const ratio = () => value() / maximum()\n const isRight = () => props.side === 'right'\n const rulerSizes = () => (isRight() ? [1 - ratio(), ratio()] : [ratio(), 1 - ratio()])\n const commit = () => props.onCommit?.(value())\n let interacting = false\n const [drag, setDrag] = createSignal<{\n pointerId: number\n startX: number\n startValue: number\n handle: HTMLElement\n }>()\n const endPointer = (shouldCommit: boolean) => {\n const current = drag()\n if (!current) return\n setDrag(undefined)\n if (current.handle.hasPointerCapture(current.pointerId))\n current.handle.releasePointerCapture(current.pointerId)\n if (shouldCommit) commit()\n }\n const endKeyboard = () => {\n const wasInteracting = interacting\n interacting = false\n if (wasInteracting) commit()\n }\n onCleanup(() => {\n endKeyboard()\n endPointer(false)\n })\n\n return (\n <ResizablePanelGroup\n orientation=\"horizontal\"\n dir=\"ltr\"\n sizes={rulerSizes()}\n keyboardDelta={`${props.step ?? 16}px`}\n style={{ width: `${maximum()}px` }}\n class={cn(\n 'pointer-events-none absolute inset-y-0 flex',\n {\n 'left-0': props.side === 'left',\n 'right-0': props.side === 'right',\n },\n props.class\n )}\n onSizesChange={(sizes) => {\n // Panel registration and teardown also emit sizes. Only user resizing\n // may update the host preference; collapsing must preserve its width.\n if (!interacting || sizes.length !== 2) return\n const next = Math.round((sizes[isRight() ? 1 : 0] ?? ratio()) * maximum())\n const bounded = Math.min(maximum(), Math.max(minimum(), next))\n if (bounded !== value()) props.onChange(bounded)\n }}\n >\n <ResizablePanel\n minSize={isRight() ? 0 : minimum() / maximum()}\n maxSize={1}\n aria-hidden=\"true\"\n />\n <ResizableHandle\n withHandle={props.grip === 'rung' ? 'rung' : true}\n label={props.label ?? `Resize ${props.side} pane`}\n aria-controls={props.controls}\n aria-valuemin={minimum()}\n aria-valuemax={maximum()}\n aria-valuenow={value()}\n aria-valuetext={`${value()} pixels`}\n data-dragging={drag() ? '' : undefined}\n onHandleDragStart={(event) => {\n // Corvu checks defaultPrevented before starting its global handler.\n event.preventDefault()\n if (event.button !== 0 || !event.isPrimary) return\n const handle = event.currentTarget\n if (!(handle instanceof HTMLElement)) return\n endPointer(false)\n interacting = false\n handle.focus()\n handle.setPointerCapture(event.pointerId)\n setDrag({\n pointerId: event.pointerId,\n startX: event.clientX,\n startValue: value(),\n handle,\n })\n }}\n onPointerMove={(event: PointerEvent) => {\n const current = drag()\n if (!current || event.pointerId !== current.pointerId) return\n if (!current.handle.hasPointerCapture(current.pointerId)) {\n endPointer(false)\n return\n }\n const delta = (event.clientX - current.startX) * (isRight() ? -1 : 1)\n const next = Math.min(\n maximum(),\n Math.max(minimum(), Math.round(current.startValue + delta))\n )\n if (next !== value()) props.onChange(next)\n }}\n onPointerUp={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(true)\n }}\n onPointerCancel={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(false)\n }}\n onLostPointerCapture={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(false)\n }}\n onBlur={() => {\n endKeyboard()\n endPointer(false)\n }}\n onKeyDown={(event) => {\n const current = drag()\n if (current && !current.handle.hasPointerCapture(current.pointerId)) endPointer(false)\n if (drag()) {\n event.preventDefault()\n return\n }\n if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) interacting = true\n // Corvu operates on physical panel order. Home/End here describe\n // the controlled pane width, including a pane after the separator.\n if (event.key === 'Home' || event.key === 'End') {\n event.preventDefault()\n props.onChange(event.key === 'Home' ? minimum() : maximum())\n }\n }}\n onKeyUp={(event) => {\n if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n endKeyboard()\n }\n }}\n class=\"pointer-events-auto\"\n />\n <ResizablePanel\n minSize={isRight() ? minimum() / maximum() : 0}\n maxSize={1}\n aria-hidden=\"true\"\n />\n </ResizablePanelGroup>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"pixel-resize-handle.js","names":["ResizableHandle","ResizablePanel","ResizablePanelGroup","createSignal","onCleanup","cn","PixelResizeHandleProps","side","value","minimum","maximum","step","label","controls","class","grip","onChange","onCommit","PixelResizeHandle","props","Math","max","min","round","ratio","isRight","rulerSizes","commit","interacting","drag","setDrag","pointerId","startX","startValue","handle","HTMLElement","endPointer","shouldCommit","current","undefined","hasPointerCapture","releasePointerCapture","endKeyboard","wasInteracting","_$createComponent","orientation","dir","sizes","keyboardDelta","style","width","onSizesChange","length","next","bounded","children","minSize","_$memo","maxSize","withHandle","aria-controls","aria-valuemin","aria-valuemax","aria-valuenow","aria-valuetext","data-dragging","onHandleDragStart","event","preventDefault","button","isPrimary","currentTarget","focus","setPointerCapture","clientX","onPointerMove","PointerEvent","delta","onPointerUp","onPointerCancel","onLostPointerCapture","onBlur","onKeyDown","includes","key","onKeyUp","_$createComponent","_$memo"],"sources":["../../../../src/components/layout/pixel-resize-handle/pixel-resize-handle.tsx"],"sourcesContent":["import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '../../ui/resizable'\nimport { createSignal, onCleanup } from 'solid-js'\nimport { cn } from '#lib/utils'\n\nexport type PixelResizeHandleProps = {\n /** Which physical edge of the ruler the resizable surface is attached to. */\n side: 'left' | 'right'\n /** Current width in CSS pixels. */\n value: number\n minimum: number\n maximum: number\n step?: number\n label?: string\n controls?: string\n class?: string\n /**\n * The grip drawn on the edge: the quieter rung by default, or the bordered\n * chip for hosts that want the heavier affordance.\n */\n grip?: 'chip' | 'rung'\n onChange(value: number): void\n onCommit?(value: number): void\n}\n\n/**\n * PixelResizeHandle.\n *\n * A keyboard- and pointer-operable edge ruler for a host-owned pane. Keep the\n * pane's actual width and any persistence in its layout owner; this component\n * reports a bounded pixel value and places the shared resizable grip at the\n * matching left or right edge.\n *\n * Corvu 0.2.5 supplies geometry, keyboard resizing, ARIA and the shared grip,\n * but its global drag handler does not end on pointer cancellation. Prevent\n * that handler through its public start hook and use local pointer capture\n * for bounded pixel gestures, including cancellation and lost capture.\n */\nexport function PixelResizeHandle(props: PixelResizeHandleProps) {\n const maximum = () => Math.max(1, props.maximum)\n const minimum = () => Math.min(maximum(), Math.max(0, props.minimum))\n const value = () => Math.min(maximum(), Math.max(minimum(), Math.round(props.value)))\n const ratio = () => value() / maximum()\n const isRight = () => props.side === 'right'\n const rulerSizes = () => (isRight() ? [1 - ratio(), ratio()] : [ratio(), 1 - ratio()])\n const commit = () => props.onCommit?.(value())\n let interacting = false\n const [drag, setDrag] = createSignal<{\n pointerId: number\n startX: number\n startValue: number\n handle: HTMLElement\n }>()\n const endPointer = (shouldCommit: boolean) => {\n const current = drag()\n if (!current) return\n setDrag(undefined)\n if (current.handle.hasPointerCapture(current.pointerId))\n current.handle.releasePointerCapture(current.pointerId)\n if (shouldCommit) commit()\n }\n const endKeyboard = () => {\n const wasInteracting = interacting\n interacting = false\n if (wasInteracting) commit()\n }\n onCleanup(() => {\n endKeyboard()\n endPointer(false)\n })\n\n return (\n <ResizablePanelGroup\n orientation=\"horizontal\"\n dir=\"ltr\"\n sizes={rulerSizes()}\n keyboardDelta={`${props.step ?? 16}px`}\n style={{ width: `${maximum()}px` }}\n class={cn(\n 'pointer-events-none absolute inset-y-0 flex',\n {\n 'left-0': props.side === 'left',\n 'right-0': props.side === 'right',\n },\n props.class\n )}\n onSizesChange={(sizes) => {\n // Panel registration and teardown also emit sizes. Only user resizing\n // may update the host preference; collapsing must preserve its width.\n if (!interacting || sizes.length !== 2) return\n const next = Math.round((sizes[isRight() ? 1 : 0] ?? ratio()) * maximum())\n const bounded = Math.min(maximum(), Math.max(minimum(), next))\n if (bounded !== value()) props.onChange(bounded)\n }}\n >\n <ResizablePanel\n minSize={isRight() ? 0 : minimum() / maximum()}\n maxSize={1}\n aria-hidden=\"true\"\n />\n <ResizableHandle\n withHandle={props.grip === 'chip' ? true : 'rung'}\n label={props.label ?? `Resize ${props.side} pane`}\n aria-controls={props.controls}\n aria-valuemin={minimum()}\n aria-valuemax={maximum()}\n aria-valuenow={value()}\n aria-valuetext={`${value()} pixels`}\n data-dragging={drag() ? '' : undefined}\n onHandleDragStart={(event) => {\n // Corvu checks defaultPrevented before starting its global handler.\n event.preventDefault()\n if (event.button !== 0 || !event.isPrimary) return\n const handle = event.currentTarget\n if (!(handle instanceof HTMLElement)) return\n endPointer(false)\n interacting = false\n handle.focus()\n handle.setPointerCapture(event.pointerId)\n setDrag({\n pointerId: event.pointerId,\n startX: event.clientX,\n startValue: value(),\n handle,\n })\n }}\n onPointerMove={(event: PointerEvent) => {\n const current = drag()\n if (!current || event.pointerId !== current.pointerId) return\n if (!current.handle.hasPointerCapture(current.pointerId)) {\n endPointer(false)\n return\n }\n const delta = (event.clientX - current.startX) * (isRight() ? -1 : 1)\n const next = Math.min(\n maximum(),\n Math.max(minimum(), Math.round(current.startValue + delta))\n )\n if (next !== value()) props.onChange(next)\n }}\n onPointerUp={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(true)\n }}\n onPointerCancel={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(false)\n }}\n onLostPointerCapture={(event: PointerEvent) => {\n if (event.pointerId === drag()?.pointerId) endPointer(false)\n }}\n onBlur={() => {\n endKeyboard()\n endPointer(false)\n }}\n onKeyDown={(event) => {\n const current = drag()\n if (current && !current.handle.hasPointerCapture(current.pointerId)) endPointer(false)\n if (drag()) {\n event.preventDefault()\n return\n }\n if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) interacting = true\n // Corvu operates on physical panel order. Home/End here describe\n // the controlled pane width, including a pane after the separator.\n if (event.key === 'Home' || event.key === 'End') {\n event.preventDefault()\n props.onChange(event.key === 'Home' ? minimum() : maximum())\n }\n }}\n onKeyUp={(event) => {\n if (['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) {\n endKeyboard()\n }\n }}\n class=\"pointer-events-auto\"\n />\n <ResizablePanel\n minSize={isRight() ? minimum() / maximum() : 0}\n maxSize={1}\n aria-hidden=\"true\"\n />\n </ResizablePanelGroup>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqCA,SAAgBkB,kBAAkBC,OAA+B;CAC/D,MAAMT,gBAAgBU,KAAKC,IAAI,GAAGF,MAAMT,OAAO;CAC/C,MAAMD,gBAAgBW,KAAKE,IAAIZ,QAAQ,GAAGU,KAAKC,IAAI,GAAGF,MAAMV,OAAO,CAAC;CACpE,MAAMD,cAAcY,KAAKE,IAAIZ,QAAQ,GAAGU,KAAKC,IAAIZ,QAAQ,GAAGW,KAAKG,MAAMJ,MAAMX,KAAK,CAAC,CAAC;CACpF,MAAMgB,cAAchB,MAAM,IAAIE,QAAQ;CACtC,MAAMe,gBAAgBN,MAAMZ,SAAS;CACrC,MAAMmB,mBAAoBD,QAAQ,IAAI,CAAC,IAAID,MAAM,GAAGA,MAAM,CAAC,IAAI,CAACA,MAAM,GAAG,IAAIA,MAAM,CAAC;CACpF,MAAMG,eAAeR,MAAMF,WAAWT,MAAM,CAAC;CAC7C,IAAIoB,cAAc;CAClB,MAAM,CAACC,MAAMC,WAAW3B,aAKrB;CACH,MAAMiC,cAAcC,iBAA0B;EAC5C,MAAMC,UAAUT,KAAK;EACrB,IAAI,CAACS,SAAS;EACdR,QAAQS,KAAAA,CAAS;EACjB,IAAID,QAAQJ,OAAOM,kBAAkBF,QAAQP,SAAS,GACpDO,QAAQJ,OAAOO,sBAAsBH,QAAQP,SAAS;EACxD,IAAIM,cAAcV,OAAO;CAC3B;CACA,MAAMe,oBAAoB;EACxB,MAAMC,iBAAiBf;EACvBA,cAAc;EACd,IAAIe,gBAAgBhB,OAAO;CAC7B;CACAvB,gBAAgB;EACdsC,YAAY;EACZN,WAAW,KAAK;CAClB,CAAC;CAED,OAAAQ,gBACG1C,qBAAmB;EAClB2C,aAAW;EACXC,KAAG;EAAA,IACHC,QAAK;GAAA,OAAErB,WAAW;EAAC;EAAA,IACnBsB,gBAAa;GAAA,OAAE,GAAG7B,MAAMR,QAAQ,GAAE;EAAI;EAAA,IACtCsC,QAAK;GAAA,OAAE,EAAEC,OAAO,GAAGxC,QAAQ,EAAC,IAAK;EAAC;EAAA,KAAA,WAAA;GAAA,OAC3BL,GACL,+CACA;IACE,UAAUc,MAAMZ,SAAS;IACzB,WAAWY,MAAMZ,SAAS;GAC5B,GACAY,MAAML,KACR;EAAC;EACDqC,gBAAgBJ,UAAU;GAGxB,IAAI,CAACnB,eAAemB,MAAMK,WAAW,GAAG;GACxC,MAAMC,OAAOjC,KAAKG,OAAOwB,MAAMtB,QAAQ,IAAI,IAAI,MAAMD,MAAM,KAAKd,QAAQ,CAAC;GACzE,MAAM4C,UAAUlC,KAAKE,IAAIZ,QAAQ,GAAGU,KAAKC,IAAIZ,QAAQ,GAAG4C,IAAI,CAAC;GAC7D,IAAIC,YAAY9C,MAAM,GAAGW,MAAMH,SAASsC,OAAO;EACjD;EAAC,IAAAC,WAAA;GAAA,OAAA;IAAAX,gBAEA3C,gBAAc;KAAA,IACbuD,UAAO;MAAA,OAAEC,WAAA,CAAA,CAAAhC,QAAQ,CAAC,CAAA,CAAA,IAAG,IAAIhB,QAAQ,IAAIC,QAAQ;KAAC;KAC9CgD,SAAS;KAAC,eAAA;IAAA,CAAA;IAAAd,gBAGX5C,iBAAe;KAAA,IACd2D,aAAU;MAAA,OAAExC,MAAMJ,SAAS,SAAS,OAAO;KAAM;KAAA,IACjDH,QAAK;MAAA,OAAEO,MAAMP,SAAS,UAAUO,MAAMZ,KAAI;KAAO;KAAA,KAAA,mBAAA;MAAA,OAClCY,MAAMN;KAAQ;KAAA,KAAA,mBAAA;MAAA,OACdJ,QAAQ;KAAC;KAAA,KAAA,mBAAA;MAAA,OACTC,QAAQ;KAAC;KAAA,KAAA,mBAAA;MAAA,OACTF,MAAM;KAAC;KAAA,KAAA,oBAAA;MAAA,OACN,GAAGA,MAAM,EAAC;KAAS;KAAA,KAAA,mBAAA;MAAA,OACpBqB,KAAK,IAAI,KAAKU,KAAAA;KAAS;KACtC2B,oBAAoBC,UAAU;MAE5BA,MAAMC,eAAe;MACrB,IAAID,MAAME,WAAW,KAAK,CAACF,MAAMG,WAAW;MAC5C,MAAMpC,SAASiC,MAAMI;MACrB,IAAI,EAAErC,kBAAkBC,cAAc;MACtCC,WAAW,KAAK;MAChBR,cAAc;MACdM,OAAOsC,MAAM;MACbtC,OAAOuC,kBAAkBN,MAAMpC,SAAS;MACxCD,QAAQ;OACNC,WAAWoC,MAAMpC;OACjBC,QAAQmC,MAAMO;OACdzC,YAAYzB,MAAM;OAClB0B;MACF,CAAC;KACH;KACAyC,gBAAgBR,UAAwB;MACtC,MAAM7B,UAAUT,KAAK;MACrB,IAAI,CAACS,WAAW6B,MAAMpC,cAAcO,QAAQP,WAAW;MACvD,IAAI,CAACO,QAAQJ,OAAOM,kBAAkBF,QAAQP,SAAS,GAAG;OACxDK,WAAW,KAAK;OAChB;MACF;MACA,MAAMyC,SAASV,MAAMO,UAAUpC,QAAQN,WAAWP,QAAQ,IAAI,KAAK;MACnE,MAAM4B,OAAOjC,KAAKE,IAChBZ,QAAQ,GACRU,KAAKC,IAAIZ,QAAQ,GAAGW,KAAKG,MAAMe,QAAQL,aAAa4C,KAAK,CAAC,CAC5D;MACA,IAAIxB,SAAS7C,MAAM,GAAGW,MAAMH,SAASqC,IAAI;KAC3C;KACAyB,cAAcX,UAAwB;MACpC,IAAIA,MAAMpC,cAAcF,KAAK,CAAC,EAAEE,WAAWK,WAAW,IAAI;KAC5D;KACA2C,kBAAkBZ,UAAwB;MACxC,IAAIA,MAAMpC,cAAcF,KAAK,CAAC,EAAEE,WAAWK,WAAW,KAAK;KAC7D;KACA4C,uBAAuBb,UAAwB;MAC7C,IAAIA,MAAMpC,cAAcF,KAAK,CAAC,EAAEE,WAAWK,WAAW,KAAK;KAC7D;KACA6C,cAAc;MACZvC,YAAY;MACZN,WAAW,KAAK;KAClB;KACA8C,YAAYf,UAAU;MACpB,MAAM7B,UAAUT,KAAK;MACrB,IAAIS,WAAW,CAACA,QAAQJ,OAAOM,kBAAkBF,QAAQP,SAAS,GAAGK,WAAW,KAAK;MACrF,IAAIP,KAAK,GAAG;OACVsC,MAAMC,eAAe;OACrB;MACF;MACA,IAAI;OAAC;OAAa;OAAc;OAAQ;MAAK,CAAC,CAACe,SAAShB,MAAMiB,GAAG,GAAGxD,cAAc;MAGlF,IAAIuC,MAAMiB,QAAQ,UAAUjB,MAAMiB,QAAQ,OAAO;OAC/CjB,MAAMC,eAAe;OACrBjD,MAAMH,SAASmD,MAAMiB,QAAQ,SAAS3E,QAAQ,IAAIC,QAAQ,CAAC;MAC7D;KACF;KACA2E,UAAUlB,UAAU;MAClB,IAAI;OAAC;OAAa;OAAc;OAAQ;MAAK,CAAC,CAACgB,SAAShB,MAAMiB,GAAG,GAC/D1C,YAAY;KAEhB;KAAC,SAAA;IAAA,CAAA;IAAAE,gBAGF3C,gBAAc;KAAA,IACbuD,UAAO;MAAA,OAAEC,WAAA,CAAA,CAAAhC,QAAQ,CAAC,CAAA,CAAA,IAAGhB,QAAQ,IAAIC,QAAQ,IAAI;KAAC;KAC9CgD,SAAS;KAAC,eAAA;IAAA,CAAA;GAAA;EAAA;CAAA,CAAA;AAKlB"}
@@ -1 +1 @@
1
- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAwC,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGvF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,cAAc;;;;8EA0D1B,CAAA;AAED,KAAK,kBAAkB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAE7D,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,QAAQ,IAAI,gBAAgB,CAC7E,CAAC,EACD,kBAAkB,GAAG;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CACF,CAAA;AAED,wBAAgB,MAAM,CAAC,CAAC,SAAS,cAAc,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,kCAwBhF"}
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC9E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAC/E,OAAO,EAAwC,KAAK,YAAY,EAAE,MAAM,eAAe,CAAA;AAGvF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,cAAc;;;;8EA6D1B,CAAA;AAED,KAAK,kBAAkB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAA;AAE7D,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,QAAQ,IAAI,gBAAgB,CAC7E,CAAC,EACD,kBAAkB,GAAG;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CACF,CAAA;AAED,wBAAgB,MAAM,CAAC,CAAC,SAAS,cAAc,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,kCAwBhF"}
@@ -34,11 +34,13 @@ var buttonVariants = cva(`${controlInteractive} inline-flex shrink-0 items-cente
34
34
  ghost: "text-foreground hover:bg-surface-hover",
35
35
  /**
36
36
  * A ghost that opens something: a sheet, menu or popover trigger in a
37
- * toolbar. While its surface is open it holds the menubar's pressed
38
- * rung, so the open control never reads identical to its closed
39
- * neighbours.
37
+ * toolbar. While its surface is open it holds the accent's own tint —
38
+ * the same treatment that drives the side rail's active destination —
39
+ * so the open control never reads identical to its closed neighbours
40
+ * and the app's pressed chrome reads as one accent chroma. The
41
+ * compound hover keeps the tint when an open control is pointed at.
40
42
  */
41
- toolbar: "text-foreground hover:bg-surface-hover data-[expanded]:bg-surface-active",
43
+ toolbar: "text-foreground hover:bg-surface-hover data-[expanded]:bg-primary-subtle data-[expanded]:text-primary data-[expanded]:hover:bg-primary-subtle",
42
44
  /** A tinted primary, for a secondary action inside a primary flow. */
43
45
  subtle: "bg-primary-subtle text-primary hover:bg-primary-subtle/80",
44
46
  success: "bg-success text-success-foreground hover:bg-success/90",
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","controlInteractive","controlSize","VariantProps","cn","buttonVariants","variants","variant","default","secondary","destructive","outline","ghost","toolbar","subtle","success","link","size","xs","sm","md","lg","xl","touchTarget","comfortable","defaultVariants","ButtonVariantProps","ButtonProps","T","class","Button","props","local","rest","_$createComponent","_$mergeProps","as","type","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/button/button.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, controlInteractive, controlSize, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Button.\n *\n * One appearance ladder shared by every pressable thing in the system: a\n * button, a toolbar control, a dialog action, and a menu row all draw from the\n * same tokens, so a row of them cannot drift apart.\n *\n * The variants answer \"what is this for\", never \"what colour is it\". A caller\n * that wants a red button writes `variant=\"destructive\"`; the red lives here.\n * That is also what lets the design-system linter tell a caller which variant\n * to use instead of only which class was wrong.\n *\n * Polymorphic: pass `as=\"a\"` (or any component) and the button becomes it\n * while keeping the same styling contract. This replaces the React-era\n * `asChild` primitive, which has no Solid equivalent that preserves props.\n */\nexport const buttonVariants = cva(\n `${controlInteractive} inline-flex shrink-0 items-center justify-center rounded-md font-medium whitespace-nowrap select-none [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n /** The one primary action in a view. */\n default: 'bg-primary text-primary-foreground hover:bg-primary-hover',\n secondary: 'bg-secondary text-secondary-foreground hover:bg-surface-hover',\n /** For the action that destroys something. Never the default. */\n destructive:\n 'bg-destructive-action text-destructive-action-foreground hover:bg-destructive-action/90 focus-visible:ring-destructive-subtle',\n /** A bordered button for a surface that already has a fill. */\n outline:\n 'border border-border bg-transparent text-foreground hover:bg-surface-hover hover:border-input',\n /** No chrome until hover. The default for toolbar and row actions. */\n ghost: 'text-foreground hover:bg-surface-hover',\n /**\n * A ghost that opens something: a sheet, menu or popover trigger in a\n * toolbar. While its surface is open it holds the menubar's pressed\n * rung, so the open control never reads identical to its closed\n * neighbours.\n */\n toolbar: 'text-foreground hover:bg-surface-hover data-[expanded]:bg-surface-active',\n /** A tinted primary, for a secondary action inside a primary flow. */\n subtle: 'bg-primary-subtle text-primary hover:bg-primary-subtle/80',\n success: 'bg-success text-success-foreground hover:bg-success/90',\n link: 'text-primary underline-offset-4 hover:underline',\n },\n size: {\n '2xs': `${controlSize['2xs']} [&_svg]:size-3`,\n xs: `${controlSize.xs} [&_svg]:size-3.5`,\n sm: `${controlSize.sm} [&_svg]:size-3.5`,\n md: `${controlSize.md} [&_svg]:size-4`,\n lg: `${controlSize.lg} [&_svg]:size-4`,\n xl: `${controlSize.xl} [&_svg]:size-5`,\n '2xl': `${controlSize['2xl']} [&_svg]:size-6`,\n /* Square, for an icon with no label. The accessible name then has to\n come from `aria-label` or a visually hidden label — an icon-only\n button with neither is the accessibility finding the Storybook lane\n catches on every story. */\n 'icon-2xs': 'size-control-2xs p-0 [&_svg]:size-3',\n 'icon-xs': 'size-control-xs p-0 [&_svg]:size-3.5',\n 'icon-sm': 'size-control-sm p-0 [&_svg]:size-3.5',\n 'icon-md': 'size-control-md p-0 [&_svg]:size-4',\n 'icon-lg': 'size-control-lg p-0 [&_svg]:size-4',\n 'icon-xl': 'size-control-xl p-0 [&_svg]:size-5',\n 'icon-2xl': 'size-control-2xl p-0 [&_svg]:size-6',\n },\n /** Opt in to a stable touch target on devices with any coarse pointer. */\n touchTarget: {\n comfortable: 'touch-target-comfortable',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n },\n }\n)\n\ntype ButtonVariantProps = VariantProps<typeof buttonVariants>\n\nexport type ButtonProps<T extends ValidComponent = 'button'> = PolymorphicProps<\n T,\n ButtonVariantProps & {\n class?: string\n }\n>\n\nexport function Button<T extends ValidComponent = 'button'>(props: ButtonProps<T>) {\n const [local, rest] = splitProps(props as ButtonProps, [\n 'variant',\n 'size',\n 'touchTarget',\n 'class',\n ])\n\n return (\n <Polymorphic\n as=\"button\"\n type=\"button\"\n data-slot=\"button\"\n class={cn(\n buttonVariants({\n variant: local.variant,\n size: local.size,\n touchTarget: local.touchTarget,\n }),\n local.class\n )}\n {...(rest as ComponentProps<'button'>)}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAaU,iBAAiBL,IAC5B,GAAGC,mBAAkB,sJACrB;CACEK,UAAU;EACRC,SAAS;;GAEPC,SAAS;GACTC,WAAW;;GAEXC,aACE;;GAEFC,SACE;;GAEFC,OAAO;;;;;;;GAOPC,SAAS;;GAETC,QAAQ;GACRC,SAAS;GACTC,MAAM;EACR;EACAC,MAAM;GACJ,OAAO,GAAGf,YAAY,OAAM;GAC5BgB,IAAI,GAAGhB,YAAYgB,GAAE;GACrBC,IAAI,GAAGjB,YAAYiB,GAAE;GACrBC,IAAI,GAAGlB,YAAYkB,GAAE;GACrBC,IAAI,GAAGnB,YAAYmB,GAAE;GACrBC,IAAI,GAAGpB,YAAYoB,GAAE;GACrB,OAAO,GAAGpB,YAAY,OAAM;GAK5B,YAAY;GACZ,WAAW;GACX,WAAW;GACX,WAAW;GACX,WAAW;GACX,WAAW;GACX,YAAY;EACd;;EAEAqB,aAAa,EACXC,aAAa,2BACf;CACF;CACAC,iBAAiB;EACflB,SAAS;EACTU,MAAM;CACR;AACF,CACF;AAWA,SAAgBa,OAA4CC,OAAuB;CACjF,MAAM,CAACC,OAAOC,QAAQnC,WAAWiC,OAAsB;EACrD;EACA;EACA;EACA;CAAO,CACR;CAED,OAAAG,gBACGvC,aAAWwC,WAAA;EACVC,IAAE;EACFC,MAAI;EAAA,aAAA;EAAA,KAAA,WAAA;GAAA,OAEGjC,GACLC,eAAe;IACbE,SAASyB,MAAMzB;IACfU,MAAMe,MAAMf;IACZM,aAAaS,MAAMT;GACrB,CAAC,GACDS,MAAMH,KACR;EAAC;CAAA,GACII,IAAgC,CAAA;AAG3C"}
1
+ {"version":3,"file":"button.js","names":["Polymorphic","PolymorphicProps","ComponentProps","splitProps","ValidComponent","cva","controlInteractive","controlSize","VariantProps","cn","buttonVariants","variants","variant","default","secondary","destructive","outline","ghost","toolbar","subtle","success","link","size","xs","sm","md","lg","xl","touchTarget","comfortable","defaultVariants","ButtonVariantProps","ButtonProps","T","class","Button","props","local","rest","_$createComponent","_$mergeProps","as","type","_$createComponent","_$mergeProps"],"sources":["../../../../src/components/ui/button/button.tsx"],"sourcesContent":["import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'\nimport { type ComponentProps, splitProps, type ValidComponent } from 'solid-js'\nimport { cva, controlInteractive, controlSize, type VariantProps } from '#lib/variants'\nimport { cn } from '#lib/utils'\n\n/**\n * Button.\n *\n * One appearance ladder shared by every pressable thing in the system: a\n * button, a toolbar control, a dialog action, and a menu row all draw from the\n * same tokens, so a row of them cannot drift apart.\n *\n * The variants answer \"what is this for\", never \"what colour is it\". A caller\n * that wants a red button writes `variant=\"destructive\"`; the red lives here.\n * That is also what lets the design-system linter tell a caller which variant\n * to use instead of only which class was wrong.\n *\n * Polymorphic: pass `as=\"a\"` (or any component) and the button becomes it\n * while keeping the same styling contract. This replaces the React-era\n * `asChild` primitive, which has no Solid equivalent that preserves props.\n */\nexport const buttonVariants = cva(\n `${controlInteractive} inline-flex shrink-0 items-center justify-center rounded-md font-medium whitespace-nowrap select-none [&_svg]:pointer-events-none [&_svg]:shrink-0`,\n {\n variants: {\n variant: {\n /** The one primary action in a view. */\n default: 'bg-primary text-primary-foreground hover:bg-primary-hover',\n secondary: 'bg-secondary text-secondary-foreground hover:bg-surface-hover',\n /** For the action that destroys something. Never the default. */\n destructive:\n 'bg-destructive-action text-destructive-action-foreground hover:bg-destructive-action/90 focus-visible:ring-destructive-subtle',\n /** A bordered button for a surface that already has a fill. */\n outline:\n 'border border-border bg-transparent text-foreground hover:bg-surface-hover hover:border-input',\n /** No chrome until hover. The default for toolbar and row actions. */\n ghost: 'text-foreground hover:bg-surface-hover',\n /**\n * A ghost that opens something: a sheet, menu or popover trigger in a\n * toolbar. While its surface is open it holds the accent's own tint —\n * the same treatment that drives the side rail's active destination —\n * so the open control never reads identical to its closed neighbours\n * and the app's pressed chrome reads as one accent chroma. The\n * compound hover keeps the tint when an open control is pointed at.\n */\n toolbar:\n 'text-foreground hover:bg-surface-hover data-[expanded]:bg-primary-subtle data-[expanded]:text-primary data-[expanded]:hover:bg-primary-subtle',\n /** A tinted primary, for a secondary action inside a primary flow. */\n subtle: 'bg-primary-subtle text-primary hover:bg-primary-subtle/80',\n success: 'bg-success text-success-foreground hover:bg-success/90',\n link: 'text-primary underline-offset-4 hover:underline',\n },\n size: {\n '2xs': `${controlSize['2xs']} [&_svg]:size-3`,\n xs: `${controlSize.xs} [&_svg]:size-3.5`,\n sm: `${controlSize.sm} [&_svg]:size-3.5`,\n md: `${controlSize.md} [&_svg]:size-4`,\n lg: `${controlSize.lg} [&_svg]:size-4`,\n xl: `${controlSize.xl} [&_svg]:size-5`,\n '2xl': `${controlSize['2xl']} [&_svg]:size-6`,\n /* Square, for an icon with no label. The accessible name then has to\n come from `aria-label` or a visually hidden label — an icon-only\n button with neither is the accessibility finding the Storybook lane\n catches on every story. */\n 'icon-2xs': 'size-control-2xs p-0 [&_svg]:size-3',\n 'icon-xs': 'size-control-xs p-0 [&_svg]:size-3.5',\n 'icon-sm': 'size-control-sm p-0 [&_svg]:size-3.5',\n 'icon-md': 'size-control-md p-0 [&_svg]:size-4',\n 'icon-lg': 'size-control-lg p-0 [&_svg]:size-4',\n 'icon-xl': 'size-control-xl p-0 [&_svg]:size-5',\n 'icon-2xl': 'size-control-2xl p-0 [&_svg]:size-6',\n },\n /** Opt in to a stable touch target on devices with any coarse pointer. */\n touchTarget: {\n comfortable: 'touch-target-comfortable',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n },\n }\n)\n\ntype ButtonVariantProps = VariantProps<typeof buttonVariants>\n\nexport type ButtonProps<T extends ValidComponent = 'button'> = PolymorphicProps<\n T,\n ButtonVariantProps & {\n class?: string\n }\n>\n\nexport function Button<T extends ValidComponent = 'button'>(props: ButtonProps<T>) {\n const [local, rest] = splitProps(props as ButtonProps, [\n 'variant',\n 'size',\n 'touchTarget',\n 'class',\n ])\n\n return (\n <Polymorphic\n as=\"button\"\n type=\"button\"\n data-slot=\"button\"\n class={cn(\n buttonVariants({\n variant: local.variant,\n size: local.size,\n touchTarget: local.touchTarget,\n }),\n local.class\n )}\n {...(rest as ComponentProps<'button'>)}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAaU,iBAAiBL,IAC5B,GAAGC,mBAAkB,sJACrB;CACEK,UAAU;EACRC,SAAS;;GAEPC,SAAS;GACTC,WAAW;;GAEXC,aACE;;GAEFC,SACE;;GAEFC,OAAO;;;;;;;;;GASPC,SACE;;GAEFC,QAAQ;GACRC,SAAS;GACTC,MAAM;EACR;EACAC,MAAM;GACJ,OAAO,GAAGf,YAAY,OAAM;GAC5BgB,IAAI,GAAGhB,YAAYgB,GAAE;GACrBC,IAAI,GAAGjB,YAAYiB,GAAE;GACrBC,IAAI,GAAGlB,YAAYkB,GAAE;GACrBC,IAAI,GAAGnB,YAAYmB,GAAE;GACrBC,IAAI,GAAGpB,YAAYoB,GAAE;GACrB,OAAO,GAAGpB,YAAY,OAAM;GAK5B,YAAY;GACZ,WAAW;GACX,WAAW;GACX,WAAW;GACX,WAAW;GACX,WAAW;GACX,YAAY;EACd;;EAEAqB,aAAa,EACXC,aAAa,2BACf;CACF;CACAC,iBAAiB;EACflB,SAAS;EACTU,MAAM;CACR;AACF,CACF;AAWA,SAAgBa,OAA4CC,OAAuB;CACjF,MAAM,CAACC,OAAOC,QAAQnC,WAAWiC,OAAsB;EACrD;EACA;EACA;EACA;CAAO,CACR;CAED,OAAAG,gBACGvC,aAAWwC,WAAA;EACVC,IAAE;EACFC,MAAI;EAAA,aAAA;EAAA,KAAA,WAAA;GAAA,OAEGjC,GACLC,eAAe;IACbE,SAASyB,MAAMzB;IACfU,MAAMe,MAAMf;IACZM,aAAaS,MAAMT;GACrB,CAAC,GACDS,MAAMH,KACR;EAAC;CAAA,GACII,IAAgC,CAAA;AAG3C"}
@@ -45,7 +45,10 @@ export type ContextualSidebarProps = {
45
45
  /** Pass the host's initial viewport seed to distinguish stale desktop state. */
46
46
  wideViewportAtLoad?: boolean
47
47
  resizeLabel?: string
48
- /** The resize edge's grip: the default bordered chip, or the quieter rung. */
48
+ /**
49
+ * The resize edge's grip: the quieter rung by default, or the bordered chip
50
+ * for hosts that want the heavier affordance.
51
+ */
49
52
  resizeGrip?: 'chip' | 'rung'
50
53
  /** Stable external opener used when the modal mobile sheet closes. */
51
54
  restoreFocusRef?: Accessor<HTMLElement | undefined>
@@ -175,7 +178,7 @@ export function ContextualSidebar(props: ContextualSidebarProps) {
175
178
  maximum={props.maximum}
176
179
  step={props.step}
177
180
  label={resizeLabel()}
178
- grip={props.resizeGrip}
181
+ grip={props.resizeGrip ?? 'rung'}
179
182
  controls={navigationId}
180
183
  onChange={props.onWidthChange}
181
184
  onCommit={props.onWidthCommit}
@@ -13,7 +13,10 @@ export type PixelResizeHandleProps = {
13
13
  label?: string
14
14
  controls?: string
15
15
  class?: string
16
- /** The grip drawn on the edge: the default bordered chip, or the quieter rung. */
16
+ /**
17
+ * The grip drawn on the edge: the quieter rung by default, or the bordered
18
+ * chip for hosts that want the heavier affordance.
19
+ */
17
20
  grip?: 'chip' | 'rung'
18
21
  onChange(value: number): void
19
22
  onCommit?(value: number): void
@@ -95,7 +98,7 @@ export function PixelResizeHandle(props: PixelResizeHandleProps) {
95
98
  aria-hidden="true"
96
99
  />
97
100
  <ResizableHandle
98
- withHandle={props.grip === 'rung' ? 'rung' : true}
101
+ withHandle={props.grip === 'chip' ? true : 'rung'}
99
102
  label={props.label ?? `Resize ${props.side} pane`}
100
103
  aria-controls={props.controls}
101
104
  aria-valuemin={minimum()}
@@ -37,11 +37,14 @@ export const buttonVariants = cva(
37
37
  ghost: 'text-foreground hover:bg-surface-hover',
38
38
  /**
39
39
  * A ghost that opens something: a sheet, menu or popover trigger in a
40
- * toolbar. While its surface is open it holds the menubar's pressed
41
- * rung, so the open control never reads identical to its closed
42
- * neighbours.
40
+ * toolbar. While its surface is open it holds the accent's own tint —
41
+ * the same treatment that drives the side rail's active destination —
42
+ * so the open control never reads identical to its closed neighbours
43
+ * and the app's pressed chrome reads as one accent chroma. The
44
+ * compound hover keeps the tint when an open control is pointed at.
43
45
  */
44
- toolbar: 'text-foreground hover:bg-surface-hover data-[expanded]:bg-surface-active',
46
+ toolbar:
47
+ 'text-foreground hover:bg-surface-hover data-[expanded]:bg-primary-subtle data-[expanded]:text-primary data-[expanded]:hover:bg-primary-subtle',
45
48
  /** A tinted primary, for a secondary action inside a primary flow. */
46
49
  subtle: 'bg-primary-subtle text-primary hover:bg-primary-subtle/80',
47
50
  success: 'bg-success text-success-foreground hover:bg-success/90',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adea-ai/ui",
3
- "version": "0.122.0",
3
+ "version": "0.122.2",
4
4
  "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
5
5
  "keywords": [
6
6
  "adea",
@@ -45,7 +45,10 @@ export type ContextualSidebarProps = {
45
45
  /** Pass the host's initial viewport seed to distinguish stale desktop state. */
46
46
  wideViewportAtLoad?: boolean
47
47
  resizeLabel?: string
48
- /** The resize edge's grip: the default bordered chip, or the quieter rung. */
48
+ /**
49
+ * The resize edge's grip: the quieter rung by default, or the bordered chip
50
+ * for hosts that want the heavier affordance.
51
+ */
49
52
  resizeGrip?: 'chip' | 'rung'
50
53
  /** Stable external opener used when the modal mobile sheet closes. */
51
54
  restoreFocusRef?: Accessor<HTMLElement | undefined>
@@ -175,7 +178,7 @@ export function ContextualSidebar(props: ContextualSidebarProps) {
175
178
  maximum={props.maximum}
176
179
  step={props.step}
177
180
  label={resizeLabel()}
178
- grip={props.resizeGrip}
181
+ grip={props.resizeGrip ?? 'rung'}
179
182
  controls={navigationId}
180
183
  onChange={props.onWidthChange}
181
184
  onCommit={props.onWidthCommit}
@@ -13,7 +13,10 @@ export type PixelResizeHandleProps = {
13
13
  label?: string
14
14
  controls?: string
15
15
  class?: string
16
- /** The grip drawn on the edge: the default bordered chip, or the quieter rung. */
16
+ /**
17
+ * The grip drawn on the edge: the quieter rung by default, or the bordered
18
+ * chip for hosts that want the heavier affordance.
19
+ */
17
20
  grip?: 'chip' | 'rung'
18
21
  onChange(value: number): void
19
22
  onCommit?(value: number): void
@@ -95,7 +98,7 @@ export function PixelResizeHandle(props: PixelResizeHandleProps) {
95
98
  aria-hidden="true"
96
99
  />
97
100
  <ResizableHandle
98
- withHandle={props.grip === 'rung' ? 'rung' : true}
101
+ withHandle={props.grip === 'chip' ? true : 'rung'}
99
102
  label={props.label ?? `Resize ${props.side} pane`}
100
103
  aria-controls={props.controls}
101
104
  aria-valuemin={minimum()}
@@ -37,11 +37,14 @@ export const buttonVariants = cva(
37
37
  ghost: 'text-foreground hover:bg-surface-hover',
38
38
  /**
39
39
  * A ghost that opens something: a sheet, menu or popover trigger in a
40
- * toolbar. While its surface is open it holds the menubar's pressed
41
- * rung, so the open control never reads identical to its closed
42
- * neighbours.
40
+ * toolbar. While its surface is open it holds the accent's own tint —
41
+ * the same treatment that drives the side rail's active destination —
42
+ * so the open control never reads identical to its closed neighbours
43
+ * and the app's pressed chrome reads as one accent chroma. The
44
+ * compound hover keeps the tint when an open control is pointed at.
43
45
  */
44
- toolbar: 'text-foreground hover:bg-surface-hover data-[expanded]:bg-surface-active',
46
+ toolbar:
47
+ 'text-foreground hover:bg-surface-hover data-[expanded]:bg-primary-subtle data-[expanded]:text-primary data-[expanded]:hover:bg-primary-subtle',
45
48
  /** A tinted primary, for a secondary action inside a primary flow. */
46
49
  subtle: 'bg-primary-subtle text-primary hover:bg-primary-subtle/80',
47
50
  success: 'bg-success text-success-foreground hover:bg-success/90',