@kushagradhawan/kookie-ui 0.1.32 → 0.1.34
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.
- package/components.css +937 -458
- package/dist/cjs/components/_internal/base-button.d.ts.map +1 -1
- package/dist/cjs/components/_internal/base-button.js +1 -1
- package/dist/cjs/components/_internal/base-button.js.map +3 -3
- package/dist/cjs/components/chatbar.d.ts +202 -0
- package/dist/cjs/components/chatbar.d.ts.map +1 -0
- package/dist/cjs/components/chatbar.js +2 -0
- package/dist/cjs/components/chatbar.js.map +7 -0
- package/dist/cjs/components/icon-button.d.ts.map +1 -1
- package/dist/cjs/components/icon-button.js +2 -2
- package/dist/cjs/components/icon-button.js.map +3 -3
- package/dist/cjs/components/icons.d.ts +6 -1
- package/dist/cjs/components/icons.d.ts.map +1 -1
- package/dist/cjs/components/icons.js +1 -1
- package/dist/cjs/components/icons.js.map +3 -3
- package/dist/cjs/components/index.d.ts +3 -0
- package/dist/cjs/components/index.d.ts.map +1 -1
- package/dist/cjs/components/index.js +1 -1
- package/dist/cjs/components/index.js.map +3 -3
- package/dist/cjs/components/popover.d.ts +13 -1
- package/dist/cjs/components/popover.d.ts.map +1 -1
- package/dist/cjs/components/popover.js +1 -1
- package/dist/cjs/components/popover.js.map +3 -3
- package/dist/cjs/components/sheet.d.ts +82 -0
- package/dist/cjs/components/sheet.d.ts.map +1 -0
- package/dist/cjs/components/sheet.js +2 -0
- package/dist/cjs/components/sheet.js.map +7 -0
- package/dist/cjs/components/shell.d.ts +180 -0
- package/dist/cjs/components/shell.d.ts.map +1 -0
- package/dist/cjs/components/shell.js +2 -0
- package/dist/cjs/components/shell.js.map +7 -0
- package/dist/cjs/components/sidebar.d.ts +4 -33
- package/dist/cjs/components/sidebar.d.ts.map +1 -1
- package/dist/cjs/components/sidebar.js +1 -1
- package/dist/cjs/components/sidebar.js.map +3 -3
- package/dist/cjs/components/skeleton.d.ts.map +1 -1
- package/dist/cjs/components/skeleton.js +1 -1
- package/dist/cjs/components/skeleton.js.map +2 -2
- package/dist/cjs/helpers/inert.d.ts +1 -1
- package/dist/cjs/helpers/inert.d.ts.map +1 -1
- package/dist/cjs/helpers/inert.js +1 -1
- package/dist/cjs/helpers/inert.js.map +2 -2
- package/dist/esm/components/_internal/base-button.d.ts.map +1 -1
- package/dist/esm/components/_internal/base-button.js +1 -1
- package/dist/esm/components/_internal/base-button.js.map +3 -3
- package/dist/esm/components/chatbar.d.ts +202 -0
- package/dist/esm/components/chatbar.d.ts.map +1 -0
- package/dist/esm/components/chatbar.js +2 -0
- package/dist/esm/components/chatbar.js.map +7 -0
- package/dist/esm/components/icon-button.d.ts.map +1 -1
- package/dist/esm/components/icon-button.js +2 -2
- package/dist/esm/components/icon-button.js.map +3 -3
- package/dist/esm/components/icons.d.ts +6 -1
- package/dist/esm/components/icons.d.ts.map +1 -1
- package/dist/esm/components/icons.js +1 -1
- package/dist/esm/components/icons.js.map +3 -3
- package/dist/esm/components/index.d.ts +3 -0
- package/dist/esm/components/index.d.ts.map +1 -1
- package/dist/esm/components/index.js +1 -1
- package/dist/esm/components/index.js.map +3 -3
- package/dist/esm/components/popover.d.ts +13 -1
- package/dist/esm/components/popover.d.ts.map +1 -1
- package/dist/esm/components/popover.js +1 -1
- package/dist/esm/components/popover.js.map +3 -3
- package/dist/esm/components/sheet.d.ts +82 -0
- package/dist/esm/components/sheet.d.ts.map +1 -0
- package/dist/esm/components/sheet.js +2 -0
- package/dist/esm/components/sheet.js.map +7 -0
- package/dist/esm/components/shell.d.ts +180 -0
- package/dist/esm/components/shell.d.ts.map +1 -0
- package/dist/esm/components/shell.js +2 -0
- package/dist/esm/components/shell.js.map +7 -0
- package/dist/esm/components/sidebar.d.ts +4 -33
- package/dist/esm/components/sidebar.d.ts.map +1 -1
- package/dist/esm/components/sidebar.js +1 -1
- package/dist/esm/components/sidebar.js.map +3 -3
- package/dist/esm/components/skeleton.d.ts.map +1 -1
- package/dist/esm/components/skeleton.js.map +2 -2
- package/dist/esm/helpers/inert.d.ts +1 -1
- package/dist/esm/helpers/inert.d.ts.map +1 -1
- package/dist/esm/helpers/inert.js +1 -1
- package/dist/esm/helpers/inert.js.map +2 -2
- package/package.json +2 -1
- package/src/components/_internal/base-button.tsx +8 -0
- package/src/components/_internal/base-card.css +18 -18
- package/src/components/_internal/base-dialog.css +11 -49
- package/src/components/_internal/base-menu.css +2 -2
- package/src/components/_internal/base-sidebar-menu.css +3 -3
- package/src/components/accordion.css +6 -6
- package/src/components/animations.css +65 -81
- package/src/components/callout.css +3 -3
- package/src/components/chatbar.css +214 -0
- package/src/components/chatbar.tsx +1181 -0
- package/src/components/icon-button.tsx +11 -0
- package/src/components/icons.tsx +97 -2
- package/src/components/image.css +3 -3
- package/src/components/index.css +3 -0
- package/src/components/index.tsx +3 -0
- package/src/components/popover.css +53 -8
- package/src/components/popover.tsx +180 -2
- package/src/components/scroll-area.css +3 -3
- package/src/components/segmented-control.css +3 -3
- package/src/components/sheet.css +90 -0
- package/src/components/sheet.tsx +247 -0
- package/src/components/shell.css +137 -0
- package/src/components/shell.tsx +1032 -0
- package/src/components/sidebar.css +55 -268
- package/src/components/sidebar.tsx +40 -262
- package/src/components/skeleton.tsx +1 -2
- package/src/components/text-area.css +6 -5
- package/src/components/tooltip.css +2 -2
- package/src/helpers/inert.ts +3 -3
- package/src/styles/tokens/constants.css +6 -3
- package/src/styles/tokens/index.css +1 -0
- package/src/styles/tokens/radius.css +7 -2
- package/src/styles/tokens/space.css +6 -0
- package/src/styles/tokens/transition.css +91 -46
- package/styles.css +998 -496
- package/tokens/base.css +57 -35
- package/tokens.css +61 -38
|
@@ -0,0 +1,180 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/** Logical document direction. Derived from document root unless `rtl` is passed. */
|
|
3
|
+
type ShellDirection = 'ltr' | 'rtl';
|
|
4
|
+
/** Logical side, independent of physical left/right and aware of RTL. */
|
|
5
|
+
type ShellSide = 'start' | 'end';
|
|
6
|
+
/** Split-mode rail state. */
|
|
7
|
+
type RailValue = 'open' | 'collapsed';
|
|
8
|
+
/** Single-markup view for morphing sidebars. */
|
|
9
|
+
type SingleView = 'panel' | 'rail' | 'collapsed';
|
|
10
|
+
/**
|
|
11
|
+
* Shared shell state across all subcomponents.
|
|
12
|
+
*
|
|
13
|
+
* We centralize both split-mode and single-markup state to allow triggers,
|
|
14
|
+
* meters, and other UI to observe/modify layout consistently.
|
|
15
|
+
*/
|
|
16
|
+
type ShellContextValue = {
|
|
17
|
+
dir: ShellDirection;
|
|
18
|
+
headerHeight: string;
|
|
19
|
+
zHeader?: number;
|
|
20
|
+
railBySide: Record<ShellSide, RailValue>;
|
|
21
|
+
setRailBySide: (side: ShellSide, value: RailValue) => void;
|
|
22
|
+
toggleRail: (side: ShellSide) => void;
|
|
23
|
+
panelRequestedBySide: Record<ShellSide, boolean>;
|
|
24
|
+
setPanelRequestedBySide: (side: ShellSide, requested: boolean) => void;
|
|
25
|
+
patternBySide: Record<ShellSide, 'single' | 'split'>;
|
|
26
|
+
setPatternForSide: (side: ShellSide, pattern: 'single' | 'split') => void;
|
|
27
|
+
singleViewBySide: Record<ShellSide, SingleView>;
|
|
28
|
+
setSingleViewBySide: (side: ShellSide, view: SingleView) => void;
|
|
29
|
+
cycleSingleView: (side: ShellSide) => void;
|
|
30
|
+
activeToolBySide: Record<ShellSide, string | null>;
|
|
31
|
+
setActiveTool: (side: ShellSide, tool: string | null) => void;
|
|
32
|
+
onItemSelected: (side: ShellSide, item: string) => void;
|
|
33
|
+
activeContextBySide: Record<ShellSide, string | null>;
|
|
34
|
+
setActiveContext: (side: ShellSide, context: string | null) => void;
|
|
35
|
+
getRegionId: (side: ShellSide) => string;
|
|
36
|
+
getPanelId: (side: ShellSide) => string;
|
|
37
|
+
getRailId: (side: ShellSide) => string;
|
|
38
|
+
};
|
|
39
|
+
/** Access the shell context (internal wiring for subcomponents). */
|
|
40
|
+
declare function useShell(): ShellContextValue;
|
|
41
|
+
type RailContextValue = {
|
|
42
|
+
onItemSelected: (item: string) => void;
|
|
43
|
+
};
|
|
44
|
+
/** Hook to emit rail selection events. Use this in Rail children to emit item selection. */
|
|
45
|
+
declare function useRailEvents(): RailContextValue;
|
|
46
|
+
type PanelContextValue = {
|
|
47
|
+
activeTool: string | null;
|
|
48
|
+
activeContext: string | null;
|
|
49
|
+
};
|
|
50
|
+
/** Hook to access active tool state. Use this in Panel children to render based on active tool. */
|
|
51
|
+
declare function usePanelState(): PanelContextValue;
|
|
52
|
+
/**
|
|
53
|
+
* Props for `Shell.Root`.
|
|
54
|
+
*
|
|
55
|
+
* - `minContentWidth`: CSS length to enforce a minimum inline-size for content
|
|
56
|
+
* area. This prevents content from collapsing too far when sidebars are open.
|
|
57
|
+
* - `rtl`: Force RTL/LTR independent of document; otherwise derived from root.
|
|
58
|
+
* - `headerHeight`: Sticky header block-size.
|
|
59
|
+
* - `zHeader`: z-index for sticky header stacking.
|
|
60
|
+
*/
|
|
61
|
+
interface ShellRootProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
62
|
+
minContentWidth?: string;
|
|
63
|
+
rtl?: boolean;
|
|
64
|
+
headerHeight?: string;
|
|
65
|
+
zHeader?: number;
|
|
66
|
+
cascadeSide?: ShellSide;
|
|
67
|
+
activeTool?: string | null;
|
|
68
|
+
onToolChange?: (id: string | null) => void;
|
|
69
|
+
activeContext?: string | null;
|
|
70
|
+
onContextChange?: (id: string | null) => void;
|
|
71
|
+
}
|
|
72
|
+
declare const Root: React.ForwardRefExoticComponent<ShellRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
73
|
+
/** Props for `Shell.Header`. Sticky by default and respects `--shell-header-height`. */
|
|
74
|
+
interface ShellHeaderProps extends React.ComponentPropsWithoutRef<'header'> {
|
|
75
|
+
}
|
|
76
|
+
declare const Header: React.ForwardRefExoticComponent<ShellHeaderProps & React.RefAttributes<HTMLElement>>;
|
|
77
|
+
/** Props for `Shell.Footer`. Rendered after body and outside the content scroll. */
|
|
78
|
+
interface ShellFooterProps extends React.ComponentPropsWithoutRef<'footer'> {
|
|
79
|
+
}
|
|
80
|
+
declare const Footer: React.ForwardRefExoticComponent<ShellFooterProps & React.RefAttributes<HTMLElement>>;
|
|
81
|
+
/** Props for `Shell.Content`. The only scrollable area of the Shell. */
|
|
82
|
+
interface ShellContentProps extends React.ComponentPropsWithoutRef<'main'> {
|
|
83
|
+
}
|
|
84
|
+
declare const Content: React.ForwardRefExoticComponent<ShellContentProps & React.RefAttributes<HTMLElement>>;
|
|
85
|
+
/**
|
|
86
|
+
* `Shell.Sidebar` controls one logical side. It supports two patterns:
|
|
87
|
+
* - Split pattern by providing both `Sidebar.Rail` and `Sidebar.Panel` children
|
|
88
|
+
* - Single-markup morphing when no slots are provided
|
|
89
|
+
*
|
|
90
|
+
* Controlled/uncontrolled:
|
|
91
|
+
* - Split: `value`/`defaultValue` reflect rail `open|collapsed`
|
|
92
|
+
* - Single: `view`/`defaultView` reflect `panel|rail|collapsed`
|
|
93
|
+
*/
|
|
94
|
+
interface ShellSidebarProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
95
|
+
side: ShellSide;
|
|
96
|
+
overlay?: boolean | Partial<Record<'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl', boolean>>;
|
|
97
|
+
overlaySide?: 'start' | 'end' | 'top' | 'bottom';
|
|
98
|
+
value?: RailValue;
|
|
99
|
+
defaultValue?: RailValue;
|
|
100
|
+
onValueChange?: (value: RailValue) => void;
|
|
101
|
+
view?: SingleView;
|
|
102
|
+
defaultView?: SingleView;
|
|
103
|
+
onViewChange?: (view: SingleView) => void;
|
|
104
|
+
as?: 'nav' | 'aside' | 'div';
|
|
105
|
+
'aria-label'?: string;
|
|
106
|
+
}
|
|
107
|
+
/** Rail component that provides event emission context for stateless navigation. */
|
|
108
|
+
interface RailProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
109
|
+
}
|
|
110
|
+
declare const Rail: React.ForwardRefExoticComponent<RailProps & React.RefAttributes<HTMLDivElement>> & {
|
|
111
|
+
displayName: string;
|
|
112
|
+
__shellSlot: "rail";
|
|
113
|
+
};
|
|
114
|
+
/** Panel component that provides active tool context for stateless content rendering. */
|
|
115
|
+
interface PanelProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
116
|
+
}
|
|
117
|
+
declare const Panel: React.ForwardRefExoticComponent<PanelProps & React.RefAttributes<HTMLDivElement>> & {
|
|
118
|
+
displayName: string;
|
|
119
|
+
__shellSlot: "panel";
|
|
120
|
+
};
|
|
121
|
+
type ShellSidebarComponent = React.ForwardRefExoticComponent<ShellSidebarProps & React.RefAttributes<HTMLDivElement>> & {
|
|
122
|
+
Rail: typeof Rail;
|
|
123
|
+
Panel: typeof Panel;
|
|
124
|
+
Trigger: typeof LocalTrigger;
|
|
125
|
+
};
|
|
126
|
+
declare const Sidebar: ShellSidebarComponent;
|
|
127
|
+
import type { IconButtonProps } from './icon-button.js';
|
|
128
|
+
type LocalTriggerProps = IconButtonProps<'button'>;
|
|
129
|
+
/**
|
|
130
|
+
* `Shell.Sidebar.Trigger` toggles the sidebar where it is rendered.
|
|
131
|
+
* - In split-mode: toggles rail open/collapsed
|
|
132
|
+
* - In single-markup: cycles through panel → rail → collapsed
|
|
133
|
+
*/
|
|
134
|
+
declare const LocalTrigger: React.ForwardRefExoticComponent<LocalTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
135
|
+
type GlobalTriggerProps = IconButtonProps<'button'> & {
|
|
136
|
+
side: ShellSide;
|
|
137
|
+
};
|
|
138
|
+
/**
|
|
139
|
+
* `Shell.Trigger` controls a specific `side` from anywhere inside `Shell.Root`.
|
|
140
|
+
* Mirrors behavior of the local trigger, but with explicit side.
|
|
141
|
+
*/
|
|
142
|
+
declare const Trigger: React.ForwardRefExoticComponent<GlobalTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
143
|
+
export { Root, Header, Footer, Content, Sidebar, Trigger, useShell, useRailEvents, usePanelState };
|
|
144
|
+
/**
|
|
145
|
+
* Convenience hook to interrogate and control one sidebar.
|
|
146
|
+
* - `rail`: open/collapsed helpers for split pattern
|
|
147
|
+
* - `panel`: show/hide helpers; visibility is conditional on rail open in split pattern
|
|
148
|
+
* - `single`: view control for single-markup pattern
|
|
149
|
+
* - `activeTool`: active tool coordination state
|
|
150
|
+
*/
|
|
151
|
+
declare function useSidebar(side: ShellSide): {
|
|
152
|
+
side: ShellSide;
|
|
153
|
+
isSplit: boolean;
|
|
154
|
+
rail: {
|
|
155
|
+
value: RailValue;
|
|
156
|
+
isOpen: boolean;
|
|
157
|
+
open: () => void;
|
|
158
|
+
close: () => void;
|
|
159
|
+
toggle: () => void;
|
|
160
|
+
onItemSelected: (item: string) => void;
|
|
161
|
+
};
|
|
162
|
+
panel: {
|
|
163
|
+
isVisible: boolean;
|
|
164
|
+
show: () => void;
|
|
165
|
+
hide: () => void;
|
|
166
|
+
activeTool: string | null;
|
|
167
|
+
activeContext: string | null;
|
|
168
|
+
};
|
|
169
|
+
single: {
|
|
170
|
+
view: SingleView;
|
|
171
|
+
setView: (view: SingleView) => void;
|
|
172
|
+
cycle: () => void;
|
|
173
|
+
};
|
|
174
|
+
activeTool: string | null;
|
|
175
|
+
setActiveTool: (tool: string | null) => void;
|
|
176
|
+
activeContext: string | null;
|
|
177
|
+
setActiveContext: (context: string | null) => void;
|
|
178
|
+
};
|
|
179
|
+
export { useSidebar };
|
|
180
|
+
//# sourceMappingURL=shell.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shell.d.ts","sourceRoot":"","sources":["../../../src/components/shell.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";"use client";var Le=Object.create;var Y=Object.defineProperty;var Me=Object.getOwnPropertyDescriptor;var De=Object.getOwnPropertyNames;var Oe=Object.getPrototypeOf,Fe=Object.prototype.hasOwnProperty;var ze=(e,l)=>{for(var a in l)Y(e,a,{get:l[a],enumerable:!0})},me=(e,l,a,n)=>{if(l&&typeof l=="object"||typeof l=="function")for(let o of De(l))!Fe.call(e,o)&&o!==a&&Y(e,o,{get:()=>l[o],enumerable:!(n=Me(l,o))||n.enumerable});return e};var oe=(e,l,a)=>(a=e!=null?Le(Oe(e)):{},me(l||!e||!e.__esModule?Y(a,"default",{value:e,enumerable:!0}):a,e)),We=e=>me(Y({},"__esModule",{value:!0}),e);var je={};ze(je,{Content:()=>ue,Footer:()=>te,Header:()=>ee,Root:()=>Se,Sidebar:()=>V,Trigger:()=>he,usePanelState:()=>Te,useRailEvents:()=>Ie,useShell:()=>P,useSidebar:()=>Ee});module.exports=We(je);var t=oe(require("react")),M=oe(require("classnames")),de=require("./icon-button.js"),ce=require("./icons.js"),Z=require("../helpers/inert.js"),ae=oe(require("./sheet.js")),Ve=require("./visually-hidden.js");const ve=t.createContext(null);function P(){const e=t.useContext(ve);if(!e)throw new Error("Shell components must be used within <Shell.Root>.");return e}const se=t.createContext(null);function re(){return t.useContext(se)}const Re=t.createContext(null);function Ie(){const e=t.useContext(Re);if(!e)throw new Error("useRailEvents must be used within <Shell.Sidebar.Rail>");return e}const be=t.createContext(null);function Te(){const e=t.useContext(be);if(!e)throw new Error("usePanelState must be used within <Shell.Sidebar.Panel>");return e}function _e(){return typeof document>"u"?"ltr":document.documentElement.getAttribute("dir")==="rtl"?"rtl":"ltr"}const Se=t.forwardRef(({minContentWidth:e="640px",rtl:l,headerHeight:a="64px",zHeader:n,cascadeSide:o="start",activeTool:s,onToolChange:d,activeContext:m,onContextChange:w,className:D,style:le,children:ie,...A},G)=>{const q=t.useMemo(()=>typeof l=="boolean"?l?"rtl":"ltr":_e(),[l]),[c,J]=t.useState({start:"open",end:"collapsed"}),O=t.useCallback((i,r)=>{J(S=>S[i]===r?S:{...S,[i]:r})},[]),F=t.useCallback(i=>{J(r=>{const S=r[i]==="open"?"collapsed":"open";return{...r,[i]:S}})},[]),[z,W]=t.useState({start:!1,end:!1}),b=t.useCallback((i,r)=>{W(S=>S[i]===r?S:{...S,[i]:r})},[]),[v,B]=t.useState({start:"single",end:"single"}),u=t.useCallback((i,r)=>{B(S=>S[i]===r?S:{...S,[i]:r})},[]),[E,x]=t.useState({start:"panel",end:"collapsed"}),I=t.useCallback((i,r)=>{x(S=>S[i]===r?S:{...S,[i]:r})},[]),p=t.useCallback(i=>{const r=["panel","rail","collapsed"],S=E[i],Ae=r.indexOf(S),qe=r[(Ae+1)%r.length];I(i,qe)},[E,I]),[k,_]=t.useState({start:null,end:null}),N=t.useCallback((i,r)=>{_(S=>S[i]===r?S:{...S,[i]:r}),r===null&&b(i,!1)},[b]),H=t.useCallback((i,r)=>{N(i,r),b(i,!0)},[N,b]),[C,$]=t.useState({start:null,end:null}),L=t.useCallback((i,r)=>{$(S=>S[i]===r?S:{...S,[i]:r}),i===o&&w?.(r)},[o,w]);t.useEffect(()=>{s!==void 0&&k[o]!==s&&_(i=>({...i,[o]:s}))},[s,o,k]),t.useEffect(()=>{m!==void 0&&C[o]!==m&&$(i=>({...i,[o]:m}))},[m,o,C]);const j=t.useId(),K=t.useId(),ne=t.useId(),f=t.useId(),g=t.useId(),y=t.useId(),h=t.useCallback(i=>i==="start"?`kui-shell-region-${j}`:`kui-shell-region-${K}`,[j,K]),R=t.useCallback(i=>i==="start"?`kui-shell-panel-${ne}`:`kui-shell-panel-${f}`,[ne,f]),T=t.useCallback(i=>i==="start"?`kui-shell-rail-${g}`:`kui-shell-rail-${y}`,[g,y]),Q=t.useMemo(()=>({dir:q,headerHeight:a,zHeader:n,railBySide:c,setRailBySide:O,toggleRail:F,panelRequestedBySide:z,setPanelRequestedBySide:b,patternBySide:v,setPatternForSide:u,singleViewBySide:E,setSingleViewBySide:I,cycleSingleView:p,activeToolBySide:k,setActiveTool:N,onItemSelected:H,activeContextBySide:C,setActiveContext:L,getRegionId:h,getPanelId:R,getRailId:T}),[q,a,n,c,O,F,z,b,v,u,E,I,p,k,N,H,C,L,h,R,T]),U=t.Children.toArray(ie),X=(i,r)=>t.isValidElement(i)&&i.type===r,ke=U.filter(i=>X(i,ee)),Ne=U.filter(i=>X(i,te)),pe=U.filter(i=>X(i,ue)),fe=U.filter(i=>X(i,V)),ge=fe.filter(i=>i.props.side==="start"),ye=fe.filter(i=>i.props.side==="end"),He=q==="rtl"?[...ye,...pe,...ge]:[...ge,...pe,...ye];return t.createElement("div",{...A,ref:G,className:(0,M.default)("rt-ShellRoot",D),style:{...le,"--shell-min-content-width":e,"--shell-header-height":a},dir:q},t.createElement(ve.Provider,{value:Q},ke,t.createElement("div",{className:"rt-ShellBody"},He),Ne))});Se.displayName="Shell.Root";const ee=t.forwardRef(({className:e,style:l,...a},n)=>{const{headerHeight:o,zHeader:s}=P();return t.createElement("header",{...a,ref:n,role:"banner",className:(0,M.default)("rt-ShellHeader",e),style:{"--shell-header-height":o,"--shell-z-header":s,...l}})});ee.displayName="Shell.Header";const te=t.forwardRef(({className:e,...l},a)=>t.createElement("footer",{...l,ref:a,role:"contentinfo",className:(0,M.default)("rt-ShellFooter",e)}));te.displayName="Shell.Footer";const xe=t.forwardRef(({className:e,...l},a)=>t.createElement("main",{...l,ref:a,className:(0,M.default)("rt-ShellContent",e)}));xe.displayName="Shell.Content";const ue=xe,Ce=Object.assign(t.forwardRef(({children:e},l)=>{const a=re(),n=P(),o=a?.side??"start",s=t.useMemo(()=>({onItemSelected:d=>n.onItemSelected(o,d)}),[n,o]);return t.createElement(Re.Provider,{value:s},e)}),{displayName:"Shell.Sidebar.Rail",__shellSlot:"rail"}),we=Object.assign(t.forwardRef(({children:e},l)=>{const a=re(),n=P(),o=a?.side??"start",s=t.useMemo(()=>({activeTool:n.activeToolBySide[o],activeContext:n.activeContextBySide[o]}),[n.activeToolBySide,n.activeContextBySide,o]);return t.createElement(be.Provider,{value:s},e)}),{displayName:"Shell.Sidebar.Panel",__shellSlot:"panel"}),$e=({side:e,overlay:l,overlaySide:a,value:n,defaultValue:o,onValueChange:s,view:d,defaultView:m,onViewChange:w,as:D="nav",className:le,style:ie,children:A,...G},q)=>{const c=P(),J=D,O=c.getRegionId(e),F=c.getPanelId(e),z=c.getRailId(e),W=Be(A,"rail"),b=Be(A,"panel"),v=W.length>0,B=b.length>0,u=v||B;t.useEffect(()=>{c.setPatternForSide(e,u&&v&&B?"split":"single")},[c,e,u,v,B]);const E=t.useRef(!1);t.useEffect(()=>{if(!E.current)if(E.current=!0,u){const f=n??o??(l?"collapsed":"open");c.setRailBySide(e,f),l&&c.setPanelRequestedBySide(e,!1)}else{const f=d??m??(l?"collapsed":"panel");c.setSingleViewBySide(e,f)}},[u,n,o,d,m,c,e,l]),t.useEffect(()=>{u&&n!==void 0&&c.railBySide[e]!==n&&c.setRailBySide(e,n)},[n,u,c,e]),t.useEffect(()=>{u||d!==void 0&&c.singleViewBySide[e]!==d&&c.setSingleViewBySide(e,d)},[d,u,c,e]);const x=c.railBySide[e],I=c.panelRequestedBySide[e],p=c.singleViewBySide[e],k=c.activeToolBySide[e],_=t.useRef(null);t.useEffect(()=>{u&&n===void 0&&_.current!==x&&(_.current=x,s?.(x))},[u,x,n,s]);const N=t.useRef(null);t.useEffect(()=>{u||d===void 0&&N.current!==p&&(N.current=p,w?.(p))},[u,p,d,w]);const H=u?v&&x==="open":p==="rail",C=u?B&&(v?x==="open"&&I&&k!==null:!0):p==="panel",$={initial:!0,xs:!0,sm:!0,md:!1,lg:!1,xl:!1},L=t.useMemo(()=>typeof l=="boolean"?{initial:l}:{...$,...l||{}},[l,$]),[j,K]=t.useState("initial");if(t.useEffect(()=>{if(typeof window>"u")return;const g=[["xs","(min-width: 520px)"],["sm","(min-width: 768px)"],["md","(min-width: 1024px)"],["lg","(min-width: 1280px)"],["xl","(min-width: 1640px)"]].map(([h,R])=>[h,window.matchMedia(R)]),y=()=>{const h=g.filter(([,T])=>T.matches).map(([T])=>T),R=h[h.length-1]??"initial";K(R)};return y(),g.forEach(([,h])=>h.addEventListener("change",y)),()=>{g.forEach(([,h])=>h.removeEventListener("change",y))}},[]),(()=>{const f=L[j];if(typeof f=="boolean")return f;const g=["xl","lg","md","sm","xs","initial"],y=g.indexOf(j);for(let h=y+1;h<g.length;h++){const R=L[g[h]];if(typeof R=="boolean")return R}return L.initial??!1})()){const f=u?x==="open"||I:p!=="collapsed",g=Q=>{u?Q?c.setRailBySide(e,"open"):(c.setRailBySide(e,"collapsed"),c.setPanelRequestedBySide(e,!1)):Q?c.setSingleViewBySide(e,"panel"):c.setSingleViewBySide(e,"collapsed")},y=a??e,h=u?B&&(v?I&&k!==null:!0):!1,R=u?t.createElement("div",{style:{display:"flex",height:"100%",minBlockSize:0}},v?t.createElement("div",{id:z,className:"rt-ShellSidebarRail","data-section":"rail","data-visible":!0,style:{inlineSize:"var(--shell-sidebar-rail-width, 64px)",overflow:"hidden"}},W):null,B?t.createElement("div",{id:F,className:"rt-ShellSidebarPanel","data-section":"panel","data-visible":h||void 0,"aria-hidden":h?void 0:!0,...h?{}:{inert:Z.inert},style:{inlineSize:h?"var(--shell-sidebar-panel-width, 288px)":"0px",overflow:"hidden"}},b):null):A,T=y==="start"||y==="end"?u?h?"var(--shell-sidebar-combined-width)":"var(--shell-sidebar-rail-width)":p==="rail"?"var(--shell-sidebar-rail-width)":"var(--shell-sidebar-panel-width)":"100vw";return t.createElement(t.Fragment,null,t.createElement(ae.Root,{open:f,onOpenChange:g},t.createElement(ae.Content,{id:O,side:y,height:{initial:"100vh"},width:{initial:T},style:{"--dialog-content-padding":"0px"}},t.createElement(ae.Title,null,t.createElement(Ve.VisuallyHidden,null,"Sidebar")),R)))}return t.createElement(J,{...G,ref:q,id:O,className:(0,M.default)("rt-ShellSidebar",le),"data-side":e,"data-rail":u?x:void 0,"data-panel":u?C?"visible":"hidden":void 0,"data-state":u?void 0:p,"aria-label":G["aria-label"],style:{...ie}},u?t.createElement(t.Fragment,null,t.createElement(se.Provider,{value:{side:e,section:"rail"}},v?t.createElement("div",{id:z,className:"rt-ShellSidebarRail","data-section":"rail","data-visible":H||void 0,"aria-hidden":H?void 0:!0,...H?{}:{inert:Z.inert},style:{inlineSize:H?"var(--shell-sidebar-rail-width, 64px)":"0px",overflow:"hidden"}},W):null),t.createElement(se.Provider,{value:{side:e,section:"panel"}},B?t.createElement("div",{id:F,className:"rt-ShellSidebarPanel","data-section":"panel","data-visible":C||void 0,"aria-hidden":C?void 0:!0,...C?{}:{inert:Z.inert},style:{inlineSize:C?"var(--shell-sidebar-panel-width, 288px)":"0px",overflow:"hidden"}},b):null)):t.createElement("div",{className:"rt-ShellSidebarSingle","data-visible":p!=="collapsed"||void 0,"aria-hidden":p==="collapsed"?!0:void 0,style:{inlineSize:p==="collapsed"?"0px":p==="rail"?"var(--shell-sidebar-rail-width, 64px)":"var(--shell-sidebar-panel-width, 288px)",overflow:"hidden"}},A))},V=t.forwardRef($e);V.displayName="Shell.Sidebar";function Be(e,l){return t.Children.toArray(e).filter(n=>t.isValidElement(n)&&n.type?.__shellSlot===l)}V.Rail=Ce,V.Panel=we;const Pe=t.forwardRef(({onClick:e,children:l,...a},n)=>{const o=re(),s=P(),d=o?.side??"start",m=s.getRegionId(d),w=s.patternBySide[d]==="split"?s.railBySide[d]==="open":s.singleViewBySide[d]!=="collapsed";return t.createElement(de.IconButton,{...a,ref:n,variant:"soft","aria-controls":m,"aria-expanded":w,onClick:D=>{e?.(D),s.patternBySide[d]==="split"?s.toggleRail(d):s.cycleSingleView(d)}},l||t.createElement(ce.ChevronDownIcon,null))});Pe.displayName="Shell.Sidebar.Trigger";const he=t.forwardRef(({side:e,onClick:l,children:a,...n},o)=>{const s=P(),d=s.getRegionId(e),m=s.patternBySide[e]==="split"?s.railBySide[e]==="open":s.singleViewBySide[e]!=="collapsed";return t.createElement(de.IconButton,{...n,ref:o,variant:"soft","aria-controls":d,"aria-expanded":m,onClick:w=>{l?.(w),s.patternBySide[e]==="split"?s.toggleRail(e):s.cycleSingleView(e)}},a||t.createElement(ce.ChevronDownIcon,null))});he.displayName="Shell.Trigger",V.Rail=Ce,V.Panel=we,V.Trigger=Pe;function Ee(e){const l=P(),a=l.patternBySide[e]==="split",n=l.railBySide[e],o=l.activeToolBySide[e],s=l.panelRequestedBySide[e]&&n==="open"&&o!==null;return{side:e,isSplit:a,rail:{value:n,isOpen:n==="open",open:()=>l.setRailBySide(e,"open"),close:()=>{l.setRailBySide(e,"collapsed"),l.setPanelRequestedBySide(e,!1)},toggle:()=>l.toggleRail(e),onItemSelected:d=>l.onItemSelected(e,d)},panel:{isVisible:s,show:()=>l.setPanelRequestedBySide(e,!0),hide:()=>l.setPanelRequestedBySide(e,!1),activeTool:l.activeToolBySide[e],activeContext:l.activeContextBySide[e]},single:{view:l.singleViewBySide[e],setView:d=>l.setSingleViewBySide(e,d),cycle:()=>l.cycleSingleView(e)},activeTool:l.activeToolBySide[e],setActiveTool:d=>l.setActiveTool(e,d),activeContext:l.activeContextBySide[e],setActiveContext:d=>l.setActiveContext(e,d)}}
|
|
2
|
+
//# sourceMappingURL=shell.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/shell.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * Shell component\n *\n * High-level application layout primitive with optional global header/footer and\n * one or two sidebars. Each sidebar supports two composition patterns:\n *\n * 1) Split pattern (preferred for interactive rails):\n * <Shell.Sidebar>\n * <Shell.Sidebar.Rail />\n * <Shell.Sidebar.Panel />\n * </Shell.Sidebar>\n *\n * 2) Single-markup morphing (compact):\n * <Shell.Sidebar> ...single content that morphs between rail/panel/collapsed </Shell.Sidebar>\n *\n * The component handles:\n * - RTL/LTR ordering for start/end sidebars\n * - Sticky panel intent in split mode (panel stays requested, visibility depends on rail open state)\n * - Controlled/uncontrolled state for both split (rail value) and single-markup (view)\n * - ARIA relationships and inert for hidden regions\n * - CSS custom properties for sizing with sensible defaults\n *\n * Layout guidance:\n * - Use flex/grid and spacing tokens; avoid margins in layout containers.\n * - Width transitions for rail/panel are CSS-driven; content scroll is confined to Content only.\n */\n'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\n\nimport { IconButton } from './icon-button.js';\nimport { ChevronDownIcon } from './icons.js';\nimport { inert } from '../helpers/inert.js';\nimport * as Sheet from './sheet.js';\nimport { VisuallyHidden } from './visually-hidden.js';\n\n/** Logical document direction. Derived from document root unless `rtl` is passed. */\ntype ShellDirection = 'ltr' | 'rtl';\n/** Logical side, independent of physical left/right and aware of RTL. */\ntype ShellSide = 'start' | 'end';\n/** Section slot identifiers inside a sidebar. */\ntype SidebarSection = 'rail' | 'panel';\n\n/** Split-mode rail state. */\ntype RailValue = 'open' | 'collapsed';\n/** Single-markup view for morphing sidebars. */\ntype SingleView = 'panel' | 'rail' | 'collapsed';\n\n/**\n * Shared shell state across all subcomponents.\n *\n * We centralize both split-mode and single-markup state to allow triggers,\n * meters, and other UI to observe/modify layout consistently.\n */\ntype ShellContextValue = {\n dir: ShellDirection;\n headerHeight: string;\n zHeader?: number;\n // Split pattern state (rail + panel)\n railBySide: Record<ShellSide, RailValue>;\n setRailBySide: (side: ShellSide, value: RailValue) => void;\n toggleRail: (side: ShellSide) => void;\n panelRequestedBySide: Record<ShellSide, boolean>;\n setPanelRequestedBySide: (side: ShellSide, requested: boolean) => void;\n // Pattern detection per side so triggers behave correctly\n patternBySide: Record<ShellSide, 'single' | 'split'>;\n setPatternForSide: (side: ShellSide, pattern: 'single' | 'split') => void;\n // Single-markup morph state (panel/rail/collapsed)\n singleViewBySide: Record<ShellSide, SingleView>;\n setSingleViewBySide: (side: ShellSide, view: SingleView) => void;\n cycleSingleView: (side: ShellSide) => void;\n // Active tool coordination state\n activeToolBySide: Record<ShellSide, string | null>;\n setActiveTool: (side: ShellSide, tool: string | null) => void;\n onItemSelected: (side: ShellSide, item: string) => void;\n // Context (panel-level) coordination state\n activeContextBySide: Record<ShellSide, string | null>;\n setActiveContext: (side: ShellSide, context: string | null) => void;\n getRegionId: (side: ShellSide) => string;\n getPanelId: (side: ShellSide) => string;\n getRailId: (side: ShellSide) => string;\n};\n\nconst ShellContext = React.createContext<ShellContextValue | null>(null);\n\n/** Access the shell context (internal wiring for subcomponents). */\nfunction useShell() {\n const ctx = React.useContext(ShellContext);\n if (!ctx) throw new Error('Shell components must be used within <Shell.Root>.');\n return ctx;\n}\n\n// Local context to communicate section (rail/panel) and side to presentational children\ntype SidebarSectionContextValue = {\n side: ShellSide;\n section: SidebarSection;\n};\nconst SidebarSectionContext = React.createContext<SidebarSectionContextValue | null>(null);\nfunction useSidebarSection() {\n return React.useContext(SidebarSectionContext);\n}\n\n// Rail context for event emission pattern\ntype RailContextValue = {\n onItemSelected: (item: string) => void;\n};\nconst RailContext = React.createContext<RailContextValue | null>(null);\n\n/** Hook to emit rail selection events. Use this in Rail children to emit item selection. */\nfunction useRailEvents() {\n const ctx = React.useContext(RailContext);\n if (!ctx) throw new Error('useRailEvents must be used within <Shell.Sidebar.Rail>');\n return ctx;\n}\n\n// Panel context for active tool consumption\ntype PanelContextValue = {\n activeTool: string | null;\n activeContext: string | null;\n};\nconst PanelContext = React.createContext<PanelContextValue | null>(null);\n\n/** Hook to access active tool state. Use this in Panel children to render based on active tool. */\nfunction usePanelState() {\n const ctx = React.useContext(PanelContext);\n if (!ctx) throw new Error('usePanelState must be used within <Shell.Sidebar.Panel>');\n return ctx;\n}\n\n// Utilities\n/**\n * Read the document `dir` attribute. Defaults to `ltr` on server.\n */\nfunction getDocumentDirection(): ShellDirection {\n if (typeof document === 'undefined') return 'ltr';\n const dir = document.documentElement.getAttribute('dir');\n return dir === 'rtl' ? 'rtl' : 'ltr';\n}\n\n// Root\n/**\n * Props for `Shell.Root`.\n *\n * - `minContentWidth`: CSS length to enforce a minimum inline-size for content\n * area. This prevents content from collapsing too far when sidebars are open.\n * - `rtl`: Force RTL/LTR independent of document; otherwise derived from root.\n * - `headerHeight`: Sticky header block-size.\n * - `zHeader`: z-index for sticky header stacking.\n */\ninterface ShellRootProps extends React.ComponentPropsWithoutRef<'div'> {\n minContentWidth?: string;\n rtl?: boolean;\n headerHeight?: string;\n zHeader?: number;\n cascadeSide?: ShellSide;\n activeTool?: string | null;\n onToolChange?: (id: string | null) => void;\n activeContext?: string | null;\n onContextChange?: (id: string | null) => void;\n}\n\nconst Root = React.forwardRef<HTMLDivElement, ShellRootProps>(\n (\n {\n minContentWidth = '640px',\n rtl,\n headerHeight = '64px',\n zHeader,\n cascadeSide = 'start',\n activeTool: activeToolProp,\n onToolChange,\n activeContext: activeContextProp,\n onContextChange,\n className,\n style,\n children,\n ...props\n },\n ref,\n ) => {\n // Determine logical direction once, overriding document if `rtl` provided\n const computedDir = React.useMemo<ShellDirection>(() => {\n if (typeof rtl === 'boolean') return rtl ? 'rtl' : 'ltr';\n return getDocumentDirection();\n }, [rtl]);\n\n // === Split-mode and single-markup state model ===\n // In split-mode, a sidebar has both Rail and Panel slots. We track:\n // - rail open/collapsed state per side\n // - a sticky panel intent per side (requested or not)\n // In single-markup, we track a single `view` morphing between panel/rail/collapsed\n const [railBySide, setRailBySideState] = React.useState<Record<ShellSide, RailValue>>({\n start: 'open',\n end: 'collapsed',\n });\n const setRailBySide = React.useCallback((side: ShellSide, value: RailValue) => {\n setRailBySideState((prev) => (prev[side] === value ? prev : { ...prev, [side]: value }));\n }, []);\n const toggleRail = React.useCallback((side: ShellSide) => {\n setRailBySideState((prev) => {\n const next = prev[side] === 'open' ? 'collapsed' : 'open';\n return { ...prev, [side]: next };\n });\n // Keep panelRequested sticky across rail collapse/expand\n }, []);\n const [panelRequestedBySide, setPanelRequestedBySideState] = React.useState<\n Record<ShellSide, boolean>\n >({ start: false, end: false });\n const setPanelRequestedBySide = React.useCallback((side: ShellSide, requested: boolean) => {\n setPanelRequestedBySideState((prev) =>\n prev[side] === requested ? prev : { ...prev, [side]: requested },\n );\n }, []);\n // Pattern per side and single-markup state\n // We detect pattern per side based on presence of slots (registered by Sidebar)\n const [patternBySide, setPatternBySide] = React.useState<Record<ShellSide, 'single' | 'split'>>(\n {\n start: 'single',\n end: 'single',\n },\n );\n const setPatternForSide = React.useCallback((side: ShellSide, pattern: 'single' | 'split') => {\n setPatternBySide((prev) => (prev[side] === pattern ? prev : { ...prev, [side]: pattern }));\n }, []);\n const [singleViewBySide, setSingleViewBySideState] = React.useState<\n Record<ShellSide, SingleView>\n >({\n start: 'panel',\n end: 'collapsed',\n });\n const setSingleViewBySide = React.useCallback((side: ShellSide, view: SingleView) => {\n setSingleViewBySideState((prev) => (prev[side] === view ? prev : { ...prev, [side]: view }));\n }, []);\n const cycleSingleView = React.useCallback(\n (side: ShellSide) => {\n const order: SingleView[] = ['panel', 'rail', 'collapsed'];\n const current = singleViewBySide[side];\n const idx = order.indexOf(current);\n const next = order[(idx + 1) % order.length];\n setSingleViewBySide(side, next);\n },\n [singleViewBySide, setSingleViewBySide],\n );\n\n // === Active tool coordination state ===\n // Track which tool/mode is active per side for coordinated rail/panel communication\n const [activeToolBySide, setActiveToolBySideState] = React.useState<\n Record<ShellSide, string | null>\n >({\n start: null,\n end: null,\n });\n const setActiveTool = React.useCallback(\n (side: ShellSide, tool: string | null) => {\n setActiveToolBySideState((prev) =>\n prev[side] === tool ? prev : { ...prev, [side]: tool },\n );\n // Auto-hide panel when no tool is active\n if (tool === null) {\n setPanelRequestedBySide(side, false);\n }\n },\n [setPanelRequestedBySide],\n );\n const onItemSelected = React.useCallback(\n (side: ShellSide, item: string) => {\n setActiveTool(side, item);\n // Auto-show panel when item is selected\n setPanelRequestedBySide(side, true);\n },\n [setActiveTool, setPanelRequestedBySide],\n );\n\n // === Active context coordination state ===\n const [activeContextBySide, setActiveContextBySideState] = React.useState<\n Record<ShellSide, string | null>\n >({ start: null, end: null });\n const setActiveContext = React.useCallback(\n (side: ShellSide, context: string | null) => {\n setActiveContextBySideState((prev) =>\n prev[side] === context ? prev : { ...prev, [side]: context },\n );\n if (side === cascadeSide) onContextChange?.(context);\n },\n [cascadeSide, onContextChange],\n );\n\n // === Controlled prop sync (cascade side) ===\n React.useEffect(() => {\n if (activeToolProp !== undefined && activeToolBySide[cascadeSide] !== activeToolProp) {\n setActiveToolBySideState((prev) => ({ ...prev, [cascadeSide]: activeToolProp }));\n }\n }, [activeToolProp, cascadeSide, activeToolBySide]);\n React.useEffect(() => {\n if (\n activeContextProp !== undefined &&\n activeContextBySide[cascadeSide] !== activeContextProp\n ) {\n setActiveContextBySideState((prev) => ({ ...prev, [cascadeSide]: activeContextProp }));\n }\n }, [activeContextProp, cascadeSide, activeContextBySide]);\n\n // === Stable ids per side ===\n // These IDs are used to wire aria-controls and aria-expanded for triggers,\n // and to scope region/panel/rail DOM nodes for measurement.\n const startRegionId = React.useId();\n const endRegionId = React.useId();\n const startPanelId = React.useId();\n const endPanelId = React.useId();\n const startRailId = React.useId();\n const endRailId = React.useId();\n const getRegionId = React.useCallback(\n (side: ShellSide) =>\n side === 'start' ? `kui-shell-region-${startRegionId}` : `kui-shell-region-${endRegionId}`,\n [startRegionId, endRegionId],\n );\n const getPanelId = React.useCallback(\n (side: ShellSide) =>\n side === 'start' ? `kui-shell-panel-${startPanelId}` : `kui-shell-panel-${endPanelId}`,\n [startPanelId, endPanelId],\n );\n const getRailId = React.useCallback(\n (side: ShellSide) =>\n side === 'start' ? `kui-shell-rail-${startRailId}` : `kui-shell-rail-${endRailId}`,\n [startRailId, endRailId],\n );\n\n const ctx = React.useMemo<ShellContextValue>(\n () => ({\n dir: computedDir,\n headerHeight,\n zHeader,\n railBySide,\n setRailBySide,\n toggleRail,\n panelRequestedBySide,\n setPanelRequestedBySide,\n patternBySide,\n setPatternForSide,\n singleViewBySide,\n setSingleViewBySide,\n cycleSingleView,\n activeToolBySide,\n setActiveTool,\n onItemSelected,\n activeContextBySide,\n setActiveContext,\n getRegionId,\n getPanelId,\n getRailId,\n }),\n [\n computedDir,\n headerHeight,\n zHeader,\n railBySide,\n setRailBySide,\n toggleRail,\n panelRequestedBySide,\n setPanelRequestedBySide,\n patternBySide,\n setPatternForSide,\n singleViewBySide,\n setSingleViewBySide,\n cycleSingleView,\n activeToolBySide,\n setActiveTool,\n onItemSelected,\n activeContextBySide,\n setActiveContext,\n getRegionId,\n getPanelId,\n getRailId,\n ],\n );\n\n // === Composition: order children based on direction ===\n const childArray = React.Children.toArray(children) as React.ReactElement[];\n const isType = (el: React.ReactElement, comp: any) =>\n React.isValidElement(el) && el.type === comp;\n const headerEls = childArray.filter((el) => isType(el, Header));\n const footerEls = childArray.filter((el) => isType(el, Footer));\n const contentEls = childArray.filter((el) => isType(el, Content));\n const sidebarEls = childArray.filter((el) => isType(el, Sidebar));\n\n // Partition sidebars by side\n const startSidebars = sidebarEls.filter((el) => (el.props as any).side === 'start');\n const endSidebars = sidebarEls.filter((el) => (el.props as any).side === 'end');\n\n const bodyChildren =\n computedDir === 'rtl'\n ? [...endSidebars, ...contentEls, ...startSidebars]\n : [...startSidebars, ...contentEls, ...endSidebars];\n\n return (\n <div\n {...props}\n ref={ref}\n className={classNames('rt-ShellRoot', className)}\n style={{\n ...style,\n // Internal CSS custom props for sizing\n ['--shell-min-content-width' as any]: minContentWidth,\n ['--shell-header-height' as any]: headerHeight,\n }}\n dir={computedDir}\n >\n <ShellContext.Provider value={ctx}>\n {headerEls}\n <div className=\"rt-ShellBody\">{bodyChildren}</div>\n {footerEls}\n </ShellContext.Provider>\n </div>\n );\n },\n);\nRoot.displayName = 'Shell.Root';\n\n// Global Header\n/** Props for `Shell.Header`. Sticky by default and respects `--shell-header-height`. */\ninterface ShellHeaderProps extends React.ComponentPropsWithoutRef<'header'> {}\nconst Header = React.forwardRef<HTMLElement, ShellHeaderProps>(\n ({ className, style, ...props }, ref) => {\n const { headerHeight, zHeader } = useShell();\n return (\n <header\n {...props}\n ref={ref}\n role=\"banner\"\n className={classNames('rt-ShellHeader', className)}\n style={{\n ['--shell-header-height' as any]: headerHeight,\n ['--shell-z-header' as any]: zHeader,\n ...style,\n }}\n />\n );\n },\n);\nHeader.displayName = 'Shell.Header';\n\n// Global Footer\n/** Props for `Shell.Footer`. Rendered after body and outside the content scroll. */\ninterface ShellFooterProps extends React.ComponentPropsWithoutRef<'footer'> {}\nconst Footer = React.forwardRef<HTMLElement, ShellFooterProps>(({ className, ...props }, ref) => (\n <footer\n {...props}\n ref={ref}\n role=\"contentinfo\"\n className={classNames('rt-ShellFooter', className)}\n />\n));\nFooter.displayName = 'Shell.Footer';\n\n// Content\n/** Props for `Shell.Content`. The only scrollable area of the Shell. */\ninterface ShellContentProps extends React.ComponentPropsWithoutRef<'main'> {}\nconst ContentBase = React.forwardRef<HTMLElement, ShellContentProps>(\n ({ className, ...props }, ref) => (\n <main {...props} ref={ref} className={classNames('rt-ShellContent', className)} />\n ),\n);\nContentBase.displayName = 'Shell.Content';\n\nconst Content = ContentBase;\n\n// Sidebar (stateful owner)\n/**\n * `Shell.Sidebar` controls one logical side. It supports two patterns:\n * - Split pattern by providing both `Sidebar.Rail` and `Sidebar.Panel` children\n * - Single-markup morphing when no slots are provided\n *\n * Controlled/uncontrolled:\n * - Split: `value`/`defaultValue` reflect rail `open|collapsed`\n * - Single: `view`/`defaultView` reflect `panel|rail|collapsed`\n */\ninterface ShellSidebarProps extends React.ComponentPropsWithoutRef<'div'> {\n side: ShellSide;\n // Overlay: render as a top sheet rather than inline. Responsiveness handled separately.\n overlay?: boolean | Partial<Record<'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl', boolean>>;\n overlaySide?: 'start' | 'end' | 'top' | 'bottom';\n // Split: rail control\n value?: RailValue;\n defaultValue?: RailValue;\n onValueChange?: (value: RailValue) => void;\n // Single-markup view control\n view?: SingleView;\n defaultView?: SingleView;\n onViewChange?: (view: SingleView) => void;\n as?: 'nav' | 'aside' | 'div';\n 'aria-label'?: string;\n}\n\n// Rail\n/** Rail component that provides event emission context for stateless navigation. */\ninterface RailProps extends React.ComponentPropsWithoutRef<'div'> {}\nconst Rail = Object.assign(\n React.forwardRef<HTMLDivElement, RailProps>(({ children }, _ref) => {\n const sidebarSection = useSidebarSection();\n const shell = useShell();\n const side = sidebarSection?.side ?? 'start';\n\n const railContext = React.useMemo<RailContextValue>(\n () => ({\n onItemSelected: (item: string) => shell.onItemSelected(side, item),\n }),\n [shell, side],\n );\n\n return <RailContext.Provider value={railContext}>{children}</RailContext.Provider>;\n }),\n { displayName: 'Shell.Sidebar.Rail', __shellSlot: 'rail' as const },\n);\n\n// Panel\n/** Panel component that provides active tool context for stateless content rendering. */\ninterface PanelProps extends React.ComponentPropsWithoutRef<'div'> {}\nconst Panel = Object.assign(\n React.forwardRef<HTMLDivElement, PanelProps>(({ children }, _ref) => {\n const sidebarSection = useSidebarSection();\n const shell = useShell();\n const side = sidebarSection?.side ?? 'start';\n\n const panelContext = React.useMemo<PanelContextValue>(\n () => ({\n activeTool: shell.activeToolBySide[side],\n activeContext: shell.activeContextBySide[side],\n }),\n [shell.activeToolBySide, shell.activeContextBySide, side],\n );\n\n return <PanelContext.Provider value={panelContext}>{children}</PanelContext.Provider>;\n }),\n { displayName: 'Shell.Sidebar.Panel', __shellSlot: 'panel' as const },\n);\n\ntype ShellSidebarComponent = React.ForwardRefExoticComponent<\n ShellSidebarProps & React.RefAttributes<HTMLDivElement>\n> & {\n Rail: typeof Rail;\n Panel: typeof Panel;\n Trigger: typeof LocalTrigger;\n};\n\nconst SidebarInner = (\n {\n side,\n overlay,\n overlaySide,\n value,\n defaultValue,\n onValueChange,\n view,\n defaultView,\n onViewChange,\n as = 'nav',\n className,\n style,\n children,\n ...props\n }: ShellSidebarProps,\n ref: React.ForwardedRef<HTMLDivElement>,\n) => {\n const shell = useShell();\n const Comp = as as any;\n\n const regionId = shell.getRegionId(side);\n const panelId = shell.getPanelId(side);\n const railId = shell.getRailId(side);\n\n const railChildren = childrenArrayOf(children, 'rail');\n const panelChildren = childrenArrayOf(children, 'panel');\n const hasRail = railChildren.length > 0;\n const hasPanel = panelChildren.length > 0;\n const hasSlots = hasRail || hasPanel;\n\n // Pattern registration per side\n React.useEffect(() => {\n shell.setPatternForSide(side, hasSlots && hasRail && hasPanel ? 'split' : 'single');\n }, [shell, side, hasSlots, hasRail, hasPanel]);\n\n // Initialize defaults (run once)\n const didInitRef = React.useRef(false);\n React.useEffect(() => {\n if (didInitRef.current) return;\n didInitRef.current = true;\n if (hasSlots) {\n // split: rail value\n const initial = value ?? defaultValue ?? (overlay ? 'collapsed' : 'open');\n shell.setRailBySide(side, initial);\n if (overlay) shell.setPanelRequestedBySide(side, false);\n } else {\n // single: view\n const initialView = view ?? defaultView ?? (overlay ? 'collapsed' : 'panel');\n shell.setSingleViewBySide(side, initialView);\n }\n }, [hasSlots, value, defaultValue, view, defaultView, shell, side, overlay]);\n\n // Keep context in sync for controlled\n React.useEffect(() => {\n if (!hasSlots) return;\n if (value !== undefined && shell.railBySide[side] !== value) {\n shell.setRailBySide(side, value);\n }\n }, [value, hasSlots, shell, side]);\n React.useEffect(() => {\n if (hasSlots) return;\n if (view !== undefined && shell.singleViewBySide[side] !== view) {\n shell.setSingleViewBySide(side, view);\n }\n }, [view, hasSlots, shell, side]);\n\n const railValue = shell.railBySide[side];\n const panelRequested = shell.panelRequestedBySide[side];\n const singleView = shell.singleViewBySide[side];\n const activeTool = shell.activeToolBySide[side];\n\n // Emit changes for uncontrolled\n const prevRailRef = React.useRef<RailValue | null>(null);\n React.useEffect(() => {\n if (!hasSlots) return;\n if (value !== undefined) return;\n if (prevRailRef.current !== railValue) {\n prevRailRef.current = railValue;\n onValueChange?.(railValue);\n }\n }, [hasSlots, railValue, value, onValueChange]);\n const prevViewRef = React.useRef<SingleView | null>(null);\n React.useEffect(() => {\n if (hasSlots) return;\n if (view !== undefined) return;\n if (prevViewRef.current !== singleView) {\n prevViewRef.current = singleView;\n onViewChange?.(singleView);\n }\n }, [hasSlots, singleView, view, onViewChange]);\n\n // Derived visibility:\n // - Split (rail+panel): panel shows when rail is open, panel is requested, and a tool is active\n // - Panel-only (no rail): panel shows unconditionally (no tool gating)\n // - Single-markup: shows when view === 'panel' and a tool is active\n const railVisible = hasSlots ? hasRail && railValue === 'open' : singleView === 'rail';\n const panelVisible = hasSlots\n ? hasPanel && (hasRail ? railValue === 'open' && panelRequested && activeTool !== null : true)\n : singleView === 'panel';\n\n // Overlay behavior (non-inline): mount as a Sheet from the top (default)\n // Resolve overlay responsively: built-in defaults overruled by prop\n // Defaults: overlay on initial/xs/sm; inline on md+\n const defaultOverlay = { initial: true, xs: true, sm: true, md: false, lg: false, xl: false };\n const mergedOverlay = React.useMemo(() => {\n if (typeof overlay === 'boolean') {\n return { initial: overlay } as Partial<\n Record<'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl', boolean>\n >;\n }\n return { ...defaultOverlay, ...(overlay || {}) } as Partial<\n Record<'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl', boolean>\n >;\n }, [overlay, defaultOverlay]);\n\n const [currentBp, setCurrentBp] = React.useState<'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl'>(\n 'initial',\n );\n\n React.useEffect(() => {\n if (typeof window === 'undefined') return;\n const queries: [key: 'xs' | 'sm' | 'md' | 'lg' | 'xl', query: string][] = [\n ['xs', '(min-width: 520px)'],\n ['sm', '(min-width: 768px)'],\n ['md', '(min-width: 1024px)'],\n ['lg', '(min-width: 1280px)'],\n ['xl', '(min-width: 1640px)'],\n ];\n const mqls = queries.map(([k, q]) => [k, window.matchMedia(q)] as const);\n const compute = () => {\n // Highest matched wins\n const matched = mqls.filter(([, m]) => m.matches).map(([k]) => k);\n const next = (matched[matched.length - 1] as typeof currentBp | undefined) ?? 'initial';\n setCurrentBp(next);\n };\n compute();\n mqls.forEach(([, m]) => m.addEventListener('change', compute));\n return () => {\n mqls.forEach(([, m]) => m.removeEventListener('change', compute));\n };\n }, []);\n\n const isOverlay = (() => {\n const val = mergedOverlay[currentBp];\n if (typeof val === 'boolean') return val;\n // Fallback cascade: if current not set, try smaller breakpoints, then initial\n const order: (typeof currentBp)[] = ['xl', 'lg', 'md', 'sm', 'xs', 'initial'];\n const idx = order.indexOf(currentBp);\n for (let i = idx + 1; i < order.length; i++) {\n const v = mergedOverlay[order[i]];\n if (typeof v === 'boolean') return v;\n }\n return mergedOverlay.initial ?? false;\n })();\n\n if (isOverlay) {\n const open = hasSlots ? railValue === 'open' || panelRequested : singleView !== 'collapsed';\n const onOpenChange = (next: boolean) => {\n if (hasSlots) {\n if (!next) {\n shell.setRailBySide(side, 'collapsed');\n shell.setPanelRequestedBySide(side, false);\n } else {\n shell.setRailBySide(side, 'open');\n }\n } else {\n if (!next) shell.setSingleViewBySide(side, 'collapsed');\n else shell.setSingleViewBySide(side, 'panel');\n }\n };\n\n const sheetSide = overlaySide ?? side;\n\n // Choose what to render in overlay\n // Split pattern: default to combined (rail + panel). Panel visibility follows panel intent and active tool.\n // Single-markup: render the provided children as-is.\n const overlayPanelVisible = hasSlots\n ? hasPanel && (hasRail ? panelRequested && activeTool !== null : true)\n : false;\n const overlayContent = hasSlots ? (\n <div style={{ display: 'flex', height: '100%', minBlockSize: 0 }}>\n {hasRail ? (\n <div\n id={railId}\n className=\"rt-ShellSidebarRail\"\n data-section=\"rail\"\n data-visible\n style={{ inlineSize: 'var(--shell-sidebar-rail-width, 64px)', overflow: 'hidden' }}\n >\n {railChildren}\n </div>\n ) : null}\n {hasPanel ? (\n <div\n id={panelId}\n className=\"rt-ShellSidebarPanel\"\n data-section=\"panel\"\n data-visible={overlayPanelVisible || undefined}\n aria-hidden={overlayPanelVisible ? undefined : true}\n {...(overlayPanelVisible ? {} : { inert })}\n style={{\n inlineSize: overlayPanelVisible ? 'var(--shell-sidebar-panel-width, 288px)' : '0px',\n overflow: 'hidden',\n }}\n >\n {panelChildren}\n </div>\n ) : null}\n </div>\n ) : (\n children\n );\n\n // Compute sheet width based on split/single pattern using CSS tokens\n const computedWidth =\n sheetSide === 'start' || sheetSide === 'end'\n ? hasSlots\n ? overlayPanelVisible\n ? 'var(--shell-sidebar-combined-width)'\n : 'var(--shell-sidebar-rail-width)'\n : singleView === 'rail'\n ? 'var(--shell-sidebar-rail-width)'\n : 'var(--shell-sidebar-panel-width)'\n : '100vw';\n\n return (\n <>\n <Sheet.Root open={open} onOpenChange={onOpenChange}>\n <Sheet.Content\n id={regionId}\n side={sheetSide}\n height={{ initial: '100vh' }}\n width={{ initial: computedWidth }}\n style={{ ['--dialog-content-padding' as any]: '0px' }}\n >\n <Sheet.Title>\n <VisuallyHidden>Sidebar</VisuallyHidden>\n </Sheet.Title>\n {overlayContent}\n </Sheet.Content>\n </Sheet.Root>\n </>\n );\n }\n\n return (\n <Comp\n {...props}\n ref={ref}\n id={regionId}\n className={classNames('rt-ShellSidebar', className)}\n data-side={side}\n data-rail={hasSlots ? railValue : undefined}\n data-panel={hasSlots ? (panelVisible ? 'visible' : 'hidden') : undefined}\n data-state={!hasSlots ? singleView : undefined}\n aria-label={props['aria-label']}\n style={{ ...style }}\n >\n {hasSlots ? (\n <>\n <SidebarSectionContext.Provider value={{ side, section: 'rail' }}>\n {hasRail ? (\n <div\n id={railId}\n className=\"rt-ShellSidebarRail\"\n data-section=\"rail\"\n data-visible={railVisible || undefined}\n aria-hidden={railVisible ? undefined : true}\n {...(railVisible ? {} : { inert })}\n style={{\n inlineSize: railVisible ? 'var(--shell-sidebar-rail-width, 64px)' : '0px',\n overflow: 'hidden',\n }}\n >\n {railChildren}\n </div>\n ) : null}\n </SidebarSectionContext.Provider>\n <SidebarSectionContext.Provider value={{ side, section: 'panel' }}>\n {hasPanel ? (\n <div\n id={panelId}\n className=\"rt-ShellSidebarPanel\"\n data-section=\"panel\"\n data-visible={panelVisible || undefined}\n aria-hidden={panelVisible ? undefined : true}\n {...(panelVisible ? {} : { inert })}\n style={{\n inlineSize: panelVisible ? 'var(--shell-sidebar-panel-width, 288px)' : '0px',\n overflow: 'hidden',\n }}\n >\n {panelChildren}\n </div>\n ) : null}\n </SidebarSectionContext.Provider>\n </>\n ) : (\n // Single-markup morphing\n <div\n className=\"rt-ShellSidebarSingle\"\n data-visible={singleView !== 'collapsed' || undefined}\n aria-hidden={singleView === 'collapsed' ? true : undefined}\n style={{\n inlineSize:\n singleView === 'collapsed'\n ? '0px'\n : singleView === 'rail'\n ? 'var(--shell-sidebar-rail-width, 64px)'\n : 'var(--shell-sidebar-panel-width, 288px)',\n overflow: 'hidden',\n }}\n >\n {children}\n </div>\n )}\n </Comp>\n );\n};\n\nconst Sidebar = React.forwardRef<HTMLDivElement, ShellSidebarProps>(\n SidebarInner,\n) as ShellSidebarComponent;\nSidebar.displayName = 'Shell.Sidebar';\n\n// Helper to pick rail/panel children by marker components\nfunction childrenArrayOf(children: React.ReactNode, slot: 'rail' | 'panel') {\n const arr = React.Children.toArray(children) as React.ReactElement[];\n return arr.filter((el) => React.isValidElement(el) && (el.type as any)?.['__shellSlot'] === slot);\n}\n\nSidebar.Rail = Rail;\nSidebar.Panel = Panel;\n\n// Local Trigger (inside a sidebar)\nimport type { IconButtonProps } from './icon-button.js';\ntype LocalTriggerProps = IconButtonProps<'button'>;\n/**\n * `Shell.Sidebar.Trigger` toggles the sidebar where it is rendered.\n * - In split-mode: toggles rail open/collapsed\n * - In single-markup: cycles through panel \u2192 rail \u2192 collapsed\n */\nconst LocalTrigger = React.forwardRef<React.ElementRef<typeof IconButton>, LocalTriggerProps>(\n ({ onClick, children, ...props }, ref) => {\n const section = useSidebarSection();\n const shell = useShell();\n const side = section?.side ?? 'start';\n const controlsId = shell.getRegionId(side);\n const expanded =\n shell.patternBySide[side] === 'split'\n ? shell.railBySide[side] === 'open'\n : shell.singleViewBySide[side] !== 'collapsed';\n return (\n <IconButton\n {...props}\n ref={ref}\n variant=\"soft\"\n aria-controls={controlsId}\n aria-expanded={expanded}\n onClick={(e) => {\n onClick?.(e);\n if (shell.patternBySide[side] === 'split') shell.toggleRail(side);\n else shell.cycleSingleView(side);\n }}\n >\n {children || <ChevronDownIcon />}\n </IconButton>\n );\n },\n);\nLocalTrigger.displayName = 'Shell.Sidebar.Trigger';\n\n// Global Trigger\ntype GlobalTriggerProps = IconButtonProps<'button'> & { side: ShellSide };\n/**\n * `Shell.Trigger` controls a specific `side` from anywhere inside `Shell.Root`.\n * Mirrors behavior of the local trigger, but with explicit side.\n */\nconst Trigger = React.forwardRef<React.ElementRef<typeof IconButton>, GlobalTriggerProps>(\n ({ side, onClick, children, ...props }, ref) => {\n const shell = useShell();\n const controlsId = shell.getRegionId(side);\n const expanded =\n shell.patternBySide[side] === 'split'\n ? shell.railBySide[side] === 'open'\n : shell.singleViewBySide[side] !== 'collapsed';\n return (\n <IconButton\n {...props}\n ref={ref}\n variant=\"soft\"\n aria-controls={controlsId}\n aria-expanded={expanded}\n onClick={(e) => {\n onClick?.(e);\n if (shell.patternBySide[side] === 'split') shell.toggleRail(side);\n else shell.cycleSingleView(side);\n }}\n >\n {children || <ChevronDownIcon />}\n </IconButton>\n );\n },\n);\nTrigger.displayName = 'Shell.Trigger';\n\n// Attach slots to Sidebar for namespaced API\n(Sidebar as any).Rail = Rail;\n(Sidebar as any).Panel = Panel;\n(Sidebar as any).Trigger = LocalTrigger;\n\nexport { Root, Header, Footer, Content, Sidebar, Trigger, useShell, useRailEvents, usePanelState };\n// Convenience per-side API\n/**\n * Convenience hook to interrogate and control one sidebar.\n * - `rail`: open/collapsed helpers for split pattern\n * - `panel`: show/hide helpers; visibility is conditional on rail open in split pattern\n * - `single`: view control for single-markup pattern\n * - `activeTool`: active tool coordination state\n */\nfunction useSidebar(side: ShellSide): {\n side: ShellSide;\n isSplit: boolean;\n rail: {\n value: RailValue;\n isOpen: boolean;\n open: () => void;\n close: () => void;\n toggle: () => void;\n onItemSelected: (item: string) => void;\n };\n panel: {\n isVisible: boolean;\n show: () => void;\n hide: () => void;\n activeTool: string | null;\n activeContext: string | null;\n };\n single: { view: SingleView; setView: (view: SingleView) => void; cycle: () => void };\n activeTool: string | null;\n setActiveTool: (tool: string | null) => void;\n activeContext: string | null;\n setActiveContext: (context: string | null) => void;\n} {\n const shell = useShell();\n const isSplit = shell.patternBySide[side] === 'split';\n const railValue = shell.railBySide[side];\n const activeTool = shell.activeToolBySide[side];\n\n const panelVisible =\n shell.panelRequestedBySide[side] && railValue === 'open' && activeTool !== null;\n return {\n side,\n isSplit,\n rail: {\n value: railValue,\n isOpen: railValue === 'open',\n open: () => shell.setRailBySide(side, 'open'),\n close: () => {\n shell.setRailBySide(side, 'collapsed');\n shell.setPanelRequestedBySide(side, false);\n },\n toggle: () => shell.toggleRail(side),\n onItemSelected: (item: string) => shell.onItemSelected(side, item),\n },\n panel: {\n isVisible: panelVisible,\n show: () => shell.setPanelRequestedBySide(side, true),\n hide: () => shell.setPanelRequestedBySide(side, false),\n activeTool: shell.activeToolBySide[side],\n activeContext: shell.activeContextBySide[side],\n },\n single: {\n view: shell.singleViewBySide[side],\n setView: (view: SingleView) => shell.setSingleViewBySide(side, view),\n cycle: () => shell.cycleSingleView(side),\n },\n activeTool: shell.activeToolBySide[side],\n setActiveTool: (tool: string | null) => shell.setActiveTool(side, tool),\n activeContext: shell.activeContextBySide[side],\n setActiveContext: (context: string | null) => shell.setActiveContext(side, context),\n };\n}\n\nexport { useSidebar };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["shell_exports", "__export", "Content", "Footer", "Header", "Root", "Sidebar", "Trigger", "usePanelState", "useRailEvents", "useShell", "useSidebar", "__toCommonJS", "React", "import_classnames", "import_icon_button", "import_icons", "import_inert", "Sheet", "import_visually_hidden", "ShellContext", "ctx", "SidebarSectionContext", "useSidebarSection", "RailContext", "PanelContext", "getDocumentDirection", "minContentWidth", "rtl", "headerHeight", "zHeader", "cascadeSide", "activeToolProp", "onToolChange", "activeContextProp", "onContextChange", "className", "style", "children", "props", "ref", "computedDir", "railBySide", "setRailBySideState", "setRailBySide", "side", "value", "prev", "toggleRail", "next", "panelRequestedBySide", "setPanelRequestedBySideState", "setPanelRequestedBySide", "requested", "patternBySide", "setPatternBySide", "setPatternForSide", "pattern", "singleViewBySide", "setSingleViewBySideState", "setSingleViewBySide", "view", "cycleSingleView", "order", "current", "idx", "activeToolBySide", "setActiveToolBySideState", "setActiveTool", "tool", "onItemSelected", "item", "activeContextBySide", "setActiveContextBySideState", "setActiveContext", "context", "startRegionId", "endRegionId", "startPanelId", "endPanelId", "startRailId", "endRailId", "getRegionId", "getPanelId", "getRailId", "childArray", "isType", "el", "comp", "headerEls", "footerEls", "contentEls", "sidebarEls", "startSidebars", "endSidebars", "bodyChildren", "classNames", "ContentBase", "Rail", "_ref", "sidebarSection", "shell", "railContext", "Panel", "panelContext", "SidebarInner", "overlay", "overlaySide", "defaultValue", "onValueChange", "defaultView", "onViewChange", "as", "Comp", "regionId", "panelId", "railId", "railChildren", "childrenArrayOf", "panelChildren", "hasRail", "hasPanel", "hasSlots", "didInitRef", "initial", "initialView", "railValue", "panelRequested", "singleView", "activeTool", "prevRailRef", "prevViewRef", "railVisible", "panelVisible", "defaultOverlay", "mergedOverlay", "currentBp", "setCurrentBp", "mqls", "k", "q", "compute", "matched", "m", "val", "i", "v", "open", "onOpenChange", "sheetSide", "overlayPanelVisible", "overlayContent", "computedWidth", "slot", "LocalTrigger", "onClick", "section", "controlsId", "expanded", "e", "isSplit"]
|
|
7
|
+
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Accordion } from 'radix-ui';
|
|
3
3
|
import { sidebarPropDefs } from './sidebar.props.js';
|
|
4
|
-
import { IconButton } from './icon-button.js';
|
|
5
4
|
import { Separator } from './separator.js';
|
|
6
5
|
import type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';
|
|
7
6
|
import type { GetPropDefTypes } from '../props/prop-def.js';
|
|
@@ -14,38 +13,13 @@ type BadgeConfig = {
|
|
|
14
13
|
highContrast?: BadgeProps['highContrast'];
|
|
15
14
|
radius?: BadgeProps['radius'];
|
|
16
15
|
};
|
|
17
|
-
type SidebarContextProps = {
|
|
18
|
-
state: 'expanded' | 'collapsed';
|
|
19
|
-
open: boolean;
|
|
20
|
-
setOpen: (open: boolean) => void;
|
|
21
|
-
openMobile: boolean;
|
|
22
|
-
setOpenMobile: (open: boolean) => void;
|
|
23
|
-
isMobile: boolean;
|
|
24
|
-
toggleSidebar: () => void;
|
|
25
|
-
side: 'left' | 'right';
|
|
26
|
-
type: 'sidebar' | 'floating';
|
|
27
|
-
variant: 'soft' | 'outline' | 'surface' | 'ghost';
|
|
28
|
-
menuVariant: 'solid' | 'soft';
|
|
29
|
-
collapsible: 'offcanvas' | 'icon' | 'none';
|
|
30
|
-
size: '1' | '2';
|
|
31
|
-
};
|
|
32
|
-
declare function useSidebar(): SidebarContextProps;
|
|
33
|
-
interface SidebarProviderProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
34
|
-
defaultOpen?: boolean;
|
|
35
|
-
open?: boolean;
|
|
36
|
-
onOpenChange?: (open: boolean) => void;
|
|
37
|
-
side?: 'left' | 'right';
|
|
38
|
-
}
|
|
39
|
-
declare const SidebarProvider: React.ForwardRefExoticComponent<SidebarProviderProps & React.RefAttributes<HTMLDivElement>>;
|
|
40
16
|
type SidebarOwnProps = GetPropDefTypes<typeof sidebarPropDefs>;
|
|
41
17
|
interface SidebarProps extends ComponentPropsWithout<'div', RemovedProps>, SidebarOwnProps {
|
|
42
18
|
}
|
|
43
19
|
declare const Sidebar: React.ForwardRefExoticComponent<SidebarProps & React.RefAttributes<HTMLDivElement>>;
|
|
44
20
|
interface SidebarContentProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
* @default "Main navigation"
|
|
48
|
-
*/
|
|
21
|
+
id?: string;
|
|
22
|
+
role?: 'navigation' | 'none';
|
|
49
23
|
'aria-label'?: string;
|
|
50
24
|
}
|
|
51
25
|
declare const SidebarContent: React.ForwardRefExoticComponent<SidebarContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -65,9 +39,6 @@ interface SidebarFooterProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
|
65
39
|
asContainer?: boolean;
|
|
66
40
|
}
|
|
67
41
|
declare const SidebarFooter: React.ForwardRefExoticComponent<SidebarFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
68
|
-
interface SidebarTriggerProps extends ComponentPropsWithout<typeof IconButton, RemovedProps> {
|
|
69
|
-
}
|
|
70
|
-
declare const SidebarTrigger: React.ForwardRefExoticComponent<Omit<SidebarTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
71
42
|
interface SidebarSeparatorProps extends ComponentPropsWithout<typeof Separator, RemovedProps> {
|
|
72
43
|
}
|
|
73
44
|
declare const SidebarSeparator: React.ForwardRefExoticComponent<SidebarSeparatorProps & React.RefAttributes<HTMLSpanElement>>;
|
|
@@ -105,7 +76,7 @@ declare const SidebarGroupLabel: React.ForwardRefExoticComponent<SidebarGroupLab
|
|
|
105
76
|
interface SidebarGroupContentProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
106
77
|
}
|
|
107
78
|
declare const SidebarGroupContent: React.ForwardRefExoticComponent<SidebarGroupContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
108
|
-
export {
|
|
79
|
+
export { Sidebar as Root, SidebarContent as Content, SidebarHeader as Header, SidebarFooter as Footer, SidebarSeparator as Separator, SidebarMenu as Menu, SidebarMenuItem as MenuItem, SidebarMenuButton as MenuButton, SidebarMenuSub as MenuSub, SidebarMenuSubTrigger as MenuSubTrigger, SidebarMenuSubContent as MenuSubContent, SidebarGroup as Group, SidebarGroupLabel as GroupLabel, SidebarGroupContent as GroupContent, };
|
|
109
80
|
/**
|
|
110
81
|
* Enhanced Sidebar Header and Footer Usage Examples:
|
|
111
82
|
*
|
|
@@ -158,5 +129,5 @@ export { SidebarProvider as Provider, Sidebar as Root, SidebarContent as Content
|
|
|
158
129
|
* - Justification: rt-justify-between, rt-justify-center, rt-justify-start, rt-justify-end
|
|
159
130
|
* - Gap: rt-gap-1, rt-gap-2, rt-gap-3, rt-gap-4
|
|
160
131
|
*/
|
|
161
|
-
export type {
|
|
132
|
+
export type { SidebarProps as RootProps, SidebarContentProps as ContentProps, SidebarHeaderProps as HeaderProps, SidebarFooterProps as FooterProps, BadgeConfig, };
|
|
162
133
|
//# sourceMappingURL=sidebar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var X=Object.create;var P=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var ee=Object.getPrototypeOf,re=Object.prototype.hasOwnProperty;var te=(r,t)=>{for(var o in t)P(r,o,{get:t[o],enumerable:!0})},k=(r,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of Z(t))!re.call(r,n)&&n!==o&&P(r,n,{get:()=>t[n],enumerable:!(a=Y(t,n))||a.enumerable});return r};var F=(r,t,o)=>(o=r!=null?X(ee(r)):{},k(t||!r||!r.__esModule?P(o,"default",{value:r,enumerable:!0}):o,r)),oe=r=>k(P({},"__esModule",{value:!0}),r);var ae={};te(ae,{Content:()=>H,Footer:()=>L,Group:()=>D,GroupContent:()=>A,GroupLabel:()=>W,Header:()=>R,Menu:()=>E,MenuButton:()=>w,MenuItem:()=>z,MenuSub:()=>G,MenuSubContent:()=>V,MenuSubTrigger:()=>I,Root:()=>B,Separator:()=>x});module.exports=oe(ae);var e=F(require("react")),i=F(require("classnames")),N=require("./slot.js"),b=require("radix-ui"),c=require("./sidebar.props.js"),j=require("./theme.js"),K=require("./scroll-area.js"),O=require("./separator.js"),_=require("./icons.js"),q=require("../helpers/extract-props.js"),U=require("./kbd.js"),T=require("./badge.js");const $=e.createContext(null);function v(){return e.useContext($)}const B=e.forwardRef((r,t)=>{const o=(0,j.useThemeContext)(),{size:a=c.sidebarPropDefs.size.default,variant:n=c.sidebarPropDefs.variant.default,menuVariant:s=c.sidebarPropDefs.menuVariant.default,panelBackground:u,color:m,highContrast:l=c.sidebarPropDefs.highContrast.default}=r,{className:p,children:M,...h}=(0,q.extractProps)(r,c.sidebarPropDefs),{asChild:y,panelBackground:J,...S}=h,g=m||o.accentColor,f=typeof a=="object"?a.initial||"2":a;return e.createElement("div",{...S,ref:t,"data-accent-color":g,className:(0,i.default)("rt-SidebarRoot",p)},e.createElement($.Provider,{value:{size:f,menuVariant:s}},e.createElement("div",{className:(0,i.default)("rt-SidebarContainer",`rt-variant-${n}`,`rt-r-size-${f}`,`rt-menu-variant-${s}`),"data-accent-color":g,"data-high-contrast":l||void 0,"data-panel-background":u},M)))});B.displayName="Sidebar.Root";const H=e.forwardRef(({className:r,children:t,role:o="navigation","aria-label":a="Main navigation",id:n,...s},u)=>{const m=v(),l=m?.size??"2",p=m?.menuVariant??"soft";return e.createElement(K.ScrollArea,{type:"hover"},e.createElement("div",{...s,ref:u,id:n,role:o,"aria-label":a,className:(0,i.default)("rt-BaseMenuContent","rt-SidebarContent",`rt-r-size-${l}`,`rt-menu-variant-${p}`,r)},t))});H.displayName="Sidebar.Content";const R=e.forwardRef(({className:r,asContainer:t=!0,...o},a)=>{const n=v(),s=n?.size??"2",u=n?.menuVariant??"soft";return e.createElement("div",{...o,ref:a,className:(0,i.default)("rt-SidebarHeader",`rt-r-size-${s}`,`rt-menu-variant-${u}`,{"rt-SidebarHeader--container":t},r)})});R.displayName="Sidebar.Header";const L=e.forwardRef(({className:r,asContainer:t=!0,...o},a)=>{const n=v(),s=n?.size??"2",u=n?.menuVariant??"soft";return e.createElement("div",{...o,ref:a,className:(0,i.default)("rt-SidebarFooter",`rt-r-size-${s}`,`rt-menu-variant-${u}`,{"rt-SidebarFooter--container":t},r)})});L.displayName="Sidebar.Footer";const x=e.forwardRef(({className:r,...t},o)=>e.createElement(O.Separator,{...t,ref:o,className:(0,i.default)("rt-SidebarSeparator",r)}));x.displayName="Sidebar.Separator";const E=e.forwardRef(({className:r,...t},o)=>e.createElement("ul",{...t,ref:o,role:"menu",className:(0,i.default)("rt-BaseMenuViewport","rt-SidebarMenu",r)}));E.displayName="Sidebar.Menu";const z=e.forwardRef(({className:r,...t},o)=>e.createElement("li",{...t,ref:o,className:(0,i.default)("rt-SidebarMenuItem",r)}));z.displayName="Sidebar.MenuItem";const w=e.forwardRef(({asChild:r=!1,isActive:t=!1,shortcut:o,badge:a,className:n,children:s,onMouseEnter:u,onMouseLeave:m,onKeyDown:l,...p},M)=>{const[h,y]=e.useState(!1),S=v()?.size??"2",g=r?N.Slot:"button",{onClick:f}=p,Q=e.useCallback(d=>{switch(d.key){case"Enter":case" ":d.preventDefault(),f&&f(d);break;case"ArrowDown":{d.preventDefault();const C=d.currentTarget.nextElementSibling?.querySelector('[role="menuitem"]');C&&C.focus();break}case"ArrowUp":{d.preventDefault();const C=d.currentTarget.previousElementSibling?.querySelector('[role="menuitem"]');C&&C.focus();break}}l?.(d)},[f,l]);return e.createElement(g,{...p,ref:M,role:"menuitem","aria-current":t?"page":void 0,className:(0,i.default)("rt-reset","rt-BaseMenuItem","rt-SidebarMenuButton",n),"data-active":t||void 0,"data-highlighted":h||void 0,onKeyDown:Q,onMouseEnter:d=>{y(!0),u?.(d)},onMouseLeave:d=>{y(!1),m?.(d)}},r?s:e.createElement(e.Fragment,null,s,a&&e.createElement("div",{className:"rt-SidebarMenuBadge"},typeof a=="string"?e.createElement(T.Badge,{size:S,variant:"soft"},a):e.createElement(T.Badge,{size:a.size||S,variant:a.variant||"soft",color:a.color,highContrast:a.highContrast,radius:a.radius},a.content)),o&&e.createElement("div",{className:"rt-BaseMenuShortcut rt-SidebarMenuShortcut"},e.createElement(U.Kbd,{size:S},o))))});w.displayName="Sidebar.MenuButton";const G=e.forwardRef(({defaultOpen:r=!1,children:t,...o},a)=>e.createElement("div",{...o,ref:a},e.createElement(b.Accordion.Root,{type:"single",collapsible:!0,defaultValue:r?"item":void 0},e.createElement(b.Accordion.Item,{value:"item"},t))));G.displayName="Sidebar.MenuSub";const I=e.forwardRef(({asChild:r=!1,className:t,children:o,onMouseEnter:a,onMouseLeave:n,...s},u)=>{const[m,l]=e.useState(!1);return e.createElement(b.Accordion.Header,{asChild:!0},e.createElement("div",null,e.createElement(b.Accordion.Trigger,{...s,ref:u,asChild:r,role:"menuitem","aria-haspopup":"true",className:(0,i.default)("rt-reset","rt-BaseMenuItem","rt-SidebarMenuButton","rt-SidebarMenuSubTrigger",t),"data-highlighted":m||void 0,onMouseEnter:p=>{l(!0),a?.(p)},onMouseLeave:p=>{l(!1),n?.(p)}},r?o:e.createElement(e.Fragment,null,o,e.createElement(_.ThickChevronRightIcon,{className:(0,i.default)("rt-BaseMenuSubTriggerIcon","rt-SidebarMenuSubTriggerIcon")})))))});I.displayName="Sidebar.MenuSubTrigger";const V=e.forwardRef(({className:r,children:t,...o},a)=>e.createElement(b.Accordion.Content,{...o,ref:a,className:(0,i.default)("rt-SidebarMenuSubContent",r)},e.createElement("div",{className:"rt-SidebarMenuSubList"},t)));V.displayName="Sidebar.MenuSubContent";const D=e.forwardRef(({className:r,...t},o)=>e.createElement("div",{...t,ref:o,className:(0,i.default)("rt-BaseMenuGroup","rt-SidebarGroup",r)}));D.displayName="Sidebar.Group";const W=e.forwardRef(({asChild:r=!1,className:t,...o},a)=>e.createElement(r?N.Slot:"div",{...o,ref:a,role:"group",className:(0,i.default)("rt-BaseMenuLabel","rt-SidebarGroupLabel",t)}));W.displayName="Sidebar.GroupLabel";const A=e.forwardRef(({className:r,...t},o)=>e.createElement("div",{...t,ref:o,className:(0,i.default)("rt-SidebarGroupContent",r)}));A.displayName="Sidebar.GroupContent";
|
|
2
2
|
//# sourceMappingURL=sidebar.js.map
|