@cronocode/react-box 1.8.9 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -68,9 +68,99 @@ import Textbox from "@cronocode/react-box/components/textbox";
68
68
  import Tooltip from "@cronocode/react-box/components/tooltip";
69
69
  ```
70
70
 
71
- ## Theme variables
71
+ ## Extend props
72
+
73
+ 1. It is possible to extend some props like `color`, `background`, `backgroundImage` and `shadow`
74
+
75
+ ```JS
76
+ function themePlugin() {
77
+ return {
78
+ name: 'themePlugin',
79
+ configResolved() {
80
+ const result = Theme.setupAugmentedProps({
81
+ colors: {
82
+ primary: '#445566'
83
+ },
84
+ backgroundImages: {
85
+ gradient: 'linear-gradient(to right, #77A1D3 0%, #79CBCA 51%, #77A1D3 100%)'
86
+ },
87
+ shadows: {
88
+ 1: '0 4px 10px rgb(224 224 224 / 52%)',
89
+ }
90
+ });
91
+
92
+ fs.writeFileSync('./src/box-theme.generated.css', result.variables);
93
+ fs.writeFileSync('./src/box.generated.d.ts', result.boxDts);
94
+ },
95
+ }
96
+ }
97
+
98
+ ```
99
+
100
+ 2. Add this plugin to your build tool
101
+
102
+ Vitejs
103
+
104
+ ```JS
105
+ // https://vitejs.dev/config/
106
+ export default defineConfig({
107
+ plugins: [..., themePlugin()],
108
+ })
109
+ ```
110
+
111
+ 3. Include `box-theme.generated.css` in your root file
112
+
113
+ ```JS
114
+ import './box-theme.generated.css';
115
+ ```
116
+
117
+ ## Theme for components
118
+
119
+ In the project root file (main.tsx) use `Theme.setup`
120
+
121
+ ```JS
122
+ import Theme from '@cronocode/react-box/theme';
72
123
 
124
+ Theme.setup({
125
+ button: {
126
+ styles: {
127
+ px: 4
128
+ },
129
+ themes: {
130
+ mytheme: {
131
+ px: 8
132
+ }
133
+ }
134
+ },
135
+ ...
136
+ })
73
137
  ```
138
+
139
+ All styles will be applied to Button component
140
+
141
+ ```JS
142
+ import Button from '@cronocode/react-box/components/button';
143
+
144
+ function MyComponent() {
145
+ return <Button>Click me</Button>
146
+ }
147
+ ```
148
+
149
+ or is possible to use Button with specific theme
150
+
151
+ ```JS
152
+ import Button from '@cronocode/react-box/components/button';
153
+
154
+ function MyComponent() {
155
+ return <Button theme="mytheme">Click me</Button>
156
+ }
157
+ ```
158
+
159
+ ## Theme variables
160
+
161
+ In CSS file is possible to override default values for:
162
+
163
+ ```CSS
74
164
  --borderColor: black;
75
165
  --outlineColor: black;
76
166
  --lineHeight: 1.2;
package/box.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";const s=require("react"),u=require("./core.cjs");function g(t,a){const{tag:n="div",children:o,props:f,className:d,style:c,disabled:r}=t,y=u.useStyles(t,n==="svg"),m=s.useMemo(()=>u.classNames(y,d).join(" "),[t]),e={...f,className:m,disabled:Array.isArray(r)?r[0]:r};c&&(e.style=c),a&&(e.ref=a);const[v,l]=s.useState(!1),i=typeof o=="function";return i&&(e.onMouseEnter=()=>l(!0),e.onMouseLeave=()=>l(!1)),s.createElement(n,e,i?o({isHover:v}):o)}const N=s.forwardRef(g);module.exports=N;
1
+ "use strict";const s=require("react"),u=require("./core.cjs");function g(t,r){const{tag:n="div",children:o,props:f,className:d,style:c,disabled:a}=t,y=u.useStyles(t,n==="svg"),m=s.useMemo(()=>u.classNames(y,d).join(" "),[t]),e={...f,className:m,disabled:Array.isArray(a)?a[0]:a};c&&(e.style=c),r&&(e.ref=r);const[v,l]=s.useState(!1),i=typeof o=="function";return i&&(e.onMouseEnter=()=>l(!0),e.onMouseLeave=()=>l(!1)),s.createElement(n,e,i?o({isHover:v}):o)}const N=s.forwardRef(g);module.exports=N;
package/box.mjs CHANGED
@@ -1,12 +1,12 @@
1
1
  import y, { forwardRef as v, useMemo as g, useState as p } from "react";
2
2
  import { u as N, c as x } from "./core.mjs";
3
3
  function H(s, o) {
4
- const { tag: r = "div", children: t, props: i, className: u, style: n, disabled: a } = s, f = N(s, r === "svg"), m = g(() => x(f, u).join(" "), [s]), e = { ...i, className: m, disabled: Array.isArray(a) ? a[0] : a };
4
+ const { tag: r = "div", children: t, props: i, className: f, style: n, disabled: a } = s, u = N(s, r === "svg"), m = g(() => x(u, f).join(" "), [s]), e = { ...i, className: m, disabled: Array.isArray(a) ? a[0] : a };
5
5
  n && (e.style = n), o && (e.ref = o);
6
6
  const [d, l] = p(!1), c = typeof t == "function";
7
7
  return c && (e.onMouseEnter = () => l(!0), e.onMouseLeave = () => l(!1)), y.createElement(r, e, c ? t({ isHover: d }) : t);
8
8
  }
9
- const $ = v(H);
9
+ const b = v(H);
10
10
  export {
11
- $ as default
11
+ b as default
12
12
  };
@@ -1 +1 @@
1
- "use strict";const g=require("react/jsx-runtime"),p=require("react"),u=require("../box.cjs");function c(r,e){const{viewBox:s="0 0 24 24",width:t="1.5rem",height:o,props:n,...i}=r;return g.jsx(u,{tag:"svg",ref:e,props:{...n,viewBox:s,width:t,height:o,xmlns:"http://www.w3.org/2000/svg",fill:"none"},...i})}const w=p.forwardRef(c);module.exports=w;
1
+ "use strict";const c=require("react/jsx-runtime"),g=require("react"),p=require("../box.cjs");function u(s,e){const{viewBox:r="0 0 24 24",width:t="1.5rem",height:o,props:n,...i}=s;return c.jsx(p,{tag:"svg",ref:e,props:{...n,viewBox:r,width:t,height:o,xmlns:"http://www.w3.org/2000/svg",fill:"none"},...i})}const w=g.forwardRef(u);module.exports=w;
@@ -1 +1 @@
1
- "use strict";const n=require("react/jsx-runtime"),r=require("react"),s=require("../box.cjs"),u=require("../utils.cjs"),c=["type","onClick"];function i(t,o){const e=u.ObjectUtils.buildProps(t,c);return n.jsx(s,{ref:o,tag:"button",component:"button",...e})}const b=r.forwardRef(i);module.exports=b;
1
+ "use strict";const e=require("react/jsx-runtime"),r=require("react"),s=require("../box.cjs"),u=require("../utils.cjs"),c=["type","onClick"];function i(t,o){const n=u.ObjectUtils.buildProps(t,c);return e.jsx(s,{ref:o,tag:"button",component:"button",...n})}const b=r.forwardRef(i);module.exports=b;
@@ -11,5 +11,5 @@ interface Props extends Omit<BoxProps, 'props'> {
11
11
  type?: ButtonType;
12
12
  onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
13
13
  }
14
- declare const _default: import('react').ForwardRefExoticComponent<Omit<Props, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
14
+ declare const _default: import('react').ForwardRefExoticComponent<Props & import('react').RefAttributes<HTMLButtonElement>>;
15
15
  export default _default;
@@ -1 +1 @@
1
- "use strict";const u=require("react/jsx-runtime"),t=require("react"),s=require("../box.cjs"),i=require("../utils.cjs"),a=["name","onInput","onChange","autoFocus","readOnly","required","value","checked","defaultChecked"];function d(n,c){const{indeterminate:r}=n,o=i.ObjectUtils.buildProps(n,a,{type:"checkbox"}),e=t.useRef(null);return t.useImperativeHandle(c,()=>e.current),t.useEffect(()=>{e.current&&(e.current.indeterminate=!!r)},[e,r]),u.jsx(s,{tag:"input",ref:e,component:"checkbox",...o})}const f=t.forwardRef(d);module.exports=f;
1
+ "use strict";const u=require("react/jsx-runtime"),t=require("react"),s=require("../box.cjs"),i=require("../utils.cjs"),a=["name","onInput","onChange","autoFocus","readOnly","required","value","checked","defaultChecked"];function d(n,r){const{indeterminate:c}=n,o=i.ObjectUtils.buildProps(n,a,{type:"checkbox"}),e=t.useRef(null);return t.useImperativeHandle(r,()=>e.current),t.useEffect(()=>{e.current&&(e.current.indeterminate=!!c)},[e,c]),u.jsx(s,{tag:"input",ref:e,component:"checkbox",...o})}const f=t.forwardRef(d);module.exports=f;
@@ -18,5 +18,5 @@ interface Props extends CheckboxProps {
18
18
  defaultChecked?: boolean;
19
19
  indeterminate?: boolean;
20
20
  }
21
- declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLInputElement>>;
21
+ declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLInputElement>>;
22
22
  export default _default;
@@ -1 +1 @@
1
- "use strict";const i=require("react/jsx-runtime"),t=require("react"),o=require("../box.cjs");function u(e,r){const{inline:n,...s}=e;return i.jsx(o,{ref:r,display:n?"inline-flex":"flex",...s})}const x=t.forwardRef(u);module.exports=x;
1
+ "use strict";const t=require("react/jsx-runtime"),i=require("react"),o=require("../box.cjs");function c(e,r){const{inline:n,...s}=e;return t.jsx(o,{ref:r,display:n?"inline-flex":"flex",...s})}const x=i.forwardRef(c);module.exports=x;
@@ -1 +1 @@
1
- "use strict";const m=require("react/jsx-runtime"),o=require("react"),f=require("../box.cjs"),l=require("../utils.cjs");function a(r){const{onSubmit:s,props:n}=r,t=o.useRef(null),u=o.useCallback(e=>{e.preventDefault();const c=l.FormUtils.getFormEntries(t.current);s(c,e)},[]),i={...n,onSubmit:u,ref:t};return m.jsx(f,{tag:"form",...r,props:i})}module.exports=a;
1
+ "use strict";const m=require("react/jsx-runtime"),o=require("react"),a=require("../box.cjs"),f=require("../utils.cjs");function l(t){const{onSubmit:s,props:n}=t,r=o.useRef(null),u=o.useCallback(e=>{e.preventDefault();const i=f.FormUtils.getFormEntries(r.current);s(i,e)},[]),c={...n,onSubmit:u,ref:r};return m.jsx(a,{tag:"form",...t,props:c})}module.exports=l;
@@ -1 +1 @@
1
- "use strict";const s=require("react/jsx-runtime"),t=require("react"),o=require("../box.cjs");function u(r,e){const{inline:i,...n}=r;return s.jsx(o,{ref:e,display:i?"inline-grid":"grid",...n})}const c=t.forwardRef(u);module.exports=c;
1
+ "use strict";const s=require("react/jsx-runtime"),t=require("react"),o=require("../box.cjs");function c(r,e){const{inline:i,...n}=r;return s.jsx(o,{ref:e,display:i?"inline-grid":"grid",...n})}const u=t.forwardRef(c);module.exports=u;
@@ -1 +1 @@
1
- "use strict";const r=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs"),s=require("../utils.cjs"),i=["name","onInput","onChange","value","autoFocus","readOnly","required","checked","defaultChecked"];function c(e,t){const o=s.ObjectUtils.buildProps(e,i,{type:"radio"});return r.jsx(u,{ref:t,tag:"input",component:"radioButton",...o})}const a=n.forwardRef(c);module.exports=a;
1
+ "use strict";const n=require("react/jsx-runtime"),r=require("react"),u=require("../box.cjs"),s=require("../utils.cjs"),c=["name","onInput","onChange","value","autoFocus","readOnly","required","checked","defaultChecked"];function i(t,e){const o=s.ObjectUtils.buildProps(t,c,{type:"radio"});return n.jsx(u,{ref:e,tag:"input",component:"radioButton",...o})}const a=r.forwardRef(i);module.exports=a;
@@ -18,5 +18,5 @@ interface Props extends Omit<BoxProps, 'props'> {
18
18
  checked?: boolean;
19
19
  defaultChecked?: boolean;
20
20
  }
21
- declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLInputElement>>;
21
+ declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLInputElement>>;
22
22
  export default _default;
@@ -22,5 +22,5 @@ interface Props extends Omit<BoxProps, 'props'> {
22
22
  readOnly?: boolean;
23
23
  required?: boolean;
24
24
  }
25
- declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
25
+ declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLTextAreaElement>>;
26
26
  export default _default;
@@ -1 +1 @@
1
- "use strict";const r=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs"),s=require("../utils.cjs"),c=["name","onInput","onChange","type","placeholder","defaultValue","autoFocus","readOnly","required","value","pattern"];function i(e,t){const o=s.ObjectUtils.buildProps(e,c);return r.jsx(u,{ref:t,tag:"input",component:"textbox",...o})}const a=n.forwardRef(i);module.exports=a;
1
+ "use strict";const n=require("react/jsx-runtime"),r=require("react"),s=require("../box.cjs"),u=require("../utils.cjs"),c=["name","onInput","onChange","type","placeholder","defaultValue","autoFocus","readOnly","required","value","pattern"];function a(e,t){const o=u.ObjectUtils.buildProps(e,c);return n.jsx(s,{ref:t,tag:"input",component:"textbox",...o})}const i=r.forwardRef(a);module.exports=i;
@@ -22,5 +22,5 @@ interface Props extends Omit<BoxProps, 'props'> {
22
22
  required?: boolean;
23
23
  step?: number | string;
24
24
  }
25
- declare const _default: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLInputElement>>;
25
+ declare const _default: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLInputElement>>;
26
26
  export default _default;
@@ -1 +1 @@
1
- "use strict";const l=require("react/jsx-runtime"),h=require("react-dom"),f=require("../box.cjs"),s=require("react");function v(){return s.useMemo(()=>{const i="crono-box";let r=document.getElementById(i);return r||(r=document.createElement("div"),r.id=i,document.body.appendChild(r)),r},[])}const a=2;function x(i){const{onPositionChange:r}=i,u=s.useRef(null),[e,p]=s.useState(),m=v(),w=s.useCallback((o,t)=>{const n=c=>{c.target.contains(o)&&t(o)};return document.addEventListener("scroll",n,{capture:!0}),()=>{document.removeEventListener("scroll",n,{capture:!0})}},[e]),b=s.useCallback((o,t)=>{const n=c=>{t(o)};return window.addEventListener("resize",n,{capture:!0}),()=>{window.removeEventListener("resize",n,{capture:!0})}},[e]),d=s.useCallback(o=>{const t=o.getBoundingClientRect(),n=Math.round((t.top+window.scrollY)*a)/a,c=Math.round((t.left+window.scrollX)*a)/a;((e==null?void 0:e.top)!==n||(e==null?void 0:e.left)!==c)&&(r==null||r({top:n,left:c}),p({top:n,left:c,width:t.width>0?t.width:void 0}))},[e]);return s.useLayoutEffect(()=>{if(u.current){d(u.current);const o=w(u.current,d),t=b(u.current,d);return()=>{o(),t()}}},[e]),l.jsxs(l.Fragment,{children:[l.jsx(f,{ref:u}),e&&h.createPortal(l.jsx(f,{position:"absolute",top:0,left:0,transition:"none",style:{transform:`translate(${e.left}px,${e.top}px)`,width:e.width},children:l.jsx(f,{position:"absolute",width:"fit",...i})}),m)]})}module.exports=x;
1
+ "use strict";const u=require("react/jsx-runtime"),h=require("react-dom"),f=require("../box.cjs"),s=require("react");function v(){return s.useMemo(()=>{const i="crono-box";let r=document.getElementById(i);return r||(r=document.createElement("div"),r.id=i,document.body.appendChild(r)),r},[])}const a=2;function x(i){const{onPositionChange:r}=i,l=s.useRef(null),[e,p]=s.useState(),m=v(),w=s.useCallback((o,t)=>{const n=c=>{c.target.contains(o)&&t(o)};return document.addEventListener("scroll",n,{capture:!0}),()=>{document.removeEventListener("scroll",n,{capture:!0})}},[e]),b=s.useCallback((o,t)=>{const n=c=>{t(o)};return window.addEventListener("resize",n,{capture:!0}),()=>{window.removeEventListener("resize",n,{capture:!0})}},[e]),d=s.useCallback(o=>{const t=o.getBoundingClientRect(),n=Math.round((t.top+window.scrollY)*a)/a,c=Math.round((t.left+window.scrollX)*a)/a;((e==null?void 0:e.top)!==n||(e==null?void 0:e.left)!==c)&&(r==null||r({top:n,left:c}),p({top:n,left:c,width:t.width>0?t.width:void 0}))},[e]);return s.useLayoutEffect(()=>{if(l.current){d(l.current);const o=w(l.current,d),t=b(l.current,d);return()=>{o(),t()}}},[e]),u.jsxs(u.Fragment,{children:[u.jsx(f,{ref:l}),e&&h.createPortal(u.jsx(f,{position:"absolute",top:0,left:0,transition:"none",style:{transform:`translate(${e.left}px,${e.top}px)`,width:e.width},children:u.jsx(f,{position:"absolute",width:"fit",...i})}),m)]})}module.exports=x;
@@ -20,7 +20,7 @@ export interface StyleItem {
20
20
  breakpoint?: BoxBreakpointsType;
21
21
  isThemeStyle?: boolean;
22
22
  }
23
- declare const simpleBoxStyles: {
23
+ export declare const simpleBoxStyles: {
24
24
  /** The `display` CSS property sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex. */
25
25
  display: {
26
26
  cssNames: string[];
@@ -1226,4 +1226,3 @@ export declare const boxBreakpointsMinWidth: Record<BoxBreakpointsType, number>;
1226
1226
  export declare let boxStyles: Record<string, StyleItem>;
1227
1227
  export declare function rebuildBoxStyles(): void;
1228
1228
  export declare function addCustomPseudoClassProps(suffix: PseudoClassSuffix, customName: string, parentKey: string): string[];
1229
- export {};
package/core/theme.cjs ADDED
@@ -0,0 +1 @@
1
+ "use strict";const e=require("../core.cjs");module.exports=e.Theme;
package/core/theme.mjs ADDED
@@ -0,0 +1,4 @@
1
+ import { T as f } from "../core.mjs";
2
+ export {
3
+ f as default
4
+ };
package/core/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { ThemeComponentProps } from './useTheme';
2
- import { StyleItem, boxStyles } from './boxStyles';
2
+ import { StyleItem, simpleBoxStyles } from './boxStyles';
3
3
 
4
4
  export type ExtractElementType<T> = T extends React.DetailedHTMLProps<React.HTMLAttributes<infer E>, infer E> ? E : T extends React.SVGProps<infer E> ? E : never;
5
5
  export type ExtractElementFromTag<T extends keyof React.JSX.IntrinsicElements> = ExtractElementType<React.JSX.IntrinsicElements[T]>;
@@ -12,7 +12,7 @@ export declare namespace Augmented {
12
12
  type BoxStyles<T extends Record<string, StyleItem>> = {
13
13
  [K in keyof T]?: T[K]['values1']['values'][number] | T[K]['values2']['values'][number] | T[K]['values3']['values'][number];
14
14
  };
15
- type BoxNormalStyles = BoxStyles<typeof boxStyles> & Augmented.BoxProps;
15
+ type BoxNormalStyles = BoxStyles<typeof simpleBoxStyles> & Augmented.BoxProps;
16
16
  interface BoxPseudoClasses {
17
17
  disabled?: boolean | [boolean, BoxNormalStyles];
18
18
  disabledGroup?: string | Record<string, BoxNormalStyles>;
package/core.cjs CHANGED
@@ -1,10 +1,10 @@
1
- "use strict";const G=require("react"),Y=require("./utils.cjs");var e;(a=>{(u=>{function t(o,m){return`${o}${m.replace("/","-")}`}u.fraction=t;function n(o){return[`${o} path`,`${o} circle`,`${o} rect`,`${o} line`]}u.svg=n})(a.ClassName||(a.ClassName={})),(u=>{function t(l,s){return`${s/4}rem`}u.rem=t;function n(l,s){return`${s}px`}u.px=n;function o(l,s){const[r,i]=s.split("/");return`${+r/+i*100}%`}u.fraction=o;function m(l,s){switch(s){case"fit":return"100%";case"fit-screen":return l.toLocaleLowerCase().includes("height")?"100vh":"100vw";default:return s}}u.widthHeight=m;function N(l){return(s,r)=>`var(--${l}${r});`}u.variables=N;function T(l){return(s,r)=>`var(--${l}${r});`}u.svgVariables=T;function S(l,s){return`repeat(${s},minmax(0,1fr))`}u.gridColumns=S;function c(l,s){return s==="full-row"?"1/-1":`span ${s}/span ${s}`}u.gridColumn=c;function f(l,s){return`${s}ms`}u.ms=f;function b(l,s){return`${s}deg`}u.rotate=b;function d(l,s){return s==="xAxis"?"-1 1":"1 -1"}u.flip=d})(a.Value||(a.Value={}))})(e||(e={}));const v=[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,22,24,26,28,30,32,34,36,38,40,42,44,46,48,50,52,54,56,58,60,64,68,72,76,80,84,88,92,96,100,120,140,160,180,200,250,300],ae=[-1,-2,-3,-4,-5,-6,-7,-8,-9,-10,-11,-12,-13,-14,-15,-16,-17,-18,-19,-20,-22,-24,-26,-28,-30,-32,-34,-36,-38,-40,-44,-48,-52,-56,-60,-64,-68,-72,-76,-80,-84,-88,-92,-96,-100],h=[...v,...ae],W=["solid","dashed","dotted","double","groove","ridge","inset","outset","none","hidden"],P=["auto","hidden","scroll","visible"],z=["1/2","1/3","2/3","1/4","2/4","3/4","1/5","2/5","3/5","4/5","1/6","2/6","3/6","4/6","5/6","1/12","2/12","3/12","4/12","5/12","6/12","7/12","8/12","9/12","10/12","11/12"],I=["fit","fit-screen","auto","fit-content","max-content","min-content"],K=["auto","flex-start","flex-end","center","baseline","stretch"],le={display:{cssNames:["display"],values1:{values:["none","block","inline-block","flex","inline-flex","grid","inline-grid","contents"]},values2:{values:[]},values3:{values:[]}},inline:{cssNames:["display"],values1:{values:[!0],formatValue:()=>"inline-block"},values2:{values:[]},values3:{values:[]}},boxSizing:{cssNames:["box-sizing"],values1:{values:["border-box","content-box"]},values2:{values:[]},values3:{values:[]}},width:{cssNames:["width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},minWidth:{cssNames:["min-width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},maxWidth:{cssNames:["max-width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},height:{cssNames:["height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},minHeight:{cssNames:["min-height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},maxHeight:{cssNames:["max-height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},position:{cssNames:["position"],values1:{values:["static","relative","absolute","fixed","sticky"]},values2:{values:[]},values3:{values:[]}},top:{cssNames:["top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},right:{cssNames:["right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},bottom:{cssNames:["bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},left:{cssNames:["left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},inset:{cssNames:["inset"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},m:{cssNames:["margin"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mx:{cssNames:["margin-inline"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},my:{cssNames:["margin-block"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mt:{cssNames:["margin-top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mr:{cssNames:["margin-right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mb:{cssNames:["margin-bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},ml:{cssNames:["margin-left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},p:{cssNames:["padding"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},px:{cssNames:["padding-inline"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},py:{cssNames:["padding-block"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pt:{cssNames:["padding-top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pr:{cssNames:["padding-right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pb:{cssNames:["padding-bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pl:{cssNames:["padding-left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},b:{cssNames:["border-width"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bx:{cssNames:["border-inline-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},by:{cssNames:["border-block-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bt:{cssNames:["border-top-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},br:{cssNames:["border-right-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bb:{cssNames:["border-bottom-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bl:{cssNames:["border-left-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderStyle:{cssNames:["border-style"],values1:{values:W},values2:{values:[]},values3:{values:[]}},borderRadius:{cssNames:["border-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTop:{cssNames:["border-top-left-radius","border-top-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusRight:{cssNames:["border-top-right-radius","border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottom:{cssNames:["border-bottom-left-radius","border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusLeft:{cssNames:["border-top-left-radius","border-bottom-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopLeft:{cssNames:["border-top-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopRight:{cssNames:["border-top-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomLeft:{cssNames:["border-bottom-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomRight:{cssNames:["border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},cursor:{cssNames:["cursor"],values1:{values:["auto","default","none","context-menu","help","pointer","progress","wait","cell","crosshair","text","vertical-text","alias","copy","move","no-drop","not-allowed","e-resize","n-resize","ne-resize","nw-resize","s-resize","se-resize","sw-resize","w-resize","ew-resize","ns-resize","nesw-resize","nwse-resize","col-resize","row-resize","all-scroll","zoom-in","zoom-out","grab","grabbing"]},values2:{values:[]},values3:{values:[]}},zIndex:{cssNames:["z-index"],values1:{values:[1,2,3,4,5,10,11,12,13,14,15,100,101,102,103,104,105,1e3,1001,1002,1003,1004,1005]},values2:{values:[]},values3:{values:[]}},overflow:{cssNames:["overflow"],values1:{values:P},values2:{values:[]},values3:{values:[]}},overflowX:{cssNames:["overflow-x"],values1:{values:P},values2:{values:[]},values3:{values:[]}},overflowY:{cssNames:["overflow-y"],values1:{values:P},values2:{values:[]},values3:{values:[]}},opacity:{cssNames:["opacity"],values1:{values:[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1]},values2:{values:[]},values3:{values:[]}},fontSize:{cssNames:["font-size"],values1:{values:v,formatValue:e.Value.px},values2:{values:["inherit"]},values3:{values:[]}},fontStyle:{cssNames:["font-style"],values1:{values:["italic","normal","oblique"]},values2:{values:[]},values3:{values:[]}},fontWeight:{cssNames:["font-weight"],values1:{values:[100,200,300,400,500,600,700,800,900]},values2:{values:[]},values3:{values:[]}},letterSpacing:{cssNames:["letter-spacing"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},lineHeight:{cssNames:["line-height"],values1:{values:v,formatValue:e.Value.px},values2:{values:["font-size"],formatValue:()=>"1"},values3:{values:[]}},textDecoration:{cssNames:["text-decoration"],values1:{values:["none","underline","overline","line-through"]},values2:{values:[]},values3:{values:[]}},textTransform:{cssNames:["text-transform"],values1:{values:["none","capitalize","lowercase","uppercase"]},values2:{values:[]},values3:{values:[]}},textAlign:{cssNames:["text-align"],values1:{values:["left","right","center","justify"]},values2:{values:[]},values3:{values:[]}},flexWrap:{cssNames:["flex-wrap"],values1:{values:["nowrap","wrap","wrap-reverse"]},values2:{values:[]},values3:{values:[]}},jc:{cssNames:["justify-content"],values1:{values:["start","end","flex-start","flex-end","center","left","right","space-between","space-around","space-evenly","stretch"]},values2:{values:[]},values3:{values:[]}},ai:{cssNames:["align-items"],values1:{values:["stretch","flex-start","flex-end","center","baseline","start","end","self-start","self-end"]},values2:{values:[]},values3:{values:[]}},alignContent:{cssNames:["align-content"],values1:{values:["flex-start","flex-end","center","space-between","space-around","space-evenly","stretch","start","end","baseline"]},values2:{values:[]},values3:{values:[]}},flex1:{cssNames:["flex"],values1:{values:[!0],formatValue:()=>"1"},values2:{values:[]},values3:{values:[]}},d:{cssNames:["flex-direction"],values1:{values:["row","row-reverse","column","column-reverse"]},values2:{values:[]},values3:{values:[]}},gap:{cssNames:["gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},rowGap:{cssNames:["row-gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},columnGap:{cssNames:["column-gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},order:{cssNames:["order"],values1:{values:v},values2:{values:[]},values3:{values:[]}},flexGrow:{cssNames:["flex-grow"],values1:{values:v},values2:{values:[]},values3:{values:[]}},flexShrink:{cssNames:["flex-shrink"],values1:{values:v},values2:{values:[]},values3:{values:[]}},alignSelf:{cssNames:["align-self"],values1:{values:K},values2:{values:[]},values3:{values:[]}},justifySelf:{cssNames:["justify-self"],values1:{values:K},values2:{values:[]},values3:{values:[]}},gridColumns:{cssNames:["grid-template-columns"],values1:{values:v,formatValue:e.Value.gridColumns},values2:{values:[]},values3:{values:[]}},colSpan:{cssNames:["grid-column"],values1:{values:v,formatValue:e.Value.gridColumn},values2:{values:["full-row"],formatValue:e.Value.gridColumn},values3:{values:[]}},colStart:{cssNames:["grid-column-start"],values1:{values:v},values2:{values:[]},values3:{values:[]}},colEnd:{cssNames:["grid-column-end"],values1:{values:v},values2:{values:[]},values3:{values:[]}},outline:{cssNames:["outline-width"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},outlineStyle:{cssNames:["outline-style"],values1:{values:W},values2:{values:[]},values3:{values:[]}},outlineOffset:{cssNames:["outline-offset"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},transition:{cssNames:["transition-property"],values1:{values:["none","all"]},values2:{values:[]},values3:{values:[]}},transitionDuration:{cssNames:["transition-duration"],values1:{values:[50,100,150,200,250,300,350,400,450,500,550,600,650,700,750,800,850,900,950,1e3],formatValue:e.Value.ms},values2:{values:[]},values3:{values:[]}},userSelect:{cssNames:["user-select"],values1:{values:["none","auto","text","all"]},values2:{values:[]},values3:{values:[]}},appearance:{cssNames:["appearance"],values1:{values:["none"]},values2:{values:[]},values3:{values:[]}},pointerEvents:{cssNames:["pointer-events"],values1:{values:["none","auto","all"]},values2:{values:[]},values3:{values:[]}},whiteSpace:{cssNames:["white-space"],values1:{values:["break-spaces","normal","nowrap","pre","pre-line","pre-wrap"]},values2:{values:[]},values3:{values:[]}},textOverflow:{cssNames:["text-overflow"],values1:{values:["clip","ellipsis"]},values2:{values:[]},values3:{values:[]}},rotate:{cssNames:["rotate"],values1:{values:[0,90,180,270,-90,-180,-270],formatValue:e.Value.rotate},values2:{values:[]},values3:{values:[]}},flip:{cssNames:["scale"],values1:{values:["xAxis","yAxis"],formatValue:e.Value.flip},values2:{values:[]},values3:{values:[]}}},M={shadow:{cssNames:["box-shadow"],formatValue:e.Value.variables("shadow")},background:{cssNames:["background"],formatValue:e.Value.variables("background")},backgroundImage:{cssNames:["background-image"],formatValue:e.Value.variables("backgroundImage")},color:{cssNames:["color"],formatValue:e.Value.variables("color")},bgColor:{cssNames:["background-color"],formatValue:e.Value.variables("color")},borderColor:{cssNames:["border-color"],formatValue:e.Value.variables("color")},outlineColor:{cssNames:["outline-color"],formatValue:e.Value.variables("color")}},U={fill:{cssNames:["fill"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg},stroke:{cssNames:["stroke"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg}},q=["Hover","Focus","Active","Checked","Indeterminate","Valid","Invalid","Required","Optional","Disabled"],A=["sm","md","lg","xl","xxl"],ue={sm:640,md:768,lg:1024,xl:1280,xxl:1536};function J(){const a={...le};Object.keys(M).forEach(t=>{a[t]=M[t],a[t].isThemeStyle=!0}),Object.keys(U).forEach(t=>{a[t]=U[t],a[t].isThemeStyle=!0});let u=Object.keys(a);return q.forEach(t=>{u.forEach(n=>{a[`${n}${t}`]={...a[n],pseudoSuffix:t}})}),u=Object.keys(a),A.forEach(t=>{u.forEach(n=>{a[`${t}${n}`]={...a[n],breakpoint:t}})}),a}let C=J();function te(){C=J()}function oe(a,u,t){const n=Object.entries(C).filter(([o,m])=>m.pseudoSuffix===a&&!m.customPseudoSuffix&&!(`${o}${u}`in C)).map(([o])=>o);return n.forEach(o=>{C[`${o}${u}`]={...C[o],customPseudoSuffix:t+u}}),n.map(o=>`${o}${u}`)}class re{constructor(){this._index=0,this._cache={}}getIdentity(u){return this._cache[u]||(this._cache[u]=this.getByIndex(this._index++)),this._cache[u]}getByIndex(u){const{first:t,next:n}=ne,o=u-t.length;if(o<0)return t[u];const m=Math.floor(o/n.length),N=o-m*n.length;return this.getByIndex(m)+n[N]}}const ne={first:"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",next:"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"};var D;(a=>{a.boxClassName="_box",a.svgClassName="_svg",a.cronoStylesElementId="crono-styles";const u=`:root{--borderColor: black;--outlineColor: black;--lineHeight: 1.2;--fontSize: 14px;--transitionTime: 0.25s;--svgTransitionTime: 0.3s;#crono-box {position: absolute;top: 0;left: 0;height: 0;}}
1
+ "use strict";const G=require("react"),Y=require("./utils.cjs");var e;(a=>{(u=>{function t(o,m){return`${o}${m.replace("/","-")}`}u.fraction=t;function n(o){return[`${o} path`,`${o} circle`,`${o} rect`,`${o} line`]}u.svg=n})(a.ClassName||(a.ClassName={})),(u=>{function t(l,s){return`${s/4}rem`}u.rem=t;function n(l,s){return`${s}px`}u.px=n;function o(l,s){const[r,i]=s.split("/");return`${+r/+i*100}%`}u.fraction=o;function m(l,s){switch(s){case"fit":return"100%";case"fit-screen":return l.toLocaleLowerCase().includes("height")?"100vh":"100vw";default:return s}}u.widthHeight=m;function N(l){return(s,r)=>`var(--${l}${r});`}u.variables=N;function T(l){return(s,r)=>`var(--${l}${r});`}u.svgVariables=T;function S(l,s){return`repeat(${s},minmax(0,1fr))`}u.gridColumns=S;function c(l,s){return s==="full-row"?"1/-1":`span ${s}/span ${s}`}u.gridColumn=c;function f(l,s){return`${s}ms`}u.ms=f;function b(l,s){return`${s}deg`}u.rotate=b;function d(l,s){return s==="xAxis"?"-1 1":"1 -1"}u.flip=d})(a.Value||(a.Value={}))})(e||(e={}));const v=[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,22,24,26,28,30,32,34,36,38,40,42,44,46,48,50,52,54,56,58,60,64,68,72,76,80,84,88,92,96,100,120,140,160,180,200,250,300],ae=[-1,-2,-3,-4,-5,-6,-7,-8,-9,-10,-11,-12,-13,-14,-15,-16,-17,-18,-19,-20,-22,-24,-26,-28,-30,-32,-34,-36,-38,-40,-44,-48,-52,-56,-60,-64,-68,-72,-76,-80,-84,-88,-92,-96,-100],h=[...v,...ae],W=["solid","dashed","dotted","double","groove","ridge","inset","outset","none","hidden"],P=["auto","hidden","scroll","visible"],z=["1/2","1/3","2/3","1/4","2/4","3/4","1/5","2/5","3/5","4/5","1/6","2/6","3/6","4/6","5/6","1/12","2/12","3/12","4/12","5/12","6/12","7/12","8/12","9/12","10/12","11/12"],I=["fit","fit-screen","auto","fit-content","max-content","min-content"],K=["auto","flex-start","flex-end","center","baseline","stretch"],le={display:{cssNames:["display"],values1:{values:["none","block","inline-block","flex","inline-flex","grid","inline-grid","contents"]},values2:{values:[]},values3:{values:[]}},inline:{cssNames:["display"],values1:{values:[!0],formatValue:()=>"inline-block"},values2:{values:[]},values3:{values:[]}},boxSizing:{cssNames:["box-sizing"],values1:{values:["border-box","content-box"]},values2:{values:[]},values3:{values:[]}},width:{cssNames:["width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},minWidth:{cssNames:["min-width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},maxWidth:{cssNames:["max-width"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},height:{cssNames:["height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},minHeight:{cssNames:["min-height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},maxHeight:{cssNames:["max-height"],values1:{values:I,formatValue:e.Value.widthHeight},values2:{values:v,formatValue:e.Value.rem},values3:{values:z,formatValue:e.Value.fraction}},position:{cssNames:["position"],values1:{values:["static","relative","absolute","fixed","sticky"]},values2:{values:[]},values3:{values:[]}},top:{cssNames:["top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},right:{cssNames:["right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},bottom:{cssNames:["bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},left:{cssNames:["left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},inset:{cssNames:["inset"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},m:{cssNames:["margin"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mx:{cssNames:["margin-inline"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},my:{cssNames:["margin-block"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mt:{cssNames:["margin-top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mr:{cssNames:["margin-right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},mb:{cssNames:["margin-bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},ml:{cssNames:["margin-left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},p:{cssNames:["padding"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},px:{cssNames:["padding-inline"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},py:{cssNames:["padding-block"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pt:{cssNames:["padding-top"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pr:{cssNames:["padding-right"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pb:{cssNames:["padding-bottom"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},pl:{cssNames:["padding-left"],values1:{values:h,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},b:{cssNames:["border-width"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bx:{cssNames:["border-inline-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},by:{cssNames:["border-block-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bt:{cssNames:["border-top-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},br:{cssNames:["border-right-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bb:{cssNames:["border-bottom-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},bl:{cssNames:["border-left-width"],values1:{values:h,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderStyle:{cssNames:["border-style"],values1:{values:W},values2:{values:[]},values3:{values:[]}},borderRadius:{cssNames:["border-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTop:{cssNames:["border-top-left-radius","border-top-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusRight:{cssNames:["border-top-right-radius","border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottom:{cssNames:["border-bottom-left-radius","border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusLeft:{cssNames:["border-top-left-radius","border-bottom-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopLeft:{cssNames:["border-top-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopRight:{cssNames:["border-top-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomLeft:{cssNames:["border-bottom-left-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomRight:{cssNames:["border-bottom-right-radius"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},cursor:{cssNames:["cursor"],values1:{values:["auto","default","none","context-menu","help","pointer","progress","wait","cell","crosshair","text","vertical-text","alias","copy","move","no-drop","not-allowed","e-resize","n-resize","ne-resize","nw-resize","s-resize","se-resize","sw-resize","w-resize","ew-resize","ns-resize","nesw-resize","nwse-resize","col-resize","row-resize","all-scroll","zoom-in","zoom-out","grab","grabbing"]},values2:{values:[]},values3:{values:[]}},zIndex:{cssNames:["z-index"],values1:{values:[1,2,3,4,5,10,11,12,13,14,15,100,101,102,103,104,105,1e3,1001,1002,1003,1004,1005]},values2:{values:[]},values3:{values:[]}},overflow:{cssNames:["overflow"],values1:{values:P},values2:{values:[]},values3:{values:[]}},overflowX:{cssNames:["overflow-x"],values1:{values:P},values2:{values:[]},values3:{values:[]}},overflowY:{cssNames:["overflow-y"],values1:{values:P},values2:{values:[]},values3:{values:[]}},opacity:{cssNames:["opacity"],values1:{values:[0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1]},values2:{values:[]},values3:{values:[]}},fontSize:{cssNames:["font-size"],values1:{values:v,formatValue:e.Value.px},values2:{values:["inherit"]},values3:{values:[]}},fontStyle:{cssNames:["font-style"],values1:{values:["italic","normal","oblique"]},values2:{values:[]},values3:{values:[]}},fontWeight:{cssNames:["font-weight"],values1:{values:[100,200,300,400,500,600,700,800,900]},values2:{values:[]},values3:{values:[]}},letterSpacing:{cssNames:["letter-spacing"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},lineHeight:{cssNames:["line-height"],values1:{values:v,formatValue:e.Value.px},values2:{values:["font-size"],formatValue:()=>"1"},values3:{values:[]}},textDecoration:{cssNames:["text-decoration"],values1:{values:["none","underline","overline","line-through"]},values2:{values:[]},values3:{values:[]}},textTransform:{cssNames:["text-transform"],values1:{values:["none","capitalize","lowercase","uppercase"]},values2:{values:[]},values3:{values:[]}},textAlign:{cssNames:["text-align"],values1:{values:["left","right","center","justify"]},values2:{values:[]},values3:{values:[]}},flexWrap:{cssNames:["flex-wrap"],values1:{values:["nowrap","wrap","wrap-reverse"]},values2:{values:[]},values3:{values:[]}},jc:{cssNames:["justify-content"],values1:{values:["start","end","flex-start","flex-end","center","left","right","space-between","space-around","space-evenly","stretch"]},values2:{values:[]},values3:{values:[]}},ai:{cssNames:["align-items"],values1:{values:["stretch","flex-start","flex-end","center","baseline","start","end","self-start","self-end"]},values2:{values:[]},values3:{values:[]}},alignContent:{cssNames:["align-content"],values1:{values:["flex-start","flex-end","center","space-between","space-around","space-evenly","stretch","start","end","baseline"]},values2:{values:[]},values3:{values:[]}},flex1:{cssNames:["flex"],values1:{values:[!0],formatValue:()=>"1"},values2:{values:[]},values3:{values:[]}},d:{cssNames:["flex-direction"],values1:{values:["row","row-reverse","column","column-reverse"]},values2:{values:[]},values3:{values:[]}},gap:{cssNames:["gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},rowGap:{cssNames:["row-gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},columnGap:{cssNames:["column-gap"],values1:{values:v,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},order:{cssNames:["order"],values1:{values:v},values2:{values:[]},values3:{values:[]}},flexGrow:{cssNames:["flex-grow"],values1:{values:v},values2:{values:[]},values3:{values:[]}},flexShrink:{cssNames:["flex-shrink"],values1:{values:v},values2:{values:[]},values3:{values:[]}},alignSelf:{cssNames:["align-self"],values1:{values:K},values2:{values:[]},values3:{values:[]}},justifySelf:{cssNames:["justify-self"],values1:{values:K},values2:{values:[]},values3:{values:[]}},gridColumns:{cssNames:["grid-template-columns"],values1:{values:v,formatValue:e.Value.gridColumns},values2:{values:[]},values3:{values:[]}},colSpan:{cssNames:["grid-column"],values1:{values:v,formatValue:e.Value.gridColumn},values2:{values:["full-row"],formatValue:e.Value.gridColumn},values3:{values:[]}},colStart:{cssNames:["grid-column-start"],values1:{values:v},values2:{values:[]},values3:{values:[]}},colEnd:{cssNames:["grid-column-end"],values1:{values:v},values2:{values:[]},values3:{values:[]}},outline:{cssNames:["outline-width"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},outlineStyle:{cssNames:["outline-style"],values1:{values:W},values2:{values:[]},values3:{values:[]}},outlineOffset:{cssNames:["outline-offset"],values1:{values:v,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},transition:{cssNames:["transition-property"],values1:{values:["none","all"]},values2:{values:[]},values3:{values:[]}},transitionDuration:{cssNames:["transition-duration"],values1:{values:[50,100,150,200,250,300,350,400,450,500,550,600,650,700,750,800,850,900,950,1e3],formatValue:e.Value.ms},values2:{values:[]},values3:{values:[]}},userSelect:{cssNames:["user-select"],values1:{values:["none","auto","text","all"]},values2:{values:[]},values3:{values:[]}},appearance:{cssNames:["appearance"],values1:{values:["none"]},values2:{values:[]},values3:{values:[]}},pointerEvents:{cssNames:["pointer-events"],values1:{values:["none","auto","all"]},values2:{values:[]},values3:{values:[]}},whiteSpace:{cssNames:["white-space"],values1:{values:["break-spaces","normal","nowrap","pre","pre-line","pre-wrap"]},values2:{values:[]},values3:{values:[]}},textOverflow:{cssNames:["text-overflow"],values1:{values:["clip","ellipsis"]},values2:{values:[]},values3:{values:[]}},rotate:{cssNames:["rotate"],values1:{values:[0,90,180,270,-90,-180,-270],formatValue:e.Value.rotate},values2:{values:[]},values3:{values:[]}},flip:{cssNames:["scale"],values1:{values:["xAxis","yAxis"],formatValue:e.Value.flip},values2:{values:[]},values3:{values:[]}}},M={shadow:{cssNames:["box-shadow"],formatValue:e.Value.variables("shadow")},background:{cssNames:["background"],formatValue:e.Value.variables("background")},backgroundImage:{cssNames:["background-image"],formatValue:e.Value.variables("backgroundImage")},color:{cssNames:["color"],formatValue:e.Value.variables("color")},bgColor:{cssNames:["background-color"],formatValue:e.Value.variables("color")},borderColor:{cssNames:["border-color"],formatValue:e.Value.variables("color")},outlineColor:{cssNames:["outline-color"],formatValue:e.Value.variables("color")}},U={fill:{cssNames:["fill"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg},stroke:{cssNames:["stroke"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg}},D=["Hover","Focus","Active","Checked","Indeterminate","Valid","Invalid","Required","Optional","Disabled"],A=["sm","md","lg","xl","xxl"],ue={sm:640,md:768,lg:1024,xl:1280,xxl:1536};function J(){const a={...le};Object.keys(M).forEach(t=>{a[t]=M[t],a[t].isThemeStyle=!0}),Object.keys(U).forEach(t=>{a[t]=U[t],a[t].isThemeStyle=!0});let u=Object.keys(a);return D.forEach(t=>{u.forEach(n=>{a[`${n}${t}`]={...a[n],pseudoSuffix:t}})}),u=Object.keys(a),A.forEach(t=>{u.forEach(n=>{a[`${t}${n}`]={...a[n],breakpoint:t}})}),a}let C=J();function te(){C=J()}function oe(a,u,t){const n=Object.entries(C).filter(([o,m])=>m.pseudoSuffix===a&&!m.customPseudoSuffix&&!(`${o}${u}`in C)).map(([o])=>o);return n.forEach(o=>{C[`${o}${u}`]={...C[o],customPseudoSuffix:t+u}}),n.map(o=>`${o}${u}`)}class re{constructor(){this._index=0,this._cache={}}getIdentity(u){return this._cache[u]||(this._cache[u]=this.getByIndex(this._index++)),this._cache[u]}getByIndex(u){const{first:t,next:n}=ne,o=u-t.length;if(o<0)return t[u];const m=Math.floor(o/n.length),N=o-m*n.length;return this.getByIndex(m)+n[N]}}const ne={first:"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",next:"abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"};var _;(a=>{a.boxClassName="_box",a.svgClassName="_svg",a.cronoStylesElementId="crono-styles";const u=`:root{--borderColor: black;--outlineColor: black;--lineHeight: 1.2;--fontSize: 14px;--transitionTime: 0.25s;--svgTransitionTime: 0.3s;#crono-box {position: absolute;top: 0;left: 0;height: 0;}}
2
2
  html{font-size: 16px;font-family: Arial, sans-serif;}
3
3
  body{margin: 0;line-height: var(--lineHeight);font-size: var(--fontSize);}
4
4
  a,ul{all: unset;}
5
5
  .${a.boxClassName}{display: block;border: 0 solid var(--borderColor);outline: 0px solid var(--outlineColor);margin: 0;padding: 0;background-color: initial;transition: all var(--transitionTime);box-sizing: border-box;font-family: inherit;font-size: inherit;}
6
6
  .${a.svgClassName}{transition: all var(--svgTransitionTime);}.${a.svgClassName} path,.${a.svgClassName} circle,.${a.svgClassName} rect,.${a.svgClassName} line {transition: all var(--svgTransitionTime);}
7
- `,t=new re;let n=!0,o={};T();function m(l,s,r){if(l in C)return c(l,s,r);if(["disabledGroup","hoverGroup","focusGroup","activeGroup"].includes(l))return l+s}a.get=m;function N(){if(n){let l=f([u]);q.forEach(r=>{l=f(l,r)}),A.forEach(r=>{l.push(`@media(min-width: ${ue[r]}px){`),l=f(l,void 0,r),q.forEach(i=>{l=f(l,i,r)}),l.push("}")});const s=d();s.innerHTML=l.join(""),n=!1}}a.flush=N;function T(){te(),o=Object.keys(C).reduce((s,r)=>(s[r]=new Set,s),{})}a.clear=T;function S(l,s,r){oe(l,s,r).forEach(p=>{o[p]=new Set})}a.addCustomPseudoClass=S;function c(l,s,r){const i=(r??"")+l;o[i].has(s)||(n=!0,o[i].add(s));const p=`${i}${s}`;return process.env.NODE_ENV==="test"?p:t.getIdentity(p)}function f(l,s,r){return Object.entries(o).filter(([p,k])=>{var w,$;return((w=C[p])==null?void 0:w.pseudoSuffix)===s&&(($=C[p])==null?void 0:$.breakpoint)===r&&k.size>0}).reduce((p,[k,w])=>(w.forEach($=>{var L;const g=C[k],y=b(g,$),j=`.${c(k,$)}`;let x=[];s?s==="Hover"?x=i(j,g,y,"hover"):s==="Focus"?x=i(j,g,y,"focus-within"):s==="Active"?x=i(j,g,y,"active"):s==="Checked"?x=i(j,g,y,"checked"):s==="Indeterminate"?x=i(j,g,y,"indeterminate"):s==="Valid"?x=i(j,g,y,"valid"):s==="Invalid"?x=i(j,g,y,"invalid"):s==="Required"?x=i(j,g,y,"required"):s==="Optional"?x=i(j,g,y,"optional"):s==="Disabled"&&(x=i(j,g,y,"disabled")):x=i(j,g,y);const V=((L=y.formatValue)==null?void 0:L.call(y,k,$))??$,ee=C[k].cssNames.map(se=>`${se}:${V};`).join("");p.push(`${x.join(",")}{${ee}}`)}),p),l);function i(p,k,w,$){let g=p;return $&&(g=k.customPseudoSuffix?`.${k.customPseudoSuffix}:${$} ${p}`:`${p}:${$}`),w.formatSelector?w.formatSelector(g):[g]}}function b(l,s){return l.isThemeStyle?l:l.values1.values.includes(s)?l.values1:l.values2.values.includes(s)?l.values2:l.values3}function d(){const s=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let r=s.getElementById(a.cronoStylesElementId);return r||(r=s.createElement("style"),r.setAttribute("id",a.cronoStylesElementId),r.setAttribute("type","text/css"),s.head.insertBefore(r,s.head.firstChild)),r}a.getElement=d})(D||(D={}));const E=D,H={button:{styles:{display:"inline-block",p:3,cursor:"pointer",b:1,borderRadius:1,userSelect:"none",disabled:{cursor:"default"}}},checkbox:{styles:{display:"inline-block"}},radioButton:{styles:{display:"inline-block",b:1,p:2}},textbox:{styles:{display:"inline-block",b:1,borderRadius:1,p:3}},textarea:{styles:{display:"inline-block",b:1,borderRadius:1}}},ve={Hover:"hover",Focus:"focus",Active:"active",Checked:"checked",Indeterminate:"indeterminate",Valid:"valid",Invalid:"invalid",Required:"required",Optional:"optional",Disabled:"disabled"};var _;(a=>{a.Styles={};function u(c){a.Styles=o(H),a.Styles=n(c)}a.setup=u;function t(c,f){const{colors:b={},shadows:d={},backgrounds:l={},backgroundImages:s={}}=c;b.none="none",d.none="none",l.none="none",s.none="none";const r=Object.entries(b).map(([V,O])=>`--color${V}: ${O};`).join(`
7
+ `,t=new re;let n=!0,o={};T();function m(l,s,r){if(l in C)return c(l,s,r);if(["disabledGroup","hoverGroup","focusGroup","activeGroup"].includes(l))return l+s}a.get=m;function N(){if(n){let l=f([u]);D.forEach(r=>{l=f(l,r)}),A.forEach(r=>{l.push(`@media(min-width: ${ue[r]}px){`),l=f(l,void 0,r),D.forEach(i=>{l=f(l,i,r)}),l.push("}")});const s=d();s.innerHTML=l.join(""),n=!1}}a.flush=N;function T(){te(),o=Object.keys(C).reduce((s,r)=>(s[r]=new Set,s),{})}a.clear=T;function S(l,s,r){oe(l,s,r).forEach(p=>{o[p]=new Set})}a.addCustomPseudoClass=S;function c(l,s,r){const i=(r??"")+l;o[i].has(s)||(n=!0,o[i].add(s));const p=`${i}${s}`;return process.env.NODE_ENV==="test"?p:t.getIdentity(p)}function f(l,s,r){return Object.entries(o).filter(([p,k])=>{var w,$;return((w=C[p])==null?void 0:w.pseudoSuffix)===s&&(($=C[p])==null?void 0:$.breakpoint)===r&&k.size>0}).reduce((p,[k,w])=>(w.forEach($=>{var L;const g=C[k],y=b(g,$),j=`.${c(k,$)}`;let x=[];s?s==="Hover"?x=i(j,g,y,"hover"):s==="Focus"?x=i(j,g,y,"focus-within"):s==="Active"?x=i(j,g,y,"active"):s==="Checked"?x=i(j,g,y,"checked"):s==="Indeterminate"?x=i(j,g,y,"indeterminate"):s==="Valid"?x=i(j,g,y,"valid"):s==="Invalid"?x=i(j,g,y,"invalid"):s==="Required"?x=i(j,g,y,"required"):s==="Optional"?x=i(j,g,y,"optional"):s==="Disabled"&&(x=i(j,g,y,"disabled")):x=i(j,g,y);const V=((L=y.formatValue)==null?void 0:L.call(y,k,$))??$,ee=C[k].cssNames.map(se=>`${se}:${V};`).join("");p.push(`${x.join(",")}{${ee}}`)}),p),l);function i(p,k,w,$){let g=p;return $&&(g=k.customPseudoSuffix?`.${k.customPseudoSuffix}:${$} ${p}`:`${p}:${$}`),w.formatSelector?w.formatSelector(g):[g]}}function b(l,s){return l.isThemeStyle?l:l.values1.values.includes(s)?l.values1:l.values2.values.includes(s)?l.values2:l.values3}function d(){const s=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let r=s.getElementById(a.cronoStylesElementId);return r||(r=s.createElement("style"),r.setAttribute("id",a.cronoStylesElementId),r.setAttribute("type","text/css"),s.head.insertBefore(r,s.head.firstChild)),r}a.getElement=d})(_||(_={}));const E=_,H={button:{styles:{display:"inline-block",p:3,cursor:"pointer",b:1,borderRadius:1,userSelect:"none",disabled:{cursor:"default"}}},checkbox:{styles:{display:"inline-block"}},radioButton:{styles:{display:"inline-block",b:1,p:2}},textbox:{styles:{display:"inline-block",b:1,borderRadius:1,p:3}},textarea:{styles:{display:"inline-block",b:1,borderRadius:1}}},ve={Hover:"hover",Focus:"focus",Active:"active",Checked:"checked",Indeterminate:"indeterminate",Valid:"valid",Invalid:"invalid",Required:"required",Optional:"optional",Disabled:"disabled"};var q;(a=>{a.Styles={};function u(c){a.Styles=o(H),a.Styles=n(c)}a.setup=u;function t(c,f){const{colors:b={},shadows:d={},backgrounds:l={},backgroundImages:s={}}=c;b.none="none",d.none="none",l.none="none",s.none="none";const r=Object.entries(b).map(([V,O])=>`--color${V}: ${O};`).join(`
8
8
  `),i=Object.entries(d).map(([V,O])=>`--shadow${V}: ${O};`).join(`
9
9
  `),p=Object.entries(l).map(([V,O])=>`--background${V}: ${O};`).join(`
10
10
  `),k=Object.entries(s).map(([V,O])=>`--backgroundImage${V}: ${O};`).join(`
@@ -34,4 +34,4 @@ a,ul{all: unset;}
34
34
  }
35
35
  }
36
36
  `;return{variables:w.join(`
37
- `),boxDts:x}}a.setupAugmentedProps=t;function n(c){const f=o(c);return Object.keys(H).forEach(d=>{const l=f[d],s=H[d];l?l.styles={...s.styles,...l.styles}:f[d]=H[d]}),f}function o(c){return m(c),T(c),c}function m(c){if(!c.components)return;const f=Object.keys(c.components);for(const b of f){const d=c.components[b],l=N(b,d);delete d.children;for(const s of l){const[r,i]=s;c.components[r]=i}}}function N(c,f){if(!f.children)return[];const b=Object.keys(f.children),d=[];for(const l of b){const s=`${c}.${l}`,r=f.children[l],i=N(s,r);d.push(...i),delete r.children,d.push([s,r])}return d}function T(c){const{components:f,...b}=c,d=Object.values(b);f&&d.push(...Object.values(f));for(const l of d)S(l.styles),A.forEach(s=>{if(s in l.styles){const r=l.styles[s];S(r)}}),l.themes&&Object.values(l.themes).forEach(s=>{S(s),A.forEach(r=>{if(r in s){const i=s[r];S(i)}})})}function S(c){Object.entries(ve).forEach(([f,b])=>{if(b in c){const d=c[b];Object.entries(d).map(([l,s])=>{c[`${l}${f}`]=s}),delete c[b]}})}})(_||(_={}));const F=_;function ie(a){const{clean:u,theme:t,component:n}=a;return G.useMemo(()=>{var m,N;if(u)return;let o=F.Styles[n]??((m=F.Styles.components)==null?void 0:m[n]);if(o)return t?{...o.styles,...(N=o.themes)==null?void 0:N[t]}:o.styles},[n,u,t])}const ce=typeof window<"u"&&typeof window.document<"u",me=ce?G.useLayoutEffect:G.useEffect;function fe(a,u){const t=ie(a);return me(E.flush,[a]),G.useMemo(()=>{const n=[u?E.svgClassName:E.boxClassName],o=t?{...t,...a}:{...a};return X(o),Object.entries(o).forEach(([m,N])=>{n.push(E.get(m,N))}),A.forEach(m=>{if(m in o){const N=o[m];X(N),Object.entries(N).forEach(([T,S])=>{n.push(E.get(T,S,m))}),delete o[m]}}),n},[a,t])}function X(a){B(a,"hover","Hover"),B(a,"focus","Focus"),B(a,"active","Active"),B(a,"disabled","Disabled"),R(a,"hoverGroup","Hover"),R(a,"focusGroup","Focus"),R(a,"activeGroup","Active"),R(a,"disabledGroup","Disabled")}function B(a,u,t){u in a&&Q(a,u,t,a[u])}function R(a,u,t){u in a&&Y.ObjectUtils.isObject(a[u])&&Object.entries(a[u]).forEach(([n,o])=>{E.addCustomPseudoClass(t,n,u),Q(a,u,t+n,o)})}function Q(a,u,t,n){Array.isArray(n)?(Object.entries(n[1]).forEach(([o,m])=>{a[`${o}${t}`]=m}),a[u]=n[0]):Y.ObjectUtils.isObject(n)&&(Object.entries(n).forEach(([o,m])=>{a[`${o}${t}`]=m}),delete a[u])}function Z(...a){return a.reduce((u,t)=>t?typeof t=="string"?(u.push(t),u):Array.isArray(t)?(u.push(...Z(...t)),u):(Object.entries(t).forEach(([n,o])=>{o&&u.push(n)}),u):u,[])}exports.StylesContext=E;exports.Theme=F;exports.classNames=Z;exports.useStyles=fe;
37
+ `),boxDts:x}}a.setupAugmentedProps=t;function n(c){const f=o(c);return Object.keys(H).forEach(d=>{const l=f[d],s=H[d];l?l.styles={...s.styles,...l.styles}:f[d]=H[d]}),f}function o(c){return m(c),T(c),c}function m(c){if(!c.components)return;const f=Object.keys(c.components);for(const b of f){const d=c.components[b],l=N(b,d);delete d.children;for(const s of l){const[r,i]=s;c.components[r]=i}}}function N(c,f){if(!f.children)return[];const b=Object.keys(f.children),d=[];for(const l of b){const s=`${c}.${l}`,r=f.children[l],i=N(s,r);d.push(...i),delete r.children,d.push([s,r])}return d}function T(c){const{components:f,...b}=c,d=Object.values(b);f&&d.push(...Object.values(f));for(const l of d)S(l.styles),A.forEach(s=>{if(s in l.styles){const r=l.styles[s];S(r)}}),l.themes&&Object.values(l.themes).forEach(s=>{S(s),A.forEach(r=>{if(r in s){const i=s[r];S(i)}})})}function S(c){Object.entries(ve).forEach(([f,b])=>{if(b in c){const d=c[b];Object.entries(d).map(([l,s])=>{c[`${l}${f}`]=s}),delete c[b]}})}})(q||(q={}));const F=q;function ie(a){const{clean:u,theme:t,component:n}=a;return G.useMemo(()=>{var m,N;if(u)return;let o=F.Styles[n]??((m=F.Styles.components)==null?void 0:m[n]);if(o)return t?{...o.styles,...(N=o.themes)==null?void 0:N[t]}:o.styles},[n,u,t])}const ce=typeof window<"u"&&typeof window.document<"u",me=ce?G.useLayoutEffect:G.useEffect;function fe(a,u){const t=ie(a);return me(E.flush,[a]),G.useMemo(()=>{const n=[u?E.svgClassName:E.boxClassName],o=t?{...t,...a}:{...a};return X(o),Object.entries(o).forEach(([m,N])=>{n.push(E.get(m,N))}),A.forEach(m=>{if(m in o){const N=o[m];X(N),Object.entries(N).forEach(([T,S])=>{n.push(E.get(T,S,m))}),delete o[m]}}),n},[a,t])}function X(a){B(a,"hover","Hover"),B(a,"focus","Focus"),B(a,"active","Active"),B(a,"disabled","Disabled"),R(a,"hoverGroup","Hover"),R(a,"focusGroup","Focus"),R(a,"activeGroup","Active"),R(a,"disabledGroup","Disabled")}function B(a,u,t){u in a&&Q(a,u,t,a[u])}function R(a,u,t){u in a&&Y.ObjectUtils.isObject(a[u])&&Object.entries(a[u]).forEach(([n,o])=>{E.addCustomPseudoClass(t,n,u),Q(a,u,t+n,o)})}function Q(a,u,t,n){Array.isArray(n)?(Object.entries(n[1]).forEach(([o,m])=>{a[`${o}${t}`]=m}),a[u]=n[0]):Y.ObjectUtils.isObject(n)&&(Object.entries(n).forEach(([o,m])=>{a[`${o}${t}`]=m}),delete a[u])}function Z(...a){return a.reduce((u,t)=>t?typeof t=="string"?(u.push(t),u):Array.isArray(t)?(u.push(...Z(...t)),u):(Object.entries(t).forEach(([n,o])=>{o&&u.push(n)}),u):u,[])}exports.StylesContext=E;exports.Theme=F;exports.classNames=Z;exports.useStyles=fe;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cronocode/react-box",
3
- "version": "1.8.9",
3
+ "version": "2.0.1",
4
4
  "type": "module",
5
5
  "main": "./box.cjs",
6
6
  "module": "./box.mjs",
@@ -11,10 +11,10 @@
11
11
  "require": "./box.cjs",
12
12
  "types": "./box.d.ts"
13
13
  },
14
- "./theme": {
15
- "import": "./theme.mjs",
16
- "require": "./theme.cjs",
17
- "types": "./theme.d.ts"
14
+ "./core/theme": {
15
+ "import": "./core/theme.mjs",
16
+ "require": "./core/theme.cjs",
17
+ "types": "./core/theme.d.ts"
18
18
  },
19
19
  "./core/types": {
20
20
  "types": "./core/types.d.ts"