@principal-ade/panels 1.0.39
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/README.md +360 -0
- package/dist/components/AnimatedResizableLayout.d.ts +42 -0
- package/dist/components/AnimatedResizableLayout.d.ts.map +1 -0
- package/dist/components/AnimatedVerticalLayout.d.ts +59 -0
- package/dist/components/AnimatedVerticalLayout.d.ts.map +1 -0
- package/dist/components/ConfigurablePanelLayout.d.ts +87 -0
- package/dist/components/ConfigurablePanelLayout.d.ts.map +1 -0
- package/dist/components/EditableConfigurablePanelLayout.d.ts +17 -0
- package/dist/components/EditableConfigurablePanelLayout.d.ts.map +1 -0
- package/dist/components/PanelConfigurator.d.ts +55 -0
- package/dist/components/PanelConfigurator.d.ts.map +1 -0
- package/dist/components/ResponsiveConfigurablePanelLayout.d.ts +21 -0
- package/dist/components/ResponsiveConfigurablePanelLayout.d.ts.map +1 -0
- package/dist/components/SnapCarousel.d.ts +38 -0
- package/dist/components/SnapCarousel.d.ts.map +1 -0
- package/dist/components/TabGroup.d.ts +21 -0
- package/dist/components/TabGroup.d.ts.map +1 -0
- package/dist/components/ThreePanelLayout.d.ts +63 -0
- package/dist/components/ThreePanelLayout.d.ts.map +1 -0
- package/dist/hooks/useLocalStorage.d.ts +2 -0
- package/dist/hooks/useLocalStorage.d.ts.map +1 -0
- package/dist/hooks/useMediaQuery.d.ts +2 -0
- package/dist/hooks/useMediaQuery.d.ts.map +1 -0
- package/dist/index.d.ts +15 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.esm.js +58 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/index.umd.js +2 -0
- package/dist/index.umd.js.map +1 -0
- package/dist/panels.css +1 -0
- package/dist/test/setup.d.ts +1 -0
- package/dist/test/setup.d.ts.map +1 -0
- package/dist/types/index.d.ts +24 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/theme.d.ts +23 -0
- package/dist/types/theme.d.ts.map +1 -0
- package/dist/utils/themeMapping.d.ts +10 -0
- package/dist/utils/themeMapping.d.ts.map +1 -0
- package/package.json +94 -0
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { Theme } from '@principal-ade/industry-theme';
|
|
3
|
+
export interface SnapCarouselRef {
|
|
4
|
+
/** Scroll to a specific panel by index */
|
|
5
|
+
scrollToPanel: (index: number) => void;
|
|
6
|
+
/** Get the current panel index */
|
|
7
|
+
getCurrentPanel: () => number;
|
|
8
|
+
}
|
|
9
|
+
export interface SnapCarouselProps {
|
|
10
|
+
/** Array of panel content to display in the carousel */
|
|
11
|
+
panels: ReactNode[];
|
|
12
|
+
/** CSS class for the carousel container */
|
|
13
|
+
className?: string;
|
|
14
|
+
/** Additional styles to apply to the container */
|
|
15
|
+
style?: React.CSSProperties;
|
|
16
|
+
/** Theme object for customizing colors */
|
|
17
|
+
theme: Theme;
|
|
18
|
+
/** Minimum width for each panel (default: 350px). For 2-panel layouts, the threshold for switching to 50% width is 2x this value. */
|
|
19
|
+
minPanelWidth?: number;
|
|
20
|
+
/** Ideal width for each panel as a fraction of container width (default: 0.333 for 1/3 of container) */
|
|
21
|
+
idealPanelWidth?: number;
|
|
22
|
+
/** Whether to show a 1px separator between panels (default: false) */
|
|
23
|
+
showSeparator?: boolean;
|
|
24
|
+
/** Callback when a panel comes into view */
|
|
25
|
+
onPanelChange?: (index: number) => void;
|
|
26
|
+
/** Prevent keyboard keys (space, arrows, page up/down) from scrolling the carousel. Useful when panels contain interactive input components like terminals or text editors. (default: true) */
|
|
27
|
+
preventKeyboardScroll?: boolean;
|
|
28
|
+
}
|
|
29
|
+
/**
|
|
30
|
+
* SnapCarousel - A horizontally scrolling carousel with snap points
|
|
31
|
+
*
|
|
32
|
+
* Responsive behavior:
|
|
33
|
+
* - 1 panel: 100% width of container
|
|
34
|
+
* - 2 panels: 100% width by default, switches to 50% when container width > 2x minPanelWidth (default: 700px)
|
|
35
|
+
* - 3+ panels: Uses max(minPanelWidth, idealPanelWidth%) of container width
|
|
36
|
+
*/
|
|
37
|
+
export declare const SnapCarousel: React.ForwardRefExoticComponent<SnapCarouselProps & React.RefAttributes<SnapCarouselRef>>;
|
|
38
|
+
//# sourceMappingURL=SnapCarousel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SnapCarousel.d.ts","sourceRoot":"","sources":["../../src/components/SnapCarousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAsD,MAAM,OAAO,CAAC;AAC7F,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAEtD,OAAO,oBAAoB,CAAC;AAE5B,MAAM,WAAW,eAAe;IAC9B,0CAA0C;IAC1C,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,kCAAkC;IAClC,eAAe,EAAE,MAAM,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,MAAM,EAAE,SAAS,EAAE,CAAC;IAEpB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,kDAAkD;IAClD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,0CAA0C;IAC1C,KAAK,EAAE,KAAK,CAAC;IAEb,qIAAqI;IACrI,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,wGAAwG;IACxG,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,sEAAsE;IACtE,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,4CAA4C;IAC5C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC,+LAA+L;IAC/L,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,2FAoMvB,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { Theme } from '@principal-ade/industry-theme';
|
|
3
|
+
import { PanelDefinitionWithContent } from './ConfigurablePanelLayout';
|
|
4
|
+
import { TabsConfig } from './PanelConfigurator';
|
|
5
|
+
export interface TabGroupProps {
|
|
6
|
+
/** Panel IDs to display as tabs */
|
|
7
|
+
panelIds: string[];
|
|
8
|
+
/** All available panels with content */
|
|
9
|
+
panels: PanelDefinitionWithContent[];
|
|
10
|
+
/** Tab configuration */
|
|
11
|
+
config?: TabsConfig;
|
|
12
|
+
/** Optional class name */
|
|
13
|
+
className?: string;
|
|
14
|
+
/** Theme object for customizing colors */
|
|
15
|
+
theme: Theme;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* TabGroup - Renders multiple panels in a tabbed interface
|
|
19
|
+
*/
|
|
20
|
+
export declare const TabGroup: React.FC<TabGroupProps>;
|
|
21
|
+
//# sourceMappingURL=TabGroup.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TabGroup.d.ts","sourceRoot":"","sources":["../../src/components/TabGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAEtD,OAAO,EAAE,0BAA0B,EAAE,MAAM,2BAA2B,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,gBAAgB,CAAC;AAExB,MAAM,WAAW,aAAa;IAC5B,mCAAmC;IACnC,QAAQ,EAAE,MAAM,EAAE,CAAC;IAEnB,wCAAwC;IACxC,MAAM,EAAE,0BAA0B,EAAE,CAAC;IAErC,wBAAwB;IACxB,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,0CAA0C;IAC1C,KAAK,EAAE,KAAK,CAAC;CACd;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAwG5C,CAAC"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { Theme } from '@principal-ade/industry-theme';
|
|
3
|
+
export interface ThreePanelLayoutProps {
|
|
4
|
+
/** Content for the left panel */
|
|
5
|
+
leftPanel: ReactNode;
|
|
6
|
+
/** Content for the middle panel */
|
|
7
|
+
middlePanel: ReactNode;
|
|
8
|
+
/** Content for the right panel */
|
|
9
|
+
rightPanel: ReactNode;
|
|
10
|
+
/** Which panels are collapsible */
|
|
11
|
+
collapsiblePanels?: {
|
|
12
|
+
left?: boolean;
|
|
13
|
+
right?: boolean;
|
|
14
|
+
};
|
|
15
|
+
/** Default sizes for each panel (0-100, must sum to 100) */
|
|
16
|
+
defaultSizes?: {
|
|
17
|
+
left: number;
|
|
18
|
+
middle: number;
|
|
19
|
+
right: number;
|
|
20
|
+
};
|
|
21
|
+
/** Minimum sizes for each panel when expanded (0-100) */
|
|
22
|
+
minSizes?: {
|
|
23
|
+
left: number;
|
|
24
|
+
middle: number;
|
|
25
|
+
right: number;
|
|
26
|
+
};
|
|
27
|
+
/** CSS class for the layout container */
|
|
28
|
+
className?: string;
|
|
29
|
+
/** Initial collapsed state for panels */
|
|
30
|
+
collapsed?: {
|
|
31
|
+
left?: boolean;
|
|
32
|
+
right?: boolean;
|
|
33
|
+
};
|
|
34
|
+
/** Additional styles to apply to the container */
|
|
35
|
+
style?: React.CSSProperties;
|
|
36
|
+
/** Whether to show collapse/expand toggle buttons */
|
|
37
|
+
showCollapseButtons?: boolean;
|
|
38
|
+
/** Animation duration in milliseconds */
|
|
39
|
+
animationDuration?: number;
|
|
40
|
+
/** Animation easing function */
|
|
41
|
+
animationEasing?: string;
|
|
42
|
+
/** Theme object for customizing colors */
|
|
43
|
+
theme: Theme;
|
|
44
|
+
/** Callbacks for panel events */
|
|
45
|
+
onLeftCollapseStart?: () => void;
|
|
46
|
+
onLeftCollapseComplete?: () => void;
|
|
47
|
+
onLeftExpandStart?: () => void;
|
|
48
|
+
onLeftExpandComplete?: () => void;
|
|
49
|
+
onRightCollapseStart?: () => void;
|
|
50
|
+
onRightCollapseComplete?: () => void;
|
|
51
|
+
onRightExpandStart?: () => void;
|
|
52
|
+
onRightExpandComplete?: () => void;
|
|
53
|
+
onPanelResize?: (sizes: {
|
|
54
|
+
left: number;
|
|
55
|
+
middle: number;
|
|
56
|
+
right: number;
|
|
57
|
+
}) => void;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* ThreePanelLayout - A three-panel layout with collapsible left and right panels
|
|
61
|
+
*/
|
|
62
|
+
export declare const ThreePanelLayout: React.FC<ThreePanelLayoutProps>;
|
|
63
|
+
//# sourceMappingURL=ThreePanelLayout.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ThreePanelLayout.d.ts","sourceRoot":"","sources":["../../src/components/ThreePanelLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA4C,MAAM,OAAO,CAAC;AASnF,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAEtD,OAAO,wBAAwB,CAAC;AAEhC,MAAM,WAAW,qBAAqB;IACpC,iCAAiC;IACjC,SAAS,EAAE,SAAS,CAAC;IAErB,mCAAmC;IACnC,WAAW,EAAE,SAAS,CAAC;IAEvB,kCAAkC;IAClC,UAAU,EAAE,SAAS,CAAC;IAEtB,mCAAmC;IACnC,iBAAiB,CAAC,EAAE;QAClB,IAAI,CAAC,EAAE,OAAO,CAAC;QACf,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;IAEF,4DAA4D;IAC5D,YAAY,CAAC,EAAE;QACb,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IAEF,yDAAyD;IACzD,QAAQ,CAAC,EAAE;QACT,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;IAEF,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,yCAAyC;IACzC,SAAS,CAAC,EAAE;QACV,IAAI,CAAC,EAAE,OAAO,CAAC;QACf,KAAK,CAAC,EAAE,OAAO,CAAC;KACjB,CAAC;IAEF,kDAAkD;IAClD,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,qDAAqD;IACrD,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,gCAAgC;IAChC,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,0CAA0C;IAC1C,KAAK,EAAE,KAAK,CAAC;IAEb,iCAAiC;IACjC,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAClF;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAqgB5D,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLocalStorage.d.ts","sourceRoot":"","sources":["../../src/hooks/useLocalStorage.ts"],"names":[],"mappings":"AAEA,wBAAgB,eAAe,CAAC,CAAC,EAC/B,GAAG,EAAE,MAAM,EACX,YAAY,EAAE,CAAC,GACd,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,CAAC,CA+C3C"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../src/hooks/useMediaQuery.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CA4BpD"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export { AnimatedResizableLayout, type AnimatedResizableLayoutProps } from './components/AnimatedResizableLayout';
|
|
2
|
+
export { AnimatedVerticalLayout, type AnimatedVerticalLayoutProps } from './components/AnimatedVerticalLayout';
|
|
3
|
+
export { ThreePanelLayout, type ThreePanelLayoutProps } from './components/ThreePanelLayout';
|
|
4
|
+
export { ConfigurablePanelLayout, type ConfigurablePanelLayoutProps, type PanelDefinitionWithContent } from './components/ConfigurablePanelLayout';
|
|
5
|
+
export { ResponsiveConfigurablePanelLayout, type ResponsiveConfigurablePanelLayoutProps } from './components/ResponsiveConfigurablePanelLayout';
|
|
6
|
+
export { EditableConfigurablePanelLayout, type EditableConfigurablePanelLayoutProps } from './components/EditableConfigurablePanelLayout';
|
|
7
|
+
export { PanelConfigurator, type PanelConfiguratorProps, type PanelDefinition, type PanelLayout, type PanelSlot, type PanelGroup, type TabsConfig, type TilesConfig } from './components/PanelConfigurator';
|
|
8
|
+
export { TabGroup, type TabGroupProps } from './components/TabGroup';
|
|
9
|
+
export { SnapCarousel, type SnapCarouselProps, type SnapCarouselRef } from './components/SnapCarousel';
|
|
10
|
+
export type { PanelOrientation, CollapsibleSide, ThemeMode, AnimationConfig, CollapseButtonConfig, PanelCallbacks, } from './types';
|
|
11
|
+
export { type Theme } from '@principal-ade/industry-theme';
|
|
12
|
+
export { mapThemeToPanelVars, mapThemeToTabVars } from './utils/themeMapping';
|
|
13
|
+
export { useMediaQuery } from './hooks/useMediaQuery';
|
|
14
|
+
export { useLocalStorage } from './hooks/useLocalStorage';
|
|
15
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,MAAM,sCAAsC,CAAC;AAClH,OAAO,EAAE,sBAAsB,EAAE,KAAK,2BAA2B,EAAE,MAAM,qCAAqC,CAAC;AAC/G,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAC7F,OAAO,EAAE,uBAAuB,EAAE,KAAK,4BAA4B,EAAE,KAAK,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AACnJ,OAAO,EAAE,iCAAiC,EAAE,KAAK,sCAAsC,EAAE,MAAM,gDAAgD,CAAC;AAChJ,OAAO,EAAE,+BAA+B,EAAE,KAAK,oCAAoC,EAAE,MAAM,8CAA8C,CAAC;AAC1I,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,KAAK,eAAe,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAE,KAAK,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC5M,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAGvG,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,SAAS,EACT,eAAe,EACf,oBAAoB,EACpB,cAAc,GACf,MAAM,SAAS,CAAC;AAGjB,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import r,{useState as o,useRef as i,useCallback as a,useEffect as l,forwardRef as s,useImperativeHandle as c,useMemo as d,useLayoutEffect as u,createContext as p,memo as h,useReducer as m,useContext as f}from"react";import{PanelGroup as g,Panel as v,PanelResizeHandle as b}from"react-resizable-panels";import{flushSync as y,unstable_batchedUpdates as w,createPortal as x}from"react-dom";function S(e){return{"--panel-background":e.colors.background,"--panel-border":e.colors.border,"--panel-handle":e.colors.backgroundSecondary,"--panel-handle-hover":e.colors.backgroundHover,"--panel-handle-active":e.colors.primary,"--panel-button-bg":e.colors.surface,"--panel-button-hover":e.colors.backgroundHover,"--panel-button-border":e.colors.border,"--panel-button-icon":e.colors.textSecondary,"--panel-accent-bg":e.colors.primary+"15"}}function C(e){return{"--tab-list-bg":e.colors.backgroundSecondary,"--tab-border":e.colors.border,"--tab-bg":e.colors.surface,"--tab-bg-hover":e.colors.backgroundHover,"--tab-bg-active":e.colors.primary,"--tab-text":e.colors.text,"--tab-text-active":e.colors.background,"--tab-border-hover":e.colors.textSecondary,"--tab-border-active":e.colors.primary,"--tab-focus":e.colors.primary,"--tab-content-bg":e.colors.background,"--tab-empty-text":e.colors.textMuted}}const R=({leftPanel:n,rightPanel:r,collapsibleSide:s="left",defaultSize:c=25,minSize:d=5,className:u="",collapsed:p=!1,style:h,showCollapseButton:m=!1,animationDuration:f=300,animationEasing:y="cubic-bezier(0.4, 0, 0.2, 1)",onCollapseStart:w,onCollapseComplete:x,onExpandStart:C,onExpandComplete:R,theme:N})=>{const[E,z]=o(p),[D,M]=o(!1),[A,T]=o(!1),[k,L]=o(p),[F,$]=o(p?0:c),P=i(null),B=i(void 0),O=i(void 0),I=i(void 0),q=a((e,t,n)=>{if(!P.current)return;B.current&&cancelAnimationFrame(B.current),O.current=performance.now();const r=o=>{if(!O.current||!P.current)return;const i=o-O.current,a=Math.min(i/f,1),l=a<.5?4*a*a*a:1-Math.pow(-2*a+2,3)/2,s=e+(t-e)*l;P.current.resize(s),a<1?B.current=requestAnimationFrame(r):(0===t?P.current.collapse():P.current.resize(t),M(!1),n&&n())};B.current=requestAnimationFrame(r)},[f]),W=a(()=>{D||A||(M(!0),z(!0),w&&w(),q(F,0,()=>{$(0),L(!0),x&&x()}))},[D,A,F,q,w,x]),_=a(()=>{D||A||(M(!0),z(!1),L(!1),C&&C(),q(0,c,()=>{$(c),R&&R()}))},[D,A,c,q,C,R]),j=a(()=>{E?_():W()},[E,W,_]),H=a(e=>{D||($(e),e>0&&z(!1))},[D]),K=a(()=>{T(!0)},[]),U=a(()=>{T(!1)},[]);l(()=>{p!==E&&(p?W():_())},[p]),l(()=>{p&&!D?L(!0):p||D||L(!1)},[p,D]),l(()=>{const e=B.current,t=I.current;return()=>{e&&cancelAnimationFrame(e),t&&clearTimeout(t)}},[]);const V="left"===s,X=E?V?"▸":"◂":V?"◂":"▸",Y=S(N),J=D&&!A?{transition:`flex ${f}ms ${y}`}:void 0,G=e=>{let t="hybrid-panel";return e&&(t+=" collapsible-panel",D&&!A&&(t+=" animating"),E&&(t+=" collapsed")),t};/* @__PURE__ */
|
|
2
|
+
return e("div",{className:`animated-resizable-layout ${u}`,style:{...Y,...h},children:/* @__PURE__ */t(g,{direction:"horizontal",onLayout:U,children:[
|
|
3
|
+
/* @__PURE__ */e(v,{ref:V?P:void 0,collapsible:V,defaultSize:V?p?0:c:void 0,minSize:V?d:30,collapsedSize:0,onResize:V?H:void 0,onCollapse:V?()=>z(!0):void 0,onExpand:V?()=>z(!1):void 0,className:G(V),style:V?J:void 0,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:V&&E?0:1,transition:D?`opacity ${.5*f}ms ${y}`:"none"},children:n})}),
|
|
4
|
+
/* @__PURE__ */e(b,{className:"resize-handle "+(k?"collapsed":""),onDragging:K,style:k?{visibility:"hidden",width:0}:void 0,children:m&&/* @__PURE__ */e("div",{className:"handle-bar",children:/* @__PURE__ */e("button",{onClick:j,className:"collapse-toggle",disabled:D,"aria-label":E?"Expand panel":"Collapse panel",children:X})})}),
|
|
5
|
+
/* @__PURE__ */e(v,{ref:V?void 0:P,collapsible:!V,defaultSize:V?void 0:p?0:c,minSize:V?30:d,collapsedSize:0,onResize:V?void 0:H,onCollapse:V?void 0:()=>z(!0),onExpand:V?void 0:()=>z(!1),className:G(!V),style:V?void 0:J,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:!V&&E?0:1,transition:D?`opacity ${.5*f}ms ${y}`:"none"},children:r})})]})})},N=({topPanel:n,bottomPanel:r,collapsiblePanels:s={top:!0,bottom:!0},defaultSizes:c={top:30,bottom:30},minSizes:d={top:5,bottom:5},className:u="",collapsed:p={top:!1,bottom:!1},style:h,showCollapseButtons:m=!1,animationDuration:f=300,animationEasing:y="cubic-bezier(0.4, 0, 0.2, 1)",theme:w,onTopCollapseStart:x,onTopCollapseComplete:C,onTopExpandStart:R,onTopExpandComplete:N,onBottomCollapseStart:E,onBottomCollapseComplete:z,onBottomExpandStart:D,onBottomExpandComplete:M,onPanelResize:A})=>{const[T,k]=o(p.top||!1),[L,F]=o(!1),[$,P]=o(p.top?0:c.top),B=i(null),O=i(void 0),I=i(void 0),[q,W]=o(p.bottom||!1),[_,j]=o(!1),[H,K]=o(p.bottom?0:c.bottom),U=i(null),V=i(void 0),X=i(void 0),[Y,J]=o(!1),G=a((e,t,n)=>{if(!B.current)return;O.current&&cancelAnimationFrame(O.current),I.current=performance.now();const r=o=>{if(!I.current||!B.current)return;const i=o-I.current,a=Math.min(i/f,1),l=a<.5?4*a*a*a:1-Math.pow(-2*a+2,3)/2,s=e+(t-e)*l;B.current.resize(s),a<1?O.current=requestAnimationFrame(r):(0===t?B.current.collapse():B.current.resize(t),F(!1),n&&n())};O.current=requestAnimationFrame(r)},[f]),Q=a((e,t,n)=>{if(!U.current)return;V.current&&cancelAnimationFrame(V.current),X.current=performance.now();const r=o=>{if(!X.current||!U.current)return;const i=o-X.current,a=Math.min(i/f,1),l=a<.5?4*a*a*a:1-Math.pow(-2*a+2,3)/2,s=e+(t-e)*l;U.current.resize(s),a<1?V.current=requestAnimationFrame(r):(0===t?U.current.collapse():U.current.resize(t),j(!1),n&&n())};V.current=requestAnimationFrame(r)},[f]),Z=a(()=>{L||Y||!s.top||(F(!0),k(!0),x&&x(),G($,0,()=>{P(0),C&&C()}))},[L,Y,$,s.top,G,x,C]),ee=a(()=>{L||Y||!s.top||(F(!0),k(!1),R&&R(),G(0,c.top,()=>{P(c.top),N&&N()}))},[L,Y,c.top,s.top,G,R,N]),te=a(()=>{T?ee():Z()},[T,Z,ee]),ne=a(()=>{_||Y||!s.bottom||(j(!0),W(!0),E&&E(),Q(H,0,()=>{K(0),z&&z()}))},[_,Y,H,s.bottom,Q,E,z]),re=a(()=>{_||Y||!s.bottom||(j(!0),W(!1),D&&D(),Q(0,c.bottom,()=>{K(c.bottom),M&&M()}))},[_,Y,c.bottom,s.bottom,Q,D,M]),oe=a(()=>{q?re():ne()},[q,ne,re]),ie=a(e=>{L||(P(e),e>0&&k(!1))},[L]),ae=a(e=>{_||(K(e),e>0&&W(!1))},[_]),le=a(()=>{J(!0)},[]),se=a(()=>{J(!1),A&&A({top:$,bottom:H})},[$,H,A]);l(()=>{void 0!==p.top&&p.top!==T&&(p.top?Z():ee())},[p.top]),l(()=>{void 0!==p.bottom&&p.bottom!==q&&(p.bottom?ne():re())},[p.bottom]),l(()=>()=>{O.current&&cancelAnimationFrame(O.current),V.current&&cancelAnimationFrame(V.current)},[]);const ce=S(w),de=L&&!Y?{transition:`flex ${f}ms ${y}`}:void 0,ue=_&&!Y?{transition:`flex ${f}ms ${y}`}:void 0;/* @__PURE__ */
|
|
6
|
+
return e("div",{className:`animated-vertical-layout ${u}`,style:{...ce,...h},children:/* @__PURE__ */t(g,{direction:"vertical",onLayout:se,children:[
|
|
7
|
+
/* @__PURE__ */e(v,{ref:B,collapsible:s.top,defaultSize:p.top?0:c.top,minSize:d.top,collapsedSize:0,onResize:ie,onCollapse:()=>k(!0),onExpand:()=>k(!1),className:(()=>{let e="vertical-panel collapsible-panel";return L&&!Y&&(e+=" animating"),T&&(e+=" collapsed"),e})(),style:de,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:T?0:1,transition:L?`opacity ${.5*f}ms ${y}`:"none"},children:n})}),
|
|
8
|
+
/* @__PURE__ */e(b,{className:"vertical-resize-handle",onDragging:le,children:m&&/* @__PURE__ */t("div",{className:"handle-bar",children:[s.top&&/* @__PURE__ */e("button",{onClick:te,className:"collapse-toggle collapse-toggle-top",disabled:L,"aria-label":T?"Expand top panel":"Collapse top panel",children:T?"▾":"▴"}),s.bottom&&/* @__PURE__ */e("button",{onClick:oe,className:"collapse-toggle collapse-toggle-bottom",disabled:_,"aria-label":q?"Expand bottom panel":"Collapse bottom panel",children:q?"▴":"▾"})]})}),
|
|
9
|
+
/* @__PURE__ */e(v,{ref:U,collapsible:s.bottom,defaultSize:p.bottom?0:c.bottom,minSize:d.bottom,collapsedSize:0,onResize:ae,onCollapse:()=>W(!0),onExpand:()=>W(!1),className:(()=>{let e="vertical-panel collapsible-panel";return _&&!Y&&(e+=" animating"),q&&(e+=" collapsed"),e})(),style:ue,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:q?0:1,transition:_?`opacity ${.5*f}ms ${y}`:"none"},children:r})})]})})},E=({leftPanel:n,middlePanel:r,rightPanel:s,collapsiblePanels:c={left:!0,right:!0},defaultSizes:d={left:20,middle:60,right:20},minSizes:u={left:5,middle:10,right:5},className:p="",collapsed:h={left:!1,right:!1},style:m,showCollapseButtons:f=!1,animationDuration:w=300,animationEasing:x="cubic-bezier(0.4, 0, 0.2, 1)",theme:C,onLeftCollapseStart:R,onLeftCollapseComplete:N,onLeftExpandStart:E,onLeftExpandComplete:z,onRightCollapseStart:D,onRightCollapseComplete:M,onRightExpandStart:A,onRightExpandComplete:T,onPanelResize:k})=>{const[L,F]=o(h.left||!1),[$,P]=o(h.right||!1),[B,O]=o(!1),[I,q]=o(!1),[W,_]=o(!1),j=L&&!B,H=$&&!I,[K,U]=o(h.left?0:d.left),[V,X]=o(h.right?0:d.right),Y=i(null),J=i(null),G=i(null),Q=i(void 0),Z=i(void 0),ee=i(void 0),te=i(void 0),ne=a((e,t,n,r,o,i)=>{if(!e.current)return;r.current&&cancelAnimationFrame(r.current),o.current=performance.now();let a=0;const l=()=>{if(!e.current||!o.current)return;a++;const s=a/10;if(s>=1)return 0===n?e.current.collapse():e.current.resize(n),void(i&&i());const c=s<.5?4*s*s*s:1-Math.pow(-2*s+2,3)/2,d=t+(n-t)*c;e.current.resize(d),r.current=requestAnimationFrame(()=>{setTimeout(l,w/10)})};l()},[w]),re=a(()=>{B||W||!c.left||(y(()=>{O(!0),F(!0)}),R&&R(),Q.current&&cancelAnimationFrame(Q.current),Q.current=requestAnimationFrame(()=>{const e=Y.current?.getLayout(),t=Math.round(1e3*(e?.[0]??K))/1e3;ne(J,t,0,Q,ee,()=>{U(0),O(!1),N&&N()})}))},[B,W,K,c.left,ne,R,N]),oe=a(()=>{B||W||!c.left||(y(()=>{O(!0),F(!1)}),E&&E(),Q.current&&cancelAnimationFrame(Q.current),Q.current=requestAnimationFrame(()=>{ne(J,0,d.left,Q,ee,()=>{U(d.left),O(!1),z&&z()})}))},[B,W,d.left,c.left,ne,E,z]),ie=a(()=>{I||W||!c.right||(y(()=>{q(!0),P(!0)}),D&&D(),Z.current&&cancelAnimationFrame(Z.current),Z.current=requestAnimationFrame(()=>{const e=Y.current?.getLayout(),t=Math.round(1e3*(e?.[2]??V))/1e3;ne(G,t,0,Z,te,()=>{X(0),q(!1),M&&M()})}))},[I,W,V,c.right,ne,D,M]),ae=a(()=>{I||W||!c.right||(y(()=>{q(!0),P(!1)}),A&&A(),Z.current&&cancelAnimationFrame(Z.current),Z.current=requestAnimationFrame(()=>{ne(G,0,d.right,Z,te,()=>{X(d.right),q(!1),T&&T()})}))},[I,W,d.right,c.right,ne,A,T]),le=a(()=>{L?oe():re()},[L,re,oe]),se=a(()=>{$?ae():ie()},[$,ie,ae]),ce=a(e=>{B||I||(U(e),e>0&&F(!1))},[B,I]),de=a(e=>{B||I||(X(e),e>0&&P(!1))},[B,I]),ue=a(()=>{k&&k({left:K,middle:100-K-V,right:V})},[K,V,k]),pe=a(e=>{_(e),e||ue()},[ue]);l(()=>{void 0!==h.left&&h.left!==L&&queueMicrotask(()=>{h.left?re():oe()})},[h.left,L,re,oe]),l(()=>{void 0!==h.right&&h.right!==$&&queueMicrotask(()=>{h.right?ie():ae()})},[h.right,$,ie,ae]),l(()=>()=>{Q.current&&cancelAnimationFrame(Q.current),Z.current&&cancelAnimationFrame(Z.current)},[]);const he=e=>{let t="three-panel-item";return"left"===e&&c.left?(t+=" collapsible-panel",B&&!W&&(t+=" animating"),j&&(t+=" collapsed")):"right"===e&&c.right?(t+=" collapsible-panel",I&&!W&&(t+=" animating"),H&&(t+=" collapsed")):"middle"===e&&(t+=" middle-panel"),t},me=B&&!W?{transition:`width ${w}ms ${x}`,width:L?"0%":`${d.left}%`}:void 0,fe=I&&!W?{transition:`width ${w}ms ${x}`,width:$?"0%":`${d.right}%`}:void 0,ge=S(C),ve=B||I?0:u.left,be=B||I?0:u.right;/* @__PURE__ */
|
|
10
|
+
return e("div",{className:`three-panel-layout ${p}`,style:{...ge,...m},children:/* @__PURE__ */t(g,{ref:Y,direction:"horizontal",onLayout:ue,children:[
|
|
11
|
+
/* @__PURE__ */e(v,{ref:J,collapsible:c.left,defaultSize:h.left?0:d.left,minSize:ve,collapsedSize:0,onResize:ce,onCollapse:()=>F(!0),onExpand:()=>F(!1),className:he("left"),style:me,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:L?0:1,transition:B?`opacity ${.5*w}ms ${x}`:"none"},children:n})}),
|
|
12
|
+
/* @__PURE__ */e(b,{className:"resize-handle left-handle "+(j?"collapsed":""),onDragging:pe,disabled:j,children:f&&c.left&&/* @__PURE__ */e("div",{className:"handle-bar",children:/* @__PURE__ */e("button",{onClick:le,className:"collapse-toggle",disabled:B,"aria-label":L?"Expand left panel":"Collapse left panel",children:L?"▸":"◂"})})}),
|
|
13
|
+
/* @__PURE__ */e(v,{defaultSize:d.middle,minSize:u.middle,className:he("middle"),children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",children:r})}),
|
|
14
|
+
/* @__PURE__ */e(b,{className:"resize-handle right-handle "+(H?"collapsed":""),onDragging:pe,disabled:H,children:f&&c.right&&/* @__PURE__ */e("div",{className:"handle-bar",children:/* @__PURE__ */e("button",{onClick:se,className:"collapse-toggle",disabled:I,"aria-label":$?"Expand right panel":"Collapse right panel",children:$?"◂":"▸"})})}),
|
|
15
|
+
/* @__PURE__ */e(v,{ref:G,collapsible:c.right,defaultSize:h.right?0:d.right,minSize:be,collapsedSize:0,onResize:de,onCollapse:()=>P(!0),onExpand:()=>P(!1),className:he("right"),style:fe,children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:$?0:1,transition:I?`opacity ${.5*w}ms ${x}`:"none"},children:s})})]})})},z=({panelIds:r,panels:i,config:a={},className:s="",theme:c})=>{const{defaultActiveTab:d=0,tabPosition:u="top",centered:p=!0,hideTabList:h=!1,activeTabIndex:m,onTabChange:f}=a,[g,v]=o(d),b=void 0!==m,y=b?m:g;l(()=>{b||v(d)},[d,b]);const w=C(c),x=r.map(e=>i.find(t=>t.id===e)).filter(e=>void 0!==e),S=Math.min(y,x.length-1),R=x[S];if(0===x.length)/* @__PURE__ */
|
|
16
|
+
return e("div",{className:"tab-group-empty",children:"No panels available"});const N=/* @__PURE__ */e("div",{className:"tab-list "+("top"===u||"bottom"===u||p?"centered":""),role:"tablist",children:x.map((r,o)=>/* @__PURE__ */e("button",{role:"tab","aria-selected":o===S,"aria-controls":`tabpanel-${r.id}`,id:`tab-${r.id}`,className:"tab-button "+(o===S?"active":""),onClick:()=>(e=>{b||v(e),f?.(e)})(o),title:r.icon?r.label:void 0,children:r.icon?/* @__PURE__ */t(n,{children:[
|
|
17
|
+
/* @__PURE__ */e("span",{className:"tab-icon",children:r.icon}),
|
|
18
|
+
/* @__PURE__ */e("span",{className:"tab-label",children:r.label})]}):r.label},r.id))}),E=R?/* @__PURE__ */e("div",{className:"tab-content",role:"tabpanel",id:`tabpanel-${R.id}`,"aria-labelledby":`tab-${R.id}`,children:R.content}):null;/* @__PURE__ */
|
|
19
|
+
return t("div",{className:`tab-group tab-position-${u} ${s}`,style:w,children:[!h&&("top"===u||"left"===u)&&N,E,!h&&("bottom"===u||"right"===u)&&N]})},D=({panels:n,layout:r,slotDataAttributes:s={},collapsiblePanels:c={left:!0,middle:!1,right:!0},defaultSizes:d={left:20,middle:60,right:20},minSizes:u={left:5,middle:10,right:5},className:p="",collapsed:h={left:!1,middle:!1,right:!1},style:m,showCollapseButtons:f=!1,animationDuration:w=300,animationEasing:x="cubic-bezier(0.4, 0, 0.2, 1)",theme:C,onLeftCollapseStart:R,onLeftCollapseComplete:N,onLeftExpandStart:E,onLeftExpandComplete:D,onMiddleCollapseStart:M,onMiddleCollapseComplete:A,onMiddleExpandStart:T,onMiddleExpandComplete:k,onRightCollapseStart:L,onRightCollapseComplete:F,onRightExpandStart:$,onRightExpandComplete:P,onPanelResize:B})=>{const O=null!==r.left&&void 0!==r.left,I=null!==r.middle&&void 0!==r.middle,q=null!==r.right&&void 0!==r.right,W=[O,I,q].filter(Boolean).length,_={left:O?d?.left??(2===W?50:3===W?20:100):0,middle:I?d?.middle??(2===W?50:3===W?60:100):0,right:q?d?.right??(2===W?50:3===W?20:100):0},j={left:u?.left??5,middle:u?.middle??10,right:u?.right??5},[H,K]=o(h.left||!O),[U,V]=o(h.middle||!I),[X,Y]=o(h.right||!q),[J,G]=o(!1),[Q,Z]=o(!1),[ee,te]=o(!1),[ne,re]=o(!1),oe=H&&!J,ie=U&&!Q,ae=X&&!ee,le=a(e=>{if(!e)return null;const t=n.find(t=>t.id===e);return t?.content||null},[n]),se=a(t=>{if(null===t)return null;if("object"==typeof t&&"type"in t){const r=t;return"tabs"===r.type?/* @__PURE__ */e(z,{panelIds:r.panels,panels:n,config:r.config,theme:C}):null}return le(t)},[n,le,C]),ce=se(r.left??null),de=se(r.middle??null),ue=se(r.right??null),[pe,he]=o(h.left||!O?0:_.left),[me,fe]=o(h.middle||!I?0:_.middle),[ge,ve]=o(h.right||!q?0:_.right),[be,ye]=o(_.left),[we,xe]=o(_.middle),[Se,Ce]=o(_.right),Re=i(null),Ne=i(null),Ee=i(null),ze=i(null),De=i(void 0),Me=i(void 0),Ae=i(void 0),Te=i(void 0),ke=i(void 0),Le=i(void 0),Fe=a((e,t)=>{const n=e.filter(e=>e.panelRef.current);if(0===n.length)return;n.forEach(e=>{e.animationFrameRef.current&&cancelAnimationFrame(e.animationFrameRef.current)});let r=0;const o=()=>{r++;const e=r/10;if(e>=1)return n.forEach(e=>{e.panelRef.current&&(0===e.toSize?e.panelRef.current.collapse():e.panelRef.current.resize(e.toSize))}),void(t&&t());const i=e<.5?4*e*e*e:1-Math.pow(-2*e+2,3)/2;n.forEach(e=>{if(e.panelRef.current){const t=e.fromSize+(e.toSize-e.fromSize)*i;e.panelRef.current.resize(t)}}),n[0].animationFrameRef.current=requestAnimationFrame(()=>{setTimeout(o,w/10)})};o()},[w]),$e=a(()=>{J||ne||!c.left||(y(()=>{G(!0),Z(!0),te(!0),K(!0)}),R&&R(),De.current&&cancelAnimationFrame(De.current),De.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??pe))/1e3,n=Math.round(1e3*(e?.[1]??me))/1e3,r=Math.round(1e3*(e?.[2]??ge))/1e3,o=n+r,i=o>0?n/o*100:I?50:0,a=o>0?r/o*100:q?50:0;i>0&&xe(i),a>0&&Ce(a),Fe([{panelRef:Ne,fromSize:t,toSize:0,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:i,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:a,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(0),fe(i),ve(a),G(!1),Z(!1),te(!1),N&&N()})}))},[J,ne,pe,me,ge,I,q,c.left,Fe,R,N]),Pe=a(()=>{J||ne||!c.left||(y(()=>{G(!0),Z(!0),te(!0),K(!1)}),E&&E(),De.current&&cancelAnimationFrame(De.current),De.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??0))/1e3,n=Math.round(1e3*(e?.[1]??me))/1e3,r=Math.round(1e3*(e?.[2]??ge))/1e3,o=be||_.left,i=100-o,a=n+r,l=a>0?n/a*i:I?i/2:0,s=a>0?r/a*i:q?i/2:0;l>0&&xe(l),s>0&&Ce(s),Fe([{panelRef:Ne,fromSize:t,toSize:o,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:l,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:s,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(o),fe(l),ve(s),G(!1),Z(!1),te(!1),D&&D()})}))},[J,ne,me,ge,_.left,be,I,q,c.left,Fe,E,D]),Be=a(()=>{ee||ne||!c.right||(y(()=>{G(!0),Z(!0),te(!0),Y(!0)}),L&&L(),Ae.current&&cancelAnimationFrame(Ae.current),Ae.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??pe))/1e3,n=Math.round(1e3*(e?.[1]??me))/1e3,r=Math.round(1e3*(e?.[2]??ge))/1e3,o=t+n,i=o>0?t/o*100:O?50:0,a=o>0?n/o*100:I?50:0;i>0&&ye(i),a>0&&xe(a),Fe([{panelRef:Ne,fromSize:t,toSize:i,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:a,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:0,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(i),fe(a),ve(0),G(!1),Z(!1),te(!1),F&&F()})}))},[ee,ne,pe,me,ge,O,I,c.right,Fe,L,F]),Oe=a(()=>{ee||ne||!c.right||(y(()=>{G(!0),Z(!0),te(!0),Y(!1)}),$&&$(),Ae.current&&cancelAnimationFrame(Ae.current),Ae.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??pe))/1e3,n=Math.round(1e3*(e?.[1]??me))/1e3,r=Math.round(1e3*(e?.[2]??0))/1e3,o=Se||_.right,i=100-o,a=t+n,l=a>0?t/a*i:O?i/2:0,s=a>0?n/a*i:I?i/2:0;l>0&&ye(l),s>0&&xe(s),Fe([{panelRef:Ne,fromSize:t,toSize:l,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:s,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:o,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(l),fe(s),ve(o),G(!1),Z(!1),te(!1),P&&P()})}))},[ee,ne,pe,me,_.right,Se,O,I,c.right,Fe,$,P]),Ie=a(()=>{H?Pe():$e()},[H,$e,Pe]),qe=a(()=>{Q||ne||!c.middle||(y(()=>{G(!0),Z(!0),te(!0),V(!0)}),M&&M(),Me.current&&cancelAnimationFrame(Me.current),Me.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??pe))/1e3,n=Math.round(1e3*(e?.[1]??me))/1e3,r=Math.round(1e3*(e?.[2]??ge))/1e3,o=t+r,i=o>0?t/o*100:O?50:0,a=o>0?r/o*100:q?50:0;i>0&&ye(i),a>0&&Ce(a),Fe([{panelRef:Ne,fromSize:t,toSize:i,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:0,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:a,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(i),fe(0),ve(a),G(!1),Z(!1),te(!1),A&&A()})}))},[Q,ne,pe,me,ge,O,q,c.middle,Fe,M,A]),We=a(()=>{Q||ne||!c.middle||(y(()=>{G(!0),Z(!0),te(!0),V(!1)}),T&&T(),Me.current&&cancelAnimationFrame(Me.current),Me.current=requestAnimationFrame(()=>{const e=Re.current?.getLayout(),t=Math.round(1e3*(e?.[0]??pe))/1e3,n=Math.round(1e3*(e?.[1]??0))/1e3,r=Math.round(1e3*(e?.[2]??ge))/1e3,o=we||_.middle,i=100-o,a=t+r,l=a>0?t/a*i:O?i/2:0,s=a>0?r/a*i:q?i/2:0;l>0&&ye(l),s>0&&Ce(s),Fe([{panelRef:Ne,fromSize:t,toSize:l,animationFrameRef:De,startTimeRef:Te},{panelRef:Ee,fromSize:n,toSize:o,animationFrameRef:Me,startTimeRef:ke},{panelRef:ze,fromSize:r,toSize:s,animationFrameRef:Ae,startTimeRef:Le}],()=>{he(l),fe(o),ve(s),G(!1),Z(!1),te(!1),k&&k()})}))},[Q,ne,pe,ge,_.middle,we,O,q,c.middle,Fe,T,k]),_e=a(()=>{X?Oe():Be()},[X,Be,Oe]),je=a(e=>{J||Q||ee||(he(e),e>0&&(ye(e),K(!1)))},[J,Q,ee]),He=a(e=>{J||Q||ee||(fe(e),e>0&&(xe(e),V(!1)))},[J,Q,ee]),Ke=a(e=>{J||Q||ee||(ve(e),e>0&&(Ce(e),Y(!1)))},[J,Q,ee]),Ue=a(()=>{if(B){B({left:H?be:pe,middle:U?we:me,right:X?Se:ge})}},[pe,me,ge,H,U,X,be,we,Se,B]),Ve=a(e=>{re(e),e||Ue()},[Ue]);l(()=>{void 0!==h.left&&h.left!==H&&queueMicrotask(()=>{h.left?$e():Pe()})},[h.left,H,$e,Pe]),l(()=>{void 0!==h.middle&&h.middle!==U&&queueMicrotask(()=>{h.middle?qe():We()})},[h.middle,U,qe,We]),l(()=>{void 0!==h.right&&h.right!==X&&queueMicrotask(()=>{h.right?Be():Oe()})},[h.right,X,Be,Oe]),l(()=>()=>{De.current&&cancelAnimationFrame(De.current),Me.current&&cancelAnimationFrame(Me.current),Ae.current&&cancelAnimationFrame(Ae.current)},[]);const Xe=e=>{let t="three-panel-item";return"left"===e?!c.left&&O||(t+=" collapsible-panel",J&&!ne&&(t+=" animating"),oe&&(t+=" collapsed")):"middle"===e?(t+=" middle-panel",!c.middle&&I||(t+=" collapsible-panel",Q&&!ne&&(t+=" animating"),ie&&(t+=" collapsed"))):"right"===e&&(!c.right&&q||(t+=" collapsible-panel",ee&&!ne&&(t+=" animating"),ae&&(t+=" collapsed"))),t},Ye=J&&!ne?{transition:`width ${w}ms ${x}`,width:H?"0%":`${_.left}%`}:void 0,Je=Q&&!ne?{transition:`width ${w}ms ${x}`,width:U?"0%":`${_.middle}%`}:void 0,Ge=ee&&!ne?{transition:`width ${w}ms ${x}`,width:X?"0%":`${_.right}%`}:void 0,Qe=S(C),Ze=J||Q||ee?0:j.left,et=J||Q||ee?0:j.middle,tt=J||Q||ee?0:j.right;/* @__PURE__ */
|
|
20
|
+
return e("div",{className:`three-panel-layout ${p}`,style:{...Qe,...m},children:/* @__PURE__ */t(g,{ref:Re,direction:"horizontal",onLayout:Ue,children:[
|
|
21
|
+
/* @__PURE__ */e(v,{ref:Ne,collapsible:c.left||!O,defaultSize:h.left||!O?0:_.left,minSize:Ze,collapsedSize:0,onResize:je,onCollapse:()=>K(!0),onExpand:()=>K(!1),className:Xe("left"),style:Ye,...s.left||{},children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:H?0:1,transition:J?`opacity ${.5*w}ms ${x}`:"none"},children:ce})}),
|
|
22
|
+
/* @__PURE__ */e(b,{className:"resize-handle left-handle "+(!oe&&O&&I?"":"collapsed"),onDragging:Ve,disabled:oe||!O||!I,children:f&&c.left&&/* @__PURE__ */e("div",{className:"handle-bar",children:/* @__PURE__ */e("button",{onClick:Ie,className:"collapse-toggle",disabled:J,"aria-label":H?"Expand left panel":"Collapse left panel",children:H?"▸":"◂"})})}),
|
|
23
|
+
/* @__PURE__ */e(v,{ref:Ee,collapsible:c.middle||!I,defaultSize:h.middle||!I?0:_.middle,minSize:et,collapsedSize:0,onResize:He,onCollapse:()=>V(!0),onExpand:()=>V(!1),className:Xe("middle"),style:Je,...s.middle||{},children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:U?0:1,transition:Q?`opacity ${.5*w}ms ${x}`:"none"},children:de})}),
|
|
24
|
+
/* @__PURE__ */e(b,{className:"resize-handle right-handle "+(ae||!q||!I&&!O?"collapsed":""),onDragging:Ve,disabled:ae||!q||!I&&!O,children:f&&c.right&&/* @__PURE__ */e("div",{className:"handle-bar",children:/* @__PURE__ */e("button",{onClick:_e,className:"collapse-toggle",disabled:ee,"aria-label":X?"Expand right panel":"Collapse right panel",children:X?"◂":"▸"})})}),
|
|
25
|
+
/* @__PURE__ */e(v,{ref:ze,collapsible:c.right||!q,defaultSize:h.right||!q?0:_.right,minSize:tt,collapsedSize:0,onResize:Ke,onCollapse:()=>Y(!0),onExpand:()=>Y(!1),className:Xe("right"),style:Ge,...s.right||{},children:/* @__PURE__ */e("div",{className:"panel-content-wrapper",style:{opacity:X?0:1,transition:ee?`opacity ${.5*w}ms ${x}`:"none"},children:ue})})]})})},M=s(({panels:o,className:a="",style:s,theme:d,minPanelWidth:u=350,idealPanelWidth:p=.333,showSeparator:h=!1,onPanelChange:m,preventKeyboardScroll:f=!0},g)=>{const v=i(null),b=S(d);c(g,()=>({scrollToPanel:e=>{if(!v.current)return;const t=v.current,n=t.children[e];if(n){const e=n.offsetLeft;t.scrollTo({left:e,behavior:"smooth"})}},getCurrentPanel:()=>{if(!v.current||0===v.current.children.length)return 0;const e=v.current,t=e.getBoundingClientRect().left;let n=0,r=1/0;for(let o=0;o<e.children.length;o++){const i=e.children[o].getBoundingClientRect(),a=Math.abs(i.left-t);a<r&&(r=a,n=o)}return n}}));l(()=>{if(!f||!v.current)return;const e=v.current,t=e=>{const t=e.target;if("INPUT"===t.tagName||"TEXTAREA"===t.tagName||"SELECT"===t.tagName||t.isContentEditable||null!==t.closest(".xterm")||null!==t.closest('[contenteditable="true"]'))return;[" ","Space","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","PageUp","PageDown"].includes(e.key)&&e.preventDefault()};return e.addEventListener("keydown",t),()=>{e.removeEventListener("keydown",t)}},[f]);const y=o.length,w=2*u;let x;x=1===y||2===y?"100%":`max(${u}px, ${100*p}%)`;const C=r.useId().replace(/:/g,"_");/* @__PURE__ */
|
|
26
|
+
return t(n,{children:[2===y&&/* @__PURE__ */e("style",{children:`\n .snap-carousel-container[data-carousel-id="${C}"][data-panel-count="2"] .snap-carousel-panel {\n width: 100%;\n }\n @container (min-width: ${w}px) {\n .snap-carousel-container[data-carousel-id="${C}"][data-panel-count="2"] .snap-carousel-panel {\n width: 50%;\n }\n }\n `}),
|
|
27
|
+
/* @__PURE__ */e("div",{ref:v,className:`snap-carousel-container ${a}`,style:{...b,...s,"--snap-carousel-min-width":`${u}px`,"--snap-carousel-ideal-width":100*p+"%","--snap-carousel-gap":h?"1px":"0px","--snap-carousel-panel-width":x,"--snap-carousel-panel-count":y,"--snap-carousel-two-panel-threshold":`${w}px`},onScroll:e=>{if(!m||!v.current||0===v.current.children.length)return;const t=v.current,n=t.getBoundingClientRect().left;let r=0,o=1/0;for(let i=0;i<t.children.length;i++){const e=t.children[i].getBoundingClientRect(),a=Math.abs(e.left-n);a<o&&(o=a,r=i)}m(r)},"data-panel-count":y,"data-carousel-id":C,children:o.map((t,n)=>/* @__PURE__ */e("div",{className:"snap-carousel-panel",children:t},n))})]})});function A(e){const[t,n]=o(()=>"undefined"!=typeof window&&window.matchMedia(e).matches);return l(()=>{if("undefined"==typeof window)return;const t=window.matchMedia(e),r=e=>{n(e.matches)};return n(t.matches),t.addEventListener?(t.addEventListener("change",r),()=>t.removeEventListener("change",r)):(t.addListener(r),()=>t.removeListener(r))},[e]),t}M.displayName="SnapCarousel";const T=({mobileBreakpoint:t="(max-width: 768px)",mobileCarouselProps:n,theme:r,layout:o,panels:i,...a})=>{const l=A(t),s=d(()=>[o?.left,o?.middle,o?.right],[o]),c=d(()=>s.map(t=>{if(null==t)return null;if("object"==typeof t&&"type"in t){const n=t;return"tabs"===n.type?/* @__PURE__ */e(z,{panelIds:n.panels,panels:i,config:n.config,theme:r}):null}return(e=>{if(!e)return null;const t=i.find(t=>t.id===e);return t?.content??null})(t)}).filter(e=>null!==e),[s,i,r]);return l?0===c.length?null:/* @__PURE__ */e(M,{theme:r,panels:c,minPanelWidth:0,idealPanelWidth:1,...n}):/* @__PURE__ */e(D,{theme:r,layout:o,panels:i,...a})},k="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement;function L(e){const t=Object.prototype.toString.call(e);return"[object Window]"===t||"[object global]"===t}function F(e){return"nodeType"in e}function $(e){var t,n;return e?L(e)?e:F(e)&&null!=(t=null==(n=e.ownerDocument)?void 0:n.defaultView)?t:window:window}function P(e){const{Document:t}=$(e);return e instanceof t}function B(e){return!L(e)&&e instanceof $(e).HTMLElement}function O(e){return e instanceof $(e).SVGElement}function I(e){return e?L(e)?e.document:F(e)?P(e)?e:B(e)||O(e)?e.ownerDocument:document:document:document}const q=k?u:l;function W(e){const t=i(e);return q(()=>{t.current=e}),a(function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];return null==t.current?void 0:t.current(...n)},[])}function _(e,t){void 0===t&&(t=[e]);const n=i(e);return q(()=>{n.current!==e&&(n.current=e)},t),n}function j(e,t){const n=i();return d(()=>{const t=e(n.current);return n.current=t,t},[...t])}function H(e){const t=W(e),n=i(null),r=a(e=>{e!==n.current&&(null==t||t(e,n.current)),n.current=e},[]);return[n,r]}function K(e){const t=i();return l(()=>{t.current=e},[e]),t.current}let U={};function V(e,t){return d(()=>{if(t)return t;const n=null==U[e]?0:U[e]+1;return U[e]=n,e+"-"+n},[e,t])}function X(e){return function(t){for(var n=arguments.length,r=new Array(n>1?n-1:0),o=1;o<n;o++)r[o-1]=arguments[o];return r.reduce((t,n)=>{const r=Object.entries(n);for(const[o,i]of r){const n=t[o];null!=n&&(t[o]=n+e*i)}return t},{...t})}}const Y=/* @__PURE__ */X(1),J=/* @__PURE__ */X(-1);function G(e){if(!e)return!1;const{KeyboardEvent:t}=$(e.target);return t&&e instanceof t}function Q(e){if(function(e){if(!e)return!1;const{TouchEvent:t}=$(e.target);return t&&e instanceof t}(e)){if(e.touches&&e.touches.length){const{clientX:t,clientY:n}=e.touches[0];return{x:t,y:n}}if(e.changedTouches&&e.changedTouches.length){const{clientX:t,clientY:n}=e.changedTouches[0];return{x:t,y:n}}}return function(e){return"clientX"in e&&"clientY"in e}(e)?{x:e.clientX,y:e.clientY}:null}const Z="a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not(:disabled),*[tabindex]";function ee(e){return e.matches(Z)?e:e.querySelector(Z)}const te={display:"none"};function ne(e){let{id:t,value:n}=e;return r.createElement("div",{id:t,style:te},n)}function re(e){let{id:t,announcement:n,ariaLiveType:o="assertive"}=e;return r.createElement("div",{id:t,style:{position:"fixed",top:0,left:0,width:1,height:1,margin:-1,border:0,padding:0,overflow:"hidden",clip:"rect(0 0 0 0)",clipPath:"inset(100%)",whiteSpace:"nowrap"},role:"status","aria-live":o,"aria-atomic":!0},n)}const oe=/* @__PURE__ */p(null);const ie={draggable:"\n To pick up a draggable item, press the space bar.\n While dragging, use the arrow keys to move the item.\n Press space again to drop the item in its new position, or press escape to cancel.\n "},ae={onDragStart(e){let{active:t}=e;return"Picked up draggable item "+t.id+"."},onDragOver(e){let{active:t,over:n}=e;return n?"Draggable item "+t.id+" was moved over droppable area "+n.id+".":"Draggable item "+t.id+" is no longer over a droppable area."},onDragEnd(e){let{active:t,over:n}=e;return n?"Draggable item "+t.id+" was dropped over droppable area "+n.id:"Draggable item "+t.id+" was dropped."},onDragCancel(e){let{active:t}=e;return"Dragging was cancelled. Draggable item "+t.id+" was dropped."}};function le(e){let{announcements:t=ae,container:n,hiddenTextDescribedById:i,screenReaderInstructions:s=ie}=e;const{announce:c,announcement:u}=function(){const[e,t]=o("");return{announce:a(e=>{null!=e&&t(e)},[]),announcement:e}}(),p=V("DndLiveRegion"),[h,m]=o(!1);if(l(()=>{m(!0)},[]),function(e){const t=f(oe);l(()=>{if(!t)throw new Error("useDndMonitor must be used within a children of <DndContext>");return t(e)},[e,t])}(d(()=>({onDragStart(e){let{active:n}=e;c(t.onDragStart({active:n}))},onDragMove(e){let{active:n,over:r}=e;t.onDragMove&&c(t.onDragMove({active:n,over:r}))},onDragOver(e){let{active:n,over:r}=e;c(t.onDragOver({active:n,over:r}))},onDragEnd(e){let{active:n,over:r}=e;c(t.onDragEnd({active:n,over:r}))},onDragCancel(e){let{active:n,over:r}=e;c(t.onDragCancel({active:n,over:r}))}}),[c,t])),!h)return null;const g=r.createElement(r.Fragment,null,r.createElement(ne,{id:i,value:s.draggable}),r.createElement(re,{id:p,announcement:u}));return n?x(g,n):g}var se,ce;function de(){}(ce=se||(se={})).DragStart="dragStart",ce.DragMove="dragMove",ce.DragEnd="dragEnd",ce.DragCancel="dragCancel",ce.DragOver="dragOver",ce.RegisterDroppable="registerDroppable",ce.SetDroppableDisabled="setDroppableDisabled",ce.UnregisterDroppable="unregisterDroppable";const ue=/* @__PURE__ */Object.freeze({x:0,y:0});function pe(e,t){return Math.sqrt(Math.pow(e.x-t.x,2)+Math.pow(e.y-t.y,2))}function he(e,t){let{data:{value:n}}=e,{data:{value:r}}=t;return n-r}function me(e,t){let{data:{value:n}}=e,{data:{value:r}}=t;return r-n}function fe(e,t,n){return void 0===t&&(t=e.left),void 0===n&&(n=e.top),{x:t+.5*e.width,y:n+.5*e.height}}const ge=e=>{let{collisionRect:t,droppableRects:n,droppableContainers:r}=e;const o=fe(t,t.left,t.top),i=[];for(const a of r){const{id:e}=a,t=n.get(e);if(t){const n=pe(fe(t),o);i.push({id:e,data:{droppableContainer:a,value:n}})}}return i.sort(he)};function ve(e,t){const n=Math.max(t.top,e.top),r=Math.max(t.left,e.left),o=Math.min(t.left+t.width,e.left+e.width),i=Math.min(t.top+t.height,e.top+e.height),a=o-r,l=i-n;if(r<o&&n<i){const n=t.width*t.height,r=e.width*e.height,o=a*l;return Number((o/(n+r-o)).toFixed(4))}return 0}const be=e=>{let{collisionRect:t,droppableRects:n,droppableContainers:r}=e;const o=[];for(const i of r){const{id:e}=i,r=n.get(e);if(r){const n=ve(r,t);n>0&&o.push({id:e,data:{droppableContainer:i,value:n}})}}return o.sort(me)};function ye(e,t){return e&&t?{x:e.left-t.left,y:e.top-t.top}:ue}function we(e){return function(t){for(var n=arguments.length,r=new Array(n>1?n-1:0),o=1;o<n;o++)r[o-1]=arguments[o];return r.reduce((t,n)=>({...t,top:t.top+e*n.y,bottom:t.bottom+e*n.y,left:t.left+e*n.x,right:t.right+e*n.x}),{...t})}}const xe=/* @__PURE__ */we(1);const Se={ignoreTransform:!1};function Ce(e,t){void 0===t&&(t=Se);let n=e.getBoundingClientRect();if(t.ignoreTransform){const{transform:t,transformOrigin:r}=$(e).getComputedStyle(e);t&&(n=function(e,t,n){const r=function(e){if(e.startsWith("matrix3d(")){const t=e.slice(9,-1).split(/, /);return{x:+t[12],y:+t[13],scaleX:+t[0],scaleY:+t[5]}}if(e.startsWith("matrix(")){const t=e.slice(7,-1).split(/, /);return{x:+t[4],y:+t[5],scaleX:+t[0],scaleY:+t[3]}}return null}(t);if(!r)return e;const{scaleX:o,scaleY:i,x:a,y:l}=r,s=e.left-a-(1-o)*parseFloat(n),c=e.top-l-(1-i)*parseFloat(n.slice(n.indexOf(" ")+1)),d=o?e.width/o:e.width,u=i?e.height/i:e.height;return{width:d,height:u,top:c,right:s+d,bottom:c+u,left:s}}(n,t,r))}const{top:r,left:o,width:i,height:a,bottom:l,right:s}=n;return{top:r,left:o,width:i,height:a,bottom:l,right:s}}function Re(e){return Ce(e,{ignoreTransform:!0})}function Ne(e,t){const n=[];return e?function r(o){if(null!=t&&n.length>=t)return n;if(!o)return n;if(P(o)&&null!=o.scrollingElement&&!n.includes(o.scrollingElement))return n.push(o.scrollingElement),n;if(!B(o)||O(o))return n;if(n.includes(o))return n;const i=$(e).getComputedStyle(o);return o!==e&&function(e,t){void 0===t&&(t=$(e).getComputedStyle(e));const n=/(auto|scroll|overlay)/;return["overflow","overflowX","overflowY"].some(e=>{const r=t[e];return"string"==typeof r&&n.test(r)})}(o,i)&&n.push(o),function(e,t){return void 0===t&&(t=$(e).getComputedStyle(e)),"fixed"===t.position}(o,i)?n:r(o.parentNode)}(e):n}function Ee(e){const[t]=Ne(e,1);return null!=t?t:null}function ze(e){return k&&e?L(e)?e:F(e)?P(e)||e===I(e).scrollingElement?window:B(e)?e:null:null:null}function De(e){return L(e)?e.scrollX:e.scrollLeft}function Me(e){return L(e)?e.scrollY:e.scrollTop}function Ae(e){return{x:De(e),y:Me(e)}}var Te,ke;function Le(e){return!(!k||!e)&&e===document.scrollingElement}function Fe(e){const t={x:0,y:0},n=Le(e)?{height:window.innerHeight,width:window.innerWidth}:{height:e.clientHeight,width:e.clientWidth},r={x:e.scrollWidth-n.width,y:e.scrollHeight-n.height};return{isTop:e.scrollTop<=t.y,isLeft:e.scrollLeft<=t.x,isBottom:e.scrollTop>=r.y,isRight:e.scrollLeft>=r.x,maxScroll:r,minScroll:t}}(ke=Te||(Te={}))[ke.Forward=1]="Forward",ke[ke.Backward=-1]="Backward";const $e={x:.2,y:.2};function Pe(e,t,n,r,o){let{top:i,left:a,right:l,bottom:s}=n;void 0===r&&(r=10),void 0===o&&(o=$e);const{isTop:c,isBottom:d,isLeft:u,isRight:p}=Fe(e),h={x:0,y:0},m={x:0,y:0},f=t.height*o.y,g=t.width*o.x;return!c&&i<=t.top+f?(h.y=Te.Backward,m.y=r*Math.abs((t.top+f-i)/f)):!d&&s>=t.bottom-f&&(h.y=Te.Forward,m.y=r*Math.abs((t.bottom-f-s)/f)),!p&&l>=t.right-g?(h.x=Te.Forward,m.x=r*Math.abs((t.right-g-l)/g)):!u&&a<=t.left+g&&(h.x=Te.Backward,m.x=r*Math.abs((t.left+g-a)/g)),{direction:h,speed:m}}function Be(e){if(e===document.scrollingElement){const{innerWidth:e,innerHeight:t}=window;return{top:0,left:0,right:e,bottom:t,width:e,height:t}}const{top:t,left:n,right:r,bottom:o}=e.getBoundingClientRect();return{top:t,left:n,right:r,bottom:o,width:e.clientWidth,height:e.clientHeight}}function Oe(e){return e.reduce((e,t)=>Y(e,Ae(t)),ue)}const Ie=[["x",["left","right"],function(e){return e.reduce((e,t)=>e+De(t),0)}],["y",["top","bottom"],function(e){return e.reduce((e,t)=>e+Me(t),0)}]];class qe{constructor(e,t){this.rect=void 0,this.width=void 0,this.height=void 0,this.top=void 0,this.bottom=void 0,this.right=void 0,this.left=void 0;const n=Ne(t),r=Oe(n);this.rect={...e},this.width=e.width,this.height=e.height;for(const[o,i,a]of Ie)for(const e of i)Object.defineProperty(this,e,{get:()=>{const t=a(n),i=r[o]-t;return this.rect[e]+i},enumerable:!0});Object.defineProperty(this,"rect",{enumerable:!1})}}class We{constructor(e){this.target=void 0,this.listeners=[],this.removeAll=()=>{this.listeners.forEach(e=>{var t;return null==(t=this.target)?void 0:t.removeEventListener(...e)})},this.target=e}add(e,t,n){var r;null==(r=this.target)||r.addEventListener(e,t,n),this.listeners.push([e,t,n])}}function _e(e,t){const n=Math.abs(e.x),r=Math.abs(e.y);return"number"==typeof t?Math.sqrt(n**2+r**2)>t:"x"in t&&"y"in t?n>t.x&&r>t.y:"x"in t?n>t.x:"y"in t&&r>t.y}var je,He,Ke,Ue;function Ve(e){e.preventDefault()}function Xe(e){e.stopPropagation()}(He=je||(je={})).Click="click",He.DragStart="dragstart",He.Keydown="keydown",He.ContextMenu="contextmenu",He.Resize="resize",He.SelectionChange="selectionchange",He.VisibilityChange="visibilitychange",(Ue=Ke||(Ke={})).Space="Space",Ue.Down="ArrowDown",Ue.Right="ArrowRight",Ue.Left="ArrowLeft",Ue.Up="ArrowUp",Ue.Esc="Escape",Ue.Enter="Enter",Ue.Tab="Tab";const Ye={start:[Ke.Space,Ke.Enter],cancel:[Ke.Esc],end:[Ke.Space,Ke.Enter,Ke.Tab]},Je=(e,t)=>{let{currentCoordinates:n}=t;switch(e.code){case Ke.Right:return{...n,x:n.x+25};case Ke.Left:return{...n,x:n.x-25};case Ke.Down:return{...n,y:n.y+25};case Ke.Up:return{...n,y:n.y-25}}};class Ge{constructor(e){this.props=void 0,this.autoScrollEnabled=!1,this.referenceCoordinates=void 0,this.listeners=void 0,this.windowListeners=void 0,this.props=e;const{event:{target:t}}=e;this.props=e,this.listeners=new We(I(t)),this.windowListeners=new We($(t)),this.handleKeyDown=this.handleKeyDown.bind(this),this.handleCancel=this.handleCancel.bind(this),this.attach()}attach(){this.handleStart(),this.windowListeners.add(je.Resize,this.handleCancel),this.windowListeners.add(je.VisibilityChange,this.handleCancel),setTimeout(()=>this.listeners.add(je.Keydown,this.handleKeyDown))}handleStart(){const{activeNode:e,onStart:t}=this.props,n=e.node.current;n&&function(e,t){if(void 0===t&&(t=Ce),!e)return;const{top:n,left:r,bottom:o,right:i}=t(e);Ee(e)&&(o<=0||i<=0||n>=window.innerHeight||r>=window.innerWidth)&&e.scrollIntoView({block:"center",inline:"center"})}(n),t(ue)}handleKeyDown(e){if(G(e)){const{active:t,context:n,options:r}=this.props,{keyboardCodes:o=Ye,coordinateGetter:i=Je,scrollBehavior:a="smooth"}=r,{code:l}=e;if(o.end.includes(l))return void this.handleEnd(e);if(o.cancel.includes(l))return void this.handleCancel(e);const{collisionRect:s}=n.current,c=s?{x:s.left,y:s.top}:ue;this.referenceCoordinates||(this.referenceCoordinates=c);const d=i(e,{active:t,context:n.current,currentCoordinates:c});if(d){const t=J(d,c),r={x:0,y:0},{scrollableAncestors:o}=n.current;for(const n of o){const o=e.code,{isTop:i,isRight:l,isLeft:s,isBottom:c,maxScroll:u,minScroll:p}=Fe(n),h=Be(n),m={x:Math.min(o===Ke.Right?h.right-h.width/2:h.right,Math.max(o===Ke.Right?h.left:h.left+h.width/2,d.x)),y:Math.min(o===Ke.Down?h.bottom-h.height/2:h.bottom,Math.max(o===Ke.Down?h.top:h.top+h.height/2,d.y))},f=o===Ke.Right&&!l||o===Ke.Left&&!s,g=o===Ke.Down&&!c||o===Ke.Up&&!i;if(f&&m.x!==d.x){const e=n.scrollLeft+t.x,i=o===Ke.Right&&e<=u.x||o===Ke.Left&&e>=p.x;if(i&&!t.y)return void n.scrollTo({left:e,behavior:a});r.x=i?n.scrollLeft-e:o===Ke.Right?n.scrollLeft-u.x:n.scrollLeft-p.x,r.x&&n.scrollBy({left:-r.x,behavior:a});break}if(g&&m.y!==d.y){const e=n.scrollTop+t.y,i=o===Ke.Down&&e<=u.y||o===Ke.Up&&e>=p.y;if(i&&!t.x)return void n.scrollTo({top:e,behavior:a});r.y=i?n.scrollTop-e:o===Ke.Down?n.scrollTop-u.y:n.scrollTop-p.y,r.y&&n.scrollBy({top:-r.y,behavior:a});break}}this.handleMove(e,Y(J(d,this.referenceCoordinates),r))}}}handleMove(e,t){const{onMove:n}=this.props;e.preventDefault(),n(t)}handleEnd(e){const{onEnd:t}=this.props;e.preventDefault(),this.detach(),t()}handleCancel(e){const{onCancel:t}=this.props;e.preventDefault(),this.detach(),t()}detach(){this.listeners.removeAll(),this.windowListeners.removeAll()}}function Qe(e){return Boolean(e&&"distance"in e)}function Ze(e){return Boolean(e&&"delay"in e)}Ge.activators=[{eventName:"onKeyDown",handler:(e,t,n)=>{let{keyboardCodes:r=Ye,onActivation:o}=t,{active:i}=n;const{code:a}=e.nativeEvent;if(r.start.includes(a)){const t=i.activatorNode.current;return(!t||e.target===t)&&(e.preventDefault(),null==o||o({event:e.nativeEvent}),!0)}return!1}}];class et{constructor(e,t,n){var r;void 0===n&&(n=function(e){const{EventTarget:t}=$(e);return e instanceof t?e:I(e)}(e.event.target)),this.props=void 0,this.events=void 0,this.autoScrollEnabled=!0,this.document=void 0,this.activated=!1,this.initialCoordinates=void 0,this.timeoutId=null,this.listeners=void 0,this.documentListeners=void 0,this.windowListeners=void 0,this.props=e,this.events=t;const{event:o}=e,{target:i}=o;this.props=e,this.events=t,this.document=I(i),this.documentListeners=new We(this.document),this.listeners=new We(n),this.windowListeners=new We($(i)),this.initialCoordinates=null!=(r=Q(o))?r:ue,this.handleStart=this.handleStart.bind(this),this.handleMove=this.handleMove.bind(this),this.handleEnd=this.handleEnd.bind(this),this.handleCancel=this.handleCancel.bind(this),this.handleKeydown=this.handleKeydown.bind(this),this.removeTextSelection=this.removeTextSelection.bind(this),this.attach()}attach(){const{events:e,props:{options:{activationConstraint:t,bypassActivationConstraint:n}}}=this;if(this.listeners.add(e.move.name,this.handleMove,{passive:!1}),this.listeners.add(e.end.name,this.handleEnd),e.cancel&&this.listeners.add(e.cancel.name,this.handleCancel),this.windowListeners.add(je.Resize,this.handleCancel),this.windowListeners.add(je.DragStart,Ve),this.windowListeners.add(je.VisibilityChange,this.handleCancel),this.windowListeners.add(je.ContextMenu,Ve),this.documentListeners.add(je.Keydown,this.handleKeydown),t){if(null!=n&&n({event:this.props.event,activeNode:this.props.activeNode,options:this.props.options}))return this.handleStart();if(Ze(t))return this.timeoutId=setTimeout(this.handleStart,t.delay),void this.handlePending(t);if(Qe(t))return void this.handlePending(t)}this.handleStart()}detach(){this.listeners.removeAll(),this.windowListeners.removeAll(),setTimeout(this.documentListeners.removeAll,50),null!==this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}handlePending(e,t){const{active:n,onPending:r}=this.props;r(n,e,this.initialCoordinates,t)}handleStart(){const{initialCoordinates:e}=this,{onStart:t}=this.props;e&&(this.activated=!0,this.documentListeners.add(je.Click,Xe,{capture:!0}),this.removeTextSelection(),this.documentListeners.add(je.SelectionChange,this.removeTextSelection),t(e))}handleMove(e){var t;const{activated:n,initialCoordinates:r,props:o}=this,{onMove:i,options:{activationConstraint:a}}=o;if(!r)return;const l=null!=(t=Q(e))?t:ue,s=J(r,l);if(!n&&a){if(Qe(a)){if(null!=a.tolerance&&_e(s,a.tolerance))return this.handleCancel();if(_e(s,a.distance))return this.handleStart()}return Ze(a)&&_e(s,a.tolerance)?this.handleCancel():void this.handlePending(a,s)}e.cancelable&&e.preventDefault(),i(l)}handleEnd(){const{onAbort:e,onEnd:t}=this.props;this.detach(),this.activated||e(this.props.active),t()}handleCancel(){const{onAbort:e,onCancel:t}=this.props;this.detach(),this.activated||e(this.props.active),t()}handleKeydown(e){e.code===Ke.Esc&&this.handleCancel()}removeTextSelection(){var e;null==(e=this.document.getSelection())||e.removeAllRanges()}}const tt={cancel:{name:"pointercancel"},move:{name:"pointermove"},end:{name:"pointerup"}};class nt extends et{constructor(e){const{event:t}=e,n=I(t.target);super(e,tt,n)}}nt.activators=[{eventName:"onPointerDown",handler:(e,t)=>{let{nativeEvent:n}=e,{onActivation:r}=t;return!(!n.isPrimary||0!==n.button)&&(null==r||r({event:n}),!0)}}];const rt={move:{name:"mousemove"},end:{name:"mouseup"}};var ot,it;(it=ot||(ot={}))[it.RightClick=2]="RightClick";(class extends et{constructor(e){super(e,rt,I(e.event.target))}}).activators=[{eventName:"onMouseDown",handler:(e,t)=>{let{nativeEvent:n}=e,{onActivation:r}=t;return n.button!==ot.RightClick&&(null==r||r({event:n}),!0)}}];const at={cancel:{name:"touchcancel"},move:{name:"touchmove"},end:{name:"touchend"}};var lt,st,ct,dt;function ut(e){let{acceleration:t,activator:n=lt.Pointer,canScroll:r,draggingRect:o,enabled:s,interval:c=5,order:u=ct.TreeOrder,pointerCoordinates:p,scrollableAncestors:h,scrollableAncestorRects:m,delta:f,threshold:g}=e;const v=function(e){let{delta:t,disabled:n}=e;const r=K(t);return j(e=>{if(n||!r||!e)return pt;const o={x:Math.sign(t.x-r.x),y:Math.sign(t.y-r.y)};return{x:{[Te.Backward]:e.x[Te.Backward]||-1===o.x,[Te.Forward]:e.x[Te.Forward]||1===o.x},y:{[Te.Backward]:e.y[Te.Backward]||-1===o.y,[Te.Forward]:e.y[Te.Forward]||1===o.y}}},[n,t,r])}({delta:f,disabled:!s}),[b,y]=function(){const e=i(null);return[a((t,n)=>{e.current=setInterval(t,n)},[]),a(()=>{null!==e.current&&(clearInterval(e.current),e.current=null)},[])]}(),w=i({x:0,y:0}),x=i({x:0,y:0}),S=d(()=>{switch(n){case lt.Pointer:return p?{top:p.y,bottom:p.y,left:p.x,right:p.x}:null;case lt.DraggableRect:return o}},[n,o,p]),C=i(null),R=a(()=>{const e=C.current;if(!e)return;const t=w.current.x*x.current.x,n=w.current.y*x.current.y;e.scrollBy(t,n)},[]),N=d(()=>u===ct.TreeOrder?[...h].reverse():h,[u,h]);l(()=>{if(s&&h.length&&S){for(const e of N){if(!1===(null==r?void 0:r(e)))continue;const n=h.indexOf(e),o=m[n];if(!o)continue;const{direction:i,speed:a}=Pe(e,o,S,t,g);for(const e of["x","y"])v[e][i[e]]||(a[e]=0,i[e]=0);if(a.x>0||a.y>0)return y(),C.current=e,b(R,c),w.current=a,void(x.current=i)}w.current={x:0,y:0},x.current={x:0,y:0},y()}else y()},[t,R,r,y,s,c,JSON.stringify(S),JSON.stringify(v),b,h,N,m,JSON.stringify(g)])}(class extends et{constructor(e){super(e,at)}static setup(){return window.addEventListener(at.move.name,e,{capture:!1,passive:!1}),function(){window.removeEventListener(at.move.name,e)};function e(){}}}).activators=[{eventName:"onTouchStart",handler:(e,t)=>{let{nativeEvent:n}=e,{onActivation:r}=t;const{touches:o}=n;return!(o.length>1)&&(null==r||r({event:n}),!0)}}],(st=lt||(lt={}))[st.Pointer=0]="Pointer",st[st.DraggableRect=1]="DraggableRect",(dt=ct||(ct={}))[dt.TreeOrder=0]="TreeOrder",dt[dt.ReversedTreeOrder=1]="ReversedTreeOrder";const pt={x:{[Te.Backward]:!1,[Te.Forward]:!1},y:{[Te.Backward]:!1,[Te.Forward]:!1}};var ht,mt,ft;(mt=ht||(ht={}))[mt.Always=0]="Always",mt[mt.BeforeDragging=1]="BeforeDragging",mt[mt.WhileDragging=2]="WhileDragging",(ft||(ft={})).Optimized="optimized";const gt=/* @__PURE__ */new Map;function vt(e,t){return j(n=>e?n||("function"==typeof t?t(e):e):null,[t,e])}function bt(e){let{callback:t,disabled:n}=e;const r=W(t),o=d(()=>{if(n||"undefined"==typeof window||void 0===window.ResizeObserver)return;const{ResizeObserver:e}=window;return new e(r)},[n]);return l(()=>()=>null==o?void 0:o.disconnect(),[o]),o}function yt(e){return new qe(Ce(e),e)}function wt(e,t,n){void 0===t&&(t=yt);const[r,i]=o(null);function a(){i(r=>{if(!e)return null;var o;if(!1===e.isConnected)return null!=(o=null!=r?r:n)?o:null;const i=t(e);return JSON.stringify(r)===JSON.stringify(i)?r:i})}const s=function(e){let{callback:t,disabled:n}=e;const r=W(t),o=d(()=>{if(n||"undefined"==typeof window||void 0===window.MutationObserver)return;const{MutationObserver:e}=window;return new e(r)},[r,n]);return l(()=>()=>null==o?void 0:o.disconnect(),[o]),o}({callback(t){if(e)for(const n of t){const{type:t,target:r}=n;if("childList"===t&&r instanceof HTMLElement&&r.contains(e)){a();break}}}}),c=bt({callback:a});return q(()=>{a(),e?(null==c||c.observe(e),null==s||s.observe(document.body,{childList:!0,subtree:!0})):(null==c||c.disconnect(),null==s||s.disconnect())},[e]),r}const xt=[];function St(e,t){void 0===t&&(t=[]);const n=i(null);return l(()=>{n.current=null},t),l(()=>{const t=e!==ue;t&&!n.current&&(n.current=e),!t&&n.current&&(n.current=null)},[e]),n.current?J(e,n.current):ue}function Ct(e){return d(()=>e?function(e){const t=e.innerWidth,n=e.innerHeight;return{top:0,left:0,right:t,bottom:n,width:t,height:n}}(e):null,[e])}const Rt=[];function Nt(e){let{measure:t}=e;const[n,r]=o(null),i=bt({callback:a(e=>{for(const{target:n}of e)if(B(n)){r(e=>{const r=t(n);return e?{...e,width:r.width,height:r.height}:r});break}},[t])}),l=a(e=>{const n=function(e){if(!e)return null;if(e.children.length>1)return e;const t=e.children[0];return B(t)?t:e}(e);null==i||i.disconnect(),n&&(null==i||i.observe(n)),r(n?t(n):null)},[t,i]),[s,c]=H(l);return d(()=>({nodeRef:s,rect:n,setRef:c}),[n,s,c])}const Et=[{sensor:nt,options:{}},{sensor:Ge,options:{}}],zt={current:{}},Dt={draggable:{measure:Re},droppable:{measure:Re,strategy:ht.WhileDragging,frequency:ft.Optimized},dragOverlay:{measure:Ce}};class Mt extends Map{get(e){var t;return null!=e&&null!=(t=super.get(e))?t:void 0}toArray(){return Array.from(this.values())}getEnabled(){return this.toArray().filter(e=>{let{disabled:t}=e;return!t})}getNodeFor(e){var t,n;return null!=(t=null==(n=this.get(e))?void 0:n.node.current)?t:void 0}}const At={activatorEvent:null,active:null,activeNode:null,activeNodeRect:null,collisions:null,containerNodeRect:null,draggableNodes:/* @__PURE__ */new Map,droppableRects:/* @__PURE__ */new Map,droppableContainers:/* @__PURE__ */new Mt,over:null,dragOverlay:{nodeRef:{current:null},rect:null,setRef:de},scrollableAncestors:[],scrollableAncestorRects:[],measuringConfiguration:Dt,measureDroppableContainers:de,windowRect:null,measuringScheduled:!1},Tt=/* @__PURE__ */p({activatorEvent:null,activators:[],active:null,activeNodeRect:null,ariaDescribedById:{draggable:""},dispatch:de,draggableNodes:/* @__PURE__ */new Map,over:null,measureDroppableContainers:de}),kt=/* @__PURE__ */p(At);function Lt(){return{draggable:{active:null,initialCoordinates:{x:0,y:0},nodes:/* @__PURE__ */new Map,translate:{x:0,y:0}},droppable:{containers:new Mt}}}function Ft(e,t){switch(t.type){case se.DragStart:return{...e,draggable:{...e.draggable,initialCoordinates:t.initialCoordinates,active:t.active}};case se.DragMove:return null==e.draggable.active?e:{...e,draggable:{...e.draggable,translate:{x:t.coordinates.x-e.draggable.initialCoordinates.x,y:t.coordinates.y-e.draggable.initialCoordinates.y}}};case se.DragEnd:case se.DragCancel:return{...e,draggable:{...e.draggable,active:null,initialCoordinates:{x:0,y:0},translate:{x:0,y:0}}};case se.RegisterDroppable:{const{element:n}=t,{id:r}=n,o=new Mt(e.droppable.containers);return o.set(r,n),{...e,droppable:{...e.droppable,containers:o}}}case se.SetDroppableDisabled:{const{id:n,key:r,disabled:o}=t,i=e.droppable.containers.get(n);if(!i||r!==i.key)return e;const a=new Mt(e.droppable.containers);return a.set(n,{...i,disabled:o}),{...e,droppable:{...e.droppable,containers:a}}}case se.UnregisterDroppable:{const{id:n,key:r}=t,o=e.droppable.containers.get(n);if(!o||r!==o.key)return e;const i=new Mt(e.droppable.containers);return i.delete(n),{...e,droppable:{...e.droppable,containers:i}}}default:return e}}function $t(e){let{disabled:t}=e;const{active:n,activatorEvent:r,draggableNodes:o}=f(Tt),i=K(r),a=K(null==n?void 0:n.id);return l(()=>{if(!t&&!r&&i&&null!=a){if(!G(i))return;if(document.activeElement===i.target)return;const e=o.get(a);if(!e)return;const{activatorNode:t,node:n}=e;if(!t.current&&!n.current)return;requestAnimationFrame(()=>{for(const e of[t.current,n.current]){if(!e)continue;const t=ee(e);if(t){t.focus();break}}})}},[r,t,o,a,i]),null}const Pt=/* @__PURE__ */p({...ue,scaleX:1,scaleY:1});var Bt,Ot;(Ot=Bt||(Bt={}))[Ot.Uninitialized=0]="Uninitialized",Ot[Ot.Initializing=1]="Initializing",Ot[Ot.Initialized=2]="Initialized";const It=/* @__PURE__ */h(function(e){var t,n,s,c;let{id:u,accessibility:p,autoScroll:h=!0,children:f,sensors:g=Et,collisionDetection:v=be,measuring:b,modifiers:y,...x}=e;const S=m(Ft,void 0,Lt),[C,R]=S,[N,E]=function(){const[e]=o(()=>/* @__PURE__ */new Set),t=a(t=>(e.add(t),()=>e.delete(t)),[e]);return[a(t=>{let{type:n,event:r}=t;e.forEach(e=>{var t;return null==(t=e[n])?void 0:t.call(e,r)})},[e]),t]}(),[z,D]=o(Bt.Uninitialized),M=z===Bt.Initialized,{draggable:{active:A,nodes:T,translate:L},droppable:{containers:F}}=C,P=null!=A?T.get(A):null,B=i({initial:null,translated:null}),O=d(()=>{var e;return null!=A?{id:A,data:null!=(e=null==P?void 0:P.data)?e:zt,rect:B}:null},[A,P]),I=i(null),[W,H]=o(null),[K,U]=o(null),X=_(x,Object.values(x)),J=V("DndDescribedBy",u),G=d(()=>F.getEnabled(),[F]),Z=d(()=>({draggable:{...Dt.draggable,...null==ee?void 0:ee.draggable},droppable:{...Dt.droppable,...null==ee?void 0:ee.droppable},dragOverlay:{...Dt.dragOverlay,...null==ee?void 0:ee.dragOverlay}}),[null==(ee=b)?void 0:ee.draggable,null==ee?void 0:ee.droppable,null==ee?void 0:ee.dragOverlay]);var ee;const{droppableRects:te,measureDroppableContainers:ne,measuringScheduled:re}=function(e,t){let{dragging:n,dependencies:r,config:s}=t;const[c,d]=o(null),{frequency:u,measure:p,strategy:h}=s,m=i(e),f=function(){switch(h){case ht.Always:return!1;case ht.BeforeDragging:return n;default:return!n}}(),g=_(f),v=a(function(e){void 0===e&&(e=[]),g.current||d(t=>null===t?e:t.concat(e.filter(e=>!t.includes(e))))},[g]),b=i(null),y=j(t=>{if(f&&!n)return gt;if(!t||t===gt||m.current!==e||null!=c){const t=/* @__PURE__ */new Map;for(let n of e){if(!n)continue;if(c&&c.length>0&&!c.includes(n.id)&&n.rect.current){t.set(n.id,n.rect.current);continue}const e=n.node.current,r=e?new qe(p(e),e):null;n.rect.current=r,r&&t.set(n.id,r)}return t}return t},[e,c,n,f,p]);return l(()=>{m.current=e},[e]),l(()=>{f||v()},[n,f]),l(()=>{c&&c.length>0&&d(null)},[JSON.stringify(c)]),l(()=>{f||"number"!=typeof u||null!==b.current||(b.current=setTimeout(()=>{v(),b.current=null},u))},[u,f,v,...r]),{droppableRects:y,measureDroppableContainers:v,measuringScheduled:null!=c}}(G,{dragging:M,dependencies:[L.x,L.y],config:Z.droppable}),ie=function(e,t){const n=null!=t?e.get(t):void 0,r=n?n.node.current:null;return j(e=>{var n;return null==t?null:null!=(n=null!=r?r:e)?n:null},[r,t])}(T,A),ae=d(()=>K?Q(K):null,[K]),ce=function(){const e=!1===(null==W?void 0:W.autoScrollEnabled),t="object"==typeof h?!1===h.enabled:!1===h,n=M&&!e&&!t;if("object"==typeof h)return{...h,enabled:n};return{enabled:n}}(),de=function(e,t){return vt(e,t)}(ie,Z.draggable.measure);!function(e){let{activeNode:t,measure:n,initialRect:r,config:o=!0}=e;const a=i(!1),{x:l,y:s}="boolean"==typeof o?{x:o,y:o}:o;q(()=>{if(!l&&!s||!t)return void(a.current=!1);if(a.current||!r)return;const e=null==t?void 0:t.node.current;if(!e||!1===e.isConnected)return;const o=ye(n(e),r);if(l||(o.x=0),s||(o.y=0),a.current=!0,Math.abs(o.x)>0||Math.abs(o.y)>0){const t=Ee(e);t&&t.scrollBy({top:o.y,left:o.x})}},[t,l,s,r,n])}({activeNode:null!=A?T.get(A):null,config:ce.layoutShiftCompensation,initialRect:de,measure:Z.draggable.measure});const pe=wt(ie,Z.draggable.measure,de),he=wt(ie?ie.parentElement:null),me=i({activatorEvent:null,active:null,activeNode:ie,collisionRect:null,collisions:null,droppableRects:te,draggableNodes:T,draggingNode:null,draggingNodeRect:null,droppableContainers:F,over:null,scrollableAncestors:[],scrollAdjustedTranslate:null}),fe=F.getNodeFor(null==(t=me.current.over)?void 0:t.id),ge=Nt({measure:Z.dragOverlay.measure}),ve=null!=(n=ge.nodeRef.current)?n:ie,we=M?null!=(s=ge.rect)?s:pe:null,Se=Boolean(ge.nodeRef.current&&ge.rect),Re=ye(De=Se?null:pe,vt(De));var De;const Me=Ct(ve?$(ve):null),Te=function(e){const t=i(e),n=j(n=>e?n&&n!==xt&&e&&t.current&&e.parentNode===t.current.parentNode?n:Ne(e):xt,[e]);return l(()=>{t.current=e},[e]),n}(M?null!=fe?fe:ie:null),ke=function(e,t){void 0===t&&(t=Ce);const[n]=e,r=Ct(n?$(n):null),[i,a]=o(Rt);function l(){a(()=>e.length?e.map(e=>Le(e)?r:new qe(t(e),e)):Rt)}const s=bt({callback:l});return q(()=>{null==s||s.disconnect(),l(),e.forEach(e=>null==s?void 0:s.observe(e))},[e]),i}(Te),Fe=function(e,t){let{transform:n,...r}=t;return null!=e&&e.length?e.reduce((e,t)=>t({transform:e,...r}),n):n}(y,{transform:{x:L.x-Re.x,y:L.y-Re.y,scaleX:1,scaleY:1},activatorEvent:K,active:O,activeNodeRect:pe,containerNodeRect:he,draggingNodeRect:we,over:me.current.over,overlayNodeRect:ge.rect,scrollableAncestors:Te,scrollableAncestorRects:ke,windowRect:Me}),$e=ae?Y(ae,L):null,Pe=function(e){const[t,n]=o(null),r=i(e),s=a(e=>{const t=ze(e.target);t&&n(e=>e?(e.set(t,Ae(t)),new Map(e)):null)},[]);return l(()=>{const t=r.current;if(e!==t){o(t);const i=e.map(e=>{const t=ze(e);return t?(t.addEventListener("scroll",s,{passive:!0}),[t,Ae(t)]):null}).filter(e=>null!=e);n(i.length?new Map(i):null),r.current=e}return()=>{o(e),o(t)};function o(e){e.forEach(e=>{const t=ze(e);null==t||t.removeEventListener("scroll",s)})}},[s,e]),d(()=>e.length?t?Array.from(t.values()).reduce((e,t)=>Y(e,t),ue):Oe(e):ue,[e,t])}(Te),Be=St(Pe),Ie=St(Pe,[pe]),We=Y(Fe,Be),_e=we?xe(we,Fe):null,je=O&&_e?v({active:O,collisionRect:_e,droppableRects:te,droppableContainers:G,pointerCoordinates:$e}):null,He=function(e,t){if(!e||0===e.length)return null;const[n]=e;return n[t]}(je,"id"),[Ke,Ue]=o(null),Ve=function(e,t,n){return{...e,scaleX:t&&n?t.width/n.width:1,scaleY:t&&n?t.height/n.height:1}}(Se?Fe:Y(Fe,Ie),null!=(c=null==Ke?void 0:Ke.rect)?c:null,pe),Xe=i(null),Ye=a((e,t)=>{let{sensor:n,options:r}=t;if(null==I.current)return;const o=T.get(I.current);if(!o)return;const i=e.nativeEvent,a=new n({active:I.current,activeNode:o,event:i,options:r,context:me,onAbort(e){if(!T.get(e))return;const{onDragAbort:t}=X.current,n={id:e};null==t||t(n),N({type:"onDragAbort",event:n})},onPending(e,t,n,r){if(!T.get(e))return;const{onDragPending:o}=X.current,i={id:e,constraint:t,initialCoordinates:n,offset:r};null==o||o(i),N({type:"onDragPending",event:i})},onStart(e){const t=I.current;if(null==t)return;const n=T.get(t);if(!n)return;const{onDragStart:r}=X.current,o={activatorEvent:i,active:{id:t,data:n.data,rect:B}};w(()=>{null==r||r(o),D(Bt.Initializing),R({type:se.DragStart,initialCoordinates:e,active:t}),N({type:"onDragStart",event:o}),H(Xe.current),U(i)})},onMove(e){R({type:se.DragMove,coordinates:e})},onEnd:l(se.DragEnd),onCancel:l(se.DragCancel)});function l(e){return async function(){const{active:t,collisions:n,over:r,scrollAdjustedTranslate:o}=me.current;let a=null;if(t&&o){const{cancelDrop:l}=X.current;if(a={activatorEvent:i,active:t,collisions:n,delta:o,over:r},e===se.DragEnd&&"function"==typeof l){await Promise.resolve(l(a))&&(e=se.DragCancel)}}I.current=null,w(()=>{R({type:e}),D(Bt.Uninitialized),Ue(null),H(null),U(null),Xe.current=null;const t=e===se.DragEnd?"onDragEnd":"onDragCancel";if(a){const e=X.current[t];null==e||e(a),N({type:t,event:a})}})}}Xe.current=a},[T]),Je=function(e,t){return d(()=>e.reduce((e,n)=>{const{sensor:r}=n;return[...e,...r.activators.map(e=>({eventName:e.eventName,handler:t(e.handler,n)}))]},[]),[e,t])}(g,a((e,t)=>(n,r)=>{const o=n.nativeEvent,i=T.get(r);if(null!==I.current||!i||o.dndKit||o.defaultPrevented)return;const a={active:i};!0===e(n,t.options,a)&&(o.dndKit={capturedBy:t.sensor},I.current=r,Ye(n,t))},[T,Ye]));!function(e){l(()=>{if(!k)return;const t=e.map(e=>{let{sensor:t}=e;return null==t.setup?void 0:t.setup()});return()=>{for(const e of t)null==e||e()}},e.map(e=>{let{sensor:t}=e;return t}))}(g),q(()=>{pe&&z===Bt.Initializing&&D(Bt.Initialized)},[pe,z]),l(()=>{const{onDragMove:e}=X.current,{active:t,activatorEvent:n,collisions:r,over:o}=me.current;if(!t||!n)return;const i={active:t,activatorEvent:n,collisions:r,delta:{x:We.x,y:We.y},over:o};w(()=>{null==e||e(i),N({type:"onDragMove",event:i})})},[We.x,We.y]),l(()=>{const{active:e,activatorEvent:t,collisions:n,droppableContainers:r,scrollAdjustedTranslate:o}=me.current;if(!e||null==I.current||!t||!o)return;const{onDragOver:i}=X.current,a=r.get(He),l=a&&a.rect.current?{id:a.id,rect:a.rect.current,data:a.data,disabled:a.disabled}:null,s={active:e,activatorEvent:t,collisions:n,delta:{x:o.x,y:o.y},over:l};w(()=>{Ue(l),null==i||i(s),N({type:"onDragOver",event:s})})},[He]),q(()=>{me.current={activatorEvent:K,active:O,activeNode:ie,collisionRect:_e,collisions:je,droppableRects:te,draggableNodes:T,draggingNode:ve,draggingNodeRect:we,droppableContainers:F,over:Ke,scrollableAncestors:Te,scrollAdjustedTranslate:We},B.current={initial:we,translated:_e}},[O,ie,je,_e,T,ve,we,te,F,Ke,Te,We]),ut({...ce,delta:L,draggingRect:_e,pointerCoordinates:$e,scrollableAncestors:Te,scrollableAncestorRects:ke});const Ge=d(()=>({active:O,activeNode:ie,activeNodeRect:pe,activatorEvent:K,collisions:je,containerNodeRect:he,dragOverlay:ge,draggableNodes:T,droppableContainers:F,droppableRects:te,over:Ke,measureDroppableContainers:ne,scrollableAncestors:Te,scrollableAncestorRects:ke,measuringConfiguration:Z,measuringScheduled:re,windowRect:Me}),[O,ie,pe,K,je,he,ge,T,F,te,Ke,ne,Te,ke,Z,re,Me]),Qe=d(()=>({activatorEvent:K,activators:Je,active:O,activeNodeRect:pe,ariaDescribedById:{draggable:J},dispatch:R,draggableNodes:T,over:Ke,measureDroppableContainers:ne}),[K,Je,O,pe,R,J,T,Ke,ne]);return r.createElement(oe.Provider,{value:E},r.createElement(Tt.Provider,{value:Qe},r.createElement(kt.Provider,{value:Ge},r.createElement(Pt.Provider,{value:Ve},f)),r.createElement($t,{disabled:!1===(null==p?void 0:p.restoreFocus)})),r.createElement(le,{...p,hiddenTextDescribedById:J}))}),qt=/* @__PURE__ */p(null),Wt="button";function _t(e){let{id:t,data:n,disabled:r=!1,attributes:o}=e;const i=V("Draggable"),{activators:a,activatorEvent:l,active:s,activeNodeRect:c,ariaDescribedById:u,draggableNodes:p,over:h}=f(Tt),{role:m=Wt,roleDescription:g="draggable",tabIndex:v=0}=null!=o?o:{},b=(null==s?void 0:s.id)===t,y=f(b?Pt:qt),[w,x]=H(),[S,C]=H(),R=function(e,t){return d(()=>e.reduce((e,n)=>{let{eventName:r,handler:o}=n;return e[r]=e=>{o(e,t)},e},{}),[e,t])}(a,t),N=_(n);q(()=>(p.set(t,{id:t,key:i,node:w,activatorNode:S,data:N}),()=>{const e=p.get(t);e&&e.key===i&&p.delete(t)}),[p,t]);return{active:s,activatorEvent:l,activeNodeRect:c,attributes:d(()=>({role:m,tabIndex:v,"aria-disabled":r,"aria-pressed":!(!b||m!==Wt)||void 0,"aria-roledescription":g,"aria-describedby":u.draggable}),[r,m,v,b,g,u.draggable]),isDragging:b,listeners:r?void 0:R,node:w,over:h,setNodeRef:x,setActivatorNodeRef:C,transform:y}}const jt={timeout:25};const Ht=({slotPosition:n,isEditing:r,isDragging:o,children:s})=>{const{attributes:c,listeners:d,setNodeRef:u,transform:p}=_t({id:`slot-${n}`,data:{slotPosition:n},disabled:!r}),{setNodeRef:h,isOver:m}=function(e){let{data:t,disabled:n=!1,id:r,resizeObserverConfig:o}=e;const s=V("Droppable"),{active:c,dispatch:d,over:u,measureDroppableContainers:p}=f(Tt),h=i({disabled:n}),m=i(!1),g=i(null),v=i(null),{disabled:b,updateMeasurementsFor:y,timeout:w}={...jt,...o},x=_(null!=y?y:r),S=bt({callback:a(()=>{m.current?(null!=v.current&&clearTimeout(v.current),v.current=setTimeout(()=>{p(Array.isArray(x.current)?x.current:[x.current]),v.current=null},w)):m.current=!0},[w]),disabled:b||!c}),C=a((e,t)=>{S&&(t&&(S.unobserve(t),m.current=!1),e&&S.observe(e))},[S]),[R,N]=H(C),E=_(t);return l(()=>{S&&R.current&&(S.disconnect(),m.current=!1,S.observe(R.current))},[R,S]),l(()=>(d({type:se.RegisterDroppable,element:{id:r,key:s,disabled:n,node:R,rect:g,data:E}}),()=>d({type:se.UnregisterDroppable,key:s,id:r})),[r]),l(()=>{n!==h.current.disabled&&(d({type:se.SetDroppableDisabled,id:r,key:s,disabled:n}),h.current.disabled=n)},[r,s,n,d]),{active:c,rect:g,isOver:(null==u?void 0:u.id)===r,node:R,over:u,setNodeRef:N}}({id:`drop-${n}`,data:{slotPosition:n}}),g={position:"relative",height:"100%",width:"100%",transform:p?`translate3d(${p.x}px, ${p.y}px, 0)`:void 0},v=a(e=>{u(e),h(e)},[u,h]);/* @__PURE__ */
|
|
28
|
+
return t("div",{ref:v,style:g,className:`slot-with-overlay ${r?"edit-mode":""} ${o?"dragging":""} ${m?"drag-over":""}`,children:[s,r&&/* @__PURE__ */t("div",{className:"slot-edit-overlay",...c,...d,children:[
|
|
29
|
+
/* @__PURE__ */e("div",{className:"drag-indicator",children:"⋮⋮"}),
|
|
30
|
+
/* @__PURE__ */e("div",{className:"slot-position-label",children:n.toUpperCase()})]})]})},Kt=({isEditMode:n,onLayoutChange:r,panels:i,layout:s,...c})=>{const[u,p]=o(null),[h,m]=o({x:0,y:0}),f=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return d(()=>[...t].filter(e=>null!=e),[...t])}(d(()=>({sensor:g,options:null!=v?v:{}}),[g=nt,v={activationConstraint:{distance:8}}]));var g,v;const b=a(e=>{const t=e.active.id;if(t.startsWith("slot-")){const e=t.replace("slot-","");p(e),m({x:0,y:0})}},[]),y=a(e=>{const{delta:t}=e;m({x:t.x,y:t.y})},[]),w=a(e=>{const{active:t,over:n}=e;if(p(null),m({x:0,y:0}),!n)return;const o=t.id,i=n.id,a=o.replace("slot-",""),l=i.replace("drop-","");if(a===l)return;const c={...s},d=c[a];c[a]=c[l],c[l]=d,r&&r(c)},[s,r]);l(()=>{if(!u||!n)return;const e=document.querySelector(`[data-slot="${u}"]`);return e&&(e.setAttribute("data-dragging","true"),e.style.setProperty("transform",`scale(0.95) translate(${h.x}px, ${h.y}px)`,"important"),e.style.setProperty("z-index","1000","important"),e.style.setProperty("transition","none","important"),e.style.setProperty("opacity","0.95","important"),e.style.setProperty("box-shadow","0 12px 24px rgba(0, 0, 0, 0.25)","important")),()=>{e&&(e.removeAttribute("data-dragging"),e.style.removeProperty("transform"),e.style.removeProperty("z-index"),e.style.removeProperty("transition"),e.style.removeProperty("opacity"),e.style.removeProperty("box-shadow"))}},[u,h,n]);/* @__PURE__ */
|
|
31
|
+
return e(It,{sensors:f,collisionDetection:ge,onDragStart:b,onDragMove:y,onDragEnd:w,children:/* @__PURE__ */t("div",{className:"editable-panel-layout "+(n?"edit-mode-active":""),children:[
|
|
32
|
+
/* @__PURE__ */e(D,{...c,panels:i,layout:s,slotDataAttributes:{left:{"data-slot":"left","data-edit-mode":n?"true":"false"},middle:{"data-slot":"middle","data-edit-mode":n?"true":"false"},right:{"data-slot":"right","data-edit-mode":n?"true":"false"}}}),n&&/* @__PURE__ */e(Ut,{layout:s,activeSlot:u,onDragStart:()=>{},onDragEnd:()=>{}})]})})},Ut=({layout:t,activeSlot:n})=>{const[i,a]=o(/* @__PURE__ */new Map);return r.useEffect(()=>{const e=()=>{const e=/* @__PURE__ */new Map;["left","middle","right"].forEach(t=>{const n=document.querySelector(`[data-slot="${t}"]`);if(n){const r=n.getBoundingClientRect();e.set(t,r)}}),a(e)};e(),window.addEventListener("resize",e);const t=setInterval(e,100);return()=>{window.removeEventListener("resize",e),clearInterval(t)}},[t]),/* @__PURE__ */e("div",{style:{pointerEvents:"none",position:"absolute",top:0,left:0,right:0,bottom:0,zIndex:999},children:["left","middle","right"].map(r=>{if(!t[r])return null;const o=i.get(r);if(!o)return null;const a=n===r;/* @__PURE__ */
|
|
33
|
+
return e("div",{style:{position:"fixed",top:o.top,left:o.left,width:o.width,height:o.height,pointerEvents:"auto"},children:/* @__PURE__ */e(Ht,{slotPosition:r,isEditing:!0,isDragging:a,children:/* @__PURE__ */e("div",{style:{height:"100%"}})})},r)})})};var Vt,Xt=(()=>{if("undefined"!=typeof window){const e=window;return e.__principlemd_theme_context__||(e.__principlemd_theme_context__=p(void 0)),e.__principlemd_theme_context__}return Vt||(Vt=p(void 0)),Vt})();const Yt=e=>null!=e&&"object"==typeof e&&"type"in e,Jt=e=>null==e?[]:"string"==typeof e?[e]:Yt(e)?e.panels:[],Gt=({availablePanels:r,currentLayout:i,onChange:l,className:s="",theme:c})=>{const d=(()=>{const e=f(Xt);if(!e)throw new Error("useTheme must be used within a ThemeProvider");return e})(),u=c||d.theme,[p,h]=o(null),m=a(e=>e&&r.find(t=>t.id===e)||null,[r]),g=a(()=>[...r].sort((e,t)=>e.label.localeCompare(t.label)),[r]),v=a(e=>{const t=Jt(i.left),n=Jt(i.middle),r=Jt(i.right);return t.includes(e)||n.includes(e)||r.includes(e)},[i]),b=a((e,t)=>{const n={...e};return["left","middle","right"].forEach(e=>{const r=n[e];if(r===t)n[e]=null;else if(null!=r&&Yt(r)){const o=r.panels.filter(e=>e!==t);0===o.length?n[e]=null:1===o.length?n[e]=o[0]:n[e]={...r,panels:o}}}),n},[]),y=a((e,t)=>{const n=i[e];if(!Yt(n)||"tabs"!==n.type)return;const r=n.panels.filter(e=>e!==t),o={...i};o[e]={...n,panels:r},l(o)},[i,l]),w=a((e,t)=>{t.stopPropagation();const n=i[e];if(Yt(n)&&"tabs"===n.type){const t={...i};t[e]=n.panels.length>0?n.panels[0]:null,l(t),h(null)}else{const t=n&&"string"==typeof n?[n]:[],r={...i};r[e]={type:"tabs",panels:t,config:{defaultActiveTab:0,tabPosition:"top"}},l(r),h({type:"slot",position:e})}},[i,l]),x=a(e=>{if(p)if("slot"===p.type){if(p.position===e)return;const t={...i},n=t[p.position];t[p.position]=t[e],t[e]=n,l(t),h(null)}else{const t=i[e];if(Yt(t)&&"tabs"===t.type){if(t.panels.includes(p.id))return void y(e,p.id);const n=t,r=b(i,p.id);return r[e]={...n,panels:[...n.panels,p.id]},void l(r)}{const t=b(i,p.id);t[e]=p.id,l(t),h(null)}}else h({type:"slot",position:e})},[p,i,l,b,y]),S=a(e=>{if(p)if("slot"===p.type){const t=i[p.position];if(Yt(t)&&"tabs"===t.type){if(t.panels.includes(e))return void y(p.position,e);const n=t,r=b(i,e);return r[p.position]={...n,panels:[...n.panels,e]},void l(r)}{const t=b(i,e);t[p.position]=e,l(t),h(null)}}else h({type:"panel",id:e});else h({type:"panel",id:e})},[p,i,l,b,y]),C=a((e,t)=>{t.stopPropagation();const n={...i};n[e]=null,l(n),h(null)},[i,l]),R=a((e,t,n)=>{n.stopPropagation();const r=i[e];if(!Yt(r)||"tabs"!==r.type)return;const o=r.panels.filter(e=>e!==t),a={...i};a[e]={...r,panels:o},l(a)},[i,l]),N=a((e,t)=>{const n=i[e];if(!Yt(n)||"tabs"!==n.type)return;const r={...i};r[e]={...n,config:{...n.config,...t}},l(r)},[i,l]),E=g(),z=e=>{const t=i[e];return Yt(t)&&"tabs"===t.type},D={"--configurator-bg":u.colors.background,"--configurator-title":u.colors.textSecondary,"--slot-bg":u.colors.backgroundSecondary,"--slot-border":u.colors.border,"--slot-border-hover":u.colors.textTertiary,"--slot-border-selected":u.colors.primary,"--slot-bg-selected":u.colors.backgroundLight,"--slot-label":u.colors.textTertiary,"--slot-content-text":u.colors.text,"--slot-preview-bg":u.colors.backgroundTertiary,"--slot-preview-border":u.colors.border,"--slot-preview-text":u.colors.textMuted,"--slot-empty-text":u.colors.textMuted,"--panel-bg":u.colors.backgroundSecondary,"--panel-border":u.colors.border,"--panel-border-hover":u.colors.textSecondary,"--panel-border-selected":u.colors.primary,"--panel-bg-selected":u.colors.backgroundLight,"--panel-label-text":u.colors.text,"--panel-preview-bg":u.colors.backgroundTertiary,"--panel-preview-text":u.colors.textMuted,"--clear-btn-bg":u.colors.error,"--clear-btn-text":u.colors.background,"--clear-btn-hover":u.colors.error,"--hint-bg":u.colors.backgroundLight,"--hint-border":u.colors.primary,"--hint-text":u.colors.text};/* @__PURE__ */
|
|
34
|
+
return t("div",{className:`panel-configurator ${s}`,style:D,children:[
|
|
35
|
+
/* @__PURE__ */t("div",{className:"configurator-section",children:[
|
|
36
|
+
/* @__PURE__ */e("h3",{className:"section-title",children:"Panel Layout (3 Slots)"}),
|
|
37
|
+
/* @__PURE__ */e("div",{className:"slots-container",children:["left","middle","right"].map(n=>{const r=i[n],o=(e=>"slot"===p?.type&&p.position===e)(n),a=Yt(r)&&"tabs"===r.type;/* @__PURE__ */
|
|
38
|
+
return t("div",{"data-position":n,className:`slot ${o?"selected":""} ${null!==r?"filled":"empty"} ${a?"tab-group":""}`,onClick:()=>x(n),children:[
|
|
39
|
+
/* @__PURE__ */e("button",{className:"tab-mode-toggle "+(a?"active":""),onClick:e=>w(n,e),title:a?"Disable tab mode":"Enable tab mode",children:/* @__PURE__ */e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",children:/* @__PURE__ */e("path",{d:"M2 2h4v2H2V2zm5 0h4v2H7V2zm5 0h2v2h-2V2zM2 5h12v9H2V5zm1 1v7h10V6H3z"})})}),null===r?/* @__PURE__ */e("div",{className:"slot-empty-state",children:a?"Click panels to add tabs":"Empty"}):Yt(r)?/* @__PURE__ */t("div",{className:"slot-content group-content",children:["tabs"===r.type&&r.panels.length>0&&/* @__PURE__ */e("div",{className:"tab-config-controls",children:/* @__PURE__ */t("label",{className:"tab-config-label",children:["Tabs:",
|
|
40
|
+
/* @__PURE__ */t("select",{value:r.config?.tabPosition||"top",onChange:e=>N(n,{tabPosition:e.target.value}),onClick:e=>e.stopPropagation(),children:[
|
|
41
|
+
/* @__PURE__ */e("option",{value:"top",children:"Top (centered)"}),
|
|
42
|
+
/* @__PURE__ */e("option",{value:"bottom",children:"Bottom (centered)"}),
|
|
43
|
+
/* @__PURE__ */e("option",{value:"left",children:"Left"}),
|
|
44
|
+
/* @__PURE__ */e("option",{value:"right",children:"Right"})]})]})}),
|
|
45
|
+
/* @__PURE__ */e("div",{className:"group-panels",children:0===r.panels.length?/* @__PURE__ */e("div",{className:"slot-empty-state",children:"Click panels to add tabs"}):r.panels.map((o,i)=>{const a=m(o),l="tabs"===r.type&&(r.config?.defaultActiveTab??0)===i;return a?/* @__PURE__ */t("div",{className:"group-panel-item",children:[
|
|
46
|
+
/* @__PURE__ */t("span",{className:"group-panel-label",children:[a.label,l&&/* @__PURE__ */e("span",{className:"default-badge",children:"★"})]}),
|
|
47
|
+
/* @__PURE__ */e("button",{className:"remove-from-group-btn",onClick:e=>R(n,o,e),title:`Remove ${a.label}`,children:"×"})]},o):null})})]}):/* @__PURE__ */t("div",{className:"slot-content",children:["string"==typeof r&&m(r)?.preview&&/* @__PURE__ */e("div",{className:"slot-preview",children:m(r)?.preview}),
|
|
48
|
+
/* @__PURE__ */e("div",{className:"slot-panel-label",children:"string"==typeof r?m(r)?.label:""}),
|
|
49
|
+
/* @__PURE__ */e("button",{className:"slot-clear-btn",onClick:e=>C(n,e),"aria-label":`Remove ${"string"==typeof r?m(r)?.label:"panel"} from ${n} slot`,children:"×"})]})]},n)})})]}),
|
|
50
|
+
/* @__PURE__ */t("div",{className:"configurator-section",children:[
|
|
51
|
+
/* @__PURE__ */e("h3",{className:"section-title",children:"Available Panels"}),
|
|
52
|
+
/* @__PURE__ */e("div",{className:"available-panels",children:E.map(n=>{const r=(o=n.id,"panel"===p?.type&&p.id===o);var o;const i=v(n.id);/* @__PURE__ */
|
|
53
|
+
return t("div",{className:`available-panel ${r?"selected":""} ${i?"in-use":""}`,onClick:()=>S(n.id),children:[
|
|
54
|
+
/* @__PURE__ */e("div",{className:"panel-label",children:n.label}),n.preview&&/* @__PURE__ */e("div",{className:"panel-preview",children:n.preview})]},n.id)})})]}),p&&/* @__PURE__ */e("div",{className:"selection-hint",children:"slot"===p.type?z(p.position)?/* @__PURE__ */t(n,{children:["Selected: ",p.position," slot (Tab Mode). Click panels to add them to the tab group."]}):/* @__PURE__ */t(n,{children:["Selected: ",p.position," slot. Click another slot to swap, or click a panel to assign."]}):/* @__PURE__ */t(n,{children:["Selected: ",m(p.id)?.label,". Click a slot to assign",z("left")||z("middle")||z("right")?" (or add to tab group)":"","."]})}),
|
|
55
|
+
/* @__PURE__ */t("div",{className:"usage-hint",children:[
|
|
56
|
+
/* @__PURE__ */e("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",style:{verticalAlign:"text-bottom",marginRight:"4px"},children:/* @__PURE__ */e("path",{d:"M8 1a7 7 0 100 14A7 7 0 008 1zm0 1a6 6 0 110 12A6 6 0 018 2zm.5 3.5v3h-1v-3h1zm0 4v1h-1v-1h1z"})}),
|
|
57
|
+
/* @__PURE__ */e("strong",{children:"Tip:"})," Toggle the tab icon on a slot to enable tab mode, then click panels to add multiple tabs."]})]})};function Qt(e,t){const[n,r]=o(()=>{if("undefined"==typeof window)return t;try{const n=window.localStorage.getItem(e);return n?JSON.parse(n):t}catch(n){return console.error(`Error reading localStorage key "${e}":`,n),t}}),i=a(t=>{try{const o=t instanceof Function?t(n):t;r(o),"undefined"!=typeof window&&window.localStorage.setItem(e,JSON.stringify(o))}catch(o){console.error(`Error setting localStorage key "${e}":`,o)}},[e,n]);return l(()=>{const t=t=>{if(t.key===e&&null!==t.newValue)try{r(JSON.parse(t.newValue))}catch(n){console.error(`Error parsing localStorage value for "${e}":`,n)}};return window.addEventListener("storage",t),()=>window.removeEventListener("storage",t)},[e]),[n,i]}export{R as AnimatedResizableLayout,N as AnimatedVerticalLayout,D as ConfigurablePanelLayout,Kt as EditableConfigurablePanelLayout,Gt as PanelConfigurator,T as ResponsiveConfigurablePanelLayout,M as SnapCarousel,z as TabGroup,E as ThreePanelLayout,S as mapThemeToPanelVars,C as mapThemeToTabVars,Qt as useLocalStorage,A as useMediaQuery};
|
|
58
|
+
//# sourceMappingURL=index.esm.js.map
|