@liberfi.io/ui-scaffold 0.1.179 → 1.0.1
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/dist/index.d.mts +128 -4
- package/dist/index.d.ts +128 -4
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +8 -8
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,130 @@
|
|
|
1
|
-
import * as react from 'react';
|
|
2
|
-
import { PropsWithChildren, ReactNode, CSSProperties } from 'react';
|
|
3
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as react from 'react';
|
|
3
|
+
import { ReactNode, Key, PropsWithChildren, CSSProperties } from 'react';
|
|
4
|
+
|
|
5
|
+
interface CollapsibleSectionProps {
|
|
6
|
+
/** Section title text. */
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
/** Initial open state when uncontrolled. Defaults to true. */
|
|
9
|
+
defaultOpen?: boolean;
|
|
10
|
+
/** Controlled open state. If set, component becomes controlled. */
|
|
11
|
+
open?: boolean;
|
|
12
|
+
/** Callback when open state changes (both controlled and uncontrolled). */
|
|
13
|
+
onOpenChange?: (open: boolean) => void;
|
|
14
|
+
/** Optional right-aligned slot in the header row. */
|
|
15
|
+
rightSlot?: ReactNode;
|
|
16
|
+
/** Content shown below the header when open. */
|
|
17
|
+
children?: ReactNode;
|
|
18
|
+
/** Extra className on the outer container. */
|
|
19
|
+
className?: string;
|
|
20
|
+
/** Extra className on the header button. */
|
|
21
|
+
headerClassName?: string;
|
|
22
|
+
/** Extra className on the body wrapper. */
|
|
23
|
+
bodyClassName?: string;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* CollapsibleSection — Axiom-style inline collapse with chevron rotation.
|
|
27
|
+
*
|
|
28
|
+
* Matches the `Token Info / Token Banner / Reused Image Tokens / Similar Tokens`
|
|
29
|
+
* sections on Axiom's trade page: the chevron rotates from `0deg` (open) to
|
|
30
|
+
* `-90deg` (closed) with a 150ms transform transition; the header button has a
|
|
31
|
+
* subtle hover background. Pure UI, no data coupling.
|
|
32
|
+
*/
|
|
33
|
+
declare function CollapsibleSection({ title, defaultOpen, open: controlledOpen, onOpenChange, rightSlot, children, className, headerClassName, bodyClassName, }: CollapsibleSectionProps): react_jsx_runtime.JSX.Element;
|
|
34
|
+
|
|
35
|
+
type AxiomSplitHandleOrientation = "horizontal" | "vertical";
|
|
36
|
+
interface AxiomSplitHandleProps {
|
|
37
|
+
/**
|
|
38
|
+
* Orientation:
|
|
39
|
+
* - `horizontal`: handle is a horizontal bar (`h-[4px] w-full`), drag resizes
|
|
40
|
+
* vertically (ns-resize cursor).
|
|
41
|
+
* - `vertical`: handle is a vertical bar (`w-[4px] h-full`), drag resizes
|
|
42
|
+
* horizontally (ew-resize cursor).
|
|
43
|
+
* Defaults to `horizontal`.
|
|
44
|
+
*/
|
|
45
|
+
orientation?: AxiomSplitHandleOrientation;
|
|
46
|
+
/**
|
|
47
|
+
* Called continuously during drag with the pixel delta since the last call.
|
|
48
|
+
* The parent owns the resized dimension state and should clamp as needed.
|
|
49
|
+
*/
|
|
50
|
+
onDrag: (delta: number) => void;
|
|
51
|
+
/** Called once when the drag starts. */
|
|
52
|
+
onDragStart?: () => void;
|
|
53
|
+
/** Called once when the drag ends. */
|
|
54
|
+
onDragEnd?: () => void;
|
|
55
|
+
/**
|
|
56
|
+
* Size of the invisible grab zone that extends on each side of the visible
|
|
57
|
+
* bar (in px). Defaults to 6, yielding a 16px-tall total hit area.
|
|
58
|
+
*/
|
|
59
|
+
grabZone?: number;
|
|
60
|
+
/** Extra className on the outer wrapper. */
|
|
61
|
+
className?: string;
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* AxiomSplitHandle — Axiom-style 4px draggable splitter.
|
|
65
|
+
*
|
|
66
|
+
* Visible 4px bar with centered dots; an invisible grab zone extends
|
|
67
|
+
* ±`grabZone` px on each perpendicular side for generous pointer
|
|
68
|
+
* affordance. Uses `PointerEvent` + `setPointerCapture` so a fast drag
|
|
69
|
+
* beyond the bar keeps tracking and touch gestures work out of the
|
|
70
|
+
* box. Pure UI, no layout state.
|
|
71
|
+
*/
|
|
72
|
+
declare function AxiomSplitHandle({ orientation, onDrag, onDragStart, onDragEnd, grabZone, className, }: AxiomSplitHandleProps): react_jsx_runtime.JSX.Element;
|
|
73
|
+
|
|
74
|
+
interface StatsFlipPanelProps {
|
|
75
|
+
/** Base layer shown at rest (e.g. 5m Vol / Buys / Sells / Net Vol.). */
|
|
76
|
+
base: ReactNode;
|
|
77
|
+
/** Overlay layer that cross-fades in on hover (e.g. 5m / 1h / 6h / 24h %). */
|
|
78
|
+
hover: ReactNode;
|
|
79
|
+
/** Enable the cursor-following radial glow. Defaults to true. */
|
|
80
|
+
glow?: boolean;
|
|
81
|
+
/** Fixed height of the panel. Defaults to 64. */
|
|
82
|
+
height?: number;
|
|
83
|
+
/** Optional className on the root container. */
|
|
84
|
+
className?: string;
|
|
85
|
+
/** Optional className on the overlay wrapper. */
|
|
86
|
+
overlayClassName?: string;
|
|
87
|
+
}
|
|
88
|
+
/**
|
|
89
|
+
* StatsFlipPanel — Axiom-style layered stat panel with hover cross-fade.
|
|
90
|
+
*
|
|
91
|
+
* The `base` layer is always rendered; on hover, the `hover` overlay fades in
|
|
92
|
+
* over a translucent blurred backdrop. A 150×150 radial gradient spotlight
|
|
93
|
+
* follows the cursor with an 80ms cubic-bezier transition, matching the
|
|
94
|
+
* signature Axiom interaction. Pure presentational — consumers own the data.
|
|
95
|
+
*/
|
|
96
|
+
declare function StatsFlipPanel({ base, hover, glow, height, className, overlayClassName, }: StatsFlipPanelProps): react_jsx_runtime.JSX.Element;
|
|
97
|
+
|
|
98
|
+
interface TabBarUnderlineItem<K extends Key = string> {
|
|
99
|
+
key: K;
|
|
100
|
+
label: ReactNode;
|
|
101
|
+
/** Optional count rendered as `(count)` suffix, e.g. `Holders (432)`. */
|
|
102
|
+
count?: number | string;
|
|
103
|
+
/** When true the tab is dimmed and not clickable. */
|
|
104
|
+
disabled?: boolean;
|
|
105
|
+
}
|
|
106
|
+
interface TabBarUnderlineProps<K extends Key = string> {
|
|
107
|
+
items: ReadonlyArray<TabBarUnderlineItem<K>>;
|
|
108
|
+
value: K;
|
|
109
|
+
onChange: (key: K) => void;
|
|
110
|
+
/** Extra className on the tab strip. */
|
|
111
|
+
className?: string;
|
|
112
|
+
/**
|
|
113
|
+
* Optional right-aligned toolbar slot rendered on the same row as the tabs
|
|
114
|
+
* (e.g. filter chips / Instant Trade toggle).
|
|
115
|
+
*/
|
|
116
|
+
rightSlot?: ReactNode;
|
|
117
|
+
}
|
|
118
|
+
/**
|
|
119
|
+
* TabBarUnderline — Axiom-style tab row with 2px underline on the active tab.
|
|
120
|
+
*
|
|
121
|
+
* - Outer button: 28px tall, 4px rounded, hover background.
|
|
122
|
+
* - Active inner track: 36px tall, 2px top padding, 2px bottom border set to
|
|
123
|
+
* `foreground`.
|
|
124
|
+
* - Horizontal scroll with scrollbar hidden so many tabs can coexist without
|
|
125
|
+
* wrapping. Presentational only.
|
|
126
|
+
*/
|
|
127
|
+
declare function TabBarUnderline<K extends Key = string>({ items, value, onChange, className, rightSlot, }: TabBarUnderlineProps<K>): react_jsx_runtime.JSX.Element;
|
|
4
128
|
|
|
5
129
|
type DraggableModalProps = PropsWithChildren<{
|
|
6
130
|
/** unique identifier for the modal, must be the same with the panel */
|
|
@@ -409,6 +533,6 @@ declare global {
|
|
|
409
533
|
};
|
|
410
534
|
}
|
|
411
535
|
}
|
|
412
|
-
declare const _default: "0.1
|
|
536
|
+
declare const _default: "1.0.1";
|
|
413
537
|
|
|
414
|
-
export { ALL_BREAKPOINTS, AsyncModal, type AsyncModalProps, type DraggableContentProps, DraggableModal, type DraggableModalProps, DraggablePanel, type DraggablePanelProps, DraggablePanelProvider, type DraggablePanelProviderProps, type LayoutBreakpoint, Logo, type LogoProps, type NavItem, NavLink, type NavLinkProps, type OpenAsyncModalOptions, type OpenDraggableModalOptions, type OpenDraggablePanelOptions, type RenderAsyncModalProps, Scaffold, ScaffoldContext, type ScaffoldContextValue, ScaffoldFooter, type ScaffoldFooterProps, ScaffoldHeader, type ScaffoldHeaderProps, type ScaffoldProps, ScaffoldToolbar, type ScaffoldToolbarProps, SplitHandle, type SplitHandleProps, SplitView, type SplitViewProps, type UseAsyncModalReturnType, type UseDraggableDisclosureReturnType, type UseDraggableModalDisclosureReturnType, type UseDraggablePanelDisclosureReturnType, getVisibilityClass, isNavItemActive, useAsyncModal, useDraggableDisclosure, useDraggableModalDisclosure, useDraggablePanelDisclosure, useScaffold, useScaffoldLayout, _default as version };
|
|
538
|
+
export { ALL_BREAKPOINTS, AsyncModal, type AsyncModalProps, AxiomSplitHandle, type AxiomSplitHandleOrientation, type AxiomSplitHandleProps, CollapsibleSection, type CollapsibleSectionProps, type DraggableContentProps, DraggableModal, type DraggableModalProps, DraggablePanel, type DraggablePanelProps, DraggablePanelProvider, type DraggablePanelProviderProps, type LayoutBreakpoint, Logo, type LogoProps, type NavItem, NavLink, type NavLinkProps, type OpenAsyncModalOptions, type OpenDraggableModalOptions, type OpenDraggablePanelOptions, type RenderAsyncModalProps, Scaffold, ScaffoldContext, type ScaffoldContextValue, ScaffoldFooter, type ScaffoldFooterProps, ScaffoldHeader, type ScaffoldHeaderProps, type ScaffoldProps, ScaffoldToolbar, type ScaffoldToolbarProps, SplitHandle, type SplitHandleProps, SplitView, type SplitViewProps, StatsFlipPanel, type StatsFlipPanelProps, TabBarUnderline, type TabBarUnderlineItem, type TabBarUnderlineProps, type UseAsyncModalReturnType, type UseDraggableDisclosureReturnType, type UseDraggableModalDisclosureReturnType, type UseDraggablePanelDisclosureReturnType, getVisibilityClass, isNavItemActive, useAsyncModal, useDraggableDisclosure, useDraggableModalDisclosure, useDraggablePanelDisclosure, useScaffold, useScaffoldLayout, _default as version };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,130 @@
|
|
|
1
|
-
import * as react from 'react';
|
|
2
|
-
import { PropsWithChildren, ReactNode, CSSProperties } from 'react';
|
|
3
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as react from 'react';
|
|
3
|
+
import { ReactNode, Key, PropsWithChildren, CSSProperties } from 'react';
|
|
4
|
+
|
|
5
|
+
interface CollapsibleSectionProps {
|
|
6
|
+
/** Section title text. */
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
/** Initial open state when uncontrolled. Defaults to true. */
|
|
9
|
+
defaultOpen?: boolean;
|
|
10
|
+
/** Controlled open state. If set, component becomes controlled. */
|
|
11
|
+
open?: boolean;
|
|
12
|
+
/** Callback when open state changes (both controlled and uncontrolled). */
|
|
13
|
+
onOpenChange?: (open: boolean) => void;
|
|
14
|
+
/** Optional right-aligned slot in the header row. */
|
|
15
|
+
rightSlot?: ReactNode;
|
|
16
|
+
/** Content shown below the header when open. */
|
|
17
|
+
children?: ReactNode;
|
|
18
|
+
/** Extra className on the outer container. */
|
|
19
|
+
className?: string;
|
|
20
|
+
/** Extra className on the header button. */
|
|
21
|
+
headerClassName?: string;
|
|
22
|
+
/** Extra className on the body wrapper. */
|
|
23
|
+
bodyClassName?: string;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* CollapsibleSection — Axiom-style inline collapse with chevron rotation.
|
|
27
|
+
*
|
|
28
|
+
* Matches the `Token Info / Token Banner / Reused Image Tokens / Similar Tokens`
|
|
29
|
+
* sections on Axiom's trade page: the chevron rotates from `0deg` (open) to
|
|
30
|
+
* `-90deg` (closed) with a 150ms transform transition; the header button has a
|
|
31
|
+
* subtle hover background. Pure UI, no data coupling.
|
|
32
|
+
*/
|
|
33
|
+
declare function CollapsibleSection({ title, defaultOpen, open: controlledOpen, onOpenChange, rightSlot, children, className, headerClassName, bodyClassName, }: CollapsibleSectionProps): react_jsx_runtime.JSX.Element;
|
|
34
|
+
|
|
35
|
+
type AxiomSplitHandleOrientation = "horizontal" | "vertical";
|
|
36
|
+
interface AxiomSplitHandleProps {
|
|
37
|
+
/**
|
|
38
|
+
* Orientation:
|
|
39
|
+
* - `horizontal`: handle is a horizontal bar (`h-[4px] w-full`), drag resizes
|
|
40
|
+
* vertically (ns-resize cursor).
|
|
41
|
+
* - `vertical`: handle is a vertical bar (`w-[4px] h-full`), drag resizes
|
|
42
|
+
* horizontally (ew-resize cursor).
|
|
43
|
+
* Defaults to `horizontal`.
|
|
44
|
+
*/
|
|
45
|
+
orientation?: AxiomSplitHandleOrientation;
|
|
46
|
+
/**
|
|
47
|
+
* Called continuously during drag with the pixel delta since the last call.
|
|
48
|
+
* The parent owns the resized dimension state and should clamp as needed.
|
|
49
|
+
*/
|
|
50
|
+
onDrag: (delta: number) => void;
|
|
51
|
+
/** Called once when the drag starts. */
|
|
52
|
+
onDragStart?: () => void;
|
|
53
|
+
/** Called once when the drag ends. */
|
|
54
|
+
onDragEnd?: () => void;
|
|
55
|
+
/**
|
|
56
|
+
* Size of the invisible grab zone that extends on each side of the visible
|
|
57
|
+
* bar (in px). Defaults to 6, yielding a 16px-tall total hit area.
|
|
58
|
+
*/
|
|
59
|
+
grabZone?: number;
|
|
60
|
+
/** Extra className on the outer wrapper. */
|
|
61
|
+
className?: string;
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* AxiomSplitHandle — Axiom-style 4px draggable splitter.
|
|
65
|
+
*
|
|
66
|
+
* Visible 4px bar with centered dots; an invisible grab zone extends
|
|
67
|
+
* ±`grabZone` px on each perpendicular side for generous pointer
|
|
68
|
+
* affordance. Uses `PointerEvent` + `setPointerCapture` so a fast drag
|
|
69
|
+
* beyond the bar keeps tracking and touch gestures work out of the
|
|
70
|
+
* box. Pure UI, no layout state.
|
|
71
|
+
*/
|
|
72
|
+
declare function AxiomSplitHandle({ orientation, onDrag, onDragStart, onDragEnd, grabZone, className, }: AxiomSplitHandleProps): react_jsx_runtime.JSX.Element;
|
|
73
|
+
|
|
74
|
+
interface StatsFlipPanelProps {
|
|
75
|
+
/** Base layer shown at rest (e.g. 5m Vol / Buys / Sells / Net Vol.). */
|
|
76
|
+
base: ReactNode;
|
|
77
|
+
/** Overlay layer that cross-fades in on hover (e.g. 5m / 1h / 6h / 24h %). */
|
|
78
|
+
hover: ReactNode;
|
|
79
|
+
/** Enable the cursor-following radial glow. Defaults to true. */
|
|
80
|
+
glow?: boolean;
|
|
81
|
+
/** Fixed height of the panel. Defaults to 64. */
|
|
82
|
+
height?: number;
|
|
83
|
+
/** Optional className on the root container. */
|
|
84
|
+
className?: string;
|
|
85
|
+
/** Optional className on the overlay wrapper. */
|
|
86
|
+
overlayClassName?: string;
|
|
87
|
+
}
|
|
88
|
+
/**
|
|
89
|
+
* StatsFlipPanel — Axiom-style layered stat panel with hover cross-fade.
|
|
90
|
+
*
|
|
91
|
+
* The `base` layer is always rendered; on hover, the `hover` overlay fades in
|
|
92
|
+
* over a translucent blurred backdrop. A 150×150 radial gradient spotlight
|
|
93
|
+
* follows the cursor with an 80ms cubic-bezier transition, matching the
|
|
94
|
+
* signature Axiom interaction. Pure presentational — consumers own the data.
|
|
95
|
+
*/
|
|
96
|
+
declare function StatsFlipPanel({ base, hover, glow, height, className, overlayClassName, }: StatsFlipPanelProps): react_jsx_runtime.JSX.Element;
|
|
97
|
+
|
|
98
|
+
interface TabBarUnderlineItem<K extends Key = string> {
|
|
99
|
+
key: K;
|
|
100
|
+
label: ReactNode;
|
|
101
|
+
/** Optional count rendered as `(count)` suffix, e.g. `Holders (432)`. */
|
|
102
|
+
count?: number | string;
|
|
103
|
+
/** When true the tab is dimmed and not clickable. */
|
|
104
|
+
disabled?: boolean;
|
|
105
|
+
}
|
|
106
|
+
interface TabBarUnderlineProps<K extends Key = string> {
|
|
107
|
+
items: ReadonlyArray<TabBarUnderlineItem<K>>;
|
|
108
|
+
value: K;
|
|
109
|
+
onChange: (key: K) => void;
|
|
110
|
+
/** Extra className on the tab strip. */
|
|
111
|
+
className?: string;
|
|
112
|
+
/**
|
|
113
|
+
* Optional right-aligned toolbar slot rendered on the same row as the tabs
|
|
114
|
+
* (e.g. filter chips / Instant Trade toggle).
|
|
115
|
+
*/
|
|
116
|
+
rightSlot?: ReactNode;
|
|
117
|
+
}
|
|
118
|
+
/**
|
|
119
|
+
* TabBarUnderline — Axiom-style tab row with 2px underline on the active tab.
|
|
120
|
+
*
|
|
121
|
+
* - Outer button: 28px tall, 4px rounded, hover background.
|
|
122
|
+
* - Active inner track: 36px tall, 2px top padding, 2px bottom border set to
|
|
123
|
+
* `foreground`.
|
|
124
|
+
* - Horizontal scroll with scrollbar hidden so many tabs can coexist without
|
|
125
|
+
* wrapping. Presentational only.
|
|
126
|
+
*/
|
|
127
|
+
declare function TabBarUnderline<K extends Key = string>({ items, value, onChange, className, rightSlot, }: TabBarUnderlineProps<K>): react_jsx_runtime.JSX.Element;
|
|
4
128
|
|
|
5
129
|
type DraggableModalProps = PropsWithChildren<{
|
|
6
130
|
/** unique identifier for the modal, must be the same with the panel */
|
|
@@ -409,6 +533,6 @@ declare global {
|
|
|
409
533
|
};
|
|
410
534
|
}
|
|
411
535
|
}
|
|
412
|
-
declare const _default: "0.1
|
|
536
|
+
declare const _default: "1.0.1";
|
|
413
537
|
|
|
414
|
-
export { ALL_BREAKPOINTS, AsyncModal, type AsyncModalProps, type DraggableContentProps, DraggableModal, type DraggableModalProps, DraggablePanel, type DraggablePanelProps, DraggablePanelProvider, type DraggablePanelProviderProps, type LayoutBreakpoint, Logo, type LogoProps, type NavItem, NavLink, type NavLinkProps, type OpenAsyncModalOptions, type OpenDraggableModalOptions, type OpenDraggablePanelOptions, type RenderAsyncModalProps, Scaffold, ScaffoldContext, type ScaffoldContextValue, ScaffoldFooter, type ScaffoldFooterProps, ScaffoldHeader, type ScaffoldHeaderProps, type ScaffoldProps, ScaffoldToolbar, type ScaffoldToolbarProps, SplitHandle, type SplitHandleProps, SplitView, type SplitViewProps, type UseAsyncModalReturnType, type UseDraggableDisclosureReturnType, type UseDraggableModalDisclosureReturnType, type UseDraggablePanelDisclosureReturnType, getVisibilityClass, isNavItemActive, useAsyncModal, useDraggableDisclosure, useDraggableModalDisclosure, useDraggablePanelDisclosure, useScaffold, useScaffoldLayout, _default as version };
|
|
538
|
+
export { ALL_BREAKPOINTS, AsyncModal, type AsyncModalProps, AxiomSplitHandle, type AxiomSplitHandleOrientation, type AxiomSplitHandleProps, CollapsibleSection, type CollapsibleSectionProps, type DraggableContentProps, DraggableModal, type DraggableModalProps, DraggablePanel, type DraggablePanelProps, DraggablePanelProvider, type DraggablePanelProviderProps, type LayoutBreakpoint, Logo, type LogoProps, type NavItem, NavLink, type NavLinkProps, type OpenAsyncModalOptions, type OpenDraggableModalOptions, type OpenDraggablePanelOptions, type RenderAsyncModalProps, Scaffold, ScaffoldContext, type ScaffoldContextValue, ScaffoldFooter, type ScaffoldFooterProps, ScaffoldHeader, type ScaffoldHeaderProps, type ScaffoldProps, ScaffoldToolbar, type ScaffoldToolbarProps, SplitHandle, type SplitHandleProps, SplitView, type SplitViewProps, StatsFlipPanel, type StatsFlipPanelProps, TabBarUnderline, type TabBarUnderlineItem, type TabBarUnderlineProps, type UseAsyncModalReturnType, type UseDraggableDisclosureReturnType, type UseDraggableModalDisclosureReturnType, type UseDraggablePanelDisclosureReturnType, getVisibilityClass, isNavItemActive, useAsyncModal, useDraggableDisclosure, useDraggableModalDisclosure, useDraggablePanelDisclosure, useScaffold, useScaffoldLayout, _default as version };
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var react=require('react'),reactDom=require('react-dom'),jotai=require('jotai'),hooks=require('@liberfi.io/hooks'),i18n=require('@liberfi.io/i18n'),ui$1=require('@liberfi.io/ui'),utils$1=require('@liberfi.io/utils'),jotaiFamily=require('jotai-family'),utils=require('jotai/utils'),jsxRuntime=require('react/jsx-runtime');var ct="";function Ct(e){ct=e;}function V(e,t){let n=`${e}.${t??"default"}`;return ct?`${ct}:${n}`:n}var xe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("panelState",e),"none",void 0,{getOnInit:true})),Xe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("panelWidth",e),350,void 0,{getOnInit:true})),Ye=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("panelMinWidth",e),320,void 0,{getOnInit:true})),Ue=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("panelMaxWidth",e),440,void 0,{getOnInit:true})),Vt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalOpen",e),false,void 0,{getOnInit:true})),Ze=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalShouldStartDragging",e),false,void 0,{getOnInit:true})),je=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalSize",e),{width:350,height:580},void 0,{getOnInit:true})),Ge=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalRestoreSize",e),{width:350,height:580},void 0,{getOnInit:true})),Ke=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalPosition",e),{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),Je=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalRestorePosition",e),{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),qe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalMinimized",e),false,void 0,{getOnInit:true})),Qe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalMinWidth",e),200,void 0,{getOnInit:true})),et=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("modalMaxWidth",e),typeof window<"u"?window.innerWidth-40:0,void 0,{getOnInit:true})),Re=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("lastPanelType",e),"modal",void 0,{getOnInit:true})),tt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(V("panelOrders",null),{left:{},right:{}},void 0,{getOnInit:true}));function Me(e){let[t,n]=jotai.useAtom(Vt(e)),[i,r]=jotai.useAtom(qe(e)),d=jotai.useAtomValue(Ge(e)),a=jotai.useAtomValue(Je(e)),c=jotai.useSetAtom(je(e)),m=jotai.useSetAtom(Ke(e)),o=jotai.useSetAtom(Ze(e)),s=jotai.useSetAtom(Re(e)),f=react.useCallback((z={})=>{let{shouldStartDragging:p,position:v,size:w}=z;v&&m(P=>({...P,...v})),w&&c(P=>({...P,...w})),o(p??false),n(true),s("modal");},[n,m,c,o]),b=react.useCallback(()=>{n(false),i&&(c({...d}),m({...a}),r(false));},[i,d,a,r,n,c,m]);return react.useMemo(()=>({isOpen:t,onOpen:f,onClose:b}),[t,f,b])}function ze(e){let[t,n]=jotai.useAtom(xe(e)),i=jotai.useSetAtom(Xe(e)),r=jotai.useSetAtom(Re(e)),d=jotai.useSetAtom(tt(null)),a=react.useCallback((s={})=>{let f=s.position??"left";i(s.width??320),n(f),r(f),d(({left:b,right:z})=>f==="left"?{left:{...b,[e]:Date.now()},right:z}:{left:b,right:{...z,[e]:Date.now()}});},[e,n,i]),c=react.useCallback(()=>{n("none");},[n]),m=react.useMemo(()=>t!=="none",[t]),o=react.useMemo(()=>t!=="none"?t:void 0,[t]);return react.useMemo(()=>({isOpen:m,position:o,onOpen:a,onClose:c}),[m,a,c])}var Ao={width:200,height:48},Ve={width:typeof window<"u"?window.innerWidth-40:0,height:typeof window<"u"?window.innerHeight-40:0},_o={x:20,y:20},$t=react.memo(function({id:t,title:n,minWidth:i=504,maxWidth:r=Ve.width,minHeight:d=200,maxHeight:a=Ve.height,leftSidebar:c,leftSidebarWidth:m=200,rightSidebar:o,rightSidebarWidth:s=200,aspectRatio:f,showHeader:b=true,header:z,headerHeight:p=44,children:v}){let{t:w}=i18n.useTranslation(),{isOpen:P,onClose:K}=Me(t),{onOpen:U}=ze(t),[S,R]=jotai.useAtom(qe(t)),[x,ue]=jotai.useAtom(Ke(t)),[u,me]=jotai.useAtom(je(t)),[Z,ne]=jotai.useAtom(Ge(t)),[X,J]=jotai.useAtom(Je(t)),[re,ie]=jotai.useAtom(Ze(t)),[N,se]=react.useState(re),[fe,y]=react.useState(false),[W,ae]=react.useState(null),[pe,le]=react.useState(null),[he,_]=react.useState(null),[ve,de]=react.useState(null),q=react.useRef(null),uo=jotai.useAtomValue(Ye(t)),mo=jotai.useAtomValue(Ue(t)),Q=hooks.useValueRef(x),E=hooks.useCallbackRef(ue),ge=hooks.useValueRef(u),H=hooks.useCallbackRef(me),fo=hooks.useValueRef(m),po=hooks.useValueRef(!!c),ho=hooks.useValueRef(s),go=hooks.useValueRef(!!o),j=hooks.useValueRef(f),ee=hooks.useValueRef(p),We=hooks.useValueRef(i),Ee=hooks.useValueRef(r),ke=hooks.useValueRef(d),Le=hooks.useValueRef(a),bo=hooks.useValueRef(N),Dt=hooks.useValueRef(pe),dt=hooks.useValueRef(ve),xo=hooks.useCallbackRef(K),yo=hooks.useCallbackRef(U),vo=hooks.useValueRef(uo),wo=hooks.useValueRef(mo),Ie=react.useMemo(()=>u.width===Ve.width&&u.height===Ve.height,[u.width,u.height]);react.useEffect(()=>{let l=Math.min(Math.max(u.width,i),r),k=Math.min(Math.max(u.height,d),a);(l!==u.width||k!==u.height)&&H({width:l,height:k});let A=Math.max(0,x.x),be=Math.max(0,x.y);A+l>window.innerWidth&&(A=Math.max(0,window.innerWidth-l)),be+k>window.innerHeight&&(be=Math.max(0,window.innerHeight-k)),(A!==x.x||be!==x.y)&&E({x:A,y:be});},[t]),react.useEffect(()=>{if(P&&re){se(true);let l=A=>{E({x:A.clientX-u.width/2,y:A.clientY-20});},k=()=>{se(false),ie(false),document.removeEventListener("mousemove",l),document.removeEventListener("mouseup",k);};return document.addEventListener("mousemove",l),document.addEventListener("mouseup",k),document.body.style.cursor="grabbing",()=>{document.removeEventListener("mousemove",l),document.removeEventListener("mouseup",k),document.body.style.cursor="";}}},[P,re,ie,u.width]);let G=(l,k,A)=>{ie(false),se(false),y(false),ae(null),k==="drag"?se(true):k==="resize"&&(ae(A||null),y(true));let be=l.clientX,Ot=l.clientY,B=ge.current.width,Y=ge.current.height,$={...Q.current},Wt=()=>{document.removeEventListener("mousemove",Et),document.removeEventListener("mouseup",kt),document.body.style.cursor="",se(false),y(false),ae(null),le(null),q.current&&(clearTimeout(q.current),q.current=null),de(null),_(null);},Et=Be=>{if(k==="drag"){let te=Be.clientX-be,oe=Be.clientY-Ot,D=$.x+te,g=$.y+oe,we=po.current?fo.current:0,Ce=12+we,F=go.current?ho.current:0,O=window.innerWidth-12-B-F,$e=window.innerHeight-12-44,L=D<=Ce?"left":D>=O?"right":null;L!==Dt.current&&le(L),q.current&&L&&_(L),q.current&&(dt.current==="left"&&(D>Ce||L!=="left")||dt.current==="right"&&(D<O||L!=="right"))&&(clearTimeout(q.current),q.current=null,de(null),_(null)),!q.current&&L&&dt.current!==L&&(de(L),_(L),q.current=setTimeout(()=>{bo.current&&Dt.current===L?(Wt(),xo(),yo({position:L,width:Math.min(Math.max(ge.current.width,vo.current),wo.current)})):de(null);},350)),D=Math.min(Math.max(D,12+we),O),g=Math.min(Math.max(g,12),$e),E({x:D,y:g});}else if(k==="resize"&&A){let te=Be.clientX-be,oe=Be.clientY-Ot,D=(g,we,Ce)=>{let F=Math.min(Math.max(g,We.current),Ee.current),O=Math.min(Math.max(we,ke.current),Le.current);if(j.current){if(Ce==="width")O=Math.min(Math.max(g/j.current+ee.current,ke.current),Le.current),F=(O-ee.current)*j.current;else if(Ce==="height")F=Math.min(Math.max((we-ee.current)*j.current,We.current),Ee.current),O=F/j.current+ee.current;else {let $e=g/j.current+ee.current,L=(we-ee.current)*j.current,Lt=Math.abs(te),It=Math.abs(oe);if(Lt>1.1*It)O=Math.min(Math.max($e,ke.current),Le.current),F=(O-ee.current)*j.current;else if(It>1.1*Lt)F=Math.min(Math.max(L,We.current),Ee.current),O=F/j.current+ee.current;else {let zo=(O+$e)/2;F=Math.min(Math.max((F+L)/2,We.current),Ee.current),O=Math.min(Math.max(zo,ke.current),Le.current),F=(O-ee.current)*j.current;}}F=Math.min(Math.max(F,We.current),Ee.current),O=Math.min(Math.max(O,ke.current),Le.current);}return {width:F,height:O}};switch(A){case "topLeft":{let g=D(B-te,Y-oe,"both");H(g),E({x:$.x+(B-g.width),y:$.y+(Y-g.height)});break}case "topRight":{let g=D(B+te,Y-oe,"both");H(g),E({x:$.x,y:$.y+(Y-g.height)});break}case "bottomLeft":{let g=D(B-te,Y+oe,"both");H(g),E({x:$.x+(B-g.width),y:$.y});break}case "bottomRight":{H(D(B+te,Y+oe,"both"));break}case "top":{let g=D(B,Y-oe,"height");H(g),E({x:$.x,y:$.y+(Y-g.height)});break}case "bottom":{H(D(B,Y+oe,"height"));break}case "left":{let g=D(B-te,Y,"width");H(g),E({x:$.x+(B-g.width),y:$.y});break}case "right":{H(D(B+te,Y,"width"));break}}}},kt=()=>{(x.x<0||x.y<0)&&E({x:Math.max(0,x.x),y:Math.max(0,x.y)}),Wt();};document.addEventListener("mousemove",Et),document.addEventListener("mouseup",kt);},Ro=react.useCallback(()=>{S?(H({...Z}),E({...X}),R(false)):(Ie?E({...X}):(ne({...u}),J({...x})),H({...Ao}),R(true));},[S,Ie,u,x,Z,X,R,ne,J]),Mo=react.useCallback(()=>{Ie?(H({...Z}),E({...X})):(S?R(false):(ne({...u}),J({...x})),H({...Ve}),E({..._o}));},[Ie,S,u,x,Z,X,R,ne,J]);return react.useEffect(()=>{let l=utils$1.throttle(()=>{(Q.current.x<0||Q.current.y<0)&&E({x:Math.max(0,Q.current.x),y:Math.max(0,Q.current.y)});let k=Q.current.x+ge.current.width,A=Q.current.y+ge.current.height;(k>window.innerWidth||A>window.innerHeight)&&E({x:Math.min(Q.current.x,Math.max(0,window.innerWidth-ge.current.width)),y:Math.min(Q.current.y,Math.max(0,window.innerHeight-ge.current.height))});},100);return window.addEventListener("resize",l),()=>{window.removeEventListener("resize",l);}},[]),P?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[(N||fe)&&reactDom.createPortal(jsxRuntime.jsx("div",{className:ui$1.cn("max-sm:hidden fixed inset-0 z-9999 bg-transparent w-full h-full select-none",N&&(ve?"cursor-grabbing":"cursor-move"),!N&&{"cursor-ns-resize":W==="top"||W==="bottom","cursor-ew-resize":W==="left"||W==="right","cursor-nwse-resize":W==="topLeft"||W==="bottomRight","cursor-nesw-resize":W==="topRight"||W==="bottomLeft","cursor-auto":W===null})}),document.body),jsxRuntime.jsx("div",{className:ui$1.cn("max-sm:hidden fixed z-50 left-0 top-0",N?"will-change-transform":"will-change-auto",fe||N?"transition-none":"transition-transform duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]"),style:{transform:`translate(${Math.round(x.x-(c?m:0))}px, ${Math.round(x.y)}px)`},children:jsxRuntime.jsxs("div",{className:"flex relative z-50",children:[c&&jsxRuntime.jsx("div",{className:ui$1.cn("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",N?"opacity-40 translate-x-4":"opacity-100 translate-x-0"),style:{width:m,height:S?40:u.height-8},children:c}),jsxRuntime.jsx("div",{className:ui$1.cn("z-50 relative bg-content1 border border-border rounded-lg overflow-hidden",N?"opacity-80 shadow-md scale-102 blur-[0.5px]":"opacity-100 shadow-lg scale-100 blur-none"),style:{width:u.width,height:u.height,transition:fe||N?"none":"transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:jsxRuntime.jsxs("div",{className:ui$1.cn("w-full h-full",he&&"animate-modal-shrink",he==="left"?"origin-left":"origin-right"),style:{contain:"paint"},children:[!S&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"absolute top-0 left-0 w-3 h-3 cursor-nw-resize z-20",onMouseDown:l=>G(l,"resize","topLeft")}),jsxRuntime.jsx("div",{className:"absolute top-0 right-0 w-3 h-3 cursor-ne-resize z-20",onMouseDown:l=>G(l,"resize","topRight")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 left-0 w-3 h-3 cursor-sw-resize z-20",onMouseDown:l=>G(l,"resize","bottomLeft")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 right-0 w-3 h-3 cursor-se-resize z-20",onMouseDown:l=>G(l,"resize","bottomRight")}),jsxRuntime.jsx("div",{className:"absolute top-0 left-3 right-3 h-1.5 cursor-n-resize z-20",onMouseDown:l=>G(l,"resize","top")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 left-3 right-3 h-1.5 cursor-s-resize z-20",onMouseDown:l=>G(l,"resize","bottom")}),jsxRuntime.jsx("div",{className:"absolute left-0 top-3 bottom-3 w-1.5 cursor-w-resize z-20",onMouseDown:l=>G(l,"resize","left")}),jsxRuntime.jsx("div",{className:"absolute right-0 top-3 bottom-3 w-1.5 cursor-e-resize z-20",onMouseDown:l=>G(l,"resize","right")})]}),b&&jsxRuntime.jsxs("div",{className:"relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:l=>G(l,"drag"),style:{height:p},children:[jsxRuntime.jsx(ui$1.StyledTooltip,{placement:"top",content:w("scaffold.draggableModal.snapToEdge"),children:jsxRuntime.jsx(ui$1.DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),z||jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:l=>l.stopPropagation(),children:n}),jsxRuntime.jsxs("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:l=>l.stopPropagation(),children:[jsxRuntime.jsx(ui$1.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Ro,children:S?jsxRuntime.jsx(ui$1.RestoreWindowIcon,{width:18,height:18,className:"text-neutral"}):jsxRuntime.jsx(ui$1.MinimizeIcon,{width:18,height:18,className:"text-neutral"})}),jsxRuntime.jsx(ui$1.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Mo,children:Ie?jsxRuntime.jsx(ui$1.UnMaximizeIcon,{width:18,height:18,className:"text-neutral"}):jsxRuntime.jsx(ui$1.MaximizeIcon,{width:18,height:18,className:"text-neutral"})}),jsxRuntime.jsx(ui$1.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:K,children:jsxRuntime.jsx(ui$1.XCloseIcon,{width:18,height:18,className:"text-neutral"})})]})]})]}),!S&&jsxRuntime.jsx("div",{className:b?"h-[calc(100%-44px)] overflow-x-hidden overflow-y-auto":"h-full overflow-x-hidden overflow-y-auto cursor-move",onMouseDown:b?void 0:l=>G(l,"drag"),children:v})]})}),o&&jsxRuntime.jsx("div",{className:ui$1.cn("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",N?"opacity-40 -translate-x-4":"opacity-100 translate-x-0"),style:{width:s,height:S?40:u.height-8},children:o})]})})]}):null});function xt({id:e,title:t,maxWidth:n=440,minWidth:i=320,position:r,showHeader:d=true,header:a,headerHeight:c=44,children:m}){let{t:o}=i18n.useTranslation(),s=jotai.useAtomValue(xe(e)),[f,b]=react.useState(false),[z,p]=react.useState(false),[v,w]=jotai.useAtom(Xe(e)),{onOpen:P}=Me(e),{onClose:K}=ze(e),U=jotai.useAtomValue(Qe(e)),S=jotai.useAtomValue(et(e)),R=hooks.useValueRef(v),x=hooks.useValueRef(n),ue=hooks.useValueRef(i),u=hooks.useValueRef(r),me=hooks.useValueRef(f),Z=hooks.useValueRef(z),ne=hooks.useCallbackRef(w),X=hooks.useCallbackRef(P),J=hooks.useCallbackRef(K),re=hooks.useValueRef(U),ie=hooks.useValueRef(S),N=y=>{y.preventDefault(),y.stopPropagation(),b(true),document.body.style.cursor="ew-resize",document.body.style.userSelect="none",document.body.style.overflow="hidden",document.body.style.position="fixed",document.body.style.width="100%",document.body.style.height="100%";let W=y.clientX,ae=R.current,pe=he=>{if(!me.current)return;let _=he.clientX-W,ve=u.current==="right"?ae-_:ae+_,de=Math.min(Math.max(ve,ue.current),x.current);ne(de);},le=()=>{b(false),document.body.style.cursor="",document.body.style.userSelect="",document.body.style.overflow="",document.body.style.position="",document.body.style.width="",document.body.style.height="",document.removeEventListener("mousemove",pe),document.removeEventListener("mouseup",le);};document.addEventListener("mousemove",pe),document.addEventListener("mouseup",le);},se=y=>{if(y.target instanceof HTMLElement&&y.target.closest("button"))return;y.preventDefault(),p(true);let W=y.clientX,ae=y.clientY,pe=()=>{document.removeEventListener("mousemove",le),document.removeEventListener("mouseup",he),p(false);},le=_=>{if(!Z.current)return;let ve=Math.abs(_.clientX-W),de=Math.abs(_.clientY-ae);(ve>10||de>10)&&(pe(),J(),X({shouldStartDragging:true,position:{x:_.clientX-R.current/2+20,y:_.clientY-20},size:{width:Math.min(Math.max(R.current,re.current),ie.current)}}));},he=()=>{pe();};document.addEventListener("mousemove",le),document.addEventListener("mouseup",he);},fe=()=>{J();};return s!==r?null:jsxRuntime.jsxs("div",{className:"max-sm:hidden flex-none flex flex-row overflow-hidden",children:[r==="right"&&jsxRuntime.jsx(Yt,{isResizing:f,handleResizeStart:N}),jsxRuntime.jsxs("div",{className:ui$1.cn("flex flex-col min-h-0 overflow-hidden bg-content1",z?"opacity-80 scale-98 blur-[1px]":"opacity-100 scale-100 blur-none"),style:{width:`${v}px`,transition:f||z?"none":"transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:[d&&jsxRuntime.jsxs("div",{className:"flex-none relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:se,style:{height:c},children:[jsxRuntime.jsx(ui$1.StyledTooltip,{placement:"top",content:o("scaffold.draggablePanel.snapToModal"),children:jsxRuntime.jsx(ui$1.DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),a||jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:y=>y.stopPropagation(),children:t}),jsxRuntime.jsx("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:y=>y.stopPropagation(),children:jsxRuntime.jsx(ui$1.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:fe,children:jsxRuntime.jsx(ui$1.XCloseIcon,{width:18,height:18,className:"text-neutral"})})})]})]}),jsxRuntime.jsx("div",{className:"flex-auto min-h-0 overflow-y-auto",children:m})]}),r==="left"&&jsxRuntime.jsx(Yt,{isResizing:f,handleResizeStart:N})]})}function Yt({isResizing:e,handleResizeStart:t}){return jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsxs("div",{className:"relative w-1 h-full cursor-ew-resize bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out group flex flex-col items-center justify-center gap-1",children:[jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("div",{className:"absolute inset-0 -left-1.5 -right-1.5 cursor-ew-resize",onMouseDown:t})]}),e&&jsxRuntime.jsx("div",{className:"fixed inset-0 z-50 cursor-ew-resize"})]})}function vr({contents:e=[],storagePrefix:t,className:n,classNames:i,children:r}){let d=react.useRef(false);!d.current&&t!==void 0&&(Ct(t),d.current=true);let a=jotai.useAtomValue(tt(null));react.useEffect(()=>{let o=jotai.getDefaultStore();e.forEach(s=>{o.set(Ye(s.id),s.panelMinWidth??320),o.set(Ue(s.id),s.panelMaxWidth??440),o.set(Qe(s.id),s.modalMinWidth??504),o.set(et(s.id),s.modalMaxWidth??window.innerWidth-40);});},[e]);let c=react.useMemo(()=>e.filter(o=>{let s=jotai.getDefaultStore();return a.left[o.id]?s.get(xe(o.id))==="left":false}).sort((o,s)=>a.left[s.id]-a.left[o.id]),[e,a.left]),m=react.useMemo(()=>e.filter(o=>{let s=jotai.getDefaultStore();return a.right[o.id]?s.get(xe(o.id))==="right":false}).sort((o,s)=>(a.right[o.id]??0)-(a.right[s.id]??0)),[e,a.right]);return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:ui$1.cn("w-full h-full flex flex-row overflow-hidden",n,i?.root),children:[jsxRuntime.jsx("div",{className:ui$1.cn("flex-none h-full flex flex-row",i?.left),children:c.map(o=>jsxRuntime.jsx(xt,{...o,position:"left",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`left-${o.id}`))}),jsxRuntime.jsx("div",{className:ui$1.cn("flex-auto min-w-0 h-full",i?.content),children:r}),jsxRuntime.jsx("div",{className:ui$1.cn("flex-none h-full flex flex-row",i?.right),children:m.map(o=>jsxRuntime.jsx(xt,{...o,position:"right",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`right-${o.id}`))})]}),e.map(o=>jsxRuntime.jsx($t,{...o,minWidth:o.modalMinWidth??504,maxWidth:o.modalMaxWidth??window.innerWidth-40},`modal-${o.id}`))]})}function Dr(e){let{isOpen:t,onOpen:n,onClose:i}=Me(e),{isOpen:r,onOpen:d,onClose:a}=ze(e),c=jotai.useAtomValue(Re(e)),m=react.useCallback(()=>{t||r||(c==="modal"?n():d({position:c}));},[t,r,c,n,d]),o=react.useCallback(()=>{t?i():r&&a();},[t,r,i,a]),s=react.useMemo(()=>t||r,[t,r]);return react.useMemo(()=>({isOpen:s,onOpen:m,onClose:o}),[s,m,o])}var Kt=["desktop","tablet","mobile"];function Jt(e,t){return e.match!==void 0?typeof e.match=="function"?e.match(t):e.match instanceof RegExp?e.match.test(t):t.startsWith(e.match):e.href==="/"?t==="/":t.startsWith(e.href)}function it(e){let t={desktop:e.includes("desktop"),tablet:e.includes("tablet"),mobile:e.includes("mobile")};if(t.desktop&&t.tablet&&t.mobile)return "";if(!t.desktop&&!t.tablet&&!t.mobile)return "hidden";if(t.desktop&&t.tablet&&!t.mobile)return "max-sm:hidden";if(t.desktop&&!t.tablet&&!t.mobile)return "max-lg:hidden";if(!t.desktop&&t.tablet&&t.mobile)return "lg:hidden";if(!t.desktop&&!t.tablet&&t.mobile)return "sm:hidden";if(!t.desktop&&t.tablet&&!t.mobile)return "max-sm:hidden lg:hidden";throw new Error(`getVisibilityClass: non-contiguous breakpoints [${e.join(", ")}] are not supported. Use a contiguous range (e.g. [desktop, tablet], [tablet, mobile]).`)}var vt=react.createContext(null);function wt(){let e=react.useContext(vt);if(!e)throw new Error("useScaffold must be used within a <Scaffold> component.");return e}function Hr(e){let t=wt();react.useEffect(()=>(e.headerVisible!==void 0&&t.setHeaderVisible(e.headerVisible),e.footerVisible!==void 0&&t.setFooterVisible(e.footerVisible),e.toolbarVisible!==void 0&&t.setToolbarVisible(e.toolbarVisible),()=>{e.headerVisible!==void 0&&t.setHeaderVisible(t.defaultHeaderVisible),e.footerVisible!==void 0&&t.setFooterVisible(t.defaultFooterVisible),e.toolbarVisible!==void 0&&t.setToolbarVisible(t.defaultToolbarVisible);}),[e.headerVisible,e.footerVisible,e.toolbarVisible]);}var an=60,ln=48,dn=56,cn=36,un=()=>{};function Yr({children:e,pathname:t="",onNavigate:n=un,header:i,footer:r,toolbar:d,headerHeight:a=an,mobileHeaderHeight:c=ln,footerHeight:m=dn,toolbarHeight:o=cn,headerVisible:s=Kt,footerVisible:f=[],toolbarVisible:b=[],className:z,classNames:p}){let[v,w]=react.useState(s),[P,K]=react.useState(f),[U,S]=react.useState(b),R=react.useId(),x=react.useMemo(()=>({pathname:t,onNavigate:n,headerHeight:a,mobileHeaderHeight:c,footerHeight:m,toolbarHeight:o,headerVisible:v,footerVisible:P,toolbarVisible:U,setHeaderVisible:w,setFooterVisible:K,setToolbarVisible:S,defaultHeaderVisible:s,defaultFooterVisible:f,defaultToolbarVisible:b}),[t,n,a,c,m,o,v,P,U,s,f,b]),ue=it(v),u=it(P),me=it(U),Z=c!==a?`[data-scaffold-id="${R}"]{--scaffold-header-height:${a}px}@media(max-width:639px){[data-scaffold-id="${R}"]{--scaffold-header-height:${c}px}}`:`[data-scaffold-id="${R}"]{--scaffold-header-height:${a}px}`;return jsxRuntime.jsxs(vt.Provider,{value:x,children:[jsxRuntime.jsx("style",{children:Z}),jsxRuntime.jsxs("div",{"data-scaffold-id":R,className:ui$1.cn("w-full h-screen max-sm:h-dvh flex flex-col overflow-hidden bg-background",p?.wrapper,z),style:{"--scaffold-footer-height":`calc(${m}px + env(safe-area-inset-bottom))`,"--scaffold-toolbar-height":`${o}px`},children:[i&&jsxRuntime.jsx("nav",{className:ui$1.cn("w-full flex-none relative z-50",ue,p?.header),style:{height:"var(--scaffold-header-height)"},children:i}),jsxRuntime.jsx("div",{className:ui$1.cn("w-full flex-auto min-h-0 relative overflow-y-auto",p?.content),children:e}),d&&jsxRuntime.jsx("div",{className:ui$1.cn("w-full flex-none",me,p?.toolbar),style:{height:`${o}px`},children:d}),r&&jsxRuntime.jsx("div",{className:ui$1.cn("w-full flex-none pb-[env(safe-area-inset-bottom)]",u,p?.footer),style:{height:`calc(${m}px + env(safe-area-inset-bottom))`},children:r})]})]})}function st({item:e,variant:t="header",className:n}){let{pathname:i,onNavigate:r}=wt(),d=Jt(e,i),a=react.useCallback(()=>{r(e.href);},[r,e.href]);return t==="footer"?jsxRuntime.jsxs("button",{type:"button","data-active":d,className:ui$1.cn("flex flex-col items-center justify-center gap-0.5 px-2 py-1 min-w-0","text-xs font-medium text-foreground/60","data-[active=true]:text-primary",n),onClick:a,"aria-label":e.label,"aria-current":d?"page":void 0,children:[e.icon&&jsxRuntime.jsx("span",{className:"flex items-center justify-center",children:e.icon}),jsxRuntime.jsx("span",{className:"truncate",children:e.label})]}):jsxRuntime.jsx("button",{type:"button","data-active":d,className:ui$1.cn("h-8 text-sm font-medium px-2 xl:px-3 rounded-sm cursor-pointer","text-foreground hover:text-primary hover:bg-primary-50","data-[active=true]:text-primary",n),onClick:a,"aria-label":e.label,"aria-current":d?"page":void 0,children:e.label})}function oi({children:e,left:t,right:n,navItems:i,className:r,style:d}){return e?jsxRuntime.jsx("header",{className:ui$1.cn("w-full h-full flex items-center bg-background border-b border-border",r),style:d,children:e}):jsxRuntime.jsxs("header",{className:ui$1.cn("w-full h-full px-6 max-lg:px-4 max-sm:px-3 flex items-center justify-between gap-6 max-lg:gap-4 max-sm:gap-3 bg-background border-b border-border",r),children:[t&&jsxRuntime.jsx("div",{className:"shrink-0 flex items-center",children:t}),i&&i.length>0&&jsxRuntime.jsx(ui$1.HorizontalScrollContainer,{className:"flex-auto min-w-0 max-sm:hidden",classNames:{content:"gap-1"},children:i.map(a=>jsxRuntime.jsx(st,{item:a,variant:"header"},a.key))}),n&&jsxRuntime.jsx("div",{className:"shrink-0 flex items-center gap-4",children:n})]})}function ai({children:e,navItems:t,className:n}){return e?jsxRuntime.jsx("footer",{className:ui$1.cn("w-full h-full flex items-center bg-background border-t border-border",n),children:e}):jsxRuntime.jsx("footer",{className:ui$1.cn("w-full h-full flex justify-evenly items-center bg-background border-t border-border",n),children:t?.map(i=>jsxRuntime.jsx(st,{item:i,variant:"footer"},i.key))})}function ui({children:e,left:t,right:n,className:i}){return e?jsxRuntime.jsx("div",{className:ui$1.cn("w-full h-full flex items-center bg-background border-t border-border",i),children:e}):jsxRuntime.jsxs("div",{className:ui$1.cn("w-full h-full px-6 flex items-center justify-between gap-4 bg-background border-t border-border",i),children:[t&&jsxRuntime.jsx("div",{className:"flex items-center gap-4",children:t}),n&&jsxRuntime.jsx("div",{className:"flex items-center gap-4",children:n})]})}function hi({href:e="/",icon:t,miniIcon:n,ariaLabel:i="Home",className:r}){return jsxRuntime.jsxs(ui$1.Link,{href:e,className:ui$1.cn("flex-none flex justify-center items-center",r),"aria-label":i,children:[jsxRuntime.jsx("div",{className:ui$1.cn("flex justify-center items-center",!!n&&"max-xl:hidden"),children:t}),n&&jsxRuntime.jsx("div",{className:"flex justify-center items-center xl:hidden",children:n})]})}function Ei({id:e,children:t}){let n=hooks.useEventEmitter(),{isOpen:i,onOpen:r,onClose:d,onOpenChange:a}=ui$1.useDisclosure(),[c,m]=react.useState(void 0),o=react.useRef(void 0),s=react.useCallback(()=>{o.current=void 0,m(void 0);},[]),f=react.useCallback(()=>{o.current?.(void 0),s(),d();},[d,s]),b=react.useCallback(p=>{o.current?.(p),s(),d();},[d,s]),z=react.useCallback(p=>{p||f();},[f]);return react.useEffect(()=>{let p=v=>{m(v?.params),o.current=v?.onResult,r();};return n.on(`open_modal:${e}`,p),()=>{n.off(`open_modal:${e}`,p);}},[e,r,n]),react.useEffect(()=>{let p=()=>{f();};return n.on(`close_modal:${e}`,p),()=>{n.off(`close_modal:${e}`,p);}},[e,f,n]),t({params:c,isOpen:i,onClose:f,onOpenChange:z,onResult:b})}function Ci(e){let t=hooks.useEventEmitter(),n=react.useCallback(r=>new Promise(d=>{let a=c=>{r?.onResult?.(c),d(c);};t.emit(`open_modal:${e}`,{...r,onResult:a});}),[e,t]),i=react.useCallback(()=>{t.emit(`close_modal:${e}`);},[e,t]);return {onOpen:n,onClose:i}}function lo({direction:e,isResizing:t,onResizeStart:n,className:i}){let r=e==="horizontal";return jsxRuntime.jsxs("div",{className:ui$1.cn("relative flex-none",i),children:[jsxRuntime.jsxs("div",{className:ui$1.cn("flex items-center justify-center bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out",r?"w-1 h-full cursor-ew-resize flex-col gap-1":"w-full h-1 cursor-ns-resize flex-row gap-1"),children:[jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("div",{className:ui$1.cn("absolute inset-0",r?"-left-1.5 -right-1.5 cursor-ew-resize":"-top-1.5 -bottom-1.5 cursor-ns-resize"),onMouseDown:n})]}),t&&jsxRuntime.jsx("div",{className:ui$1.cn("fixed inset-0 z-50",r?"cursor-ew-resize":"cursor-ns-resize")})]})}var Nn=4;function Dn(e){if(!e)return null;try{let t=localStorage.getItem(`splitView.${e}`);return t?Number(t):null}catch{return null}}function On(e,t){if(e)try{localStorage.setItem(`splitView.${e}`,String(t));}catch{}}function Zi({direction:e="horizontal",primary:t,secondary:n,defaultSize:i=400,minSize:r=100,maxSize:d=1/0,secondaryMinSize:a=100,onSizeChange:c,persistId:m,className:o,classNames:s}){let f=react.useRef(null),[b,z]=react.useState(()=>Dn(m)??i),[p,v]=react.useState(false),w=e==="horizontal",P=hooks.useValueRef(b),K=hooks.useValueRef(r),U=hooks.useValueRef(d),S=hooks.useValueRef(a),R=hooks.useValueRef(p),x=hooks.useCallbackRef(u=>{z(u),On(m,u),c?.(u);}),ue=react.useCallback(u=>{u.preventDefault(),u.stopPropagation(),v(true);let me=w?"ew-resize":"ns-resize";document.body.style.cursor=me,document.body.style.userSelect="none";let Z=w?u.clientX:u.clientY,ne=P.current,X=f.current,J=X?w?X.offsetWidth:X.offsetHeight:1/0,re=N=>{if(!R.current)return;let fe=(w?N.clientX:N.clientY)-Z,y=Math.min(U.current,J-S.current-Nn),W=Math.min(Math.max(ne+fe,K.current),y);x(W);},ie=()=>{v(false),document.body.style.cursor="",document.body.style.userSelect="",document.removeEventListener("mousemove",re),document.removeEventListener("mouseup",ie);};document.addEventListener("mousemove",re),document.addEventListener("mouseup",ie);},[w,P,K,U,S,R,x]);return jsxRuntime.jsxs("div",{ref:f,className:ui$1.cn("w-full h-full flex overflow-hidden",w?"flex-row":"flex-col",o),children:[jsxRuntime.jsx("div",{className:ui$1.cn("flex-none overflow-hidden",s?.primary),style:w?{width:`${b}px`,minWidth:`${r}px`}:{height:`${b}px`,minHeight:`${r}px`},children:t}),jsxRuntime.jsx(lo,{direction:e,isResizing:p,onResizeStart:ue,className:s?.handle}),jsxRuntime.jsx("div",{className:ui$1.cn("flex-auto min-w-0 min-h-0 overflow-hidden",s?.secondary),style:w?{minWidth:`${a}px`}:{minHeight:`${a}px`},children:n})]})}typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-scaffold"]="0.1.179");var En="0.1.179";exports.ALL_BREAKPOINTS=Kt;exports.AsyncModal=Ei;exports.DraggableModal=$t;exports.DraggablePanel=xt;exports.DraggablePanelProvider=vr;exports.Logo=hi;exports.NavLink=st;exports.Scaffold=Yr;exports.ScaffoldContext=vt;exports.ScaffoldFooter=ai;exports.ScaffoldHeader=oi;exports.ScaffoldToolbar=ui;exports.SplitHandle=lo;exports.SplitView=Zi;exports.getVisibilityClass=it;exports.isNavItemActive=Jt;exports.useAsyncModal=Ci;exports.useDraggableDisclosure=Dr;exports.useDraggableModalDisclosure=Me;exports.useDraggablePanelDisclosure=ze;exports.useScaffold=wt;exports.useScaffoldLayout=Hr;exports.version=En;//# sourceMappingURL=index.js.map
|
|
1
|
+
'use strict';var react=require('react'),ui=require('@liberfi.io/ui'),jsxRuntime=require('react/jsx-runtime'),reactDom=require('react-dom'),jotai=require('jotai'),hooks=require('@liberfi.io/hooks'),i18n=require('@liberfi.io/i18n'),utils$1=require('@liberfi.io/utils'),jotaiFamily=require('jotai-family'),utils=require('jotai/utils');function nr({title:e,defaultOpen:t=true,open:n,onOpenChange:a,rightSlot:i,children:s,className:r,headerClassName:d,bodyClassName:c}){let[o,l]=react.useState(t),m=n!==void 0,f=m?n:o,R=react.useCallback(()=>{let p=!f;m||l(p),a?.(p);},[f,m,a]);return jsxRuntime.jsxs("div",{className:ui.cn("flex flex-col",r),children:[jsxRuntime.jsxs("div",{className:"flex h-[36px] flex-row items-center justify-between gap-2 px-2",children:[jsxRuntime.jsxs("button",{type:"button",onClick:R,"aria-expanded":f,className:ui.cn("group/collapsible flex h-[28px] flex-row items-center gap-1 rounded px-2 text-[14px] font-medium text-default-500 transition-colors duration-[125ms] ease-in-out hover:bg-default-100/50 hover:text-foreground",d),children:[jsxRuntime.jsx("span",{className:"tracking-[-0.02em]",children:e}),jsxRuntime.jsx(ui.ChevronDownIcon,{width:16,height:16,className:ui.cn("shrink-0 transition-transform duration-150 ease-in-out",f?"rotate-0":"-rotate-90")})]}),i?jsxRuntime.jsx("div",{className:"flex items-center",children:i}):null]}),f?jsxRuntime.jsx("div",{className:ui.cn("flex flex-col",c),children:s}):null]})}function cr({orientation:e="horizontal",onDrag:t,onDragStart:n,onDragEnd:a,grabZone:i=6,className:s}){let r=e==="horizontal",[d,c]=react.useState(false),o=react.useRef(null),l=react.useCallback(h=>{h.preventDefault(),h.currentTarget.setPointerCapture(h.pointerId),o.current=r?h.clientY:h.clientX,c(true),n?.();},[r,n]),m=react.useCallback(h=>{if(o.current==null)return;let b=r?h.clientY:h.clientX,v=b-o.current;v!==0&&(o.current=b,t(v));},[r,t]),f=react.useCallback(h=>{if(o.current!=null){try{h.currentTarget.releasePointerCapture(h.pointerId);}catch{}o.current=null,c(false),a?.();}},[a]),R=r?{top:-i,bottom:-i,left:0,right:0}:{left:-i,right:-i,top:0,bottom:0},p=()=>jsxRuntime.jsxs("span",{className:ui.cn("flex items-center justify-center gap-[2px]",r?"flex-row":"flex-col"),"aria-hidden":true,children:[jsxRuntime.jsx("span",{className:"size-[2px] rounded-full bg-current"}),jsxRuntime.jsx("span",{className:"size-[2px] rounded-full bg-current"}),jsxRuntime.jsx("span",{className:"size-[2px] rounded-full bg-current"})]});return jsxRuntime.jsxs("div",{role:"separator","aria-orientation":r?"horizontal":"vertical",className:ui.cn("group relative flex items-center justify-center bg-default-200 text-default-400 transition-colors duration-150 ease-in-out hover:bg-default-400 hover:text-foreground/80",r?"h-[4px] w-full cursor-ns-resize":"h-full w-[4px] cursor-ew-resize",d&&"bg-default-400 text-foreground/80",s),onPointerDown:l,onPointerMove:m,onPointerUp:f,onPointerCancel:f,children:[jsxRuntime.jsx(p,{}),jsxRuntime.jsx("div",{"aria-hidden":true,className:ui.cn("absolute",r?"cursor-ns-resize":"cursor-ew-resize"),style:R})]})}var Ge=150;function br({base:e,hover:t,glow:n=true,height:a=64,className:i,overlayClassName:s}){let r=react.useRef(null),d=react.useRef(null),c=react.useRef(null),[o,l]=react.useState(false),m=react.useCallback((b,v)=>{if(!n)return;let H=d.current,A=r.current;if(!H||!A)return;let M=A.getBoundingClientRect(),N=b-M.left-Ge/2,y=v-M.top-Ge/2;H.style.transform=`translate(${N}px, ${y}px)`;},[n]),f=react.useCallback(b=>{let{clientX:v,clientY:H}=b;c.current!=null&&cancelAnimationFrame(c.current),c.current=requestAnimationFrame(()=>{m(v,H);});},[m]),R=react.useCallback(b=>{l(true),m(b.clientX,b.clientY);},[m]),p=react.useCallback(()=>{l(false),c.current!=null&&(cancelAnimationFrame(c.current),c.current=null);},[]),h={minHeight:a,maxHeight:a,height:a};return jsxRuntime.jsxs("div",{ref:r,onPointerEnter:R,onPointerMove:f,onPointerLeave:p,"data-hovered":o||void 0,className:ui.cn("relative flex w-full flex-col overflow-hidden",i),style:h,children:[jsxRuntime.jsx("div",{className:"flex h-full w-full flex-col",style:h,children:e}),n?jsxRuntime.jsx("div",{ref:d,"aria-hidden":true,className:"pointer-events-none absolute left-0 top-0 rounded-full opacity-[0.1] transition-transform duration-[80ms] ease-[cubic-bezier(0.17,0.17,0,1)]",style:{width:Ge,height:Ge,background:"radial-gradient(circle, rgb(255, 255, 255), rgba(255, 255, 255, 0))",transform:"translate(-999px, -999px)"}}):null,jsxRuntime.jsx("div",{"aria-hidden":!o,className:ui.cn("absolute inset-0 flex w-full flex-row items-center bg-content1/70 backdrop-blur-[4px] transition-opacity duration-150 ease-in-out",o?"opacity-100":"pointer-events-none opacity-0",s),style:h,children:t})]})}function Mr({items:e,value:t,onChange:n,className:a,rightSlot:i}){return jsxRuntime.jsxs("div",{className:ui.cn("flex max-h-[37px] min-h-[37px] w-full flex-row items-center border-b border-default-100 px-2",a),children:[jsxRuntime.jsx("div",{className:ui.cn("flex min-w-0 flex-1 flex-row items-center gap-4 overflow-x-auto","[&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]"),children:e.map(s=>{let r=s.key===t,d=s.count!==void 0?` (${s.count})`:"";return jsxRuntime.jsx("button",{type:"button",role:"tab","aria-selected":r,"aria-disabled":s.disabled||void 0,disabled:s.disabled,onClick:()=>{s.disabled||n(s.key);},className:ui.cn("group relative flex h-[28px] flex-row items-center gap-1 rounded px-2 text-nowrap transition-colors",r?"":"hover:bg-default-100/40",s.disabled&&"cursor-not-allowed opacity-50"),children:jsxRuntime.jsx("span",{className:ui.cn("flex h-[36px] flex-row items-center justify-center gap-1 pt-[2px]",r?"border-b-[2px] border-foreground text-foreground":"text-default-500"),children:jsxRuntime.jsxs("span",{className:"text-[14px] font-medium",children:[s.label,d]})})},String(s.key))})}),i?jsxRuntime.jsx("div",{className:"flex shrink-0 flex-row items-center gap-2 pl-2",children:i}):null]})}var Rt="";function jt(e){Rt=e;}function F(e,t){let n=`${e}.${t??"default"}`;return Rt?`${Rt}:${n}`:n}var xe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("panelState",e),"none",void 0,{getOnInit:true})),qe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("panelWidth",e),350,void 0,{getOnInit:true})),Je=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("panelMinWidth",e),320,void 0,{getOnInit:true})),Qe=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("panelMaxWidth",e),440,void 0,{getOnInit:true})),qt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalOpen",e),false,void 0,{getOnInit:true})),et=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalShouldStartDragging",e),false,void 0,{getOnInit:true})),tt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalSize",e),{width:350,height:580},void 0,{getOnInit:true})),ot=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalRestoreSize",e),{width:350,height:580},void 0,{getOnInit:true})),nt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalPosition",e),{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),rt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalRestorePosition",e),{x:typeof window<"u"?Math.max(0,(window.innerWidth-350)/2):0,y:typeof window<"u"?Math.max(0,(window.innerHeight-580)/2):0},void 0,{getOnInit:true})),it=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalMinimized",e),false,void 0,{getOnInit:true})),at=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalMinWidth",e),200,void 0,{getOnInit:true})),st=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("modalMaxWidth",e),typeof window<"u"?window.innerWidth-40:0,void 0,{getOnInit:true})),Re=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("lastPanelType",e),"modal",void 0,{getOnInit:true})),lt=jotaiFamily.atomFamily(e=>utils.atomWithStorage(F("panelOrders",null),{left:{},right:{}},void 0,{getOnInit:true}));function Me(e){let[t,n]=jotai.useAtom(qt(e)),[a,i]=jotai.useAtom(it(e)),s=jotai.useAtomValue(ot(e)),r=jotai.useAtomValue(rt(e)),d=jotai.useSetAtom(tt(e)),c=jotai.useSetAtom(nt(e)),o=jotai.useSetAtom(et(e)),l=jotai.useSetAtom(Re(e)),m=react.useCallback((R={})=>{let{shouldStartDragging:p,position:h,size:b}=R;h&&c(v=>({...v,...h})),b&&d(v=>({...v,...b})),o(p??false),n(true),l("modal");},[n,c,d,o]),f=react.useCallback(()=>{n(false),a&&(d({...s}),c({...r}),i(false));},[a,s,r,i,n,d,c]);return react.useMemo(()=>({isOpen:t,onOpen:m,onClose:f}),[t,m,f])}function Ne(e){let[t,n]=jotai.useAtom(xe(e)),a=jotai.useSetAtom(qe(e)),i=jotai.useSetAtom(Re(e)),s=jotai.useSetAtom(lt(null)),r=react.useCallback((l={})=>{let m=l.position??"left";a(l.width??320),n(m),i(m),s(({left:f,right:R})=>m==="left"?{left:{...f,[e]:Date.now()},right:R}:{left:f,right:{...R,[e]:Date.now()}});},[e,n,a]),d=react.useCallback(()=>{n("none");},[n]),c=react.useMemo(()=>t!=="none",[t]),o=react.useMemo(()=>t!=="none"?t:void 0,[t]);return react.useMemo(()=>({isOpen:c,position:o,onOpen:r,onClose:d}),[c,r,d])}var dn={width:200,height:48},He={width:typeof window<"u"?window.innerWidth-40:0,height:typeof window<"u"?window.innerHeight-40:0},cn={x:20,y:20},ro=react.memo(function({id:t,title:n,minWidth:a=504,maxWidth:i=He.width,minHeight:s=200,maxHeight:r=He.height,leftSidebar:d,leftSidebarWidth:c=200,rightSidebar:o,rightSidebarWidth:l=200,aspectRatio:m,showHeader:f=true,header:R,headerHeight:p=44,children:h}){let{t:b}=i18n.useTranslation(),{isOpen:v,onClose:H}=Me(t),{onOpen:A}=Ne(t),[M,N]=jotai.useAtom(it(t)),[y,ue]=jotai.useAtom(nt(t)),[g,me]=jotai.useAtom(tt(t)),[G,ne]=jotai.useAtom(ot(t)),[Y,q]=jotai.useAtom(rt(t)),[re,ie]=jotai.useAtom(et(t)),[S,ae]=react.useState(re),[fe,P]=react.useState(false),[E,se]=react.useState(null),[pe,le]=react.useState(null),[he,$]=react.useState(null),[ve,de]=react.useState(null),J=react.useRef(null),zo=jotai.useAtomValue(Je(t)),So=jotai.useAtomValue(Qe(t)),Q=hooks.useValueRef(y),k=hooks.useCallbackRef(ue),ge=hooks.useValueRef(g),B=hooks.useCallbackRef(me),Do=hooks.useValueRef(c),Oo=hooks.useValueRef(!!d),Eo=hooks.useValueRef(l),ko=hooks.useValueRef(!!o),Z=hooks.useValueRef(m),ee=hooks.useValueRef(p),Ee=hooks.useValueRef(a),ke=hooks.useValueRef(i),Ce=hooks.useValueRef(s),We=hooks.useValueRef(r),Co=hooks.useValueRef(S),At=hooks.useValueRef(pe),gt=hooks.useValueRef(ve),Wo=hooks.useCallbackRef(H),Lo=hooks.useCallbackRef(A),Io=hooks.useValueRef(zo),Fo=hooks.useValueRef(So),Le=react.useMemo(()=>g.width===He.width&&g.height===He.height,[g.width,g.height]);react.useEffect(()=>{let u=Math.min(Math.max(g.width,a),i),C=Math.min(Math.max(g.height,s),r);(u!==g.width||C!==g.height)&&B({width:u,height:C});let _=Math.max(0,y.x),be=Math.max(0,y.y);_+u>window.innerWidth&&(_=Math.max(0,window.innerWidth-u)),be+C>window.innerHeight&&(be=Math.max(0,window.innerHeight-C)),(_!==y.x||be!==y.y)&&k({x:_,y:be});},[t]),react.useEffect(()=>{if(v&&re){ae(true);let u=_=>{k({x:_.clientX-g.width/2,y:_.clientY-20});},C=()=>{ae(false),ie(false),document.removeEventListener("mousemove",u),document.removeEventListener("mouseup",C);};return document.addEventListener("mousemove",u),document.addEventListener("mouseup",C),document.body.style.cursor="grabbing",()=>{document.removeEventListener("mousemove",u),document.removeEventListener("mouseup",C),document.body.style.cursor="";}}},[v,re,ie,g.width]);let j=(u,C,_)=>{ie(false),ae(false),P(false),se(null),C==="drag"?ae(true):C==="resize"&&(se(_||null),P(true));let be=u.clientX,Bt=u.clientY,X=ge.current.width,K=ge.current.height,U={...Q.current},_t=()=>{document.removeEventListener("mousemove",$t),document.removeEventListener("mouseup",Xt),document.body.style.cursor="",ae(false),P(false),se(null),le(null),J.current&&(clearTimeout(J.current),J.current=null),de(null),$(null);},$t=$e=>{if(C==="drag"){let te=$e.clientX-be,oe=$e.clientY-Bt,D=U.x+te,w=U.y+oe,we=Oo.current?Do.current:0,Ie=12+we,T=ko.current?Eo.current:0,O=window.innerWidth-12-X-T,Xe=window.innerHeight-12-44,W=D<=Ie?"left":D>=O?"right":null;W!==At.current&&le(W),J.current&&W&&$(W),J.current&&(gt.current==="left"&&(D>Ie||W!=="left")||gt.current==="right"&&(D<O||W!=="right"))&&(clearTimeout(J.current),J.current=null,de(null),$(null)),!J.current&&W&>.current!==W&&(de(W),$(W),J.current=setTimeout(()=>{Co.current&&At.current===W?(_t(),Wo(),Lo({position:W,width:Math.min(Math.max(ge.current.width,Io.current),Fo.current)})):de(null);},350)),D=Math.min(Math.max(D,12+we),O),w=Math.min(Math.max(w,12),Xe),k({x:D,y:w});}else if(C==="resize"&&_){let te=$e.clientX-be,oe=$e.clientY-Bt,D=(w,we,Ie)=>{let T=Math.min(Math.max(w,Ee.current),ke.current),O=Math.min(Math.max(we,Ce.current),We.current);if(Z.current){if(Ie==="width")O=Math.min(Math.max(w/Z.current+ee.current,Ce.current),We.current),T=(O-ee.current)*Z.current;else if(Ie==="height")T=Math.min(Math.max((we-ee.current)*Z.current,Ee.current),ke.current),O=T/Z.current+ee.current;else {let Xe=w/Z.current+ee.current,W=(we-ee.current)*Z.current,Ut=Math.abs(te),Yt=Math.abs(oe);if(Ut>1.1*Yt)O=Math.min(Math.max(Xe,Ce.current),We.current),T=(O-ee.current)*Z.current;else if(Yt>1.1*Ut)T=Math.min(Math.max(W,Ee.current),ke.current),O=T/Z.current+ee.current;else {let Vo=(O+Xe)/2;T=Math.min(Math.max((T+W)/2,Ee.current),ke.current),O=Math.min(Math.max(Vo,Ce.current),We.current),T=(O-ee.current)*Z.current;}}T=Math.min(Math.max(T,Ee.current),ke.current),O=Math.min(Math.max(O,Ce.current),We.current);}return {width:T,height:O}};switch(_){case "topLeft":{let w=D(X-te,K-oe,"both");B(w),k({x:U.x+(X-w.width),y:U.y+(K-w.height)});break}case "topRight":{let w=D(X+te,K-oe,"both");B(w),k({x:U.x,y:U.y+(K-w.height)});break}case "bottomLeft":{let w=D(X-te,K+oe,"both");B(w),k({x:U.x+(X-w.width),y:U.y});break}case "bottomRight":{B(D(X+te,K+oe,"both"));break}case "top":{let w=D(X,K-oe,"height");B(w),k({x:U.x,y:U.y+(K-w.height)});break}case "bottom":{B(D(X,K+oe,"height"));break}case "left":{let w=D(X-te,K,"width");B(w),k({x:U.x+(X-w.width),y:U.y});break}case "right":{B(D(X+te,K,"width"));break}}}},Xt=()=>{(y.x<0||y.y<0)&&k({x:Math.max(0,y.x),y:Math.max(0,y.y)}),_t();};document.addEventListener("mousemove",$t),document.addEventListener("mouseup",Xt);},Ho=react.useCallback(()=>{M?(B({...G}),k({...Y}),N(false)):(Le?k({...Y}):(ne({...g}),q({...y})),B({...dn}),N(true));},[M,Le,g,y,G,Y,N,ne,q]),To=react.useCallback(()=>{Le?(B({...G}),k({...Y})):(M?N(false):(ne({...g}),q({...y})),B({...He}),k({...cn}));},[Le,M,g,y,G,Y,N,ne,q]);return react.useEffect(()=>{let u=utils$1.throttle(()=>{(Q.current.x<0||Q.current.y<0)&&k({x:Math.max(0,Q.current.x),y:Math.max(0,Q.current.y)});let C=Q.current.x+ge.current.width,_=Q.current.y+ge.current.height;(C>window.innerWidth||_>window.innerHeight)&&k({x:Math.min(Q.current.x,Math.max(0,window.innerWidth-ge.current.width)),y:Math.min(Q.current.y,Math.max(0,window.innerHeight-ge.current.height))});},100);return window.addEventListener("resize",u),()=>{window.removeEventListener("resize",u);}},[]),v?jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[(S||fe)&&reactDom.createPortal(jsxRuntime.jsx("div",{className:ui.cn("max-sm:hidden fixed inset-0 z-9999 bg-transparent w-full h-full select-none",S&&(ve?"cursor-grabbing":"cursor-move"),!S&&{"cursor-ns-resize":E==="top"||E==="bottom","cursor-ew-resize":E==="left"||E==="right","cursor-nwse-resize":E==="topLeft"||E==="bottomRight","cursor-nesw-resize":E==="topRight"||E==="bottomLeft","cursor-auto":E===null})}),document.body),jsxRuntime.jsx("div",{className:ui.cn("max-sm:hidden fixed z-50 left-0 top-0",S?"will-change-transform":"will-change-auto",fe||S?"transition-none":"transition-transform duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]"),style:{transform:`translate(${Math.round(y.x-(d?c:0))}px, ${Math.round(y.y)}px)`},children:jsxRuntime.jsxs("div",{className:"flex relative z-50",children:[d&&jsxRuntime.jsx("div",{className:ui.cn("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",S?"opacity-40 translate-x-4":"opacity-100 translate-x-0"),style:{width:c,height:M?40:g.height-8},children:d}),jsxRuntime.jsx("div",{className:ui.cn("z-50 relative bg-content1 border border-border rounded-lg overflow-hidden",S?"opacity-80 shadow-md scale-102 blur-[0.5px]":"opacity-100 shadow-lg scale-100 blur-none"),style:{width:g.width,height:g.height,transition:fe||S?"none":"transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:jsxRuntime.jsxs("div",{className:ui.cn("w-full h-full",he&&"animate-modal-shrink",he==="left"?"origin-left":"origin-right"),style:{contain:"paint"},children:[!M&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"absolute top-0 left-0 w-3 h-3 cursor-nw-resize z-20",onMouseDown:u=>j(u,"resize","topLeft")}),jsxRuntime.jsx("div",{className:"absolute top-0 right-0 w-3 h-3 cursor-ne-resize z-20",onMouseDown:u=>j(u,"resize","topRight")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 left-0 w-3 h-3 cursor-sw-resize z-20",onMouseDown:u=>j(u,"resize","bottomLeft")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 right-0 w-3 h-3 cursor-se-resize z-20",onMouseDown:u=>j(u,"resize","bottomRight")}),jsxRuntime.jsx("div",{className:"absolute top-0 left-3 right-3 h-1.5 cursor-n-resize z-20",onMouseDown:u=>j(u,"resize","top")}),jsxRuntime.jsx("div",{className:"absolute bottom-0 left-3 right-3 h-1.5 cursor-s-resize z-20",onMouseDown:u=>j(u,"resize","bottom")}),jsxRuntime.jsx("div",{className:"absolute left-0 top-3 bottom-3 w-1.5 cursor-w-resize z-20",onMouseDown:u=>j(u,"resize","left")}),jsxRuntime.jsx("div",{className:"absolute right-0 top-3 bottom-3 w-1.5 cursor-e-resize z-20",onMouseDown:u=>j(u,"resize","right")})]}),f&&jsxRuntime.jsxs("div",{className:"relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:u=>j(u,"drag"),style:{height:p},children:[jsxRuntime.jsx(ui.StyledTooltip,{placement:"top",content:b("scaffold.draggableModal.snapToEdge"),children:jsxRuntime.jsx(ui.DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),R||jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:u=>u.stopPropagation(),children:n}),jsxRuntime.jsxs("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:u=>u.stopPropagation(),children:[jsxRuntime.jsx(ui.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:Ho,children:M?jsxRuntime.jsx(ui.RestoreWindowIcon,{width:18,height:18,className:"text-neutral"}):jsxRuntime.jsx(ui.MinimizeIcon,{width:18,height:18,className:"text-neutral"})}),jsxRuntime.jsx(ui.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:To,children:Le?jsxRuntime.jsx(ui.UnMaximizeIcon,{width:18,height:18,className:"text-neutral"}):jsxRuntime.jsx(ui.MaximizeIcon,{width:18,height:18,className:"text-neutral"})}),jsxRuntime.jsx(ui.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:H,children:jsxRuntime.jsx(ui.XCloseIcon,{width:18,height:18,className:"text-neutral"})})]})]})]}),!M&&jsxRuntime.jsx("div",{className:f?"h-[calc(100%-44px)] overflow-x-hidden overflow-y-auto":"h-full overflow-x-hidden overflow-y-auto cursor-move",onMouseDown:f?void 0:u=>j(u,"drag"),children:h})]})}),o&&jsxRuntime.jsx("div",{className:ui.cn("relative mt-1 z-10 transition-all duration-250 ease-[cubic-bezier(0.16,1,0.3,1)]",S?"opacity-40 -translate-x-4":"opacity-100 translate-x-0"),style:{width:l,height:M?40:g.height-8},children:o})]})})]}):null});function Et({id:e,title:t,maxWidth:n=440,minWidth:a=320,position:i,showHeader:s=true,header:r,headerHeight:d=44,children:c}){let{t:o}=i18n.useTranslation(),l=jotai.useAtomValue(xe(e)),[m,f]=react.useState(false),[R,p]=react.useState(false),[h,b]=jotai.useAtom(qe(e)),{onOpen:v}=Me(e),{onClose:H}=Ne(e),A=jotai.useAtomValue(at(e)),M=jotai.useAtomValue(st(e)),N=hooks.useValueRef(h),y=hooks.useValueRef(n),ue=hooks.useValueRef(a),g=hooks.useValueRef(i),me=hooks.useValueRef(m),G=hooks.useValueRef(R),ne=hooks.useCallbackRef(b),Y=hooks.useCallbackRef(v),q=hooks.useCallbackRef(H),re=hooks.useValueRef(A),ie=hooks.useValueRef(M),S=P=>{P.preventDefault(),P.stopPropagation(),f(true),document.body.style.cursor="ew-resize",document.body.style.userSelect="none",document.body.style.overflow="hidden",document.body.style.position="fixed",document.body.style.width="100%",document.body.style.height="100%";let E=P.clientX,se=N.current,pe=he=>{if(!me.current)return;let $=he.clientX-E,ve=g.current==="right"?se-$:se+$,de=Math.min(Math.max(ve,ue.current),y.current);ne(de);},le=()=>{f(false),document.body.style.cursor="",document.body.style.userSelect="",document.body.style.overflow="",document.body.style.position="",document.body.style.width="",document.body.style.height="",document.removeEventListener("mousemove",pe),document.removeEventListener("mouseup",le);};document.addEventListener("mousemove",pe),document.addEventListener("mouseup",le);},ae=P=>{if(P.target instanceof HTMLElement&&P.target.closest("button"))return;P.preventDefault(),p(true);let E=P.clientX,se=P.clientY,pe=()=>{document.removeEventListener("mousemove",le),document.removeEventListener("mouseup",he),p(false);},le=$=>{if(!G.current)return;let ve=Math.abs($.clientX-E),de=Math.abs($.clientY-se);(ve>10||de>10)&&(pe(),q(),Y({shouldStartDragging:true,position:{x:$.clientX-N.current/2+20,y:$.clientY-20},size:{width:Math.min(Math.max(N.current,re.current),ie.current)}}));},he=()=>{pe();};document.addEventListener("mousemove",le),document.addEventListener("mouseup",he);},fe=()=>{q();};return l!==i?null:jsxRuntime.jsxs("div",{className:"max-sm:hidden flex-none flex flex-row overflow-hidden",children:[i==="right"&&jsxRuntime.jsx(ao,{isResizing:m,handleResizeStart:S}),jsxRuntime.jsxs("div",{className:ui.cn("flex flex-col min-h-0 overflow-hidden bg-content1",R?"opacity-80 scale-98 blur-[1px]":"opacity-100 scale-100 blur-none"),style:{width:`${h}px`,transition:m||R?"none":"transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s cubic-bezier(0.33, 1, 0.68, 1), height 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.33, 1, 0.68, 1)",contain:"content"},children:[s&&jsxRuntime.jsxs("div",{className:"flex-none relative border-b border-border/80 px-3 gap-4 flex items-center justify-between cursor-move select-none",onMouseDown:ae,style:{height:d},children:[jsxRuntime.jsx(ui.StyledTooltip,{placement:"top",content:o("scaffold.draggablePanel.snapToModal"),children:jsxRuntime.jsx(ui.DraggableIcon,{className:"text-neutral absolute left-1/2 -translate-x-1/2 top-0"})}),r||jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"min-w-0 flex-initial text-sm font-medium truncate cursor-auto",onMouseDown:P=>P.stopPropagation(),children:t}),jsxRuntime.jsx("div",{className:"flex-none flex items-center justify-end gap-1",onMouseDown:P=>P.stopPropagation(),children:jsxRuntime.jsx(ui.Button,{size:"sm",variant:"light",radius:"lg",isIconOnly:true,onPress:fe,children:jsxRuntime.jsx(ui.XCloseIcon,{width:18,height:18,className:"text-neutral"})})})]})]}),jsxRuntime.jsx("div",{className:"flex-auto min-h-0 overflow-y-auto",children:c})]}),i==="left"&&jsxRuntime.jsx(ao,{isResizing:m,handleResizeStart:S})]})}function ao({isResizing:e,handleResizeStart:t}){return jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsxs("div",{className:"relative w-1 h-full cursor-ew-resize bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out group flex flex-col items-center justify-center gap-1",children:[jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("div",{className:"absolute inset-0 -left-1.5 -right-1.5 cursor-ew-resize",onMouseDown:t})]}),e&&jsxRuntime.jsx("div",{className:"fixed inset-0 z-50 cursor-ew-resize"})]})}function wi({contents:e=[],storagePrefix:t,className:n,classNames:a,children:i}){let s=react.useRef(false);!s.current&&t!==void 0&&(jt(t),s.current=true);let r=jotai.useAtomValue(lt(null));react.useEffect(()=>{let o=jotai.getDefaultStore();e.forEach(l=>{o.set(Je(l.id),l.panelMinWidth??320),o.set(Qe(l.id),l.panelMaxWidth??440),o.set(at(l.id),l.modalMinWidth??504),o.set(st(l.id),l.modalMaxWidth??window.innerWidth-40);});},[e]);let d=react.useMemo(()=>e.filter(o=>{let l=jotai.getDefaultStore();return r.left[o.id]?l.get(xe(o.id))==="left":false}).sort((o,l)=>r.left[l.id]-r.left[o.id]),[e,r.left]),c=react.useMemo(()=>e.filter(o=>{let l=jotai.getDefaultStore();return r.right[o.id]?l.get(xe(o.id))==="right":false}).sort((o,l)=>(r.right[o.id]??0)-(r.right[l.id]??0)),[e,r.right]);return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsxs("div",{className:ui.cn("w-full h-full flex flex-row overflow-hidden",n,a?.root),children:[jsxRuntime.jsx("div",{className:ui.cn("flex-none h-full flex flex-row",a?.left),children:d.map(o=>jsxRuntime.jsx(Et,{...o,position:"left",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`left-${o.id}`))}),jsxRuntime.jsx("div",{className:ui.cn("flex-auto min-w-0 h-full",a?.content),children:i}),jsxRuntime.jsx("div",{className:ui.cn("flex-none h-full flex flex-row",a?.right),children:c.map(o=>jsxRuntime.jsx(Et,{...o,position:"right",minWidth:o.panelMinWidth??320,maxWidth:o.panelMaxWidth??440},`right-${o.id}`))})]}),e.map(o=>jsxRuntime.jsx(ro,{...o,minWidth:o.modalMinWidth??504,maxWidth:o.modalMaxWidth??window.innerWidth-40},`modal-${o.id}`))]})}function Oi(e){let{isOpen:t,onOpen:n,onClose:a}=Me(e),{isOpen:i,onOpen:s,onClose:r}=Ne(e),d=jotai.useAtomValue(Re(e)),c=react.useCallback(()=>{t||i||(d==="modal"?n():s({position:d}));},[t,i,d,n,s]),o=react.useCallback(()=>{t?a():i&&r();},[t,i,a,r]),l=react.useMemo(()=>t||i,[t,i]);return react.useMemo(()=>({isOpen:l,onOpen:c,onClose:o}),[l,c,o])}var mo=["desktop","tablet","mobile"];function fo(e,t){return e.match!==void 0?typeof e.match=="function"?e.match(t):e.match instanceof RegExp?e.match.test(t):t.startsWith(e.match):e.href==="/"?t==="/":t.startsWith(e.href)}function mt(e){let t={desktop:e.includes("desktop"),tablet:e.includes("tablet"),mobile:e.includes("mobile")};if(t.desktop&&t.tablet&&t.mobile)return "";if(!t.desktop&&!t.tablet&&!t.mobile)return "hidden";if(t.desktop&&t.tablet&&!t.mobile)return "max-sm:hidden";if(t.desktop&&!t.tablet&&!t.mobile)return "max-lg:hidden";if(!t.desktop&&t.tablet&&t.mobile)return "lg:hidden";if(!t.desktop&&!t.tablet&&t.mobile)return "sm:hidden";if(!t.desktop&&t.tablet&&!t.mobile)return "max-sm:hidden lg:hidden";throw new Error(`getVisibilityClass: non-contiguous breakpoints [${e.join(", ")}] are not supported. Use a contiguous range (e.g. [desktop, tablet], [tablet, mobile]).`)}var Ct=react.createContext(null);function Wt(){let e=react.useContext(Ct);if(!e)throw new Error("useScaffold must be used within a <Scaffold> component.");return e}function Ai(e){let t=Wt();react.useEffect(()=>(e.headerVisible!==void 0&&t.setHeaderVisible(e.headerVisible),e.footerVisible!==void 0&&t.setFooterVisible(e.footerVisible),e.toolbarVisible!==void 0&&t.setToolbarVisible(e.toolbarVisible),()=>{e.headerVisible!==void 0&&t.setHeaderVisible(t.defaultHeaderVisible),e.footerVisible!==void 0&&t.setFooterVisible(t.defaultFooterVisible),e.toolbarVisible!==void 0&&t.setToolbarVisible(t.defaultToolbarVisible);}),[e.headerVisible,e.footerVisible,e.toolbarVisible]);}var On=60,En=48,kn=56,Cn=36,Wn=()=>{};function Yi({children:e,pathname:t="",onNavigate:n=Wn,header:a,footer:i,toolbar:s,headerHeight:r=On,mobileHeaderHeight:d=En,footerHeight:c=kn,toolbarHeight:o=Cn,headerVisible:l=mo,footerVisible:m=[],toolbarVisible:f=[],className:R,classNames:p}){let[h,b]=react.useState(l),[v,H]=react.useState(m),[A,M]=react.useState(f),N=react.useId(),y=react.useMemo(()=>({pathname:t,onNavigate:n,headerHeight:r,mobileHeaderHeight:d,footerHeight:c,toolbarHeight:o,headerVisible:h,footerVisible:v,toolbarVisible:A,setHeaderVisible:b,setFooterVisible:H,setToolbarVisible:M,defaultHeaderVisible:l,defaultFooterVisible:m,defaultToolbarVisible:f}),[t,n,r,d,c,o,h,v,A,l,m,f]),ue=mt(h),g=mt(v),me=mt(A),G=d!==r?`[data-scaffold-id="${N}"]{--scaffold-header-height:${r}px}@media(max-width:639px){[data-scaffold-id="${N}"]{--scaffold-header-height:${d}px}}`:`[data-scaffold-id="${N}"]{--scaffold-header-height:${r}px}`;return jsxRuntime.jsxs(Ct.Provider,{value:y,children:[jsxRuntime.jsx("style",{children:G}),jsxRuntime.jsxs("div",{"data-scaffold-id":N,className:ui.cn("w-full h-screen max-sm:h-dvh flex flex-col overflow-hidden bg-background",p?.wrapper,R),style:{"--scaffold-footer-height":`calc(${c}px + env(safe-area-inset-bottom))`,"--scaffold-toolbar-height":`${o}px`},children:[a&&jsxRuntime.jsx("nav",{className:ui.cn("w-full flex-none relative z-50",ue,p?.header),style:{height:"var(--scaffold-header-height)"},children:a}),jsxRuntime.jsx("div",{className:ui.cn("w-full flex-auto min-h-0 relative overflow-y-auto",p?.content),children:e}),s&&jsxRuntime.jsx("div",{className:ui.cn("w-full flex-none",me,p?.toolbar),style:{height:`${o}px`},children:s}),i&&jsxRuntime.jsx("div",{className:ui.cn("w-full flex-none pb-[env(safe-area-inset-bottom)]",g,p?.footer),style:{height:`calc(${c}px + env(safe-area-inset-bottom))`},children:i})]})]})}function ft({item:e,variant:t="header",className:n}){let{pathname:a,onNavigate:i}=Wt(),s=fo(e,a),r=react.useCallback(()=>{i(e.href);},[i,e.href]);return t==="footer"?jsxRuntime.jsxs("button",{type:"button","data-active":s,className:ui.cn("flex flex-col items-center justify-center gap-0.5 px-2 py-1 min-w-0","text-xs font-medium text-foreground/60","data-[active=true]:text-primary",n),onClick:r,"aria-label":e.label,"aria-current":s?"page":void 0,children:[e.icon&&jsxRuntime.jsx("span",{className:"flex items-center justify-center",children:e.icon}),jsxRuntime.jsx("span",{className:"truncate",children:e.label})]}):jsxRuntime.jsx("button",{type:"button","data-active":s,className:ui.cn("h-8 text-sm font-medium px-2 xl:px-3 rounded-sm cursor-pointer","text-foreground hover:text-primary hover:bg-primary-50","data-[active=true]:text-primary",n),onClick:r,"aria-label":e.label,"aria-current":s?"page":void 0,children:e.label})}function na({children:e,left:t,right:n,navItems:a,className:i,style:s}){return e?jsxRuntime.jsx("header",{className:ui.cn("w-full h-full flex items-center bg-background border-b border-border",i),style:s,children:e}):jsxRuntime.jsxs("header",{className:ui.cn("w-full h-full px-6 max-lg:px-4 max-sm:px-3 flex items-center justify-between gap-6 max-lg:gap-4 max-sm:gap-3 bg-background border-b border-border",i),children:[t&&jsxRuntime.jsx("div",{className:"shrink-0 flex items-center",children:t}),a&&a.length>0&&jsxRuntime.jsx(ui.HorizontalScrollContainer,{className:"flex-auto min-w-0 max-sm:hidden",classNames:{content:"gap-1"},children:a.map(r=>jsxRuntime.jsx(ft,{item:r,variant:"header"},r.key))}),n&&jsxRuntime.jsx("div",{className:"shrink-0 flex items-center gap-4",children:n})]})}function la({children:e,navItems:t,className:n}){return e?jsxRuntime.jsx("footer",{className:ui.cn("w-full h-full flex items-center bg-background border-t border-border",n),children:e}):jsxRuntime.jsx("footer",{className:ui.cn("w-full h-full flex justify-evenly items-center bg-background border-t border-border",n),children:t?.map(a=>jsxRuntime.jsx(ft,{item:a,variant:"footer"},a.key))})}function ma({children:e,left:t,right:n,className:a}){return e?jsxRuntime.jsx("div",{className:ui.cn("w-full h-full flex items-center bg-background border-t border-border",a),children:e}):jsxRuntime.jsxs("div",{className:ui.cn("w-full h-full px-6 flex items-center justify-between gap-4 bg-background border-t border-border",a),children:[t&&jsxRuntime.jsx("div",{className:"flex items-center gap-4",children:t}),n&&jsxRuntime.jsx("div",{className:"flex items-center gap-4",children:n})]})}function ga({href:e="/",icon:t,miniIcon:n,ariaLabel:a="Home",className:i}){return jsxRuntime.jsxs(ui.Link,{href:e,className:ui.cn("flex-none flex justify-center items-center",i),"aria-label":a,children:[jsxRuntime.jsx("div",{className:ui.cn("flex justify-center items-center",!!n&&"max-xl:hidden"),children:t}),n&&jsxRuntime.jsx("div",{className:"flex justify-center items-center xl:hidden",children:n})]})}function Ca({id:e,children:t}){let n=hooks.useEventEmitter(),{isOpen:a,onOpen:i,onClose:s,onOpenChange:r}=ui.useDisclosure(),[d,c]=react.useState(void 0),o=react.useRef(void 0),l=react.useCallback(()=>{o.current=void 0,c(void 0);},[]),m=react.useCallback(()=>{o.current?.(void 0),l(),s();},[s,l]),f=react.useCallback(p=>{o.current?.(p),l(),s();},[s,l]),R=react.useCallback(p=>{p||m();},[m]);return react.useEffect(()=>{let p=h=>{c(h?.params),o.current=h?.onResult,i();};return n.on(`open_modal:${e}`,p),()=>{n.off(`open_modal:${e}`,p);}},[e,i,n]),react.useEffect(()=>{let p=()=>{m();};return n.on(`close_modal:${e}`,p),()=>{n.off(`close_modal:${e}`,p);}},[e,m,n]),t({params:d,isOpen:a,onClose:m,onOpenChange:R,onResult:f})}function Fa(e){let t=hooks.useEventEmitter(),n=react.useCallback(i=>new Promise(s=>{let r=d=>{i?.onResult?.(d),s(d);};t.emit(`open_modal:${e}`,{...i,onResult:r});}),[e,t]),a=react.useCallback(()=>{t.emit(`close_modal:${e}`);},[e,t]);return {onOpen:n,onClose:a}}function No({direction:e,isResizing:t,onResizeStart:n,className:a}){let i=e==="horizontal";return jsxRuntime.jsxs("div",{className:ui.cn("relative flex-none",a),children:[jsxRuntime.jsxs("div",{className:ui.cn("flex items-center justify-center bg-border/80 hover:bg-border transition-colors duration-150 ease-in-out",i?"w-1 h-full cursor-ew-resize flex-col gap-1":"w-full h-1 cursor-ns-resize flex-row gap-1"),children:[jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("i",{className:"rounded-full w-0.5 h-0.5 bg-neutral"}),jsxRuntime.jsx("div",{className:ui.cn("absolute inset-0",i?"-left-1.5 -right-1.5 cursor-ew-resize":"-top-1.5 -bottom-1.5 cursor-ns-resize"),onMouseDown:n})]}),t&&jsxRuntime.jsx("div",{className:ui.cn("fixed inset-0 z-50",i?"cursor-ew-resize":"cursor-ns-resize")})]})}var Zn=4;function jn(e){if(!e)return null;try{let t=localStorage.getItem(`splitView.${e}`);return t?Number(t):null}catch{return null}}function qn(e,t){if(e)try{localStorage.setItem(`splitView.${e}`,String(t));}catch{}}function Ga({direction:e="horizontal",primary:t,secondary:n,defaultSize:a=400,minSize:i=100,maxSize:s=1/0,secondaryMinSize:r=100,onSizeChange:d,persistId:c,className:o,classNames:l}){let m=react.useRef(null),[f,R]=react.useState(()=>jn(c)??a),[p,h]=react.useState(false),b=e==="horizontal",v=hooks.useValueRef(f),H=hooks.useValueRef(i),A=hooks.useValueRef(s),M=hooks.useValueRef(r),N=hooks.useValueRef(p),y=hooks.useCallbackRef(g=>{R(g),qn(c,g),d?.(g);}),ue=react.useCallback(g=>{g.preventDefault(),g.stopPropagation(),h(true);let me=b?"ew-resize":"ns-resize";document.body.style.cursor=me,document.body.style.userSelect="none";let G=b?g.clientX:g.clientY,ne=v.current,Y=m.current,q=Y?b?Y.offsetWidth:Y.offsetHeight:1/0,re=S=>{if(!N.current)return;let fe=(b?S.clientX:S.clientY)-G,P=Math.min(A.current,q-M.current-Zn),E=Math.min(Math.max(ne+fe,H.current),P);y(E);},ie=()=>{h(false),document.body.style.cursor="",document.body.style.userSelect="",document.removeEventListener("mousemove",re),document.removeEventListener("mouseup",ie);};document.addEventListener("mousemove",re),document.addEventListener("mouseup",ie);},[b,v,H,A,M,N,y]);return jsxRuntime.jsxs("div",{ref:m,className:ui.cn("w-full h-full flex overflow-hidden",b?"flex-row":"flex-col",o),children:[jsxRuntime.jsx("div",{className:ui.cn("flex-none overflow-hidden",l?.primary),style:b?{width:`${f}px`,minWidth:`${i}px`}:{height:`${f}px`,minHeight:`${i}px`},children:t}),jsxRuntime.jsx(No,{direction:e,isResizing:p,onResizeStart:ue,className:l?.handle}),jsxRuntime.jsx("div",{className:ui.cn("flex-auto min-w-0 min-h-0 overflow-hidden",l?.secondary),style:b?{minWidth:`${r}px`}:{minHeight:`${r}px`},children:n})]})}typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-scaffold"]="1.0.1");var Qn="1.0.1";exports.ALL_BREAKPOINTS=mo;exports.AsyncModal=Ca;exports.AxiomSplitHandle=cr;exports.CollapsibleSection=nr;exports.DraggableModal=ro;exports.DraggablePanel=Et;exports.DraggablePanelProvider=wi;exports.Logo=ga;exports.NavLink=ft;exports.Scaffold=Yi;exports.ScaffoldContext=Ct;exports.ScaffoldFooter=la;exports.ScaffoldHeader=na;exports.ScaffoldToolbar=ma;exports.SplitHandle=No;exports.SplitView=Ga;exports.StatsFlipPanel=br;exports.TabBarUnderline=Mr;exports.getVisibilityClass=mt;exports.isNavItemActive=fo;exports.useAsyncModal=Fa;exports.useDraggableDisclosure=Oi;exports.useDraggableModalDisclosure=Me;exports.useDraggablePanelDisclosure=Ne;exports.useScaffold=Wt;exports.useScaffoldLayout=Ai;exports.version=Qn;//# sourceMappingURL=index.js.map
|
|
2
2
|
//# sourceMappingURL=index.js.map
|