@graphty/compact-mantine 0.4.0 → 0.5.0

package/README.md

@@ -1 +1,198 @@
+# @graphty/compact-mantine
 
+[![npm version](https://img.shields.io/npm/v/@graphty/compact-mantine.svg)](https://www.npmjs.com/package/@graphty/compact-mantine)
+[![Storybook](https://img.shields.io/badge/storybook-examples-ff4785)](https://graphty.app/storybook/compact-mantine/)
+
+A Mantine theme and component library optimized for dense, compact UIs. All components default to compact sizing automatically using Mantine's `defaultProps` system.
+
+## Features
+
+- **Compact by Default**: All components render at compact size without explicit props
+- **Mantine-Idiomatic**: Uses `defaultProps` with `size="sm"` as default
+- **Global Token Overrides**: Smaller font sizes, tighter spacing, compact radii
+- **Visual Styling**: Borderless inputs, semantic color backgrounds
+- **Fully Customizable**: Spread the theme to add your own customizations
+
+## Installation
+
+```bash
+npm install @graphty/compact-mantine @mantine/core @mantine/hooks
+```
+
+## Quick Start
+
+```tsx
+import { MantineProvider, TextInput, Button } from '@mantine/core';
+import { compactTheme } from '@graphty/compact-mantine';
+
+function App() {
+    return (
+        <MantineProvider theme={compactTheme}>
+            {/* Components use compact sizing automatically */}
+            <TextInput label="Name" />
+            <Button>Submit</Button>
+        </MantineProvider>
+    );
+}
+```
+
+## Usage
+
+### Default Compact Sizing
+
+No size prop needed - components render compact by default:
+
+```tsx
+// All of these use compact sizing automatically
+<TextInput label="Name" />
+<NumberInput label="Amount" />
+<Select label="Country" data={countries} />
+<Button>Submit</Button>
+<Checkbox label="I agree" />
+<Switch label="Enable notifications" />
+```
+
+### Override to Larger Sizes
+
+When you need larger components, use the standard Mantine size prop:
+
+```tsx
+// Override to larger sizes when needed
+<TextInput size="md" label="Medium Input" />
+<TextInput size="lg" label="Large Input" />
+<Button size="lg">Large Button</Button>
+```
+
+### Theme Customization
+
+Spread the compact theme to add your own customizations:
+
+```tsx
+import { MantineProvider } from '@mantine/core';
+import { compactTheme } from '@graphty/compact-mantine';
+
+const customTheme = {
+    ...compactTheme,
+    primaryColor: 'teal',
+    other: {
+        myCustomProperty: true,
+    },
+};
+
+function App() {
+    return (
+        <MantineProvider theme={customTheme}>
+            {/* Still compact by default with your customizations */}
+            <Button>Teal Button</Button>
+        </MantineProvider>
+    );
+}
+```
+
+### Compact Region in Larger UI
+
+Use nested `MantineProvider` to create compact regions within a regular-sized UI:
+
+```tsx
+import { MantineProvider, TextInput, Button } from '@mantine/core';
+import { compactTheme } from '@graphty/compact-mantine';
+
+function App() {
+    return (
+        <MantineProvider>
+            {/* Regular Mantine UI */}
+            <TextInput label="Regular Size" />
+
+            {/* Compact region */}
+            <MantineProvider theme={compactTheme}>
+                <div className="settings-panel">
+                    <TextInput label="Compact Input" />
+                    <Button>Compact Button</Button>
+                </div>
+            </MantineProvider>
+        </MantineProvider>
+    );
+}
+```
+
+## Global Token Overrides
+
+The compact theme overrides Mantine's global tokens:
+
+| Token | Values |
+|-------|--------|
+| **fontSizes** | xs=10px, sm=11px, md=13px, lg=14px, xl=16px |
+| **spacing** | xs=4px, sm=6px, md=8px, lg=12px, xl=16px |
+| **radius** | xs=2px, sm=4px, md=6px, lg=8px, xl=12px |
+
+## Exports
+
+### Theme
+
+```tsx
+import { compactTheme, compactColors, compactDarkColors } from '@graphty/compact-mantine';
+```
+
+- `compactTheme` - Complete Mantine theme with compact defaults
+- `compactColors` - Color palette including dark colors
+- `compactDarkColors` - Dark color palette array
+
+### Components
+
+```tsx
+import {
+    CompactColorInput,
+    ControlGroup,
+    ControlSection,
+    ControlSubGroup,
+    EffectToggle,
+    GradientEditor,
+    Popout,
+    PopoutManager,
+    StatRow,
+    StyleNumberInput,
+    StyleSelect,
+} from '@graphty/compact-mantine';
+```
+
+### Hooks
+
+```tsx
+import { useActualColorScheme } from '@graphty/compact-mantine';
+```
+
+## Affected Components (43 total)
+
+### Input Components (14)
+TextInput, NumberInput, Select, Textarea, PasswordInput, Autocomplete, MultiSelect, TagsInput, PillsInput, FileInput, JsonInput, ColorInput, NativeSelect, InputWrapper
+
+### Button Components (3)
+Button, ActionIcon, CloseButton
+
+### Control Components (6)
+Switch, Checkbox, Radio, Slider, RangeSlider, SegmentedControl
+
+### Display Components (7)
+Badge, Text, Avatar, ThemeIcon, Indicator, Kbd, Pill
+
+### Navigation Components (6)
+Tabs, NavLink, Pagination, Stepper, Anchor, Burger
+
+### Feedback Components (3)
+Loader, Progress, RingProgress
+
+### Overlay Components (4)
+Menu, Tooltip, Popover, HoverCard
+
+## Migration from size="compact"
+
+If you're migrating from the previous `size="compact"` pattern:
+
+1. Remove all `size="compact"` props - components are now compact by default
+2. Add `size="md"` or `size="lg"` where you previously relied on Mantine's default sizing
+
+See the [Migration Guide](./stories/docs/Migration.mdx) for detailed instructions.
+
+## License
+
+MIT

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@mantine/core"),r=require("react/jsx-runtime"),G=require("@mantine/hooks"),R=require("lucide-react"),i=require("react"),ye=require("react-dom"),ue=["#d5d7da","#a3a8b1","#7a828e","#5f6873","#48525c","#374047","#2a3035","#1f2428","#161b22","#0d1117"],pe={dark:ue},_e={Button:o.Button.extend({vars:(t,e)=>e.size==="compact"?{root:{"--button-height":"24px","--button-fz":"11px","--button-padding-x":"8px"}}:{root:{}}}),ActionIcon:o.ActionIcon.extend({vars:(t,e)=>e.size==="compact"?{root:{"--ai-size":"24px"}}:{root:{}}}),CloseButton:o.CloseButton.extend({defaultProps:{size:"compact"},vars:(t,e)=>e.size==="compact"?{root:{"--cb-size":"16px","--cb-icon-size":"12px"}}:{root:{}}})},je={SegmentedControl:o.SegmentedControl.extend({vars:(t,e)=>e.size==="compact"?{root:{"--sc-font-size":"10px","--sc-padding":"4px 8px"}}:{root:{}}}),Checkbox:o.Checkbox.extend({vars:(t,e)=>e.size==="compact"?{root:{"--checkbox-size":"16px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{label:{fontSize:11}}:{}}),Switch:o.Switch.extend({vars:(t,e)=>e.size==="compact"?{root:{"--switch-height":"16px","--switch-width":"28px","--switch-thumb-size":"12px","--switch-track-label-padding":"2px","--switch-label-font-size":"5px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{label:{fontSize:11}}:{}}),Slider:o.Slider.extend({vars:(t,e)=>e.size==="compact"?{root:{"--slider-size":"4px","--slider-thumb-size":"12px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{markLabel:{fontSize:10,marginTop:2}}:{}}),Radio:o.Radio.extend({vars:(t,e)=>e.size==="compact"?{root:{"--radio-size":"16px","--radio-icon-size":"6px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{label:{fontSize:11}}:{}}),RangeSlider:o.RangeSlider.extend({vars:(t,e)=>e.size==="compact"?{root:{"--slider-size":"4px","--slider-thumb-size":"12px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{markLabel:{fontSize:10,marginTop:2}}:{}})},Ie={Text:o.Text.extend({vars:(t,e)=>e.size==="compact"?{root:{"--text-fz":"11px","--text-lh":"1.2"}}:{root:{}}}),Badge:o.Badge.extend({vars:(t,e)=>e.size==="compact"?{root:{"--badge-height":"14px","--badge-fz":"9px","--badge-padding-x":"4px"}}:{root:{}}}),Pill:o.Pill.extend({vars:(t,e)=>e.size==="compact"?{root:{"--pill-height":"16px","--pill-fz":"10px"}}:{root:{}}}),Avatar:o.Avatar.extend({vars:(t,e)=>e.size==="compact"?{root:{"--avatar-size":"24px"}}:{root:{}}}),ThemeIcon:o.ThemeIcon.extend({vars:(t,e)=>e.size==="compact"?{root:{"--ti-size":"24px"}}:{root:{}}}),Indicator:o.Indicator.extend({vars:(t,e)=>e.size==="compact"?{root:{"--indicator-size":"8px"}}:{root:{}}}),Kbd:o.Kbd.extend({vars:(t,e)=>e.size==="compact"?{root:{"--kbd-fz":"10px","--kbd-padding":"2px 4px"}}:{root:{}}})},ke={Loader:o.Loader.extend({vars:(t,e)=>e.size==="compact"?{root:{"--loader-size":"18px"}}:{root:{}}}),Progress:o.Progress.extend({vars:(t,e)=>e.size==="compact"?{root:{"--progress-size":"4px"}}:{root:{}},styles:(t,e)=>e.size==="compact"?{label:{fontSize:9}}:{}}),RingProgress:o.RingProgress.extend({vars:()=>({root:{}})})},K=1e3,L=1100,de=8,Be=4,X={root:{},wrapper:{"--input-size":"24px","--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}},k={label:{fontSize:11,color:"var(--mantine-color-dimmed)",marginBottom:1,lineHeight:1.2},input:{paddingLeft:8,paddingRight:8,border:"none"}},W={dropdown:{padding:4,border:"none",boxShadow:"var(--mantine-shadow-md)"},option:{fontSize:11,padding:"4px 8px",borderRadius:4},options:{},groupLabel:{fontSize:10,padding:"4px 8px"},empty:{fontSize:11,padding:"8px"}},Ae={TextInput:o.TextInput.extend({vars:(t,e)=>e.size==="compact"?X:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?k:{}}),NumberInput:o.NumberInput.extend({vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-size":"24px","--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none","--input-right-section-width":"24px"},controls:{"--ni-chevron-size":"10px"}}:{root:{},wrapper:{},controls:{}},styles:(t,e)=>e.size==="compact"?{...k,control:{borderColor:"transparent"}}:{}}),Select:o.Select.extend({defaultProps:{comboboxProps:{zIndex:L}},vars:(t,e)=>e.size==="compact"?X:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,...W}:{}}),Textarea:o.Textarea.extend({vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}}:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?k:{}}),PasswordInput:o.PasswordInput.extend({vars:(t,e)=>e.size==="compact"?X:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,innerInput:{paddingLeft:8,paddingRight:8}}:{}}),Autocomplete:o.Autocomplete.extend({defaultProps:{comboboxProps:{zIndex:L}},vars:(t,e)=>e.size==="compact"?X:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,...W}:{}}),ColorInput:o.ColorInput.extend({defaultProps:{popoverProps:{zIndex:L}},styles:(t,e)=>e.size==="compact"?{...k,wrapper:{"--input-size":"24px","--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}}:{}}),MultiSelect:o.MultiSelect.extend({defaultProps:{comboboxProps:{zIndex:L}},vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none","--input-size":"24px","--combobox-chevron-size":"12px"}}:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,...W,input:{...k.input,minHeight:24,height:"auto",display:"flex",alignItems:"center",paddingTop:4,paddingBottom:4},inputField:{minWidth:60,flexBasis:60},pillsList:{columnGap:4,rowGap:2},pill:{margin:0,paddingTop:2,paddingBottom:2}}:{}}),TagsInput:o.TagsInput.extend({defaultProps:{comboboxProps:{zIndex:L}},vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}}:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,...W,input:{...k.input,minHeight:24,height:"auto",display:"flex",alignItems:"center",paddingTop:4,paddingBottom:4},inputField:{minWidth:30,flexBasis:30},pillsList:{columnGap:4,rowGap:2},pill:{margin:0,paddingTop:2,paddingBottom:2}}:{}}),PillsInput:o.PillsInput.extend({vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}}:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?{...k,input:{...k.input,minHeight:24,height:"auto",display:"flex",alignItems:"center",paddingTop:4,paddingBottom:4},inputField:{minWidth:30,flexBasis:30},pillsList:{columnGap:4,rowGap:2},pill:{margin:0,paddingTop:2,paddingBottom:2}}:{}}),FileInput:o.FileInput.extend({vars:(t,e)=>e.size==="compact"?X:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?k:{}}),JsonInput:o.JsonInput.extend({vars:(t,e)=>e.size==="compact"?{root:{},wrapper:{"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"}}:{root:{},wrapper:{}},styles:(t,e)=>e.size==="compact"?k:{}}),InputClearButton:o.InputClearButton.extend({defaultProps:{size:"compact"},vars:(t,e)=>e.size==="compact"?{root:{"--cb-size":"16px","--cb-icon-size":"12px"}}:{root:{}}})},Ee={Anchor:o.Anchor.extend({styles:(t,e)=>e.size==="compact"?{root:{fontSize:11}}:{}}),Burger:o.Burger.extend({vars:(t,e)=>e.size==="compact"?{root:{"--burger-size":"18px","--burger-line-size":"2px"}}:{root:{}}}),NavLink:o.NavLink.extend({styles:(t,e)=>e.variant==="compact"?{root:{fontSize:11,minHeight:28},label:{fontSize:11}}:{}}),Pagination:o.Pagination.extend({vars:(t,e)=>e.size==="compact"?{root:{"--pagination-control-size":"24px","--pagination-control-fz":"11px"}}:{root:{}}}),Stepper:o.Stepper.extend({vars:(t,e)=>e.size==="compact"?{root:{"--stepper-icon-size":"24px","--stepper-fz":"11px","--stepper-spacing":"8px"}}:{root:{}}}),Tabs:o.Tabs.extend({styles:(t,e)=>e.variant==="compact"?{tab:{fontSize:11,padding:"6px 10px"}}:{}})},Re={Menu:o.Menu.extend({defaultProps:{zIndex:L}}),Tooltip:o.Tooltip.extend({defaultProps:{zIndex:L}}),Popover:o.Popover.extend({defaultProps:{zIndex:L}}),HoverCard:o.HoverCard.extend({defaultProps:{zIndex:L}})},Oe=o.createTheme({colors:pe,components:{...Ae,..._e,...je,...Ie,...ke,...Ee,...Re}}),De=["#5B8FF9","#FF6B6B","#61D095","#F7B731","#9B59B6"],fe=["#5B8FF9FF","#FF6B6BFF","#61D095FF","#F7B731FF","#9B59B6FF","#5B8FF980","#FF6B6B80","#61D09580","#F7B73180","#9B59B680"],xe="#888888",J=255,Q=100;function ee(t){return Math.round(parseInt(t,16)/J*Q)}function te(t){return Math.round(t/Q*J).toString(16).padStart(2,"0")}function Fe(t){let e=t.replace("#","");e.length===3?e=`${e.split("").map(n=>n+n).join("")}ff`:e.length===4?e=e.split("").map(n=>n+n).join(""):e.length===6&&(e=`${e}ff`);const s=`#${e.slice(0,6)}`,a=e.slice(6,8),c=ee(a);return{hex:s,opacity:c}}function Le(t,e){const s=t.replace("#",""),a=te(e);return`#${s}${a}`}function Ge(t){return/^#?([A-Fa-f0-9]{3}|[A-Fa-f0-9]{4}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(t)}function He({color:t,defaultColor:e,opacity:s,defaultOpacity:a=100,onColorChange:c,onOpacityChange:n,label:l,showOpacity:p=!0}){const[g,z]=G.useUncontrolled({value:t,defaultValue:void 0,finalValue:void 0,onChange:c}),[C,b]=G.useUncontrolled({value:s,defaultValue:void 0,finalValue:void 0,onChange:n}),d=g===void 0,m=C===void 0,B=d&&(!p||m),u=g??e,v=C??a,[S,_]=i.useState(!1),[E,j]=i.useState(u.replace("#","").toUpperCase()),[O,H]=i.useState(v);i.useEffect(()=>{j(u.replace("#","").toUpperCase())},[u]),i.useEffect(()=>{H(v)},[v]);const $=x=>{if(x.length===9){const A=x.slice(0,7).toUpperCase(),I=x.slice(7,9),w=ee(I);z(A),p&&b(w)}else z(x.toUpperCase())},f=()=>{const x=te(v);return`${u}${x}`.toUpperCase()},h=x=>{j(x.currentTarget.value.toUpperCase())},P=()=>{let x=E.toUpperCase();x&&!x.startsWith("#")&&(x=`#${x}`),/^#[0-9A-F]{6}$/i.test(x)&&x!==u?z(x):j(u.replace("#","").toUpperCase())},T=x=>{H(x)},D=()=>{const x=typeof O=="string"?parseFloat(O):O;if(isNaN(x))H(v);else{const A=Math.min(100,Math.max(0,x));A!==v&&b(A)}},M=()=>{z(void 0),p&&b(void 0)},F=r.jsxs(o.Group,{gap:4,wrap:"nowrap",children:[r.jsxs(o.Group,{gap:0,children:[r.jsxs(o.Popover,{opened:S,onChange:_,position:"bottom-start",shadow:"md",children:[r.jsx(o.Popover.Target,{children:r.jsx(o.ActionIcon,{variant:"filled",size:24,radius:0,style:{backgroundColor:"var(--mantine-color-default)",borderRadius:"4px 0 0 4px"},onClick:()=>{_(x=>!x)},"aria-label":"Color swatch",children:r.jsx(o.ColorSwatch,{color:u,size:14,radius:2,style:{border:"1px solid var(--mantine-color-default-border)"}})})}),r.jsx(o.Popover.Dropdown,{p:"xs",children:r.jsx(o.ColorPicker,{format:"hexa",value:f(),onChange:$,swatches:[...fe]})})]}),r.jsx(o.TextInput,{size:"compact",value:E,onChange:h,onBlur:P,"aria-label":"Color hex value","data-is-default":d?"true":"false",w:72,styles:{input:{borderRadius:p?0:"0 4px 4px 0",fontFamily:"monospace",textTransform:"uppercase",...d?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:{}}}}),p&&r.jsxs(r.Fragment,{children:[r.jsx(o.Box,{style:{width:1,height:24,backgroundColor:"var(--mantine-color-default-border)"}}),r.jsx(o.NumberInput,{size:"compact",value:O,onChange:T,onBlur:D,min:0,max:100,hideControls:!0,suffix:"%","aria-label":"Opacity","data-is-default":m?"true":"false",w:54,styles:{input:{borderRadius:"0 4px 4px 0",textAlign:"right",...m?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:{}}}})]})]}),!B&&r.jsx(o.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${l??"color"} to default`,onClick:M,children:r.jsx(R.X,{size:12})})]});return l?r.jsxs(o.Stack,{gap:0,children:[r.jsx(o.Text,{size:"xs",c:"dimmed",mb:1,lh:1.2,children:l}),F]}):F}function Ne({label:t,actions:e,children:s}){return r.jsxs(o.Box,{children:[r.jsx(o.Divider,{color:"gray.7",mt:8,mb:0}),r.jsxs(o.Group,{justify:"space-between",py:8,children:[r.jsx(o.Text,{size:"xs",fw:500,lh:1.2,children:t}),e&&r.jsx(o.Group,{gap:4,children:e})]}),r.jsx(o.Stack,{gap:0,children:s})]})}function Me({label:t,defaultOpen:e=!0,children:s,hasConfiguredValues:a=!1}){const[c,{toggle:n}]=G.useDisclosure(e);return r.jsxs(o.Box,{children:[r.jsx(o.Divider,{color:"gray.7",mt:8,mb:0}),r.jsx(o.Group,{justify:"space-between",py:8,style:{cursor:"pointer"},onClick:n,children:r.jsxs(o.Group,{gap:4,children:[r.jsx(o.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":c?`Collapse ${t}`:`Expand ${t}`,children:c?r.jsx(R.ChevronDown,{size:12}):r.jsx(R.ChevronRight,{size:12})}),r.jsx(o.Text,{size:"xs",fw:500,lh:1.2,children:t}),a&&r.jsx(o.Box,{"aria-label":`${t} has configured values`,style:{width:6,height:6,borderRadius:"50%",backgroundColor:"var(--mantine-color-blue-5)",marginLeft:4}})]})}),r.jsx(o.Collapse,{in:c,children:r.jsx(o.Stack,{gap:0,children:s})})]})}function Ue({label:t,defaultOpen:e=!1,children:s}){const[a,{toggle:c}]=G.useDisclosure(e);return r.jsxs(o.Box,{children:[r.jsxs(o.Group,{gap:4,py:4,style:{cursor:"pointer"},onClick:c,children:[r.jsx(o.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":a?`Collapse ${t}`:`Expand ${t}`,children:a?r.jsx(R.ChevronDown,{size:10}):r.jsx(R.ChevronRight,{size:10})}),r.jsx(o.Text,{size:"xs",c:"dimmed",lh:1.2,children:t})]}),a&&r.jsx(o.Box,{pl:"md",children:r.jsx(o.Stack,{gap:4,children:s})})]})}function $e({label:t,checked:e,defaultChecked:s,onChange:a,children:c}){const[n,l]=G.useUncontrolled({value:e,defaultValue:s,finalValue:!1,onChange:a});return r.jsxs(o.Stack,{gap:4,children:[r.jsx(o.Checkbox,{size:"compact",label:t,checked:n,onChange:p=>{l(p.currentTarget.checked)}}),n&&r.jsx(o.Box,{"data-testid":"effect-toggle-children",pl:"md",children:r.jsx(o.Stack,{gap:4,children:c})})]})}function Ve(){return crypto.randomUUID().slice(0,8)}function Z(t,e){return{id:Ve(),offset:t,color:e}}function me(){return[Z(0,"#6366F1"),Z(1,"#06B6D4")]}function Xe({stops:t,defaultStops:e,direction:s,defaultDirection:a=0,showDirection:c=!0,onChange:n}){const[l,p]=G.useUncontrolled({value:t,defaultValue:e,finalValue:me(),onChange:u=>n==null?void 0:n(u,g)}),[g,z]=G.useUncontrolled({value:s,defaultValue:a,finalValue:0,onChange:u=>n==null?void 0:n(l,u)}),C=(u,v)=>{const S=[...l];S[u]={...S[u],color:v},p(S),n==null||n(S,g)},b=(u,v)=>{const S=[...l];S[u]={...S[u],offset:v/100},p(S),n==null||n(S,g)},d=u=>{z(u),n==null||n(l,u)},m=()=>{if(l.length>=5)return;const u=l.length>0?(l[l.length-1].offset+1)/2:.5,v=[...l,Z(u,xe)];v.sort((S,_)=>S.offset-_.offset),p(v),n==null||n(v,g)},B=u=>{if(l.length<=2)return;const v=l.filter((S,_)=>_!==u);p(v),n==null||n(v,g)};return r.jsxs(o.Stack,{gap:"xs",children:[r.jsxs(o.Group,{justify:"space-between",align:"center",children:[r.jsx(o.Text,{size:"xs",c:"dimmed",children:"Color Stops"}),r.jsx(o.ActionIcon,{size:"compact",variant:"subtle",color:"gray",onClick:m,disabled:l.length>=5,"aria-label":"Add color stop",children:r.jsx(R.Plus,{size:12})})]}),l.map((u,v)=>r.jsxs(o.Group,{gap:"xs",align:"flex-end",children:[r.jsx(o.Box,{style:{flex:1},children:r.jsx(o.ColorInput,{size:"compact",value:u.color,onChange:S=>{C(v,S)},"aria-label":`Color stop ${v+1}`})}),r.jsx(o.Box,{style:{width:"80px"},children:r.jsx(o.Slider,{size:"compact",min:0,max:100,value:u.offset*100,onChange:S=>{b(v,S)},label:S=>`${Math.round(S)}%`,"aria-label":`Stop ${v+1} position`})}),r.jsx(o.ActionIcon,{size:"compact",variant:"subtle",color:"gray",onClick:()=>{B(v)},disabled:l.length<=2,"aria-label":`Remove color stop ${v+1}`,children:r.jsx(R.Minus,{size:12})})]},u.id)),c&&r.jsxs(o.Box,{children:[r.jsx(o.Text,{size:"xs",c:"dimmed",mb:4,children:"Direction"}),r.jsx(o.Slider,{size:"compact",min:0,max:360,value:g,onChange:d,label:u=>`${u}°`,"aria-label":"Gradient direction",marks:[{value:0,label:"0°"},{value:90,label:"90°"},{value:180,label:"180°"},{value:270,label:"270°"},{value:360,label:"360°"}]})]})]})}function qe({children:t}){return r.jsx(o.Box,{p:"sm",children:t})}const We=["[data-portal]","[data-combobox-dropdown]","[data-menu-dropdown]","[data-popover-dropdown]","[data-tooltip]","[data-hovercard-dropdown]","[data-dates-dropdown]","[data-modal]"].join(", ");function Ze(t,e=!0){i.useEffect(()=>{if(!e)return;const s=a=>{const c=a.target;c.closest('[role="dialog"]')||c.closest("[data-popout-trigger]")||c.closest("[data-popout-portal-container]")||c.closest(We)||t()};return document.addEventListener("mousedown",s),()=>{document.removeEventListener("mousedown",s)}},[t,e])}function Ye(t,e=!0){i.useEffect(()=>{if(!e)return;const s=a=>{a.key==="Escape"&&(a.preventDefault(),t())};return document.addEventListener("keydown",s),()=>{document.removeEventListener("keydown",s)}},[t,e])}const oe=i.createContext(null),he=i.createContext(null);function ge(){const t=i.useContext(oe);if(!t)throw new Error("usePopoutContext must be used within a Popout component");return t}function Ke(){return i.useContext(oe)}function Je(){const t=i.useContext(he);if(!t)throw new Error("usePopoutManagerContext must be used within a PopoutManager");return t}function Qe({children:t,parentId:e=null}){const s=i.useId(),[a,c]=i.useState(!1),n=i.useRef(null),l=i.useMemo(()=>({id:s,isOpen:a,open:()=>{c(!0)},close:()=>{c(!1)},toggle:()=>{c(p=>!p)},triggerRef:n,parentId:e}),[s,a,e]);return r.jsx(oe.Provider,{value:l,children:t})}function et({children:t}){const[e,s]=i.useState(null),a=i.useRef([]),c=i.useRef(new Map),n=i.useRef(new Map),[l,p]=i.useState(0),g=i.useCallback((f,h,P)=>{var T,D;if(!a.current.includes(f)){const M=a.current,F=[];for(const x of M)n.current.get(x)===(P??null)&&F.push(x);for(const x of F.reverse()){const A=[];for(const I of M){let w=I;for(;w;){const U=n.current.get(w);if(U===x){A.push(I);break}w=U??null}}for(const I of A.reverse())(T=c.current.get(I))==null||T();(D=c.current.get(x))==null||D()}a.current=[...a.current.filter(x=>!F.includes(x)&&!F.some(A=>{let I=x;for(;I;){const w=n.current.get(I);if(w===A)return!0;I=w??null}return!1})),f],c.current.set(f,h),n.current.set(f,P??null),p(x=>x+1)}},[]),z=i.useCallback(f=>{a.current=a.current.filter(h=>h!==f),c.current.delete(f),n.current.delete(f),p(h=>h+1)},[]),C=i.useCallback(f=>{const h=a.current.indexOf(f);return h>=0?K+h:K},[]),b=i.useCallback(f=>{const h=a.current,P=h.indexOf(f);P===-1||P===h.length-1||(a.current=[...h.filter(T=>T!==f),f],p(T=>T+1))},[]),d=i.useCallback(f=>n.current.get(f)??null,[]),m=i.useCallback((f,h)=>{let P=h;for(;P;){const T=n.current.get(P);if(T===f)return!0;P=T??null}return!1},[]),B=i.useCallback(f=>{const h=[],P=a.current;for(const T of P)m(f,T)&&h.push(T);return h},[m]),u=i.useCallback(f=>{const h=B(f);for(const P of[...h].reverse()){const T=c.current.get(P);T==null||T()}},[B]),v=i.useCallback(f=>{u(f);const h=c.current.get(f);h==null||h()},[u]),S=i.useCallback((f,h)=>{const P=a.current;for(const T of P){if(T===f)continue;n.current.get(T)===h&&v(T)}},[v]),_=i.useCallback(()=>{const f=a.current;if(f.length===0)return;const h=f[f.length-1],P=c.current.get(h);P==null||P()},[]),E=i.useCallback(()=>{const f=[...a.current];for(const h of f){const P=c.current.get(h);P==null||P()}},[]),j=i.useCallback(()=>a.current.length>0,[]),[O,H]=i.useState(!1);i.useEffect(()=>{H(a.current.length>0)},[l]),Ye(_,O),Ze(E,O);const $=i.useMemo(()=>({register:g,unregister:z,getZIndex:C,bringToFront:b,portalContainer:e,zIndexVersion:l,closeFocused:_,closeAll:E,hasOpenPopouts:j,closeWithDescendants:v,closeDescendants:u,closeSiblings:S,getParentId:d,isAncestor:m}),[g,z,C,b,e,l,_,E,j,v,u,S,d,m]);return r.jsxs(he.Provider,{value:$,children:[t,r.jsx("div",{ref:s,"data-popout-portal-container":!0})]})}function tt(t){const{isOpen:e,onDragStart:s}=t,[a,c]=i.useState({left:0,top:0}),n=i.useRef(!1),l=i.useRef({x:0,y:0,offsetLeft:0,offsetTop:0}),p=i.useCallback(()=>{c({left:0,top:0})},[]),g=i.useCallback(b=>{const d=b.target;d.tagName==="INPUT"||d.tagName==="TEXTAREA"||d.tagName==="BUTTON"||d.tagName==="SELECT"||d.closest("button")||d.closest("input")||d.closest("textarea")||d.closest("select")||(n.current=!0,l.current={x:b.clientX,y:b.clientY,offsetLeft:a.left,offsetTop:a.top},s==null||s(),b.target.setPointerCapture(b.pointerId))},[a.left,a.top,s]),z=i.useCallback(b=>{if(!n.current)return;const d=b.clientX-l.current.x,m=b.clientY-l.current.y;c({left:l.current.offsetLeft+d,top:l.current.offsetTop+m})},[]),C=i.useCallback(b=>{n.current&&(n.current=!1,b.target.releasePointerCapture(b.pointerId))},[]);return e?{dragTriggerProps:{"data-drag-trigger":!0,onPointerDown:g,onPointerMove:z,onPointerUp:C,style:{cursor:"grab",userSelect:"none",touchAction:"none"}},dragOffset:a,resetDragOffset:p}:{dragTriggerProps:{},dragOffset:{left:0,top:0},resetDragOffset:p}}function ot({id:t,label:e,isActive:s,onClick:a}){return r.jsx(o.UnstyledButton,{role:"tab",id:`tab-${t}`,"aria-selected":s,"aria-controls":`tabpanel-${t}`,onClick:a,px:"xs",py:3,style:{fontSize:"11px",fontWeight:s?500:400,color:s?"var(--mantine-color-text)":"var(--mantine-color-dimmed)",borderBottom:s?"2px solid var(--mantine-color-blue-filled)":"2px solid transparent",cursor:"pointer"},children:e})}function rt({config:t,onClose:e,dragTriggerProps:s={},actions:a=[],activeTab:c,onTabChange:n,titleId:l}){var d;const{style:p,...g}=s,C=t.variant==="tabs"?t:null,b=m=>{n&&n(m)};return r.jsxs(o.Group,{justify:"space-between",px:"sm",py:"xs",...g,style:{...p},children:[t.variant==="title"?r.jsx(o.Text,{id:l,size:"compact",fw:500,children:t.title}):r.jsxs(o.Group,{gap:0,role:"tablist","aria-label":"Panel tabs",children:[r.jsx("span",{id:l,style:{position:"absolute",width:1,height:1,overflow:"hidden",clip:"rect(0, 0, 0, 0)"},children:((d=C==null?void 0:C.tabs[0])==null?void 0:d.label)??"Settings"}),C==null?void 0:C.tabs.map(m=>r.jsx(ot,{id:m.id,label:m.label,isActive:c===m.id,onClick:()=>{b(m.id)}},m.id))]}),r.jsxs(o.Group,{gap:4,children:[a.map(m=>r.jsx(o.ActionIcon,{variant:"subtle",size:"compact",onClick:m.onClick,"aria-label":m.label,children:m.icon},m.id)),r.jsx(o.ActionIcon,{variant:"subtle",size:"compact",onClick:e,"aria-label":"Close panel",children:r.jsx(R.X,{size:14})})]})]})}function nt(t,e,s=de,a={}){const{placement:c="left",alignment:n="start",panelHeight:l=0}=a;let p,g;switch(c){case"left":p=t.left-e-s,g=ce(t,n,l);break;case"right":p=t.right+s,g=ce(t,n,l);break;case"top":p=le(t,n,e),g=t.top-l-s;break;case"bottom":p=le(t,n,e),g=t.bottom+s;break;default:{const z=c;throw new Error(`Unknown placement: ${String(z)}`)}}return{left:p,top:g}}function ce(t,e,s){switch(e){case"start":return t.top;case"center":return t.top+t.height/2-s/2;case"end":return t.bottom-s;default:{const a=e;throw new Error(`Unknown alignment: ${String(a)}`)}}}function le(t,e,s){switch(e){case"start":return t.left;case"center":return t.left+t.width/2-s/2;case"end":return t.right-s;default:{const a=e;throw new Error(`Unknown alignment: ${String(a)}`)}}}function st({width:t,height:e,header:s,children:a,anchorRef:c,placement:n="left",alignment:l="start",gap:p=0,actions:g}){var ae,ie;const{isOpen:z,close:C,triggerRef:b,id:d,parentId:m}=ge(),{getZIndex:B,portalContainer:u,register:v,unregister:S,bringToFront:_,zIndexVersion:E,closeWithDescendants:j,closeDescendants:O}=Je(),H=i.useId(),$=`popout-panel-${d}`,f=`popout-title-${H}`,[h,P]=i.useState(null),T=i.useRef(!1),D=i.useRef(null),M=i.useCallback(()=>{_(d)},[_,d]),{dragTriggerProps:F,dragOffset:x,resetDragOffset:A}=tt({isOpen:z,onDragStart:M}),I=s.variant==="tabs",w=I?s:null,U=(w==null?void 0:w.defaultTab)??((ae=w==null?void 0:w.tabs[0])==null?void 0:ae.id),[re,ne]=i.useState(U),be=i.useCallback(y=>{var N;ne(y),(N=w==null?void 0:w.onTabChange)==null||N.call(w,y)},[w]),ve=i.useCallback(y=>{y.stopPropagation(),O(d),_(d)},[O,_,d]),ze=i.useCallback(()=>{j(d)},[j,d]);if(i.useEffect(()=>(z?v(d,C,m):S(d),()=>{S(d)}),[z,d,v,S,C,m]),i.useEffect(()=>{if(z){let y=(c==null?void 0:c.current)??null;if(!y&&m&&(y=document.querySelector(`[data-popout-id="${m}"]`)),y||(y=b.current),y){const N=y.getBoundingClientRect(),we=nt(N,t,p,{placement:n,alignment:l,panelHeight:e});P(we),T.current||(A(),I&&ne(U))}}T.current=z},[z,t,e,p,b,c,n,l,A,I,U,m]),i.useEffect(()=>{if(z&&D.current){const y=setTimeout(()=>{var N;(N=D.current)==null||N.focus()},0);return()=>{clearTimeout(y)}}else!z&&b.current&&b.current.focus()},[z,b]),!z||!u||!h)return null;const Ce=B(d),se={left:h.left+x.left,top:h.top+x.top},V="1px solid light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.12))",q="none",Y=c!==void 0||m!==void 0,Se=()=>Y?{borderTop:n==="bottom"?q:V,borderRight:n==="left"?q:V,borderBottom:n==="top"?q:V,borderLeft:n==="right"?q:V}:{border:V},Pe=()=>{if(!Y)return{};const y=8;switch(n){case"left":return{borderTopLeftRadius:y,borderBottomLeftRadius:y,borderTopRightRadius:0,borderBottomRightRadius:0};case"right":return{borderTopLeftRadius:0,borderBottomLeftRadius:0,borderTopRightRadius:y,borderBottomRightRadius:y};case"top":return{borderTopLeftRadius:y,borderTopRightRadius:y,borderBottomLeftRadius:0,borderBottomRightRadius:0};case"bottom":return{borderTopLeftRadius:0,borderTopRightRadius:0,borderBottomLeftRadius:y,borderBottomRightRadius:y};default:return{}}},Te=r.jsxs(o.Paper,{ref:D,id:$,role:"dialog","aria-modal":"false","aria-labelledby":f,tabIndex:-1,radius:Y?0:8,onClick:ve,"data-popout-id":d,...m&&{"data-parent-id":m},style:{position:"fixed",left:se.left,top:se.top,width:t,...e!==void 0&&{height:e},zIndex:Ce,backgroundColor:"var(--mantine-color-body)",...Se(),...Pe(),boxShadow:["0 1px 2px light-dark(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.4))","0 4px 8px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.35))","0 8px 16px light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25))"].join(", "),outline:"none"},children:[r.jsx(rt,{config:s,onClose:ze,dragTriggerProps:F,activeTab:re,onTabChange:be,actions:g,titleId:f}),r.jsx(o.Box,{children:I?(ie=w==null?void 0:w.tabs.find(y=>y.id===re))==null?void 0:ie.content:a})]});return ye.createPortal(Te,u)}function at({children:t}){const{toggle:e,triggerRef:s,isOpen:a,id:c}=ge(),n=i.useCallback(g=>{g.stopPropagation(),e()},[e]);if(!i.isValidElement(t))throw new Error("PopoutTrigger requires a single valid React element as its child");const l=`popout-panel-${c}`,p=t;return i.cloneElement(p,{onClick:g=>{var z,C;(C=(z=p.props).onClick)==null||C.call(z,g),n(g)},ref:s,"data-popout-trigger":!0,"aria-expanded":a,"aria-controls":l,"aria-haspopup":"dialog"})}function it({children:t}){const e=Ke(),s=(e==null?void 0:e.id)??null;return r.jsx(Qe,{parentId:s,children:t})}const ct=Object.assign(it,{Trigger:at,Panel:st,Content:qe});function lt({children:t}){return r.jsx(et,{children:t})}function ut({label:t,value:e}){return r.jsxs(o.Group,{justify:"space-between",py:4,children:[r.jsx(o.Text,{size:"compact",c:"dimmed",children:t}),r.jsx(o.Text,{size:"compact",c:"var(--mantine-color-text)",fw:500,children:String(e)})]})}function pt({label:t,value:e,defaultValue:s,onChange:a,min:c,max:n,step:l,decimalScale:p,suffix:g,hideControls:z=!0}){const[C,b]=G.useUncontrolled({value:e,defaultValue:void 0,finalValue:void 0,onChange:a}),d=C===void 0,m=C??s,[B,u]=i.useState(m);i.useEffect(()=>{u(C??s)},[C,s]);const v=E=>{u(E)},S=()=>{const E=typeof B=="string"?parseFloat(B):B;if(isNaN(E))u(C??s);else{let j=E;c!==void 0&&j<c&&(j=c),n!==void 0&&j>n&&(j=n),j!==C&&b(j),u(j)}},_=()=>{b(void 0)};return r.jsxs(o.Group,{gap:4,wrap:"nowrap",align:"flex-end",children:[r.jsx(o.NumberInput,{label:t,"aria-label":t,value:B,onChange:v,onBlur:S,min:c,max:n,step:l,decimalScale:p,suffix:g,hideControls:z,size:"compact","data-is-default":d?"true":"false",styles:{input:d?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:void 0},style:{flex:1}}),!d&&r.jsx(o.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${t} to default`,onClick:_,style:{marginBottom:2},children:r.jsx(R.X,{size:12})})]})}function dt({label:t,value:e,defaultValue:s,options:a,onChange:c}){const[n,l]=G.useUncontrolled({value:e,defaultValue:void 0,finalValue:void 0,onChange:c}),p=n===void 0,g=n??s,z=b=>{b!==null&&l(b)},C=()=>{l(void 0)};return r.jsxs(o.Group,{gap:4,wrap:"nowrap",align:"flex-end",children:[r.jsx(o.Select,{label:t,"aria-label":t,value:g,onChange:z,data:a,size:"compact",rightSection:r.jsx(R.ChevronDown,{size:14}),rightSectionPointerEvents:"none","data-is-default":p?"true":"false",allowDeselect:!1,styles:{input:p?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:void 0},style:{flex:1}}),!p&&r.jsx(o.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${t} to default`,onClick:C,style:{marginBottom:2},children:r.jsx(R.X,{size:12})})]})}function ft(){return o.useComputedColorScheme("dark")}const xt={xs:o.rem(4),sm:o.rem(8),md:o.rem(16),lg:o.rem(24),xl:o.rem(32)},mt="0.1.0";exports.CompactColorInput=He;exports.ControlGroup=Ne;exports.ControlSection=Me;exports.ControlSubGroup=Ue;exports.DEFAULT_GRADIENT_STOP_COLOR=xe;exports.EffectToggle=$e;exports.GradientEditor=Xe;exports.MANTINE_SPACING=xt;exports.MAX_ALPHA_HEX=J;exports.MAX_OPACITY_PERCENT=Q;exports.POPOUT_GAP=de;exports.POPOUT_NESTED_GAP=Be;exports.POPOUT_Z_INDEX_BASE=K;exports.Popout=ct;exports.PopoutManager=lt;exports.SWATCH_COLORS=De;exports.SWATCH_COLORS_HEXA=fe;exports.StatRow=ut;exports.StyleNumberInput=pt;exports.StyleSelect=dt;exports.VERSION=mt;exports.compactColors=pe;exports.compactDarkColors=ue;exports.compactTheme=Oe;exports.createColorStop=Z;exports.createDefaultGradientStops=me;exports.isValidHex=Ge;exports.opacityToAlphaHex=te;exports.parseAlphaFromHexa=ee;exports.parseHexaColor=Fe;exports.toHexaColor=Le;exports.useActualColorScheme=ft;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@mantine/core"),o=require("react/jsx-runtime"),V=require("@mantine/hooks"),D=require("lucide-react"),a=require("react"),Fe=require("react-dom"),ve=["#d5d7da","#a3a8b1","#7a828e","#5f6873","#48525c","#374047","#2a3035","#1f2428","#161b22","#0d1117"],Pe={...e.DEFAULT_THEME.colors,dark:ve},Re={"--button-height":"24px","--button-fz":"11px","--button-padding-x":"8px"},De={"--ai-size":"24px"},_e={"--cb-size":"16px","--cb-icon-size":"12px"},Ve={Button:e.Button.extend({defaultProps:{size:"sm"},vars:()=>({root:Re})}),ActionIcon:e.ActionIcon.extend({defaultProps:{size:"sm",variant:"subtle"},vars:()=>({root:De})}),CloseButton:e.CloseButton.extend({defaultProps:{size:"xs"},vars:()=>({root:_e})})},He={"--switch-height":"16px","--switch-width":"28px","--switch-thumb-size":"12px","--switch-track-label-padding":"2px","--switch-label-font-size":"5px"},Le={"--checkbox-size":"16px"},Me={"--radio-size":"16px","--radio-icon-size":"6px"},xe={"--slider-size":"4px","--slider-thumb-size":"12px"},Ne={"--sc-font-size":"10px","--sc-padding":"4px 8px"},Ge={backgroundColor:"transparent"},Ue={backgroundColor:"var(--mantine-color-dark-6)"},Q={fontSize:11},me={fontSize:10,marginTop:2},$e={SegmentedControl:e.SegmentedControl.extend({defaultProps:{size:"sm",withItemsBorders:!1},vars:()=>({root:Ne}),styles:{root:Ge,indicator:Ue}}),Checkbox:e.Checkbox.extend({defaultProps:{size:"sm"},vars:()=>({root:Le}),styles:{label:Q}}),Switch:e.Switch.extend({defaultProps:{size:"sm"},vars:()=>({root:He}),styles:{label:Q}}),Slider:e.Slider.extend({defaultProps:{size:"sm"},vars:()=>({root:xe}),styles:{markLabel:me}}),Radio:e.Radio.extend({defaultProps:{size:"sm"},vars:()=>({root:Me}),styles:{label:Q}}),RangeSlider:e.RangeSlider.extend({defaultProps:{size:"sm"},vars:()=>({root:xe}),styles:{markLabel:me}})},Xe={"--badge-height":"14px","--badge-fz":"9px","--badge-padding-x":"4px"},We={"--avatar-size":"24px"},qe={"--ti-size":"24px"},Ze={"--indicator-size":"8px"},Ke={"--kbd-fz":"10px","--kbd-padding":"2px 4px"},Ye={"--pill-height":"16px","--pill-fz":"10px"},Je={Text:e.Text.extend({}),Badge:e.Badge.extend({defaultProps:{size:"sm"},vars:()=>({root:Xe})}),Pill:e.Pill.extend({defaultProps:{size:"sm"},vars:()=>({root:Ye})}),Avatar:e.Avatar.extend({defaultProps:{size:"sm"},vars:()=>({root:We})}),ThemeIcon:e.ThemeIcon.extend({defaultProps:{size:"sm"},vars:()=>({root:qe})}),Indicator:e.Indicator.extend({defaultProps:{size:"sm"},vars:()=>({root:Ze})}),Kbd:e.Kbd.extend({defaultProps:{size:"sm"},vars:()=>({root:Ke})})},Qe={"--loader-size":"18px"},et={"--progress-size":"4px"},tt={label:{fontSize:9}},ot={Loader:e.Loader.extend({defaultProps:{size:"sm"},vars:()=>({root:Qe})}),Progress:e.Progress.extend({defaultProps:{size:"sm"},vars:()=>({root:et}),styles:tt}),RingProgress:e.RingProgress.extend({})},te=1e3,L=1100,Se=8,nt=4,G={"--input-height":"24px","--input-size":"24px","--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"},q={"--input-fz":"11px","--input-bg":"var(--mantine-color-default)","--input-bd":"none"},$={fontSize:11,color:"var(--mantine-color-dimmed)",marginBottom:1,lineHeight:1.2},oe={paddingLeft:8,paddingRight:8,border:"none",backgroundColor:"var(--mantine-color-default)"},U={label:$,input:oe},ge={label:$,input:oe},Z={dropdown:{padding:4,border:"none",boxShadow:"var(--mantine-shadow-md)"},option:{fontSize:11,padding:"4px 8px",borderRadius:4},options:{},groupLabel:{fontSize:10,padding:"4px 8px"},empty:{fontSize:11,padding:"8px"}},ee={input:{...U.input,minHeight:24,height:"auto",display:"flex",alignItems:"center",paddingTop:4,paddingBottom:4},pillsList:{columnGap:4,rowGap:2},pill:{margin:0}},st={TextInput:e.TextInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:G}),styles:U}),NumberInput:e.NumberInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:{...G,"--input-right-section-width":"24px"},controls:{"--ni-chevron-size":"10px"}}),styles:{label:$,input:oe,control:{borderColor:"transparent"}}}),Select:e.Select.extend({defaultProps:{size:"sm",variant:"filled",comboboxProps:{zIndex:L}},vars:()=>({root:{},wrapper:G}),styles:{...U,...Z}}),Textarea:e.Textarea.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:q}),styles:ge}),PasswordInput:e.PasswordInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:G}),styles:{...U,innerInput:{paddingLeft:8,paddingRight:8}}}),Autocomplete:e.Autocomplete.extend({defaultProps:{size:"sm",variant:"filled",comboboxProps:{zIndex:L}},vars:()=>({root:{},wrapper:G}),styles:{...U,...Z}}),MultiSelect:e.MultiSelect.extend({defaultProps:{size:"sm",variant:"filled",comboboxProps:{zIndex:L}},vars:()=>({root:{},wrapper:{...G,"--combobox-chevron-size":"12px"}}),styles:{label:$,...Z,...ee,inputField:{minWidth:60,flexBasis:60}}}),TagsInput:e.TagsInput.extend({defaultProps:{size:"sm",variant:"filled",comboboxProps:{zIndex:L}},vars:()=>({root:{},wrapper:q}),styles:{label:$,...Z,...ee,inputField:{minWidth:30,flexBasis:30}}}),PillsInput:e.PillsInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:q}),styles:{label:$,...ee}}),FileInput:e.FileInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:G}),styles:U}),JsonInput:e.JsonInput.extend({defaultProps:{size:"sm",variant:"filled"},vars:()=>({root:{},wrapper:q}),styles:ge}),InputClearButton:e.InputClearButton.extend({defaultProps:{size:"xs"},vars:()=>({root:{"--cb-size":"16px","--cb-icon-size":"12px"}})})},rt={"--pagination-control-size":"24px","--pagination-control-fz":"11px"},at={"--stepper-icon-size":"24px","--stepper-fz":"11px","--stepper-spacing":"8px"},lt={"--burger-size":"18px","--burger-line-size":"2px"},it={root:{fontSize:11}},ct={root:{fontSize:11,minHeight:28},label:{fontSize:11}},ut={tab:{fontSize:11,padding:"6px 10px"}},dt={Anchor:e.Anchor.extend({defaultProps:{size:"sm"},styles:it}),Burger:e.Burger.extend({defaultProps:{size:"sm"},vars:()=>({root:lt})}),NavLink:e.NavLink.extend({styles:ct}),Pagination:e.Pagination.extend({defaultProps:{size:"sm"},vars:()=>({root:rt})}),Stepper:e.Stepper.extend({defaultProps:{size:"sm"},vars:()=>({root:at})}),Tabs:e.Tabs.extend({styles:ut})},pt={"--menu-item-fz":"11px"},ft={tooltip:{fontSize:11,padding:"4px 8px"}},xt={dropdown:{padding:8}},mt={dropdown:{padding:8}},gt={Menu:e.Menu.extend({defaultProps:{zIndex:L},vars:()=>({dropdown:pt})}),Tooltip:e.Tooltip.extend({defaultProps:{zIndex:L},styles:ft}),Popover:e.Popover.extend({defaultProps:{zIndex:L},styles:xt}),HoverCard:e.HoverCard.extend({defaultProps:{zIndex:L},styles:mt})},ht={xs:"10px",sm:"11px",md:"13px",lg:"14px",xl:"16px"},bt={xs:"4px",sm:"6px",md:"8px",lg:"12px",xl:"16px"},vt={xs:"2px",sm:"4px",md:"6px",lg:"8px",xl:"12px"},Ce=e.createTheme({colors:Pe,fontSizes:ht,spacing:bt,radius:vt,focusRing:"never",components:{...st,...Ve,...$e,...Je,...ot,...dt,...gt}}),Pt=e.mergeMantineTheme(e.DEFAULT_THEME,Ce),St=["#5B8FF9","#FF6B6B","#61D095","#F7B731","#9B59B6"],ze=["#5B8FF9FF","#FF6B6BFF","#61D095FF","#F7B731FF","#9B59B6FF","#5B8FF980","#FF6B6B80","#61D09580","#F7B73180","#9B59B680"],K="#888888",ne=255,se=100;function re(t){return Math.round(parseInt(t,16)/ne*se)}function ae(t){return Math.round(t/se*ne).toString(16).padStart(2,"0")}function Ct(t){let n=t.replace("#","");n.length===3?n=`${n.split("").map(s=>s+s).join("")}ff`:n.length===4?n=n.split("").map(s=>s+s).join(""):n.length===6&&(n=`${n}ff`);const l=`#${n.slice(0,6)}`,r=n.slice(6,8),i=re(r);return{hex:l,opacity:i}}function zt(t,n){const l=t.replace("#",""),r=ae(n);return`#${l}${r}`}function yt(t){return/^#?([A-Fa-f0-9]{3}|[A-Fa-f0-9]{4}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{8})$/.test(t)}const ye=a.createContext(null);function wt(){return a.useContext(ye)}function It({children:t}){const n=a.useRef(null);if(!a.isValidElement(t))throw new Error("PopoutAnchor requires a single valid React element as its child");const l=t,r=a.cloneElement(l,{ref:n});return o.jsx(ye.Provider,{value:{anchorRef:n},children:r})}function kt({children:t}){return o.jsx(e.Box,{p:"sm",children:t})}const Tt=["[data-portal]","[data-combobox-dropdown]","[data-menu-dropdown]","[data-popover-dropdown]","[data-tooltip]","[data-hovercard-dropdown]","[data-dates-dropdown]","[data-modal]"].join(", ");function jt(t,n=!0){a.useEffect(()=>{if(!n)return;const l=r=>{const i=r.target;i.closest('[role="dialog"]')||i.closest("[data-popout-trigger]")||i.closest("[data-popout-portal-container]")||i.closest(Tt)||t()};return document.addEventListener("mousedown",l),()=>{document.removeEventListener("mousedown",l)}},[t,n])}function At(t,n=!0){a.useEffect(()=>{if(!n)return;const l=r=>{r.key==="Escape"&&(r.preventDefault(),t())};return document.addEventListener("keydown",l),()=>{document.removeEventListener("keydown",l)}},[t,n])}const le=a.createContext(null),we=a.createContext(null);function ie(){const t=a.useContext(le);if(!t)throw new Error("usePopoutContext must be used within a Popout component");return t}function Et(){return a.useContext(le)}function Bt(){const t=a.useContext(we);if(!t)throw new Error("usePopoutManagerContext must be used within a PopoutManager");return t}function Ot({children:t,parentId:n=null}){const l=a.useId(),[r,i]=a.useState(!1),s=a.useRef(null),c=a.useMemo(()=>({id:l,isOpen:r,open:()=>{i(!0)},close:()=>{i(!1)},toggle:()=>{i(d=>!d)},triggerRef:s,parentId:n}),[l,r,n]);return o.jsx(le.Provider,{value:c,children:t})}function Ft({children:t}){const[n,l]=a.useState(null),r=a.useRef([]),i=a.useRef(new Map),s=a.useRef(new Map),[c,d]=a.useState(0),x=a.useCallback((f,g,C)=>{var y,_;if(!r.current.includes(f)){const z=r.current,B=[];for(const A of z)s.current.get(A)===(C??null)&&B.push(A);for(const A of B.reverse()){const R=[];for(const O of z){let F=O;for(;F;){const I=s.current.get(F);if(I===A){R.push(O);break}F=I??null}}for(const O of R.reverse())(y=i.current.get(O))==null||y();(_=i.current.get(A))==null||_()}r.current=[...r.current.filter(A=>!B.includes(A)&&!B.some(R=>{let O=A;for(;O;){const F=s.current.get(O);if(F===R)return!0;O=F??null}return!1})),f],i.current.set(f,g),s.current.set(f,C??null),d(A=>A+1)}},[]),b=a.useCallback(f=>{r.current=r.current.filter(g=>g!==f),i.current.delete(f),s.current.delete(f),d(g=>g+1)},[]),P=a.useCallback(f=>{const g=r.current.indexOf(f);return g>=0?te+g:te},[]),m=a.useCallback(f=>{const g=r.current,C=g.indexOf(f);C===-1||C===g.length-1||(r.current=[...g.filter(y=>y!==f),f],d(y=>y+1))},[]),p=a.useCallback(f=>s.current.get(f)??null,[]),v=a.useCallback((f,g)=>{let C=g;for(;C;){const y=s.current.get(C);if(y===f)return!0;C=y??null}return!1},[]),E=a.useCallback(f=>{const g=[],C=r.current;for(const y of C)v(f,y)&&g.push(y);return g},[v]),u=a.useCallback(f=>{const g=E(f);for(const C of[...g].reverse()){const y=i.current.get(C);y==null||y()}},[E]),h=a.useCallback(f=>{u(f);const g=i.current.get(f);g==null||g()},[u]),S=a.useCallback((f,g)=>{const C=r.current;for(const y of C){if(y===f)continue;s.current.get(y)===g&&h(y)}},[h]),w=a.useCallback(()=>{const f=r.current;if(f.length===0)return;const g=f[f.length-1],C=i.current.get(g);C==null||C()},[]),j=a.useCallback(()=>{const f=[...r.current];for(const g of f){const C=i.current.get(g);C==null||C()}},[]),k=a.useCallback(()=>r.current.length>0,[]),[M,H]=a.useState(!1);a.useEffect(()=>{H(r.current.length>0)},[c]),At(w,M),jt(j,M);const X=a.useMemo(()=>({register:x,unregister:b,getZIndex:P,bringToFront:m,portalContainer:n,zIndexVersion:c,closeFocused:w,closeAll:j,hasOpenPopouts:k,closeWithDescendants:h,closeDescendants:u,closeSiblings:S,getParentId:p,isAncestor:v}),[x,b,P,m,n,c,w,j,k,h,u,S,p,v]);return o.jsxs(we.Provider,{value:X,children:[t,o.jsx("div",{ref:l,"data-popout-portal-container":!0})]})}function Rt(t){const{isOpen:n,onDragStart:l}=t,[r,i]=a.useState({left:0,top:0}),s=a.useRef(!1),c=a.useRef({x:0,y:0,offsetLeft:0,offsetTop:0}),d=a.useCallback(()=>{i({left:0,top:0})},[]),x=a.useCallback(m=>{const p=m.target;p.tagName==="INPUT"||p.tagName==="TEXTAREA"||p.tagName==="BUTTON"||p.tagName==="SELECT"||p.closest("button")||p.closest("input")||p.closest("textarea")||p.closest("select")||(s.current=!0,c.current={x:m.clientX,y:m.clientY,offsetLeft:r.left,offsetTop:r.top},l==null||l(),m.target.setPointerCapture(m.pointerId))},[r.left,r.top,l]),b=a.useCallback(m=>{if(!s.current)return;const p=m.clientX-c.current.x,v=m.clientY-c.current.y;i({left:c.current.offsetLeft+p,top:c.current.offsetTop+v})},[]),P=a.useCallback(m=>{s.current&&(s.current=!1,m.target.releasePointerCapture(m.pointerId))},[]);return n?{dragTriggerProps:{"data-drag-trigger":!0,onPointerDown:x,onPointerMove:b,onPointerUp:P,style:{cursor:"grab",userSelect:"none",touchAction:"none"}},dragOffset:r,resetDragOffset:d}:{dragTriggerProps:{},dragOffset:{left:0,top:0},resetDragOffset:d}}function Dt({config:t,onClose:n,dragTriggerProps:l={},actions:r=[],activeTab:i,onTabChange:s,titleId:c}){var p;const{style:d,...x}=l,P=t.variant==="tabs"?t:null,m=(P==null?void 0:P.tabs.map(v=>({value:v.id,label:v.label})))??[];return o.jsxs(e.Group,{justify:"space-between",px:"sm",py:"xs",...x,style:{...d},children:[t.variant==="title"?o.jsx(e.Text,{id:c,size:"sm",fw:500,children:t.title}):o.jsxs(o.Fragment,{children:[o.jsx("span",{id:c,style:{position:"absolute",width:1,height:1,overflow:"hidden",clip:"rect(0, 0, 0, 0)"},children:((p=P==null?void 0:P.tabs[0])==null?void 0:p.label)??"Settings"}),o.jsx(e.SegmentedControl,{data:m,value:i,onChange:v=>s==null?void 0:s(v),size:"xs"})]}),o.jsxs(e.Group,{gap:4,children:[r.map(v=>o.jsx(e.ActionIcon,{variant:"subtle",onClick:v.onClick,"aria-label":v.label,children:v.icon},v.id)),o.jsx(e.CloseButton,{size:"sm",onClick:n,"aria-label":"Close panel"})]})]})}function _t(t,n,l=Se,r={}){const{placement:i="left",alignment:s="start",panelHeight:c=0}=r;let d,x;switch(i){case"left":d=t.left-n-l,x=he(t,s,c);break;case"right":d=t.right+l,x=he(t,s,c);break;case"top":d=be(t,s,n),x=t.top-c-l;break;case"bottom":d=be(t,s,n),x=t.bottom+l;break;default:{const b=i;throw new Error(`Unknown placement: ${String(b)}`)}}return{left:d,top:x}}function he(t,n,l){switch(n){case"start":return t.top;case"center":return t.top+t.height/2-l/2;case"end":return t.bottom-l;default:{const r=n;throw new Error(`Unknown alignment: ${String(r)}`)}}}function be(t,n,l){switch(n){case"start":return t.left;case"center":return t.left+t.width/2-l/2;case"end":return t.right-l;default:{const r=n;throw new Error(`Unknown alignment: ${String(r)}`)}}}function Vt({width:t,height:n,header:l,children:r,anchorRef:i,placement:s="left",alignment:c="start",gap:d=0,actions:x}){var pe,fe;const{isOpen:b,close:P,triggerRef:m,id:p,parentId:v}=ie(),{getZIndex:E,portalContainer:u,register:h,unregister:S,bringToFront:w,zIndexVersion:j,closeWithDescendants:k,closeDescendants:M}=Bt(),H=wt(),X=a.useId(),f=`popout-panel-${p}`,g=`popout-title-${X}`,[C,y]=a.useState(null),_=a.useRef(!1),z=a.useRef(null),B=a.useCallback(()=>{w(p)},[w,p]),{dragTriggerProps:A,dragOffset:R,resetDragOffset:O}=Rt({isOpen:b,onDragStart:B}),F=l.variant==="tabs",I=F?l:null,J=(I==null?void 0:I.defaultTab)??((pe=I==null?void 0:I.tabs[0])==null?void 0:pe.id),[ce,ue]=a.useState(J),Te=a.useCallback(T=>{var N;ue(T),(N=I==null?void 0:I.onTabChange)==null||N.call(I,T)},[I]),je=a.useCallback(T=>{T.stopPropagation(),M(p),w(p)},[M,w,p]),Ae=a.useCallback(()=>{k(p)},[k,p]);if(a.useEffect(()=>(b?h(p,P,v):S(p),()=>{S(p)}),[b,p,h,S,P,v]),a.useEffect(()=>{if(b){let T=(i==null?void 0:i.current)??null;if(!T&&(H!=null&&H.anchorRef.current)&&(T=H.anchorRef.current),!T&&v&&(T=document.querySelector(`[data-popout-id="${v}"]`)),T||(T=m.current),T){const N=T.getBoundingClientRect(),Oe=_t(N,t,d,{placement:s,alignment:c,panelHeight:n});y(Oe),_.current||(O(),F&&ue(J))}}_.current=b},[b,t,n,d,m,i,s,c,O,F,J,v]),a.useEffect(()=>{if(b&&z.current){const T=setTimeout(()=>{var N;(N=z.current)==null||N.focus()},0);return()=>{clearTimeout(T)}}else!b&&m.current&&m.current.focus()},[b,m]),!b||!u||!C)return null;const Ee=E(p),de={left:C.left+R.left,top:C.top+R.top},Be=o.jsxs(e.Paper,{ref:z,id:f,role:"dialog","aria-modal":"false","aria-labelledby":g,tabIndex:-1,radius:8,onClick:je,"data-popout-id":p,...v&&{"data-parent-id":v},style:{position:"fixed",left:de.left,top:de.top,minWidth:t,...n!==void 0&&{minHeight:n},zIndex:Ee,backgroundColor:"var(--mantine-color-body)",border:"1px solid light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.12))",boxShadow:["0 1px 2px light-dark(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.4))","0 4px 8px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.35))","0 8px 16px light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.25))"].join(", "),outline:"none"},children:[o.jsx(Dt,{config:l,onClose:Ae,dragTriggerProps:A,activeTab:ce,onTabChange:Te,actions:x,titleId:g}),o.jsx(e.Box,{children:F?(fe=I==null?void 0:I.tabs.find(T=>T.id===ce))==null?void 0:fe.content:r})]});return Fe.createPortal(Be,u)}function Ht({children:t}){const{toggle:n,triggerRef:l,isOpen:r,id:i}=ie(),s=a.useCallback(x=>{x.stopPropagation(),n()},[n]);if(!a.isValidElement(t))throw new Error("PopoutTrigger requires a single valid React element as its child");const c=`popout-panel-${i}`,d=t;return a.cloneElement(d,{onClick:x=>{var b,P;(P=(b=d.props).onClick)==null||P.call(b,x),s(x)},ref:l,"data-popout-trigger":!0,"aria-expanded":r,"aria-controls":c,"aria-haspopup":"dialog"})}function Lt({children:t}){const n=Et(),l=(n==null?void 0:n.id)??null;return o.jsx(Ot,{parentId:l,children:t})}const W=Object.assign(Lt,{Trigger:Ht,Panel:Vt,Content:kt,Anchor:It}),Mt=a.forwardRef(function({icon:n,size:l="xs",...r},i){const{isOpen:s}=ie();return o.jsx(e.ActionIcon,{ref:i,variant:s?"light":"subtle",size:l,c:s?void 0:"dimmed",...r,children:n})});function Nt({children:t}){return o.jsx(Ft,{children:t})}function Ie({color:t,defaultColor:n,opacity:l,defaultOpacity:r=100,onColorChange:i,onOpacityChange:s,label:c,showOpacity:d=!0}){const[x,b]=V.useUncontrolled({value:t,defaultValue:void 0,finalValue:void 0,onChange:i}),[P,m]=V.useUncontrolled({value:l,defaultValue:void 0,finalValue:void 0,onChange:s}),p=x===void 0,v=P===void 0,E=p&&(!d||v),u=x??n,h=P??r,[S,w]=a.useState(u.replace("#","").toUpperCase()),[j,k]=a.useState(h);a.useEffect(()=>{w(u.replace("#","").toUpperCase())},[u]),a.useEffect(()=>{k(h)},[h]);const M=z=>{if(z.length===9){const B=z.slice(0,7).toUpperCase(),A=z.slice(7,9),R=re(A);b(B),d&&m(R)}else b(z.toUpperCase())},H=()=>{const z=ae(h);return`${u}${z}`.toUpperCase()},X=z=>{w(z.currentTarget.value.toUpperCase())},f=()=>{let z=S.toUpperCase();z&&!z.startsWith("#")&&(z=`#${z}`),/^#[0-9A-F]{6}$/i.test(z)&&z!==u?b(z):w(u.replace("#","").toUpperCase())},g=z=>{k(z)},C=()=>{const z=typeof j=="string"?parseFloat(j):j;if(isNaN(z))k(h);else{const B=Math.min(100,Math.max(0,z));B!==h&&m(B)}},y=()=>{b(void 0),d&&m(void 0)},_=o.jsxs(e.Group,{gap:4,wrap:"nowrap",children:[o.jsxs(e.Group,{gap:0,children:[o.jsxs(W,{children:[o.jsx(W.Trigger,{children:o.jsx(e.ActionIcon,{variant:"filled",size:24,radius:0,style:{backgroundColor:"var(--mantine-color-default)",borderRadius:"4px 0 0 4px"},"aria-label":"Color swatch",children:o.jsx(e.ColorSwatch,{color:u,size:14,radius:2,style:{border:"1px solid var(--mantine-color-default-border)"}})})}),o.jsx(W.Panel,{width:220,header:{variant:"title",title:c??"Color"},placement:"bottom",alignment:"start",gap:4,children:o.jsx(W.Content,{children:o.jsx(e.ColorPicker,{format:"hexa",value:H(),onChange:M,swatches:[...ze]})})})]}),o.jsx(e.TextInput,{value:S,onChange:X,onBlur:f,"aria-label":"Color hex value","data-is-default":p?"true":"false",w:72,styles:{input:{borderRadius:d?0:"0 4px 4px 0",fontFamily:"monospace",textTransform:"uppercase",...p?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:{}}}}),d&&o.jsxs(o.Fragment,{children:[o.jsx(e.Box,{style:{width:1,height:24,backgroundColor:"var(--mantine-color-default-border)"}}),o.jsx(e.NumberInput,{value:j,onChange:g,onBlur:C,min:0,max:100,hideControls:!0,suffix:"%","aria-label":"Opacity","data-is-default":v?"true":"false",w:54,styles:{input:{borderRadius:"0 4px 4px 0",textAlign:"right",...v?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:{}}}})]})]}),!E&&o.jsx(e.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${c??"color"} to default`,onClick:y,children:o.jsx(D.X,{size:12})})]});return c?o.jsxs(e.Stack,{gap:0,children:[o.jsx(e.Text,{size:"xs",c:"dimmed",mb:1,lh:1.2,children:c}),_]}):_}function Gt({label:t,actions:n,children:l,bleed:r}){const i=r?"calc(-1 * var(--mantine-spacing-sm) - 1px)":void 0;return o.jsxs(e.Box,{children:[o.jsx(e.Divider,{color:"gray.7",mt:8,mb:0,mx:i}),o.jsxs(e.Group,{justify:"space-between",py:8,px:8,children:[o.jsx(e.Text,{size:"xs",fw:500,lh:1.2,children:t}),n&&o.jsx(e.Group,{gap:4,children:n})]}),o.jsx(e.Stack,{gap:0,px:8,children:l})]})}function Ut({label:t,defaultOpen:n=!0,children:l,hasConfiguredValues:r=!1}){const[i,{toggle:s}]=V.useDisclosure(n);return o.jsxs(e.Box,{children:[o.jsx(e.Divider,{color:"gray.7",mt:8,mb:0,mx:8}),o.jsx(e.Group,{justify:"space-between",py:8,px:8,style:{cursor:"pointer"},onClick:s,children:o.jsxs(e.Group,{gap:4,children:[o.jsx(e.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":i?`Collapse ${t}`:`Expand ${t}`,children:i?o.jsx(D.ChevronDown,{size:12}):o.jsx(D.ChevronRight,{size:12})}),o.jsx(e.Text,{size:"xs",fw:500,lh:1.2,children:t}),r&&o.jsx(e.Box,{"aria-label":`${t} has configured values`,style:{width:6,height:6,borderRadius:"50%",backgroundColor:"var(--mantine-color-blue-5)",marginLeft:4}})]})}),o.jsx(e.Collapse,{in:i,children:o.jsx(e.Stack,{gap:0,children:l})})]})}function $t({label:t,defaultOpen:n=!1,children:l}){const[r,{toggle:i}]=V.useDisclosure(n);return o.jsxs(e.Box,{children:[o.jsxs(e.Group,{gap:4,py:4,style:{cursor:"pointer"},onClick:i,children:[o.jsx(e.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":r?`Collapse ${t}`:`Expand ${t}`,children:r?o.jsx(D.ChevronDown,{size:10}):o.jsx(D.ChevronRight,{size:10})}),o.jsx(e.Text,{size:"xs",c:"dimmed",lh:1.2,children:t})]}),r&&o.jsx(e.Box,{pl:"md",children:o.jsx(e.Stack,{gap:4,children:l})})]})}function Xt(){return crypto.randomUUID().slice(0,8)}function Y(t,n){return{id:Xt(),offset:t,color:n}}function ke(){return[Y(0,"#6366F1"),Y(1,"#06B6D4")]}function Wt({stops:t,defaultStops:n,direction:l,defaultDirection:r=0,showDirection:i=!0,onChange:s}){const[c,d]=V.useUncontrolled({value:t,defaultValue:n,finalValue:ke(),onChange:u=>s==null?void 0:s(u,x)}),[x,b]=V.useUncontrolled({value:l,defaultValue:r,finalValue:0,onChange:u=>s==null?void 0:s(c,u)}),P=(u,h)=>{const S=[...c];S[u]={...S[u],color:h},d(S),s==null||s(S,x)},m=(u,h)=>{const S=[...c];S[u]={...S[u],offset:h/100},d(S),s==null||s(S,x)},p=u=>{b(u),s==null||s(c,u)},v=()=>{if(c.length>=5)return;const u=c.length>0?(c[c.length-1].offset+1)/2:.5,h=[...c,Y(u,K)];h.sort((S,w)=>S.offset-w.offset),d(h),s==null||s(h,x)},E=u=>{if(c.length<=2)return;const h=c.filter((S,w)=>w!==u);d(h),s==null||s(h,x)};return o.jsxs(e.Stack,{gap:"xs",children:[o.jsxs(e.Group,{justify:"space-between",align:"center",children:[o.jsx(e.Text,{size:"xs",c:"dimmed",children:"Color Stops"}),o.jsx(e.ActionIcon,{variant:"subtle",color:"gray",onClick:v,disabled:c.length>=5,"aria-label":"Add color stop",children:o.jsx(D.Plus,{size:12})})]}),c.map((u,h)=>o.jsxs(e.Group,{gap:"xs",align:"flex-end",children:[o.jsx(Ie,{color:u.color,defaultColor:K,onColorChange:S=>{P(h,S??K)},showOpacity:!1}),o.jsx(e.Box,{style:{width:"80px"},children:o.jsx(e.Slider,{min:0,max:100,value:u.offset*100,onChange:S=>{m(h,S)},label:S=>`${Math.round(S)}%`,"aria-label":`Stop ${h+1} position`})}),o.jsx(e.ActionIcon,{variant:"subtle",color:"gray",onClick:()=>{E(h)},disabled:c.length<=2,"aria-label":`Remove color stop ${h+1}`,children:o.jsx(D.Minus,{size:12})})]},u.id)),i&&o.jsxs(e.Box,{pb:"md",children:[o.jsx(e.Text,{size:"xs",c:"dimmed",mb:4,children:"Direction"}),o.jsx(e.Slider,{min:0,max:360,value:x,onChange:p,label:u=>`${u}°`,"aria-label":"Gradient direction",marks:[{value:0,label:"0°"},{value:90,label:"90°"},{value:180,label:"180°"},{value:270,label:"270°"},{value:360,label:"360°"}]})]})]})}function qt({label:t,value:n}){return o.jsxs(e.Group,{justify:"space-between",py:4,children:[o.jsx(e.Text,{size:"sm",c:"dimmed",children:t}),o.jsx(e.Text,{size:"sm",c:"var(--mantine-color-text)",fw:500,children:String(n)})]})}function Zt({label:t,value:n,defaultValue:l,onChange:r,min:i,max:s,step:c,decimalScale:d,suffix:x,hideControls:b=!0}){const[P,m]=V.useUncontrolled({value:n,defaultValue:void 0,finalValue:void 0,onChange:r}),p=P===void 0,v=P??l,[E,u]=a.useState(v);a.useEffect(()=>{u(P??l)},[P,l]);const h=j=>{u(j)},S=()=>{const j=typeof E=="string"?parseFloat(E):E;if(isNaN(j))u(P??l);else{let k=j;i!==void 0&&k<i&&(k=i),s!==void 0&&k>s&&(k=s),k!==P&&m(k),u(k)}},w=()=>{m(void 0)};return o.jsxs(e.Group,{gap:4,wrap:"nowrap",align:"flex-end",children:[o.jsx(e.NumberInput,{label:t,"aria-label":t,value:E,onChange:h,onBlur:S,min:i,max:s,step:c,decimalScale:d,suffix:x,hideControls:b,"data-is-default":p?"true":"false",styles:{input:p?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:void 0},style:{flex:1}}),!p&&o.jsx(e.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${t} to default`,onClick:w,style:{marginBottom:2},children:o.jsx(D.X,{size:12})})]})}function Kt({label:t,value:n,defaultValue:l,options:r,onChange:i}){const[s,c]=V.useUncontrolled({value:n,defaultValue:void 0,finalValue:void 0,onChange:i}),d=s===void 0,x=s??l,b=m=>{m!==null&&c(m)},P=()=>{c(void 0)};return o.jsxs(e.Group,{gap:4,wrap:"nowrap",align:"flex-end",children:[o.jsx(e.Select,{label:t,"aria-label":t,value:x,onChange:b,data:r,rightSection:o.jsx(D.ChevronDown,{size:14}),rightSectionPointerEvents:"none","data-is-default":d?"true":"false",allowDeselect:!1,styles:{input:d?{fontStyle:"italic",color:"var(--mantine-color-dimmed)"}:void 0},style:{flex:1}}),!d&&o.jsx(e.ActionIcon,{variant:"subtle",size:"xs",c:"dimmed","aria-label":`Reset ${t} to default`,onClick:P,style:{marginBottom:2},children:o.jsx(D.X,{size:12})})]})}function Yt({label:t,checked:n,defaultChecked:l,onChange:r,children:i}){const[s,c]=V.useUncontrolled({value:n,defaultValue:l,finalValue:!1,onChange:r});return o.jsxs(e.Stack,{gap:4,children:[o.jsx(e.Checkbox,{label:t,checked:s,onChange:d=>{c(d.currentTarget.checked)}}),s&&o.jsx(e.Box,{"data-testid":"toggle-with-content-children",pl:"md",children:o.jsx(e.Stack,{gap:4,children:i})})]})}function Jt(){return e.useComputedColorScheme("dark")}const Qt={xs:e.rem(4),sm:e.rem(8),md:e.rem(16),lg:e.rem(24),xl:e.rem(32)},eo="0.1.0";exports.CompactColorInput=Ie;exports.ControlGroup=Gt;exports.ControlSection=Ut;exports.ControlSubGroup=$t;exports.DEFAULT_GRADIENT_STOP_COLOR=K;exports.GradientEditor=Wt;exports.MANTINE_SPACING=Qt;exports.MAX_ALPHA_HEX=ne;exports.MAX_OPACITY_PERCENT=se;exports.POPOUT_GAP=Se;exports.POPOUT_NESTED_GAP=nt;exports.POPOUT_Z_INDEX_BASE=te;exports.Popout=W;exports.PopoutButton=Mt;exports.PopoutManager=Nt;exports.SWATCH_COLORS=St;exports.SWATCH_COLORS_HEXA=ze;exports.StatRow=qt;exports.StyleNumberInput=Zt;exports.StyleSelect=Kt;exports.ToggleWithContent=Yt;exports.VERSION=eo;exports.compactColors=Pe;exports.compactDarkColors=ve;exports.compactTheme=Pt;exports.compactThemeOverride=Ce;exports.createColorStop=Y;exports.createDefaultGradientStops=ke;exports.isValidHex=yt;exports.opacityToAlphaHex=ae;exports.parseAlphaFromHexa=re;exports.parseHexaColor=Ct;exports.toHexaColor=zt;exports.useActualColorScheme=Jt;