@mickyballadelli/react-things 0.1.0

package/README.md

@@ -0,0 +1,52 @@
+# @mickyballadelli/react-things
+
+Reusable React components from React Things.
+
+## Install
+
+```sh
+npm install @mickyballadelli/react-things @mui/material @emotion/react @emotion/styled
+```
+
+React and React DOM are peer dependencies.
+
+## Use
+
+```tsx
+import { GlassBox } from '@mickyballadelli/react-things'
+
+export function Example() {
+  return (
+    <GlassBox transparency={0.45} fill={0.62} liquidColor="#38d6a5">
+      Liquid glass content
+    </GlassBox>
+  )
+}
+```
+
+## Components
+
+- GlassBox
+- DraggableBox
+- CodeViewer
+- DockBar
+- CommandPalette
+- SplitPane
+- FloatingToolbar
+- MagneticCard
+- SpotlightPanel
+- NodeCanvas
+- BeforeAfterSlider
+- InfiniteCanvas
+- SmartTooltip
+- ResizableFrame
+- InspectorPanel
+- ColorPicker
+- TimelineScrubber
+- FileDropZone
+
+## Publish
+
+```sh
+npm publish -w @mickyballadelli/react-things
+```

package/dist/components/BeforeAfterSlider.d.ts

@@ -0,0 +1,8 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type BeforeAfterSliderProps = BoxProps & {
+    before: ReactNode;
+    after: ReactNode;
+    initialPosition?: number;
+};
+export declare function BeforeAfterSlider({ before, after, initialPosition, sx, ...props }: BeforeAfterSliderProps): import("react").JSX.Element;

package/dist/components/CodeViewer.d.ts

@@ -0,0 +1,8 @@
+export type CodeViewerProps = {
+    label: string;
+    language: string;
+    value: string;
+    onChange: (value: string) => void;
+    minHeight?: number;
+};
+export declare function CodeViewer({ label, language, value, onChange, minHeight }: CodeViewerProps): import("react").JSX.Element;

package/dist/components/ColorPicker.d.ts

@@ -0,0 +1,9 @@
+export type ColorPickerProps = {
+    value: string;
+    alpha?: number;
+    swatches?: string[];
+    showValue?: boolean;
+    onChange?: (value: string) => void;
+    onAlphaChange?: (alpha: number) => void;
+};
+export declare function ColorPicker({ value, alpha, swatches, showValue, onChange, onAlphaChange }: ColorPickerProps): import("react").JSX.Element;

package/dist/components/CommandPalette.d.ts

@@ -0,0 +1,28 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type CommandPaletteVariant = 'list' | 'tree';
+export type CommandPaletteItem = {
+    id: string;
+    label: string;
+    description?: string;
+    group?: string;
+    parentId?: string;
+    icon?: ReactNode;
+    keywords?: string[];
+    onSelect?: () => void;
+};
+export type CommandPaletteProps = Omit<BoxProps, 'onSelect'> & {
+    items: CommandPaletteItem[];
+    variant?: CommandPaletteVariant;
+    selectedId?: string;
+    placeholder?: string;
+    emptyText?: string;
+    maxResults?: number;
+    showSearch?: boolean;
+    dense?: boolean;
+    expandedGroups?: string[];
+    defaultExpandedGroups?: string[];
+    onExpandedGroupsChange?: (groups: string[]) => void;
+    onSelect?: (item: CommandPaletteItem) => void;
+};
+export declare function CommandPalette({ items, variant, selectedId, placeholder, emptyText, maxResults, showSearch, dense, expandedGroups, defaultExpandedGroups, onExpandedGroupsChange, onSelect, sx, ...props }: CommandPaletteProps): import("react").JSX.Element;

package/dist/components/ComponentExample.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export type ComponentExampleProps = {
+    title?: string;
+    children?: ReactNode;
+};
+export declare function ComponentExample({ title, children }: ComponentExampleProps): import("react").JSX.Element;

package/dist/components/DockBar.d.ts

@@ -0,0 +1,16 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type DockBarItem = {
+    id: string;
+    label: string;
+    icon: ReactNode;
+    onClick?: () => void;
+};
+export type DockBarProps = BoxProps & {
+    items: DockBarItem[];
+    iconSize?: number;
+    magnification?: number;
+    gap?: number;
+    tooltip?: boolean;
+};
+export declare function DockBar({ items, iconSize, magnification, gap, tooltip, sx, ...props }: DockBarProps): import("react").JSX.Element;

package/dist/components/DraggableBox.d.ts

@@ -0,0 +1,25 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type DraggableBoxPosition = {
+    x: number;
+    y: number;
+};
+export type DraggableBoxMetrics = {
+    containerWidth: number;
+    containerHeight: number;
+    draggableWidth: number;
+    draggableHeight: number;
+    draggableLeft: number;
+    draggableTop: number;
+    containerBackgroundImage: string;
+    containerBackgroundSize: string;
+    containerBackgroundPosition: string;
+};
+export type DraggableBoxProps = BoxProps & {
+    children: ReactNode;
+    initialPosition?: DraggableBoxPosition;
+    dragSx?: BoxProps['sx'];
+    onPositionChange?: (position: DraggableBoxPosition, metrics?: DraggableBoxMetrics) => void;
+    onDraggingChange?: (dragging: boolean) => void;
+};
+export declare function DraggableBox({ children, initialPosition, dragSx, onPositionChange, onDraggingChange, sx, ...props }: DraggableBoxProps): import("react").JSX.Element;

package/dist/components/FileDropZone.d.ts

@@ -0,0 +1,5 @@
+import type { BoxProps } from '@mui/material/Box';
+export type FileDropZoneProps = BoxProps & {
+    onFiles?: (files: File[]) => void;
+};
+export declare function FileDropZone({ onFiles, sx, ...props }: FileDropZoneProps): import("react").JSX.Element;

package/dist/components/FloatingToolbar.d.ts

@@ -0,0 +1,16 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode, RefObject } from 'react';
+export type FloatingToolbarPlacement = 'top' | 'bottom';
+export type FloatingToolbarProps = BoxProps & {
+    open: boolean;
+    children: ReactNode;
+    anchorEl?: HTMLElement | null;
+    anchorRect?: DOMRect | null;
+    containerRef?: RefObject<HTMLElement | null>;
+    placement?: FloatingToolbarPlacement;
+    offset?: number;
+    boundaryPadding?: number;
+    autoUpdate?: boolean;
+    arrow?: boolean;
+};
+export declare function FloatingToolbar({ open, children, anchorEl, anchorRect, containerRef, placement, offset, boundaryPadding, autoUpdate, arrow, sx, ...props }: FloatingToolbarProps): import("react").JSX.Element | null;

package/dist/components/GlassBox.d.ts

@@ -0,0 +1,10 @@
+import type { BoxProps } from '@mui/material/Box';
+export type GlassBoxProps = BoxProps & {
+    transparency?: number;
+    fill?: number;
+    liquidColor?: string;
+    glassColor?: string;
+    motion?: number;
+    refractionActive?: boolean;
+};
+export declare function GlassBox({ transparency, fill, liquidColor, glassColor, motion, refractionActive, children, sx, ...props }: GlassBoxProps): import("react").JSX.Element;

package/dist/components/InfiniteCanvas.d.ts

@@ -0,0 +1,35 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type InfiniteCanvasItem = {
+    id: string;
+    x: number;
+    y: number;
+    width?: number;
+    height?: number;
+    label?: string;
+    color?: string;
+    data?: unknown;
+};
+export type InfiniteCanvasViewport = {
+    x: number;
+    y: number;
+    zoom: number;
+};
+export type InfiniteCanvasProps = Omit<BoxProps, 'onChange'> & {
+    items?: InfiniteCanvasItem[];
+    defaultViewport?: InfiniteCanvasViewport;
+    viewport?: InfiniteCanvasViewport;
+    minZoom?: number;
+    maxZoom?: number;
+    showGrid?: boolean;
+    showMinimap?: boolean;
+    selectedItemId?: string | null;
+    renderItem?: (item: InfiniteCanvasItem, selected: boolean) => ReactNode;
+    onViewportChange?: (viewport: InfiniteCanvasViewport) => void;
+    onItemMove?: (itemId: string, position: {
+        x: number;
+        y: number;
+    }) => void;
+    onItemSelect?: (item: InfiniteCanvasItem | null) => void;
+};
+export declare function InfiniteCanvas({ items, defaultViewport, viewport, minZoom, maxZoom, showGrid, showMinimap, selectedItemId, renderItem, onViewportChange, onItemMove, onItemSelect, sx, ...props }: InfiniteCanvasProps): import("react").JSX.Element;

package/dist/components/InspectorPanel.d.ts

@@ -0,0 +1,31 @@
+import type { BoxProps } from '@mui/material/Box';
+export type InspectorPanelFieldOption = {
+    label: string;
+    value: string | number;
+};
+export type InspectorPanelField = {
+    id: string;
+    label: string;
+    type: 'text' | 'number' | 'boolean' | 'select' | 'color';
+    value: string | number | boolean;
+    defaultValue?: string | number | boolean;
+    description?: string;
+    group?: string;
+    unit?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    options?: InspectorPanelFieldOption[];
+    disabled?: boolean;
+};
+export type InspectorPanelProps = {
+    fields: InspectorPanelField[];
+    onChange?: (id: string, value: string | number | boolean) => void;
+    title?: string;
+    description?: string;
+    density?: 'comfortable' | 'compact';
+    showValueSummary?: boolean;
+    showReset?: boolean;
+    sx?: BoxProps['sx'];
+};
+export declare function InspectorPanel({ fields, onChange, title, description, density, showValueSummary, showReset, sx }: InspectorPanelProps): import("react").JSX.Element;

package/dist/components/MagneticCard.d.ts

@@ -0,0 +1,9 @@
+import type { BoxProps } from '@mui/material/Box';
+export type MagneticCardProps = BoxProps & {
+    strength?: number;
+    tilt?: number;
+    lift?: number;
+    glare?: boolean;
+    perspective?: number;
+};
+export declare function MagneticCard({ strength, tilt, lift, glare, perspective, sx, children, ...props }: MagneticCardProps): import("react").JSX.Element;

package/dist/components/NodeCanvas.d.ts

@@ -0,0 +1,42 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type NodeCanvasNode = {
+    id: string;
+    label: string;
+    x: number;
+    y: number;
+    color?: string;
+    data?: unknown;
+};
+export type NodeCanvasConnection = {
+    from: string;
+    to: string;
+    type?: NodeCanvasConnectionType | string;
+    label?: string;
+    color?: string;
+};
+export type NodeCanvasConnectionType = 'line' | 'curved' | 'step' | 'ellipse';
+export type NodeCanvasPosition = {
+    x: number;
+    y: number;
+};
+export type NodeCanvasProps = BoxProps & {
+    nodes: NodeCanvasNode[];
+    connections?: NodeCanvasConnection[];
+    nodeWidth?: number;
+    nodeHeight?: number;
+    mode?: 'edit' | 'readonly';
+    snapToGrid?: boolean;
+    gridSize?: number;
+    showGrid?: boolean;
+    selectedNodeId?: string | null;
+    connectionStyle?: NodeCanvasConnectionType;
+    editableTools?: boolean;
+    linkTypes?: NodeCanvasConnectionType[];
+    renderNode?: (node: NodeCanvasNode, selected: boolean) => ReactNode;
+    onNodesChange?: (nodes: NodeCanvasNode[]) => void;
+    onConnectionsChange?: (connections: NodeCanvasConnection[]) => void;
+    onNodeMove?: (nodeId: string, position: NodeCanvasPosition) => void;
+    onNodeSelect?: (node: NodeCanvasNode) => void;
+};
+export declare function NodeCanvas({ nodes, connections, nodeWidth, nodeHeight, mode, snapToGrid, gridSize, showGrid, selectedNodeId, connectionStyle, editableTools, linkTypes, renderNode, onNodesChange, onConnectionsChange, onNodeMove, onNodeSelect, sx, ...props }: NodeCanvasProps): import("react").JSX.Element;

package/dist/components/ResizableFrame.d.ts

@@ -0,0 +1,8 @@
+import type { BoxProps } from '@mui/material/Box';
+export type ResizableFrameProps = BoxProps & {
+    initialWidth?: number;
+    initialHeight?: number;
+    minWidth?: number;
+    minHeight?: number;
+};
+export declare function ResizableFrame({ initialWidth, initialHeight, minWidth, minHeight, sx, children, ...props }: ResizableFrameProps): import("react").JSX.Element;

package/dist/components/SmartTooltip.d.ts

@@ -0,0 +1,21 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactElement, ReactNode } from 'react';
+export type SmartTooltipAction = {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    onClick?: () => void;
+};
+export type SmartTooltipProps = Omit<BoxProps, 'title' | 'content'> & {
+    children: ReactElement;
+    title?: ReactNode;
+    content?: ReactNode;
+    media?: ReactNode;
+    actions?: SmartTooltipAction[];
+    copyText?: string;
+    placement?: 'top' | 'bottom' | 'left' | 'right';
+    pinMode?: boolean;
+    defaultPinned?: boolean;
+    openDelay?: number;
+};
+export declare function SmartTooltip({ children, title, content, media, actions, copyText, placement, pinMode, defaultPinned, openDelay, sx, ...props }: SmartTooltipProps): import("react").JSX.Element;

package/dist/components/SplitPane.d.ts

@@ -0,0 +1,28 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type SplitPaneOrientation = 'horizontal' | 'vertical';
+export type SplitPaneCollapse = 'first' | 'second' | null;
+export type SplitPaneProps = BoxProps & {
+    first: ReactNode;
+    second: ReactNode;
+    orientation?: SplitPaneOrientation;
+    initialSize?: number;
+    size?: number;
+    defaultSize?: number;
+    minSize?: number;
+    maxSize?: number;
+    dividerSize?: number;
+    snapPoints?: number[];
+    snapThreshold?: number;
+    resetSize?: number;
+    collapsed?: SplitPaneCollapse;
+    defaultCollapsed?: SplitPaneCollapse;
+    collapsedSize?: number;
+    persistKey?: string;
+    keyboardStep?: number;
+    onSizeChange?: (size: number) => void;
+    onCollapsedChange?: (collapsed: SplitPaneCollapse) => void;
+    onDraggingChange?: (dragging: boolean) => void;
+    dividerLabel?: string;
+};
+export declare function SplitPane({ first, second, orientation, initialSize, size: controlledSize, defaultSize, minSize, maxSize, dividerSize, snapPoints, snapThreshold, resetSize, collapsed: controlledCollapsed, defaultCollapsed, collapsedSize, persistKey, keyboardStep, onSizeChange, onCollapsedChange, onDraggingChange, dividerLabel, sx, ...props }: SplitPaneProps): import("react").JSX.Element;

package/dist/components/SpotlightPanel.d.ts

@@ -0,0 +1,6 @@
+import type { BoxProps } from '@mui/material/Box';
+export type SpotlightPanelProps = BoxProps & {
+    radius?: number;
+    dim?: number;
+};
+export declare function SpotlightPanel({ radius, dim, sx, children, ...props }: SpotlightPanelProps): import("react").JSX.Element;

package/dist/components/TimelineScrubber.d.ts

@@ -0,0 +1,28 @@
+import type { BoxProps } from '@mui/material/Box';
+import type { ReactNode } from 'react';
+export type TimelineScrubberMarker = {
+    id: string;
+    time: number;
+    label?: string;
+    color?: string;
+    thumbnail?: ReactNode;
+};
+export type TimelineScrubberThumbnail = {
+    time: number;
+    thumbnail: ReactNode;
+};
+export type TimelineScrubberChangeReason = 'drag' | 'click' | 'keyboard' | 'marker';
+export type TimelineScrubberProps = Omit<BoxProps, 'onChange'> & {
+    duration: number;
+    value?: number;
+    defaultValue?: number;
+    markers?: TimelineScrubberMarker[];
+    thumbnails?: TimelineScrubberThumbnail[];
+    disabled?: boolean;
+    showTime?: boolean;
+    preview?: boolean;
+    step?: number;
+    formatTime?: (time: number) => string;
+    onChange?: (time: number, reason: TimelineScrubberChangeReason) => void;
+};
+export declare function TimelineScrubber({ duration, value, defaultValue, markers, thumbnails, disabled, showTime, preview, step, formatTime, onChange, sx, ...props }: TimelineScrubberProps): import("react").JSX.Element;

package/dist/index.d.ts

@@ -0,0 +1,38 @@
+export type { ComponentExampleProps } from './components/ComponentExample';
+export { ComponentExample } from './components/ComponentExample';
+export type { CodeViewerProps } from './components/CodeViewer';
+export { CodeViewer } from './components/CodeViewer';
+export type { DraggableBoxMetrics, DraggableBoxPosition, DraggableBoxProps } from './components/DraggableBox';
+export { DraggableBox } from './components/DraggableBox';
+export type { GlassBoxProps } from './components/GlassBox';
+export { GlassBox } from './components/GlassBox';
+export type { DockBarItem, DockBarProps } from './components/DockBar';
+export { DockBar } from './components/DockBar';
+export type { CommandPaletteItem, CommandPaletteProps, CommandPaletteVariant } from './components/CommandPalette';
+export { CommandPalette } from './components/CommandPalette';
+export type { SplitPaneCollapse, SplitPaneOrientation, SplitPaneProps } from './components/SplitPane';
+export { SplitPane } from './components/SplitPane';
+export type { FloatingToolbarPlacement, FloatingToolbarProps } from './components/FloatingToolbar';
+export { FloatingToolbar } from './components/FloatingToolbar';
+export type { MagneticCardProps } from './components/MagneticCard';
+export { MagneticCard } from './components/MagneticCard';
+export type { SpotlightPanelProps } from './components/SpotlightPanel';
+export { SpotlightPanel } from './components/SpotlightPanel';
+export type { NodeCanvasConnection, NodeCanvasConnectionType, NodeCanvasNode, NodeCanvasPosition, NodeCanvasProps } from './components/NodeCanvas';
+export { NodeCanvas } from './components/NodeCanvas';
+export type { BeforeAfterSliderProps } from './components/BeforeAfterSlider';
+export { BeforeAfterSlider } from './components/BeforeAfterSlider';
+export type { ResizableFrameProps } from './components/ResizableFrame';
+export { ResizableFrame } from './components/ResizableFrame';
+export type { InspectorPanelField, InspectorPanelProps } from './components/InspectorPanel';
+export { InspectorPanel } from './components/InspectorPanel';
+export type { ColorPickerProps } from './components/ColorPicker';
+export { ColorPicker } from './components/ColorPicker';
+export type { FileDropZoneProps } from './components/FileDropZone';
+export { FileDropZone } from './components/FileDropZone';
+export type { TimelineScrubberChangeReason, TimelineScrubberMarker, TimelineScrubberProps, TimelineScrubberThumbnail } from './components/TimelineScrubber';
+export { TimelineScrubber } from './components/TimelineScrubber';
+export type { InfiniteCanvasItem, InfiniteCanvasProps, InfiniteCanvasViewport } from './components/InfiniteCanvas';
+export { InfiniteCanvas } from './components/InfiniteCanvas';
+export type { SmartTooltipAction, SmartTooltipProps } from './components/SmartTooltip';
+export { SmartTooltip } from './components/SmartTooltip';

package/dist/react-things-ui.cjs

@@ -0,0 +1,24 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),K=require("@mui/material"),b=require("react"),p=require("@mui/material/Box"),F=require("@mui/material/styles"),ne=require("@mui/material/Tooltip"),q=require("@mui/material/Typography"),De=require("@mui/material/Collapse"),We=require("@mui/material/InputBase"),Ee=require("@mui/material/List"),$e=require("@mui/material/ListItemButton"),Xe=require("@mui/material/ListItemIcon"),Ce=require("@mui/material/ListItemText"),qe=require("@mui/icons-material/AddBox"),Ye=require("@mui/icons-material/AddLink"),Fe=require("@mui/icons-material/Close"),Ne=require("@mui/icons-material/Delete"),Oe=require("@mui/icons-material/LinkOff"),ce=require("@mui/material/IconButton"),de=require("@mui/material/MenuItem"),G=require("@mui/material/Stack"),Z=require("@mui/material/TextField"),He=require("@mui/icons-material/DragIndicator"),oe=require("@mui/material/Button"),Ge=require("@mui/material/Checkbox"),be=require("@mui/material/Chip"),Ve=require("@mui/material/Divider"),Ue=require("@mui/material/FormControlLabel"),Pe=require("@mui/material/Paper"),Le=require("@mui/material/Slider"),Ze=require("@mui/material/InputAdornment"),_e=require("@mui/icons-material/ContentCopy"),Qe=require("@mui/icons-material/PushPin"),Je=require("@mui/icons-material/PushPinOutlined"),Ke=require("@mui/material/ClickAwayListener"),et=require("@mui/material/Popper");function tt({title:t="React Things",children:n}){return e.jsxs(K.Box,{sx:{border:1,borderColor:"divider",borderRadius:1,p:2,bgcolor:"background.paper"},children:[e.jsx(K.Typography,{variant:"subtitle1",fontWeight:700,children:t}),n?e.jsx(K.Box,{sx:{mt:1},children:n}):null]})}const me="ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",Se=12,rt={c:"#659ad2",cpp:"#00599c",cplusplus:"#00599c","c++":"#00599c",typescript:"#3178c6",ts:"#3178c6",tsx:"#3178c6",javascript:"#f7df1e",js:"#f7df1e",jsx:"#f7df1e",java:"#e76f00",powershell:"#5391fe",ps1:"#5391fe",rust:"#dea584",rs:"#dea584",go:"#00add8",golang:"#00add8",shell:"#89e051",sh:"#89e051",bash:"#89e051",zsh:"#89e051",python:"#3776ab",py:"#3776ab",csharp:"#9b4f96","c#":"#9b4f96",cs:"#9b4f96",php:"#777bb4",ruby:"#cc342d",rb:"#cc342d",swift:"#f05138",kotlin:"#a97bff",kt:"#a97bff",sql:"#336791",html:"#e34f26",css:"#1572b6",dart:"#0175c2"};function nt(t){return t.trim().replace(/^\./,"").toLowerCase().replace(/\s+/g,"")}function ot(t){return rt[nt(t)]??"#93c5fd"}function it(t){return t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function at(t){const n=it(t),d=/^(import|from|export|function|return|const|let|var|type|interface|class|extends|new|if|else|for|while|switch|case|break|continue|async|await|try|catch|finally|throw|fn|pub|use|mod|impl|trait|struct|enum|match|mut|let|where|package|func|defer|go|select|range|map|chan|SELECT|FROM|WHERE|AS|AND|OR|INSERT|UPDATE|DELETE|CREATE|TABLE|ORDER|BY|GROUP|LIMIT|select|from|where|as|and|or|insert|update|delete|create|table|order|by|group|limit)\b/;return/^['"`]/.test(t)?`<span style="color:#86efac">${n}</span>`:/^\d/.test(t)?`<span style="color:#fbbf24">${n}</span>`:/^<\/?[A-Z][\w.]*/.test(t)?`<span style="color:#67e8f9">${n}</span>`:d.test(t)?`<span style="color:#c084fc">${n}</span>`:/^[$#][\w-]+$|^\.[\w-]+$/.test(t)?`<span style="color:#f9a8d4">${n}</span>`:/^[A-Z][\w.]*$/.test(t)?`<span style="color:#93c5fd">${n}</span>`:/^[a-z][\w-]*(?==|:)/.test(t)?`<span style="color:#f9a8d4">${n}</span>`:/^[{}()[\].,:;=<>/]+$/.test(t)?`<span style="color:#94a3b8">${n}</span>`:n}function st(t){return t.split(/(\s+|<\/?[A-Z][\w.]*|['"`][^'"`]*['"`]|\d*\.?\d+|[A-Za-z_$][\w$-]*|[{}()[\].,:;=<>/]+)/g).map(n=>at(n)).join("")}function lt({label:t,language:n,value:d,onChange:l,minHeight:f=360}){const c=d??"",g=Math.max(c.split(`
+`).length,1),x=Array.from({length:g},(y,v)=>v+1).join(`
+`),a=st(c),m=ot(n);return e.jsxs(K.Box,{children:[e.jsxs(K.Box,{sx:{display:"flex",alignItems:"center",justifyContent:"space-between",px:1.5,py:1,bgcolor:"#111827",color:"#d1d5db",borderTopLeftRadius:4,borderTopRightRadius:4},children:[e.jsx(K.Typography,{variant:"caption",fontWeight:800,children:t}),e.jsx(K.Typography,{variant:"caption",sx:{fontFamily:"monospace",color:m,textTransform:"lowercase"},children:n})]}),e.jsxs(K.Box,{sx:{display:"grid",gridTemplateColumns:"48px 1fr",minHeight:f,bgcolor:"#0f172a",borderBottomLeftRadius:4,borderBottomRightRadius:4,overflow:"hidden"},children:[e.jsx(K.Box,{component:"pre","aria-hidden":"true",sx:{m:0,px:1.5,py:1.5,color:"#64748b",bgcolor:"#111827",fontFamily:me,fontSize:14,lineHeight:1.6,textAlign:"right",userSelect:"none"},children:x}),e.jsxs(K.Box,{sx:{position:"relative",minHeight:f,bgcolor:"#0f172a",overflow:"auto"},children:[e.jsx(K.Box,{component:"pre","aria-hidden":"true",dangerouslySetInnerHTML:{__html:a},sx:{position:"absolute",inset:0,m:0,p:`${Se}px`,boxSizing:"border-box",pointerEvents:"none",color:"#e5e7eb",fontFamily:me,fontSize:14,lineHeight:1.6,tabSize:2,whiteSpace:"pre-wrap",overflowWrap:"normal"}}),e.jsx(K.Box,{component:"textarea","aria-label":`${t} code editor`,spellCheck:!1,value:c,onChange:y=>l(y.target.value),sx:{position:"relative",width:"100%",minWidth:0,minHeight:f,resize:"vertical",border:0,outline:0,p:`${Se}px`,boxSizing:"border-box",color:"transparent",WebkitTextFillColor:"transparent",bgcolor:"transparent",caretColor:"#60a5fa",fontFamily:me,fontSize:14,lineHeight:1.6,tabSize:2,whiteSpace:"pre-wrap",overflow:"auto",textShadow:"none",MozOsxFontSmoothing:"auto","&::selection":{color:"transparent",WebkitTextFillColor:"transparent",bgcolor:"rgba(96, 165, 250, 0.35)"}}})]})]})]})}function ct({children:t,initialPosition:n={x:50,y:50},dragSx:d,onPositionChange:l,onDraggingChange:f,sx:c,...g}){const x=b.useRef(null),a=b.useRef(null),[m,y]=b.useState(n),[v,j]=b.useState({x:0,y:0}),[T,$]=b.useState(!1);b.useLayoutEffect(()=>{const u=x.current,S=a.current;if(!u||!S)return;const E=u.getBoundingClientRect(),D=S.getBoundingClientRect(),k=window.getComputedStyle(u),L=m.x/100*E.width,w=m.y/100*E.height;l?.(m,{containerWidth:E.width,containerHeight:E.height,draggableWidth:D.width,draggableHeight:D.height,draggableLeft:L-D.width/2,draggableTop:w-D.height/2,containerBackgroundImage:k.backgroundImage,containerBackgroundSize:k.backgroundSize,containerBackgroundPosition:k.backgroundPosition})},[]);function o(u,S){y(u),l?.(u,S)}function M(u,S,E=v){const D=x.current,k=a.current;if(!D||!k)return;const L=D.getBoundingClientRect(),w=k.getBoundingClientRect(),A=window.getComputedStyle(D),N=u-E.x+w.width/2,X=S-E.y+w.height/2,s=w.width/L.width*50,R=w.height/L.height*50,h=(N-L.left)/L.width*100,I=(X-L.top)/L.height*100,B={x:Math.min(Math.max(h,s),100-s),y:Math.min(Math.max(I,R),100-R)},i=B.x/100*L.width,P=B.y/100*L.height;o(B,{containerWidth:L.width,containerHeight:L.height,draggableWidth:w.width,draggableHeight:w.height,draggableLeft:i-w.width/2,draggableTop:P-w.height/2,containerBackgroundImage:A.backgroundImage,containerBackgroundSize:A.backgroundSize,containerBackgroundPosition:A.backgroundPosition})}return e.jsx(p,{...g,ref:x,sx:[{position:"relative",overflow:"hidden",touchAction:"none"},...Array.isArray(c)?c:c?[c]:[]],onPointerMove:u=>{T&&M(u.clientX,u.clientY)},onPointerUp:u=>{$(!1),f?.(!1),u.currentTarget.releasePointerCapture(u.pointerId)},onPointerCancel:()=>{$(!1),f?.(!1)},children:e.jsx(p,{ref:a,sx:[{position:"absolute",left:`${m.x}%`,top:`${m.y}%`,transform:"translate(-50%, -50%)",cursor:T?"grabbing":"grab",userSelect:"none"},...Array.isArray(d)?d:d?[d]:[]],onPointerDown:u=>{const S=u.currentTarget.getBoundingClientRect(),E={x:u.clientX-S.left,y:u.clientY-S.top};$(!0),f?.(!0),j(E),u.currentTarget.setPointerCapture(u.pointerId),M(u.clientX,u.clientY,E)},children:t})})}function Ie(t){return Math.min(Math.max(t,0),1)}function dt({transparency:t=.36,fill:n=.72,liquidColor:d="#39b8ff",glassColor:l="#ffffff",motion:f=0,refractionActive:c=!0,children:g,sx:x,...a}){const y=`glass-liquid-${b.useId().replace(/:/g,"")}`,v=1-Ie(t),j=Ie(t),$=`${(1-Math.min(Math.max(n,0),1))*100}%`,o=Math.abs(Math.round(f*8))+1,M=.012+Math.abs(Math.sin(f/17))*.012,u=18+v*18,S=c;return e.jsxs(p,{...a,sx:[{position:"relative",overflow:"hidden",border:1,borderColor:F.alpha(l,.48),borderRadius:2,minHeight:160,p:3,color:"common.white",bgcolor:F.alpha(l,.08+j*.18),boxShadow:`
+            inset 0 1px 0 ${F.alpha(l,.68)},
+            inset 14px 0 34px ${F.alpha(l,.12)},
+            inset -18px 0 32px ${F.alpha(d,v*.2)},
+            0 18px 48px ${F.alpha("#0b2030",.18)}
+          `,backdropFilter:"blur(12px) saturate(170%) contrast(108%)",WebkitBackdropFilter:"blur(12px) saturate(170%) contrast(108%)","&::before":{content:'""',position:"absolute",left:0,right:0,top:$,bottom:0,background:`
+              linear-gradient(160deg, ${F.alpha(l,v*.16)} 0%, ${F.alpha(d,v*.28)} 42%, ${F.alpha("#063451",v*.2)} 100%)
+            `,opacity:.95,boxShadow:`
+              inset 0 18px 28px ${F.alpha(l,.12+v*.16)},
+              inset 0 -34px 44px ${F.alpha("#032536",v*.22)}
+            `},"&::after":{content:'""',position:"absolute",inset:0,background:`
+              linear-gradient(105deg, ${F.alpha(l,.34)} 0%, ${F.alpha(l,.08)} 18%, ${F.alpha(l,0)} 34%),
+              radial-gradient(circle at 18% 18%, ${F.alpha(l,.38)} 0 3%, ${F.alpha(l,0)} 18%)
+            `,pointerEvents:"none"},"& .GlassBox-liquidLens":{position:"absolute",inset:0,zIndex:1,pointerEvents:"none",backgroundImage:"var(--glassbox-refraction-background, none)",backgroundSize:"var(--glassbox-refraction-background-size, cover)",backgroundPosition:"var(--glassbox-refraction-background-position, center)",backgroundRepeat:"no-repeat",filter:`url(#${y}) saturate(150%) contrast(112%)`,opacity:S?.72:0,transition:"opacity 120ms ease-out",maskImage:`linear-gradient(to bottom, transparent 0, transparent calc(${$} + 10px), black calc(${$} + 28px), black 100%)`,WebkitMaskImage:`linear-gradient(to bottom, transparent 0, transparent calc(${$} + 10px), black calc(${$} + 28px), black 100%)`},"& .GlassBox-refractionOffset":{position:"absolute",inset:0,zIndex:2,pointerEvents:"none",opacity:S?.16+j*.16:0,backdropFilter:"blur(3px) saturate(190%)",WebkitBackdropFilter:"blur(3px) saturate(190%)",background:`
+              linear-gradient(180deg, ${F.alpha(l,.2)} 0, ${F.alpha(l,0)} 20%),
+              linear-gradient(90deg, ${F.alpha(l,0)} 0 18%, ${F.alpha(l,.14)} 26%, ${F.alpha(l,0)} 34% 58%, ${F.alpha(l,.1)} 68%, ${F.alpha(l,0)} 76% 100%)
+            `,transition:"opacity 120ms ease-out",maskImage:`linear-gradient(to bottom, transparent 0, transparent ${$}, black calc(${$} + 18px), black 100%)`,WebkitMaskImage:`linear-gradient(to bottom, transparent 0, transparent ${$}, black calc(${$} + 18px), black 100%)`},"& .GlassBox-content":{position:"relative",zIndex:3,textShadow:`0 1px 10px ${F.alpha("#00121d",.36)}`},"& > *":{position:"relative",zIndex:3}},...Array.isArray(x)?x:x?[x]:[]],children:[e.jsx(p,{component:"svg","aria-hidden":"true",focusable:"false",sx:{position:"absolute",width:0,height:0,overflow:"hidden"},children:e.jsxs("filter",{id:y,children:[e.jsx("feTurbulence",{type:"fractalNoise",baseFrequency:`${M} ${M*2.6}`,numOctaves:"2",seed:o,result:"liquidNoise"}),e.jsx("feDisplacementMap",{in:"SourceGraphic",in2:"liquidNoise",scale:u,xChannelSelector:"R",yChannelSelector:"G"})]})}),e.jsx(p,{className:"GlassBox-liquidLens"}),e.jsx(p,{className:"GlassBox-refractionOffset"}),e.jsx(p,{className:"GlassBox-content",children:g})]})}function ut(t,n,d){return Math.min(Math.max(t,n),d)}function pt({items:t,iconSize:n=52,magnification:d=1.7,gap:l=10,tooltip:f=!0,sx:c,...g}){const[x,a]=b.useState(null);return e.jsx(p,{...g,role:"toolbar",sx:[{display:"inline-flex",alignItems:"flex-end",gap:`${l}px`,p:1,border:1,borderColor:"rgba(255,255,255,0.5)",borderRadius:3,bgcolor:"rgba(255,255,255,0.34)",boxShadow:"0 18px 44px rgba(15, 23, 42, 0.22)",backdropFilter:"blur(18px) saturate(150%)",WebkitBackdropFilter:"blur(18px) saturate(150%)"},...Array.isArray(c)?c:c?[c]:[]],onMouseLeave:()=>a(null),children:t.map((m,y)=>{const v=x===null?4:Math.abs(y-x),j=ut(1-v/3,0,1),T=1+(d-1)*j,$=-18*j,o=e.jsx(p,{component:"button",type:"button","aria-label":m.label,onClick:m.onClick,onMouseEnter:()=>a(y),sx:{width:n,height:n,display:"grid",placeItems:"center",flex:"0 0 auto",border:0,borderRadius:2,p:0,color:"inherit",bgcolor:"rgba(255,255,255,0.72)",boxShadow:"inset 0 1px 0 rgba(255,255,255,0.85), 0 8px 18px rgba(15, 23, 42, 0.18)",cursor:"pointer",transform:`translateY(${$}px) scale(${T})`,transformOrigin:"bottom center",transition:"transform 130ms ease-out, background-color 130ms ease-out","&:focus-visible":{outline:"2px solid #2563eb",outlineOffset:3},"&:active":{bgcolor:"rgba(255,255,255,0.9)"}},children:e.jsx(q,{component:"span","aria-hidden":"true",sx:{display:"grid",placeItems:"center",fontSize:Math.round(n*.52),lineHeight:1},children:m.icon})},m.id);return f?e.jsx(ne,{title:m.label,placement:"top",arrow:!0,children:o},m.id):o})})}function Te(t){return t.toLowerCase().trim()}function ht(t){return Te([t.label,t.description,t.group,t.parentId,...t.keywords??[]].filter(Boolean).join(" "))}function Re(t){return Array.from(new Set(t.map(n=>n.group).filter(Boolean)))}function xt({items:t,variant:n="list",selectedId:d,placeholder:l="Search",emptyText:f="No items found",maxResults:c,showSearch:g=!0,dense:x=!1,expandedGroups:a,defaultExpandedGroups:m,onExpandedGroupsChange:y,onSelect:v,sx:j,...T}){const $=m??Re(t),[o,M]=b.useState(""),[u,S]=b.useState(0),[E,D]=b.useState($),k=Te(o),L=a??E,w=b.useMemo(()=>{const i=k?t.filter(P=>ht(P).includes(k)):t;return typeof c=="number"?i.slice(0,c):i},[t,c,k]),A=Re(w),N=w;function X(i){i.onSelect?.(),v?.(i),M(""),S(0)}function s(i){a===void 0&&D(i),y?.(i)}function R(i){s(L.includes(i)?L.filter(P=>P!==i):[...L,i])}function h(i,P=0){const _=i.id===d;return e.jsxs($e,{selected:_,dense:x,onClick:()=>X(i),sx:{borderRadius:1,pl:1.25+P*2,"&.Mui-selected":{bgcolor:"action.selected",color:"primary.main"},"&.Mui-selected:hover, &:hover":{bgcolor:"action.hover"}},children:[i.icon?e.jsx(Xe,{sx:{minWidth:34,color:"inherit"},children:i.icon}):null,e.jsx(Ce,{primary:i.label,secondary:i.description,primaryTypographyProps:{fontWeight:_?850:700},secondaryTypographyProps:{color:"text.secondary"}})]},i.id)}function I(){return w.length?A.length?A.map(i=>e.jsxs(p,{children:[e.jsx(q,{variant:"caption",fontWeight:900,color:"text.secondary",sx:{display:"block",px:1.25,pt:1.5,pb:.5},children:i}),w.filter(P=>P.group===i).map(P=>h(P))]},i)):w.map(i=>h(i)):e.jsx(p,{sx:{px:2,py:4,textAlign:"center",color:"text.secondary"},children:f})}function B(){return w.length?A.length?A.map(i=>{const P=k||L.includes(i);return e.jsxs(p,{children:[e.jsxs($e,{dense:x,onClick:()=>R(i),sx:{borderRadius:1,px:1.25},children:[e.jsx(q,{component:"span","aria-hidden":"true",sx:{mr:1,width:16,color:"text.secondary"},children:P?"▾":"▸"}),e.jsx(Ce,{primary:i,primaryTypographyProps:{fontWeight:900}})]}),e.jsx(De,{in:!!P,timeout:"auto",unmountOnExit:!0,children:w.filter(_=>_.group===i).map(_=>h(_,1))})]},i)}):w.map(i=>h(i)):e.jsx(p,{sx:{px:2,py:4,textAlign:"center",color:"text.secondary"},children:f})}return e.jsxs(p,{...T,sx:[{display:"flex",flexDirection:"column",gap:1,minWidth:0},...Array.isArray(j)?j:j?[j]:[]],children:[g?e.jsx(p,{sx:{px:1.25,py:.75,border:1,borderColor:"divider",borderRadius:1,bgcolor:"background.paper"},children:e.jsx(We,{fullWidth:!0,value:o,placeholder:l,onChange:i=>{M(i.target.value),S(0)},onKeyDown:i=>{i.key==="ArrowDown"&&(i.preventDefault(),S(P=>Math.min(P+1,N.length-1))),i.key==="ArrowUp"&&(i.preventDefault(),S(P=>Math.max(P-1,0))),i.key==="Enter"&&N[u]&&(i.preventDefault(),X(N[u]))},sx:{fontSize:14}})}):null,e.jsx(Ee,{disablePadding:!0,dense:x,sx:{overflow:"auto"},children:n==="tree"?B():I()})]})}function ze(t,n,d){return Math.min(Math.max(t,n),d)}function ft(t){if(!t||typeof window>"u")return null;const n=window.localStorage.getItem(t),d=n===null?Number.NaN:Number(n);return Number.isFinite(d)?d:null}function gt({first:t,second:n,orientation:d="horizontal",initialSize:l=50,size:f,defaultSize:c,minSize:g=20,maxSize:x=80,dividerSize:a=8,snapPoints:m=[],snapThreshold:y=4,resetSize:v=c??l,collapsed:j,defaultCollapsed:T=null,collapsedSize:$=0,persistKey:o,keyboardStep:M=5,onSizeChange:u,onCollapsedChange:S,onDraggingChange:E,dividerLabel:D="Resize panels",sx:k,...L}){const w=b.useRef(null),[A,N]=b.useState(()=>ft(o)??c??l),[X,s]=b.useState(T),[R,h]=b.useState(!1),I=d==="horizontal",i=ze(f??A,g,x),P=j??X,_=P==="first"?$:P==="second"?100-$:i,ie=P==="first"&&$<=0,ae=P==="second"&&$<=0;b.useEffect(()=>{o&&window.localStorage.setItem(o,String(i))},[o,i]),b.useEffect(()=>{E?.(R)},[R,E]);function H(C){const te=m.reduce((se,he)=>{const xe=Math.abs(se-C);return Math.abs(he-C)<xe?he:se},C),re=Math.abs(te-C)<=y,Q=ze(re?te:C,g,x);f===void 0&&N(Q),u?.(Q),pe(null)}function ee(C,te){const re=w.current;if(!re)return;const Q=re.getBoundingClientRect(),se=I?(C-Q.left)/Q.width*100:(te-Q.top)/Q.height*100;H(se)}function V(C){H(i+C)}function J(){H(v)}function ue(C){pe(P===C?null:C)}function pe(C){j===void 0&&s(C),S?.(C)}return e.jsxs(p,{...L,ref:w,sx:[{display:"grid",gridTemplateColumns:I?`${_}% ${a}px 1fr`:"1fr",gridTemplateRows:I?"1fr":`${_}% ${a}px 1fr`,minHeight:280,overflow:"hidden",userSelect:R?"none":void 0},...Array.isArray(k)?k:k?[k]:[]],onPointerMove:C=>{R&&ee(C.clientX,C.clientY)},onPointerUp:()=>{h(!1)},onPointerCancel:()=>h(!1),children:[e.jsx(p,{sx:{minWidth:0,minHeight:0,overflow:"auto",display:ie?"none":void 0},children:t}),e.jsx(p,{role:"separator","aria-label":D,"aria-orientation":I?"vertical":"horizontal","aria-valuemin":g,"aria-valuemax":x,"aria-valuenow":Math.round(i),tabIndex:0,onPointerDown:C=>{h(!0),C.currentTarget.setPointerCapture(C.pointerId),ee(C.clientX,C.clientY)},onPointerUp:C=>{h(!1),C.currentTarget.releasePointerCapture(C.pointerId)},onDoubleClick:J,onKeyDown:C=>{C.key==="Enter"&&(J(),C.preventDefault()),C.key==="Home"&&(ue("first"),C.preventDefault()),C.key==="End"&&(ue("second"),C.preventDefault()),(C.key==="ArrowLeft"||C.key==="ArrowUp")&&(V(-M),C.preventDefault()),(C.key==="ArrowRight"||C.key==="ArrowDown")&&(V(M),C.preventDefault())},sx:{position:"relative",bgcolor:R?"primary.main":"divider",cursor:I?"col-resize":"row-resize",touchAction:"none",transition:"background-color 120ms ease","&:hover":{bgcolor:"primary.main"},"&:focus-visible":{outline:"2px solid",outlineColor:"primary.main",outlineOffset:-2},"&::after":{content:'""',position:"absolute",inset:I?"30% -4px":"-4px 30%",borderRadius:999,bgcolor:R?"primary.contrastText":"text.disabled",opacity:.55}}}),e.jsx(p,{sx:{minWidth:0,minHeight:0,overflow:"auto",display:ae?"none":void 0},children:n})]})}function bt(t,n){return n??t?.getBoundingClientRect()??null}function mt({open:t,children:n,anchorEl:d,anchorRect:l,containerRef:f,placement:c="top",offset:g=8,boundaryPadding:x=8,autoUpdate:a=!0,arrow:m=!0,sx:y,...v}){const j=b.useRef(null),[T,$]=b.useState({left:-9999,top:-9999}),o=b.useCallback(()=>{if(!t)return;const M=bt(d,l),u=j.current;if(!M||!u)return;const S=f?.current?.getBoundingClientRect(),E=S?.left??0,D=S?.top??0,k=S?.width??window.innerWidth,L=S?.height??window.innerHeight,w=u.offsetWidth/2,A=u.offsetHeight,N=M.left-E+M.width/2,X=c==="top"?M.top-D-g:M.bottom-D+g,s=Math.min(Math.max(N,w+x),k-w-x),R=c==="top"?Math.max(X,A+x):Math.min(X,L-A-x);$({left:s,top:R})},[d,l,x,f,g,t,c]);return b.useLayoutEffect(()=>{o()},[o]),b.useEffect(()=>{if(!(!t||!a))return window.addEventListener("resize",o),window.addEventListener("scroll",o,!0),()=>{window.removeEventListener("resize",o),window.removeEventListener("scroll",o,!0)}},[a,t,o]),t?e.jsx(p,{...v,ref:j,role:"toolbar",sx:[{position:f?"absolute":"fixed",left:T.left,top:T.top,zIndex:1300,display:"inline-flex",alignItems:"center",gap:.5,p:.5,borderRadius:1.5,bgcolor:"rgba(15,23,42,0.96)",color:"#e5e7eb",boxShadow:"0 16px 40px rgba(15, 23, 42, 0.34)",transform:c==="top"?"translate(-50%, -100%)":"translate(-50%, 0)",backdropFilter:"blur(12px)","&::after":m?{content:'""',position:"absolute",left:"50%",width:10,height:10,bgcolor:"rgba(15,23,42,0.96)",transform:"translateX(-50%) rotate(45deg)",bottom:c==="top"?-5:void 0,top:c==="bottom"?-5:void 0}:void 0},...Array.isArray(y)?y:y?[y]:[]],children:n}):null}function yt({strength:t=18,tilt:n=10,lift:d=10,glare:l=!0,perspective:f=900,sx:c,children:g,...x}){const[a,m]=b.useState({x:0,y:0,rotateX:0,rotateY:0,glareX:50,glareY:50,active:!1});return e.jsx(p,{...x,onMouseMove:y=>{const v=y.currentTarget.getBoundingClientRect(),j=(y.clientX-v.left)/v.width,T=(y.clientY-v.top)/v.height,$=(j-.5)*t,o=(T-.5)*t;m({x:$,y:o,rotateX:(.5-T)*n,rotateY:(j-.5)*n,glareX:j*100,glareY:T*100,active:!0})},onMouseLeave:()=>m({x:0,y:0,rotateX:0,rotateY:0,glareX:50,glareY:50,active:!1}),sx:[{position:"relative",overflow:"hidden",transform:`
+            perspective(${f}px)
+            translate3d(${a.x}px, ${a.y}px, ${a.active?-d:0}px)
+            rotateX(${a.rotateX}deg)
+            rotateY(${a.rotateY}deg)
+          `,transformStyle:"preserve-3d",transition:a.active?"transform 80ms ease-out, box-shadow 120ms ease-out":"transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 260ms ease",willChange:"transform",boxShadow:a.active?"0 28px 70px rgba(15, 23, 42, 0.24)":"0 14px 34px rgba(15, 23, 42, 0.12)","&::before":l?{content:'""',position:"absolute",inset:0,pointerEvents:"none",opacity:a.active?.78:0,transition:"opacity 160ms ease",background:`radial-gradient(circle at ${a.glareX}% ${a.glareY}%, rgba(255,255,255,0.55), rgba(255,255,255,0.16) 22%, transparent 48%)`,mixBlendMode:"screen"}:void 0,"& > *":{position:"relative",zIndex:1,transform:a.active?"translateZ(24px)":"translateZ(0)",transition:"transform 180ms ease"}},...Array.isArray(c)?c:c?[c]:[]],children:g})}function wt({radius:t=160,dim:n=.72,sx:d,children:l,...f}){const[c,g]=b.useState({x:50,y:50});return e.jsx(p,{...f,onMouseMove:x=>{const a=x.currentTarget.getBoundingClientRect();g({x:(x.clientX-a.left)/a.width*100,y:(x.clientY-a.top)/a.height*100})},sx:[{position:"relative",overflow:"hidden","&::after":{content:'""',position:"absolute",inset:0,pointerEvents:"none",background:`radial-gradient(circle ${t}px at ${c.x}% ${c.y}%, transparent 0, transparent 45%, rgba(0,0,0,${n}) 100%)`}},...Array.isArray(d)?d:d?[d]:[]],children:l})}function Me(t,n){return Math.round(t/n)*n}function jt(t,n,d,l,f){const c=t.x+d/2,g=t.y+l/2,x=n.x+d/2,a=n.y+l/2,m=(c+x)/2;if(f==="ellipse"){const y=Math.max(Math.abs(x-c)/2,24),v=Math.max(Math.abs(a-g)/2,24);return`M ${c} ${g} A ${y} ${v} 0 0 1 ${x} ${a}`}return f==="curved"?`M ${c} ${g} C ${m} ${g}, ${m} ${a}, ${x} ${a}`:f==="step"?`M ${c} ${g} L ${m} ${g} L ${m} ${a} L ${x} ${a}`:`M ${c} ${g} L ${x} ${a}`}function vt({nodes:t,connections:n=[],nodeWidth:d=132,nodeHeight:l=52,mode:f="edit",snapToGrid:c=!1,gridSize:g=24,showGrid:x=!1,selectedNodeId:a,connectionStyle:m="line",editableTools:y=!1,linkTypes:v=["line","curved","step","ellipse"],renderNode:j,onNodesChange:T,onConnectionsChange:$,onNodeMove:o,onNodeSelect:M,sx:u,...S}){const[E,D]=b.useState(t),[k,L]=b.useState(n),w=y?E:t,A=y?k:n,[N,X]=b.useState(Object.fromEntries(w.map(r=>[r.id,{x:r.x,y:r.y}]))),[s,R]=b.useState(a??null),[h,I]=b.useState(!1),[B,i]=b.useState(""),[P,_]=b.useState(v[0]??"line"),[ie,ae]=b.useState(""),[H,ee]=b.useState(null),V=a??s,J=w.find(r=>r.id===V)??null,ue=A.map((r,z)=>({connection:r,index:z})).filter(({connection:r})=>r.from===V||r.to===V),pe=t.map(r=>`${r.id}:${r.label}:${r.x}:${r.y}:${r.color??""}`).join("|"),C=n.map(r=>`${r.from}:${r.to}:${r.type??""}:${r.label??""}:${r.color??""}`).join("|");b.useEffect(()=>{y||D(t),X(r=>({...Object.fromEntries(t.map(z=>[z.id,r[z.id]??{x:z.x,y:z.y}]))}))},[y,pe]),b.useEffect(()=>{y||L(n)},[C,y]);function te(r){D(r),T?.(r)}function re(r){L(r),$?.(r)}function Q(r,z){const Y=c?{x:Me(z.x,g),y:Me(z.y,g)}:z;X(W=>({...W,[r]:Y})),y&&te(w.map(W=>W.id===r?{...W,...Y}:W)),o?.(r,Y)}function se(){const r=w.length+1,z={id:`node-${Date.now()}`,label:`Box ${r}`,x:48+r*18,y:48+r*18,color:"#ffffff"};te([...w,z]),X(Y=>({...Y,[z.id]:{x:z.x,y:z.y}})),R(z.id)}function he(){V&&(te(w.filter(r=>r.id!==V)),re(A.filter(r=>r.from!==V&&r.to!==V)),R(null),I(!1))}function xe(r){V&&te(w.map(z=>z.id===V?{...z,...r}:z))}function we(){if(!V||!B||V===B)return;const r={from:V,to:B,type:P,label:ie,color:P==="ellipse"?"#db2777":P==="step"?"#059669":"#2563eb"},z=[...A.filter(Y=>!(Y.from===V&&Y.to===B)),r];re(z),i(""),ae(""),ee(z.indexOf(r))}function fe(r,z){const Y=A[r];if(!Y)return;const W={...Y,...z},U=A.map((O,le)=>le===r?W:O).filter((O,le)=>le===r||O.from!==W.from||O.to!==W.to);re(U)}function Be(r){re(A.filter((z,Y)=>Y!==r)),ee(null)}return e.jsxs(p,{...S,sx:[{position:"relative",minHeight:360,overflow:"hidden",bgcolor:"#f8fafc",backgroundImage:x?"linear-gradient(rgba(148,163,184,0.24) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,0.24) 1px, transparent 1px)":void 0,backgroundSize:x?`${g}px ${g}px`:void 0},...Array.isArray(u)?u:u?[u]:[]],children:[e.jsx(p,{component:"svg",sx:{position:"absolute",inset:0,width:"100%",height:"100%"},children:A.map(r=>{const z=N[r.from],Y=N[r.to];if(!z||!Y)return null;const W=jt(z,Y,d,l,r.type??m),U=(z.x+Y.x+d)/2,O=(z.y+Y.y+l)/2;return e.jsxs("g",{children:[e.jsx("path",{d:W,fill:"none",stroke:r.color??"#94a3b8",strokeWidth:"2.5"}),r.label?e.jsx("text",{x:U,y:O-8,textAnchor:"middle",fill:r.color??"#64748b",fontSize:"11",fontWeight:"700",children:r.label}):null]},`${r.from}-${r.to}-${r.type??r.label??"link"}`)})}),w.map(r=>{const z=N[r.id],Y=r.id===V;return e.jsx(p,{role:"button",tabIndex:0,sx:{position:"absolute",left:z.x,top:z.y,width:d,height:l,display:"grid",placeItems:"center",border:Y?2:1,borderColor:Y?"primary.main":"divider",borderRadius:1,bgcolor:r.color??"background.paper",cursor:f==="edit"?"grab":"pointer",userSelect:"none",boxShadow:Y?"0 18px 34px rgba(37,99,235,0.22)":"0 12px 28px rgba(15,23,42,0.12)",touchAction:"none"},onPointerDown:W=>{if(R(r.id),ee(null),y&&I(!0),M?.(r),f==="readonly")return;const U=W.clientX,O=W.clientY,le=N[r.id];W.currentTarget.setPointerCapture(W.pointerId);function je(ke){Q(r.id,{x:le.x+ke.clientX-U,y:le.y+ke.clientY-O})}function ve(){window.removeEventListener("pointermove",je),window.removeEventListener("pointerup",ve)}window.addEventListener("pointermove",je),window.addEventListener("pointerup",ve)},onKeyDown:W=>{if(f==="readonly")return;const U=c?g:8,O=N[r.id];W.key==="ArrowLeft"&&(Q(r.id,{x:O.x-U,y:O.y}),W.preventDefault()),W.key==="ArrowRight"&&(Q(r.id,{x:O.x+U,y:O.y}),W.preventDefault()),W.key==="ArrowUp"&&(Q(r.id,{x:O.x,y:O.y-U}),W.preventDefault()),W.key==="ArrowDown"&&(Q(r.id,{x:O.x,y:O.y+U}),W.preventDefault())},children:j?j(r,Y):e.jsx(q,{fontWeight:800,children:r.label})},r.id)}),y&&J&&h?e.jsx(p,{sx:{position:"absolute",right:12,top:12,zIndex:20,width:340,maxWidth:"calc(100% - 24px)",maxHeight:"calc(100% - 24px)",overflow:"auto",border:1,borderColor:"divider",borderRadius:1,bgcolor:"background.paper",boxShadow:"0 20px 48px rgba(15,23,42,0.22)"},children:e.jsxs(G,{spacing:1.25,sx:{p:1.5},children:[e.jsxs(G,{direction:"row",spacing:.75,alignItems:"center",children:[e.jsx(q,{variant:"subtitle2",fontWeight:900,sx:{flex:1},children:"Box editor"}),e.jsx(ne,{title:"Add box",children:e.jsx(ce,{size:"small",color:"primary",onClick:se,children:e.jsx(qe,{fontSize:"small"})})}),e.jsx(ne,{title:"Remove box",children:e.jsx("span",{children:e.jsx(ce,{size:"small",color:"error",onClick:he,disabled:!J,children:e.jsx(Ne,{fontSize:"small"})})})}),e.jsx(ne,{title:"Close editor",children:e.jsx(ce,{size:"small",onClick:()=>I(!1),children:e.jsx(Fe,{fontSize:"small"})})})]}),e.jsxs(p,{sx:{display:"grid",gridTemplateColumns:"1fr 96px",gap:1},children:[e.jsx(Z,{size:"small",label:"Label",value:J?.label??"",disabled:!J,onChange:r=>xe({label:r.target.value})}),e.jsx(Z,{size:"small",label:"Color",type:"color",value:J?.color??"#ffffff",disabled:!J,onChange:r=>xe({color:r.target.value})})]}),e.jsxs(p,{sx:{display:"grid",gridTemplateColumns:"1fr",gap:1.25},children:[e.jsxs(G,{spacing:1,children:[e.jsx(q,{variant:"caption",fontWeight:900,color:"text.secondary",children:"Links"}),e.jsxs(p,{sx:{display:"grid",gridTemplateColumns:"1fr 32px",gap:.5,alignItems:"center"},children:[e.jsxs(Z,{select:!0,size:"small",label:"To",value:B,disabled:!J,onChange:r=>i(r.target.value),children:[e.jsx(de,{value:"",children:"Pick target"}),w.filter(r=>r.id!==V).map(r=>e.jsx(de,{value:r.id,children:r.label},r.id))]}),e.jsx(ne,{title:`Add link from ${J?.label??"box"}`,children:e.jsx("span",{children:e.jsx(ce,{size:"small",color:"primary",disabled:!J||!B,onClick:we,sx:{width:32,height:32,border:1,borderColor:"divider",borderRadius:1},children:e.jsx(Ye,{fontSize:"small"})})})})]}),ue.length?ue.map(({connection:r,index:z})=>{const Y=w.find(O=>O.id===r.from),W=w.find(O=>O.id===r.to),U=H===z;return e.jsxs(p,{sx:{width:"100%",display:"grid",gridTemplateColumns:"1fr 32px",gap:.5,alignItems:"center"},children:[e.jsx(p,{component:"button",onClick:()=>ee(z),sx:{px:1,py:.75,minWidth:0,border:1,borderColor:U?"primary.main":"divider",borderRadius:1,bgcolor:U?"primary.main":"background.paper",color:U?"primary.contrastText":"text.primary",cursor:"pointer",font:"inherit",textAlign:"left"},children:(Y?.label??r.from)+" -> "+(W?.label??r.to)}),e.jsx(ne,{title:"Remove link",children:e.jsx(ce,{size:"small",color:"error",onClick:()=>Be(z),sx:{width:32,height:32},children:e.jsx(Oe,{fontSize:"small"})})})]},`${r.from}-${r.to}-${z}`)}):e.jsx(q,{variant:"body2",color:"text.secondary",children:"No linked boxes."})]}),e.jsxs(G,{spacing:1,children:[e.jsx(q,{variant:"caption",fontWeight:900,color:"text.secondary",children:"Link details"}),H!==null&&A[H]?e.jsxs(e.Fragment,{children:[e.jsx(Z,{select:!0,size:"small",label:"From",value:A[H].from,onChange:r=>fe(H,{from:r.target.value}),children:w.filter(r=>r.id!==A[H].to).map(r=>e.jsx(de,{value:r.id,children:r.label},r.id))}),e.jsxs(p,{sx:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:1},children:[e.jsx(Z,{select:!0,size:"small",label:"To",value:A[H].to,onChange:r=>fe(H,{to:r.target.value}),children:w.filter(r=>r.id!==A[H].from).map(r=>e.jsx(de,{value:r.id,children:r.label},r.id))}),e.jsx(Z,{select:!0,size:"small",label:"Shape",value:A[H].type??m,onChange:r=>fe(H,{type:r.target.value}),children:v.map(r=>e.jsx(de,{value:r,children:r},r))})]}),e.jsx(Z,{size:"small",label:"Label",value:A[H].label??"",onChange:r=>fe(H,{label:r.target.value})})]}):e.jsx(q,{variant:"body2",color:"text.secondary",children:"Pick a link."})]})]})]})}):null]})}function kt({before:t,after:n,initialPosition:d=50,sx:l,...f}){const[c,g]=b.useState(d);return e.jsxs(p,{...f,sx:[{position:"relative",overflow:"hidden",minHeight:280},...Array.isArray(l)?l:l?[l]:[]],onPointerMove:x=>{if(x.buttons!==1)return;const a=x.currentTarget.getBoundingClientRect();g((x.clientX-a.left)/a.width*100)},children:[e.jsx(p,{sx:{position:"absolute",inset:0},children:n}),e.jsx(p,{sx:{position:"absolute",inset:0,width:`${c}%`,overflow:"hidden"},children:t}),e.jsx(p,{sx:{position:"absolute",top:0,bottom:0,left:`${c}%`,width:3,bgcolor:"#ffffff",boxShadow:"0 0 0 1px rgba(0,0,0,0.2)",cursor:"ew-resize"}})]})}function $t({initialWidth:t=320,initialHeight:n=220,minWidth:d=160,minHeight:l=120,sx:f,children:c,...g}){const[x,a]=b.useState({width:t,height:n});return e.jsxs(p,{...g,sx:[{position:"relative",width:x.width,height:x.height,overflow:"auto",border:1,borderColor:"divider",borderRadius:1,bgcolor:"background.paper"},...Array.isArray(f)?f:f?[f]:[]],children:[c,e.jsx(p,{sx:{position:"absolute",right:4,bottom:4,width:28,height:28,display:"grid",placeItems:"center",cursor:"nwse-resize",color:"text.secondary",bgcolor:"background.paper",border:1,borderColor:"divider",borderRadius:1,boxShadow:"0 6px 16px rgba(15,23,42,0.14)"},onPointerDown:m=>{const y=m.clientX,v=m.clientY,j=x;function T(o){a({width:Math.max(d,j.width+o.clientX-y),height:Math.max(l,j.height+o.clientY-v)})}function $(){window.removeEventListener("pointermove",T),window.removeEventListener("pointerup",$)}window.addEventListener("pointermove",T),window.addEventListener("pointerup",$)},children:e.jsx(He,{fontSize:"small"})})]})}function Ct(t){return t.type==="boolean"?t.value?"On":"Off":`${t.value}${t.unit?` ${t.unit}`:""}`}function St(t){return t.reduce((n,d)=>{const l=d.group??"Settings";return{...n,[l]:[...n[l]??[],d]}},{})}function It({fields:t,onChange:n,title:d="Inspector",description:l,density:f="comfortable",showValueSummary:c=!0,showReset:g=!0,sx:x}){const a=St(t),m=f==="compact"?1.25:2,y=f==="compact"?"small":"medium";function v(j){j.defaultValue!==void 0&&n?.(j.id,j.defaultValue)}return e.jsx(Pe,{variant:"outlined",sx:[{p:f==="compact"?1.5:2,borderRadius:1},...Array.isArray(x)?x:[x]],children:e.jsxs(G,{spacing:m,children:[e.jsxs(p,{children:[e.jsxs(G,{direction:"row",alignItems:"center",justifyContent:"space-between",spacing:1,children:[e.jsx(q,{variant:"subtitle1",fontWeight:850,children:d}),c?e.jsx(be,{size:"small",label:`${t.length} fields`}):null]}),l?e.jsx(q,{variant:"body2",color:"text.secondary",sx:{mt:.5},children:l}):null]}),Object.entries(a).map(([j,T],$)=>e.jsxs(G,{spacing:m,children:[$>0?e.jsx(Ve,{}):null,e.jsx(q,{variant:"caption",color:"text.secondary",fontWeight:850,sx:{textTransform:"uppercase"},children:j}),T.map(o=>{const M=g&&o.defaultValue!==void 0&&o.defaultValue!==o.value;return o.type==="boolean"?e.jsxs(p,{children:[e.jsxs(G,{direction:"row",alignItems:"center",justifyContent:"space-between",spacing:1,children:[e.jsx(Ue,{control:e.jsx(Ge,{checked:!!o.value,disabled:o.disabled,onChange:u=>n?.(o.id,u.target.checked)}),label:o.label}),M?e.jsx(oe,{size:"small",onClick:()=>v(o),children:"Reset"}):null]}),o.description?e.jsx(q,{variant:"caption",color:"text.secondary",children:o.description}):null]},o.id):o.type==="number"?e.jsxs(G,{spacing:1,children:[e.jsxs(G,{direction:"row",spacing:1,alignItems:"flex-start",children:[e.jsx(Z,{fullWidth:!0,size:y,label:o.label,type:"number",value:o.value,helperText:o.description,disabled:o.disabled,inputProps:{min:o.min,max:o.max,step:o.step},onChange:u=>n?.(o.id,Number(u.target.value))}),o.unit?e.jsx(be,{label:o.unit,size:"small",sx:{mt:1}}):null,M?e.jsx(oe,{size:"small",onClick:()=>v(o),sx:{mt:.5},children:"Reset"}):null]}),o.min!==void 0||o.max!==void 0?e.jsx(Le,{value:Number(o.value),min:o.min??0,max:o.max??100,step:o.step??1,disabled:o.disabled,valueLabelDisplay:"auto",onChange:(u,S)=>n?.(o.id,Array.isArray(S)?S[0]:S)}):null]},o.id):o.type==="select"?e.jsxs(G,{direction:"row",spacing:1,alignItems:"flex-start",children:[e.jsx(Z,{select:!0,fullWidth:!0,size:y,label:o.label,value:o.value,helperText:o.description,disabled:o.disabled,onChange:u=>n?.(o.id,u.target.value),children:(o.options??[]).map(u=>e.jsx(de,{value:u.value,children:u.label},u.value))}),M?e.jsx(oe,{size:"small",onClick:()=>v(o),sx:{mt:.5},children:"Reset"}):null]},o.id):o.type==="color"?e.jsxs(G,{direction:"row",spacing:1,alignItems:"flex-start",children:[e.jsx(Z,{fullWidth:!0,size:y,label:o.label,value:o.value,helperText:o.description,disabled:o.disabled,onChange:u=>n?.(o.id,u.target.value),InputProps:{startAdornment:e.jsx(p,{component:"input",type:"color",value:String(o.value),disabled:o.disabled,onChange:u=>n?.(o.id,u.target.value),sx:{width:28,height:28,p:0,mr:1,border:0,bgcolor:"transparent",cursor:o.disabled?"default":"pointer"}})}}),M?e.jsx(oe,{size:"small",onClick:()=>v(o),sx:{mt:.5},children:"Reset"}):null]},o.id):e.jsxs(G,{direction:"row",spacing:1,alignItems:"flex-start",children:[e.jsx(Z,{fullWidth:!0,size:y,label:o.label,value:o.value,helperText:o.description,disabled:o.disabled,onChange:u=>n?.(o.id,u.target.value)}),M?e.jsx(oe,{size:"small",onClick:()=>v(o),sx:{mt:.5},children:"Reset"}):null]},o.id)})]},j)),c?e.jsxs(p,{sx:{p:1.25,borderRadius:1,bgcolor:"action.hover"},children:[e.jsx(q,{variant:"caption",color:"text.secondary",fontWeight:850,children:"Current values"}),e.jsx(G,{direction:"row",flexWrap:"wrap",gap:.75,sx:{mt:1},children:t.map(j=>e.jsx(be,{size:"small",label:`${j.label}: ${Ct(j)}`},j.id))})]}):null]})})}function Rt({value:t,alpha:n=1,swatches:d=["#2563eb","#7c3aed","#db2777","#dc2626","#f59e0b","#059669"],showValue:l=!0,onChange:f,onAlphaChange:c}){const g=Math.round(n*100),x=`${t}${Math.round(n*255).toString(16).padStart(2,"0")}`;return e.jsx(Pe,{variant:"outlined",sx:{p:2,borderRadius:1},children:e.jsxs(G,{spacing:2,children:[e.jsx(p,{sx:{height:96,borderRadius:1,border:1,borderColor:"divider",backgroundImage:"linear-gradient(45deg, #e5e7eb 25%, transparent 25%), linear-gradient(-45deg, #e5e7eb 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #e5e7eb 75%), linear-gradient(-45deg, transparent 75%, #e5e7eb 75%)",backgroundSize:"18px 18px",backgroundPosition:"0 0, 0 9px, 9px -9px, -9px 0"},children:e.jsx(p,{sx:{height:"100%",borderRadius:1,bgcolor:t,opacity:n}})}),e.jsxs(G,{direction:{xs:"column",sm:"row"},spacing:1.5,children:[e.jsx(Z,{label:"Color",type:"color",value:t,onChange:a=>f?.(a.target.value),sx:{width:{xs:"100%",sm:120}}}),e.jsx(Z,{label:"Hex",value:t,onChange:a=>f?.(a.target.value),fullWidth:!0})]}),e.jsxs(p,{children:[e.jsx(q,{variant:"caption",color:"text.secondary",fontWeight:800,children:"Alpha"}),e.jsx(Le,{min:0,max:1,step:.01,value:n,onChange:(a,m)=>c?.(Array.isArray(m)?m[0]:m),valueLabelDisplay:"auto",valueLabelFormat:a=>`${Math.round(a*100)}%`}),e.jsx(Z,{label:"Alpha",type:"number",value:g,onChange:a=>c?.(Math.min(Math.max(Number(a.target.value),0),100)/100),InputProps:{endAdornment:e.jsx(Ze,{position:"end",children:"%"})},fullWidth:!0})]}),e.jsx(p,{sx:{display:"flex",gap:1,flexWrap:"wrap"},children:d.map(a=>e.jsx(p,{component:"button","aria-label":a,onClick:()=>f?.(a),sx:{width:32,height:32,borderRadius:"50%",border:2,borderColor:a.toLowerCase()===t.toLowerCase()?"text.primary":"divider",bgcolor:a,cursor:"pointer"}},a))}),l?e.jsxs(p,{sx:{p:1.5,borderRadius:1,bgcolor:"#0f172a",color:"#e5e7eb"},children:[e.jsx(q,{variant:"caption",color:"#94a3b8",children:"selected color"}),e.jsx(q,{fontFamily:"monospace",children:x})]}):null]})})}function zt({onFiles:t,sx:n,...d}){const[l,f]=b.useState(!1);function c(g){g&&t?.(Array.from(g))}return e.jsxs(p,{...d,onDragOver:g=>{g.preventDefault(),f(!0)},onDragLeave:()=>f(!1),onDrop:g=>{g.preventDefault(),f(!1),c(g.dataTransfer.files)},sx:[{p:4,border:2,borderStyle:"dashed",borderColor:l?"primary.main":"divider",borderRadius:1,textAlign:"center",bgcolor:l?"primary.50":"background.paper"},...Array.isArray(n)?n:n?[n]:[]],children:[e.jsx(q,{fontWeight:800,children:"Drop files here"}),e.jsx(q,{variant:"body2",color:"text.secondary",children:"Drag files into this zone"})]})}function ge(t,n,d){return Math.min(Math.max(t,n),d)}function Mt(t){const n=Math.floor(t/60),d=Math.floor(t%60);return`${n}:${String(d).padStart(2,"0")}`}function ye(t,n){return n>0?ge(t/n*100,0,100):0}function At(t,n){return n.reduce((d,l)=>d?Math.abs(l.time-t)<Math.abs(d.time-t)?l:d:l,null)}function Pt({duration:t,value:n,defaultValue:d=0,markers:l=[],thumbnails:f=[],disabled:c=!1,showTime:g=!0,preview:x=!0,step:a=1,formatTime:m=Mt,onChange:y,sx:v,...j}){const T=b.useRef(null),[$,o]=b.useState(d),[M,u]=b.useState(!1),[S,E]=b.useState(null),D=ge(n??$,0,t),k=S===null?D:S,L=ye(D,t),w=ye(k,t),A=b.useMemo(()=>[...l].sort((h,I)=>h.time-I.time),[l]),N=At(k,f);function X(h,I){const B=a>0?Math.round(h/a)*a:h,i=ge(B,0,t);n===void 0&&o(i),y?.(i,I)}function s(h){const I=T.current;if(!I)return D;const B=I.getBoundingClientRect();return ge((h-B.left)/B.width,0,1)*t}function R(h){E(s(h))}return e.jsxs(p,{...j,sx:[{width:"100%",color:c?"text.disabled":"text.primary",userSelect:"none"},...Array.isArray(v)?v:v?[v]:[]],children:[g?e.jsxs(p,{sx:{display:"flex",justifyContent:"space-between",mb:1},children:[e.jsx(q,{variant:"caption",fontWeight:800,children:m(D)}),e.jsx(q,{variant:"caption",color:"text.secondary",children:m(t)})]}):null,e.jsxs(p,{ref:T,role:"slider",tabIndex:c?-1:0,"aria-valuemin":0,"aria-valuemax":t,"aria-valuenow":Math.round(D),onPointerMove:h=>{c||(R(h.clientX),M&&X(s(h.clientX),"drag"))},onPointerLeave:()=>{M||E(null)},onPointerDown:h=>{c||(u(!0),h.currentTarget.setPointerCapture(h.pointerId),X(s(h.clientX),"click"))},onPointerUp:h=>{u(!1),h.currentTarget.releasePointerCapture(h.pointerId)},onPointerCancel:()=>u(!1),onKeyDown:h=>{c||(h.key==="ArrowLeft"&&(X(D-a,"keyboard"),h.preventDefault()),h.key==="ArrowRight"&&(X(D+a,"keyboard"),h.preventDefault()),h.key==="Home"&&(X(0,"keyboard"),h.preventDefault()),h.key==="End"&&(X(t,"keyboard"),h.preventDefault()))},sx:{position:"relative",height:86,cursor:c?"default":"pointer",outline:"none","&:focus-visible .TimelineScrubber-track":{boxShadow:"0 0 0 3px rgba(37,99,235,0.28)"}},children:[x&&S!==null?e.jsxs(p,{sx:{position:"absolute",left:`${w}%`,top:0,transform:"translateX(-50%)",width:116,p:.75,border:1,borderColor:"divider",borderRadius:1,bgcolor:"background.paper",boxShadow:"0 14px 34px rgba(15,23,42,0.18)",pointerEvents:"none",zIndex:2},children:[e.jsx(p,{sx:{height:56,borderRadius:.75,overflow:"hidden",bgcolor:"#e5e7eb"},children:N?.thumbnail??e.jsx(p,{sx:{height:"100%",display:"grid",placeItems:"center",bgcolor:"#0f172a",color:"#fff"},children:e.jsx(q,{variant:"caption",fontWeight:900,children:m(k)})})}),e.jsx(q,{variant:"caption",fontWeight:800,sx:{display:"block",mt:.5,textAlign:"center"},children:m(k)})]}):null,e.jsx(p,{className:"TimelineScrubber-track",sx:{position:"absolute",left:0,right:0,bottom:18,height:12,borderRadius:999,bgcolor:"#e5e7eb",overflow:"hidden",transition:"box-shadow 120ms ease"},children:e.jsx(p,{sx:{width:`${L}%`,height:"100%",borderRadius:999,background:"linear-gradient(90deg, #2563eb, #06b6d4)"}})}),A.map(h=>{const I=ye(h.time,t);return e.jsx(ne,{title:h.label??m(h.time),arrow:!0,children:e.jsx(p,{onPointerDown:B=>{B.stopPropagation(),X(h.time,"marker")},sx:{position:"absolute",left:`${I}%`,bottom:11,width:12,height:26,borderRadius:999,transform:"translateX(-50%)",bgcolor:h.color??"#f59e0b",border:"2px solid",borderColor:"background.paper",boxShadow:"0 8px 18px rgba(15,23,42,0.2)",zIndex:1}})},h.id)}),e.jsx(p,{sx:{position:"absolute",left:`${L}%`,bottom:5,width:28,height:28,borderRadius:"50%",transform:"translateX(-50%)",bgcolor:"background.paper",border:3,borderColor:"#2563eb",boxShadow:M?"0 12px 30px rgba(37,99,235,0.36)":"0 8px 20px rgba(15,23,42,0.2)"}})]})]})}function Ae(t,n,d){return Math.min(Math.max(t,n),d)}function Lt({items:t=[],defaultViewport:n={x:0,y:0,zoom:1},viewport:d,minZoom:l=.3,maxZoom:f=2.5,showGrid:c=!0,showMinimap:g=!0,selectedItemId:x,renderItem:a,onViewportChange:m,onItemMove:y,onItemSelect:v,sx:j,...T}){const $=b.useRef(null),[o,M]=b.useState(n),[u,S]=b.useState(Object.fromEntries(t.map(s=>[s.id,{x:s.x,y:s.y}]))),[E,D]=b.useState(x??null),k=d??o,L=x??E,w=b.useMemo(()=>{const s=t.map(i=>({x:u[i.id]?.x??i.x,y:u[i.id]?.y??i.y,width:i.width??140,height:i.height??80}));if(!s.length)return{minX:-200,minY:-120,width:400,height:240};const R=Math.min(...s.map(i=>i.x))-80,h=Math.min(...s.map(i=>i.y))-80,I=Math.max(...s.map(i=>i.x+i.width))+80,B=Math.max(...s.map(i=>i.y+i.height))+80;return{minX:R,minY:h,width:I-R,height:B-h}},[u,t]);function A(s){const R={...s,zoom:Ae(s.zoom,l,f)};d===void 0&&M(R),m?.(R)}function N(s,R){const h=$.current?.getBoundingClientRect();return{x:(s-(h?.left??0)-k.x)/k.zoom,y:(R-(h?.top??0)-k.y)/k.zoom}}function X(s){D(s?.id??null),v?.(s)}return e.jsxs(p,{...T,ref:$,onWheel:s=>{s.preventDefault();const R=Ae(k.zoom*(s.deltaY>0?.92:1.08),l,f),h=N(s.clientX,s.clientY),I=$.current?.getBoundingClientRect(),B=s.clientX-(I?.left??0)-h.x*R,i=s.clientY-(I?.top??0)-h.y*R;A({x:B,y:i,zoom:R})},onPointerDown:s=>{if(s.target!==s.currentTarget)return;X(null);const R=s.clientX,h=s.clientY,I=k;s.currentTarget.setPointerCapture(s.pointerId);function B(P){A({...I,x:I.x+P.clientX-R,y:I.y+P.clientY-h})}function i(){window.removeEventListener("pointermove",B),window.removeEventListener("pointerup",i)}window.addEventListener("pointermove",B),window.addEventListener("pointerup",i)},sx:[{position:"relative",minHeight:420,overflow:"hidden",bgcolor:"#f8fafc",cursor:"grab",touchAction:"none"},...Array.isArray(j)?j:j?[j]:[]],children:[e.jsx(p,{sx:{position:"absolute",inset:0,pointerEvents:"none",backgroundImage:c?"linear-gradient(rgba(148,163,184,0.25) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,0.25) 1px, transparent 1px)":void 0,backgroundSize:`${32*k.zoom}px ${32*k.zoom}px`,backgroundPosition:`${k.x}px ${k.y}px`}}),e.jsx(p,{sx:{position:"absolute",left:k.x,top:k.y,transform:`scale(${k.zoom})`,transformOrigin:"0 0"},children:t.map(s=>{const R=u[s.id]??{x:s.x,y:s.y},h=s.id===L;return e.jsx(p,{onPointerDown:I=>{I.stopPropagation(),X(s);const B=u[s.id]??{x:s.x,y:s.y},i=N(I.clientX,I.clientY);I.currentTarget.setPointerCapture(I.pointerId);function P(ie){const ae=N(ie.clientX,ie.clientY),H={x:B.x+ae.x-i.x,y:B.y+ae.y-i.y};S(ee=>({...ee,[s.id]:H})),y?.(s.id,H)}function _(){window.removeEventListener("pointermove",P),window.removeEventListener("pointerup",_)}window.addEventListener("pointermove",P),window.addEventListener("pointerup",_)},sx:{position:"absolute",left:R.x,top:R.y,width:s.width??140,height:s.height??80,display:"grid",placeItems:"center",border:h?2:1,borderColor:h?"primary.main":"divider",borderRadius:1,bgcolor:s.color??"background.paper",boxShadow:h?"0 18px 40px rgba(37,99,235,0.24)":"0 12px 28px rgba(15,23,42,0.13)",cursor:"grab",userSelect:"none"},children:a?a(s,h):e.jsx(q,{fontWeight:900,children:s.label??s.id})},s.id)})}),e.jsxs(p,{sx:{position:"absolute",left:12,bottom:12,display:"flex",gap:.75,alignItems:"center",px:1,py:.5,borderRadius:1,bgcolor:"rgba(255,255,255,0.92)",border:1,borderColor:"divider",fontSize:12,fontWeight:800},children:[Math.round(k.zoom*100),"%"]}),g?e.jsx(p,{sx:{position:"absolute",right:12,bottom:12,width:160,height:100,border:1,borderColor:"divider",borderRadius:1,bgcolor:"rgba(255,255,255,0.9)",overflow:"hidden"},children:t.map(s=>{const R=u[s.id]??{x:s.x,y:s.y},h=(R.x-w.minX)/w.width*100,I=(R.y-w.minY)/w.height*100,B=(s.width??140)/w.width*100,i=(s.height??80)/w.height*100;return e.jsx(p,{sx:{position:"absolute",left:`${h}%`,top:`${I}%`,width:`${B}%`,height:`${i}%`,minWidth:6,minHeight:4,borderRadius:.5,bgcolor:s.id===L?"primary.main":s.color??"#94a3b8"}},s.id)})}):null]})}function Tt({children:t,title:n,content:d,media:l,actions:f=[],copyText:c,placement:g="top",pinMode:x=!0,defaultPinned:a=!1,openDelay:m=120,sx:y,...v}){const j=b.useRef(null),T=b.useRef(null),$=b.useRef(null),[o,M]=b.useState(a),[u,S]=b.useState(a),[E,D]=b.useState(!1);function k(){$.current&&window.clearTimeout($.current),T.current&&window.clearTimeout(T.current)}function L(){k(),!o&&($.current=window.setTimeout(()=>M(!0),m))}function w(){k(),M(!0)}function A(){k(),u||(T.current=window.setTimeout(()=>M(!1),100))}function N(){const s=!u;S(s),M(s||o)}async function X(){c&&(await navigator.clipboard?.writeText(c),D(!0),window.setTimeout(()=>D(!1),1100))}return e.jsxs(e.Fragment,{children:[e.jsx(p,{component:"span",ref:j,onMouseEnter:L,onMouseLeave:A,onFocus:L,onBlur:A,onClick:()=>{x&&(M(!0),S(!0))},sx:{display:"inline-flex"},children:t}),e.jsx(et,{open:o,anchorEl:j.current,placement:g,modifiers:[{name:"offset",options:{offset:[0,10]}},{name:"preventOverflow",options:{padding:12}}],sx:{zIndex:1500},children:e.jsx(Ke,{onClickAway:()=>{u&&(M(!1),S(!1))},children:e.jsx(p,{onMouseEnter:w,onMouseLeave:A,sx:{width:320,maxWidth:"calc(100vw - 24px)",borderRadius:1,overflow:"hidden",boxShadow:"0 24px 64px rgba(15,23,42,0.28)",bgcolor:"background.paper"},children:e.jsx(p,{...v,sx:[{p:1.25},...Array.isArray(y)?y:y?[y]:[]],children:e.jsxs(G,{spacing:1.25,children:[l?e.jsx(p,{sx:{borderRadius:1,overflow:"hidden",bgcolor:"#e5e7eb"},children:l}):null,e.jsxs(G,{direction:"row",spacing:1,alignItems:"flex-start",children:[e.jsxs(p,{sx:{minWidth:0,flex:1},children:[n?e.jsx(q,{fontWeight:900,children:n}):null,d?e.jsx(q,{variant:"body2",color:"text.secondary",sx:{mt:n?.25:0},children:d}):null]}),x?e.jsx(ne,{title:u?"Unpin":"Pin",children:e.jsx(ce,{size:"small",onClick:N,children:u?e.jsx(Qe,{fontSize:"small"}):e.jsx(Je,{fontSize:"small"})})}):null]}),c||f.length?e.jsxs(G,{direction:"row",spacing:1,flexWrap:"wrap",children:[c?e.jsx(oe,{size:"small",variant:"outlined",startIcon:e.jsx(_e,{}),onClick:X,children:E?"Copied":"Copy"}):null,f.map(s=>e.jsx(oe,{size:"small",variant:"contained",startIcon:s.icon,onClick:s.onClick,children:s.label},s.id))]}):null]})})})})})]})}exports.BeforeAfterSlider=kt;exports.CodeViewer=lt;exports.ColorPicker=Rt;exports.CommandPalette=xt;exports.ComponentExample=tt;exports.DockBar=pt;exports.DraggableBox=ct;exports.FileDropZone=zt;exports.FloatingToolbar=mt;exports.GlassBox=dt;exports.InfiniteCanvas=Lt;exports.InspectorPanel=It;exports.MagneticCard=yt;exports.NodeCanvas=vt;exports.ResizableFrame=$t;exports.SmartTooltip=Tt;exports.SplitPane=gt;exports.SpotlightPanel=wt;exports.TimelineScrubber=Pt;