@cronocode/react-box 1.6.6 → 1.6.8

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.
Files changed (43) hide show
  1. package/components/baseSvg.cjs +1 -1
  2. package/components/baseSvg.mjs +1 -4
  3. package/components/button.cjs +1 -1
  4. package/components/button.d.ts +1 -0
  5. package/components/button.mjs +7 -10
  6. package/components/checkbox.cjs +1 -1
  7. package/components/checkbox.mjs +4 -7
  8. package/components/dataGrid/dataGridContract.d.ts +1 -0
  9. package/components/dataGrid.cjs +1 -1
  10. package/components/dataGrid.d.ts +1 -1
  11. package/components/dataGrid.mjs +2 -32
  12. package/components/dox/doxStyles.d.ts +9 -0
  13. package/components/dox.cjs +2 -2
  14. package/components/dox.d.ts +6 -4
  15. package/components/dox.mjs +125 -126
  16. package/components/doxSvg.cjs +1 -1
  17. package/components/doxSvg.d.ts +1 -0
  18. package/components/doxSvg.mjs +4 -7
  19. package/components/flex.d.ts +4 -2
  20. package/components/form.cjs +1 -1
  21. package/components/form.d.ts +2 -1
  22. package/components/form.mjs +4 -15
  23. package/components/grid.cjs +1 -1
  24. package/components/grid.d.ts +4 -2
  25. package/components/grid.mjs +5 -8
  26. package/components/radioButton.cjs +1 -1
  27. package/components/radioButton.mjs +2 -5
  28. package/components/textarea.cjs +1 -1
  29. package/components/textarea.mjs +7 -10
  30. package/components/textbox.cjs +1 -1
  31. package/components/textbox.mjs +6 -9
  32. package/components/tooltip.cjs +1 -1
  33. package/components/tooltip.d.ts +1 -1
  34. package/components/tooltip.mjs +5 -63
  35. package/package.json +14 -14
  36. package/plugins.cjs +1 -209
  37. package/plugins.mjs +0 -219
  38. package/style.css +1 -1
  39. package/theme.cjs +1 -1
  40. package/theme.mjs +23 -25
  41. package/types.d.ts +9 -0
  42. package/utils/utils.cjs +1 -1
  43. package/utils/utils.mjs +53 -63
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./doxSvg.cjs");require("react/jsx-runtime");require("react");require("./dox.cjs");require("../utils/utils.cjs");require("../theme.cjs");exports.default=e.default;
1
+ "use strict";require("./doxSvg.cjs");require("react/jsx-runtime");require("react");require("./dox.cjs");require("../utils/utils.cjs");require("../theme.cjs");
@@ -1,9 +1,6 @@
1
- import r from "./doxSvg.mjs";
1
+ import "./doxSvg.mjs";
2
2
  import "react/jsx-runtime";
3
3
  import "react";
4
4
  import "./dox.mjs";
5
5
  import "../utils/utils.mjs";
6
6
  import "../theme.mjs";
7
- export {
8
- r as default
9
- };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),r=require("react"),u=require("./dox.cjs"),s=require("../utils/utils.cjs");require("../theme.cjs");const i=["type","onClick","disabled"];function c(t,e){const o=s.ObjectUtils.buildProps(t,i);return n.jsx(u.default,{ref:e,tag:"button",component:"button",...o})}const l=r.forwardRef(c);exports.default=l;
1
+ "use strict";const r=require("react/jsx-runtime"),n=require("react"),s=require("./dox.cjs"),u=require("../utils/utils.cjs");require("../theme.cjs");const i=["type","onClick","disabled"];function c(t,e){const o=u.ObjectUtils.buildProps(t,i);return r.jsx(s.default,{ref:e,tag:"button",component:"button",...o})}n.forwardRef(c);
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  import Box from '../box';
2
3
  type BoxProps = Omit<React.ComponentProps<typeof Box<'button'>>, 'ref' | 'tag'>;
3
4
  type BoxTagProps = Required<BoxProps>['props'];
@@ -1,14 +1,11 @@
1
1
  import { jsx as n } from "react/jsx-runtime";
2
- import { forwardRef as p } from "react";
3
- import s from "./dox.mjs";
4
- import { O as i } from "../utils/utils.mjs";
2
+ import { forwardRef as i } from "react";
3
+ import m from "./dox.mjs";
4
+ import { O as p } from "../utils/utils.mjs";
5
5
  import "../theme.mjs";
6
- const m = ["type", "onClick", "disabled"];
6
+ const s = ["type", "onClick", "disabled"];
7
7
  function e(o, t) {
8
- const r = i.buildProps(o, m);
9
- return /* @__PURE__ */ n(s, { ref: t, tag: "button", component: "button", ...r });
8
+ const r = p.buildProps(o, s);
9
+ return /* @__PURE__ */ n(m, { ref: t, tag: "button", component: "button", ...r });
10
10
  }
11
- const d = p(e);
12
- export {
13
- d as default
14
- };
11
+ i(e);
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),t=require("./dox.cjs"),i=require("../utils/utils.cjs"),u=require("./flex.cjs"),l=require("../box.module.css.cjs");require("../theme.cjs");const d=["name","onInput","onChange","disabled","autoFocus","readOnly","required","value","checked","defaultChecked"];function a(n,s){const{native:o}=n,r=i.ObjectUtils.buildProps(n,d,{type:"checkbox"});return e.jsxs(u.default,{inline:!0,position:"relative",children:[e.jsx(t.default,{ref:s,tag:"input",component:"checkbox",...r,appearance:o?void 0:"none"}),!o&&e.jsx(t.default,{position:"absolute",pointerEvents:"none",className:l.classes._checkedIcon,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",viewBox:"0 0 20 20",children:e.jsx("g",{fill:"none",fillRule:"evenodd",children:e.jsx("path",{stroke:"#000",strokeLinecap:"round",strokeLinejoin:"round",d:"M6 10.15L8.5 13 14 7"})})})})]})}const x=c.forwardRef(a);exports.default=x;
1
+ "use strict";const e=require("react/jsx-runtime"),i=require("react"),t=require("./dox.cjs"),c=require("../utils/utils.cjs"),u=require("./flex.cjs"),l=require("../box.module.css.cjs");require("../theme.cjs");const d=["name","onInput","onChange","disabled","autoFocus","readOnly","required","value","checked","defaultChecked"];function a(n,s){const{native:o}=n,r=c.ObjectUtils.buildProps(n,d,{type:"checkbox"});return e.jsxs(u.default,{inline:!0,position:"relative",children:[e.jsx(t.default,{ref:s,tag:"input",component:"checkbox",...r,appearance:o?void 0:"none"}),!o&&e.jsx(t.default,{position:"absolute",pointerEvents:"none",className:l.classes._checkedIcon,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",viewBox:"0 0 20 20",children:e.jsx("g",{fill:"none",fillRule:"evenodd",children:e.jsx("path",{stroke:"#000",strokeLinecap:"round",strokeLinejoin:"round",d:"M6 10.15L8.5 13 14 7"})})})})]})}i.forwardRef(a);
@@ -1,5 +1,5 @@
1
- import { jsxs as c, jsx as e } from "react/jsx-runtime";
2
- import { forwardRef as s } from "react";
1
+ import { jsxs as s, jsx as e } from "react/jsx-runtime";
2
+ import { forwardRef as c } from "react";
3
3
  import t from "./dox.mjs";
4
4
  import { O as a } from "../utils/utils.mjs";
5
5
  import l from "./flex.mjs";
@@ -19,12 +19,9 @@ const p = [
19
19
  ];
20
20
  function m(o, r) {
21
21
  const { native: n } = o, i = a.buildProps(o, p, { type: "checkbox" });
22
- return /* @__PURE__ */ c(l, { inline: !0, position: "relative", children: [
22
+ return /* @__PURE__ */ s(l, { inline: !0, position: "relative", children: [
23
23
  /* @__PURE__ */ e(t, { ref: r, tag: "input", component: "checkbox", ...i, appearance: n ? void 0 : "none" }),
24
24
  !n && /* @__PURE__ */ e(t, { position: "absolute", pointerEvents: "none", className: d._checkedIcon, children: /* @__PURE__ */ e("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", viewBox: "0 0 20 20", children: /* @__PURE__ */ e("g", { fill: "none", fillRule: "evenodd", children: /* @__PURE__ */ e("path", { stroke: "#000", strokeLinecap: "round", strokeLinejoin: "round", d: "M6 10.15L8.5 13 14 7" }) }) }) })
25
25
  ] });
26
26
  }
27
- const w = s(m);
28
- export {
29
- w as default
30
- };
27
+ c(m);
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export interface GridCell<T> {
2
3
  key: keyof T;
3
4
  value: React.ReactNode;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),u=require("./dox.cjs");require("react");require("../utils/utils.cjs");require("../theme.cjs");function o(r){if(!(r!=null&&r.length))return{rows:[],columns:[]};const s=Object.keys(r[0]);return{rows:r.map(e=>({dataRow:e,cells:s.map(n=>({key:n,value:e[n]}))})),columns:s.map(e=>({key:e}))}}function c(r){const{data:s}=r,e=o(s);return t.jsx(u.default,{display:"grid",b:1,borderRadius:1,children:e.columns.length===0?t.jsx(t.Fragment,{children:"empty grid"}):t.jsxs(t.Fragment,{children:[e.columns.map((n,i)=>t.jsx(u.default,{style:{gridColumn:i+1},children:n.key.toString()},n.key.toString())),e.rows.map((n,i)=>n.cells.map(l=>t.jsx(u.default,{children:l.value},l.key.toString()+i)))]})})}exports.default=c;
1
+ "use strict";require("react/jsx-runtime");require("./dox.cjs");require("react");require("../utils/utils.cjs");require("../theme.cjs");
@@ -1,5 +1,5 @@
1
1
  interface Props<T extends {}> {
2
2
  data?: T[];
3
3
  }
4
- export default function DataGrid<T extends {}>(props: Props<T>): JSX.Element;
4
+ export default function DataGrid<T extends {}>(props: Props<T>): import("react/jsx-runtime").JSX.Element;
5
5
  export {};
@@ -1,35 +1,5 @@
1
- import { jsx as o, Fragment as l, jsxs as u } from "react/jsx-runtime";
2
- import s from "./dox.mjs";
1
+ import "react/jsx-runtime";
2
+ import "./dox.mjs";
3
3
  import "react";
4
4
  import "../utils/utils.mjs";
5
5
  import "../theme.mjs";
6
- function c(e) {
7
- if (!(e != null && e.length))
8
- return {
9
- rows: [],
10
- columns: []
11
- };
12
- const i = Object.keys(e[0]);
13
- return {
14
- rows: e.map((r) => ({
15
- dataRow: r,
16
- cells: i.map((n) => ({
17
- key: n,
18
- value: r[n]
19
- }))
20
- })),
21
- columns: i.map((r) => ({
22
- key: r
23
- }))
24
- };
25
- }
26
- function f(e) {
27
- const { data: i } = e, r = c(i);
28
- return /* @__PURE__ */ o(s, { display: "grid", b: 1, borderRadius: 1, children: r.columns.length === 0 ? /* @__PURE__ */ o(l, { children: "empty grid" }) : /* @__PURE__ */ u(l, { children: [
29
- r.columns.map((n, t) => /* @__PURE__ */ o(s, { style: { gridColumn: t + 1 }, children: n.key.toString() }, n.key.toString())),
30
- r.rows.map((n, t) => n.cells.map((m) => /* @__PURE__ */ o(s, { children: m.value }, m.key.toString() + t)))
31
- ] }) });
32
- }
33
- export {
34
- f as default
35
- };
@@ -1,6 +1,15 @@
1
1
  import { ThemeComponentProps } from '../../theme';
2
2
  import { Augmented } from '../../types';
3
3
  import { DoxStylesFormatters } from './doxStylesFormatters';
4
+ type Hovered<T> = {
5
+ [K in keyof T as K extends string ? `${K}H` : never]: T[K];
6
+ };
7
+ type Focused<T> = {
8
+ [K in keyof T as K extends string ? `${K}F` : never]: T[K];
9
+ };
10
+ type Activated<T> = {
11
+ [K in keyof T as K extends string ? `${K}A` : never]: T[K];
12
+ };
4
13
  export interface StyleValues {
5
14
  values: Readonly<Array<string | number | boolean>>;
6
15
  formatClassName?: (key: string, value: string | number | boolean) => string;
@@ -1,7 +1,7 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),B=require("../utils/utils.cjs"),I=require("../theme.cjs");var e;(a=>{(i=>{function m(v,d){return`${v}${d.replace("/","-")}`}i.fraction=m;function n(v){return[`${v} path`,`${v} circle`,`${v} rect`,`${v} line`]}i.svg=n})(a.ClassName||(a.ClassName={})),(i=>{function m(l,u){return`${u/4}rem`}i.rem=m;function n(l,u){return`${u}px`}i.px=n;function v(l,u){const[r,o]=u.split("/");return`${+r/+o*100}%`}i.fraction=v;function d(l,u){switch(u){case"fit":return"100%";case"fit-screen":return l.toLocaleLowerCase().includes("height")?"100vh":"100vw";default:return u}}i.widthHeight=d;function g(l){return(u,r)=>`var(--${l}${r});`}i.variables=g;function x(l){return(u,r)=>`var(--${l}${r});`}i.svgVariables=x;function S(l,u){return`repeat(${u},minmax(0,1fr))`}i.gridColumns=S;function f(l,u){return u==="full-row"?"1/-1":`span ${u}/span ${u}`}i.gridColumn=f;function h(l,u){return`${u}ms`}i.ms=h;function V(l,u){return`${u}deg`}i.rotate=V;function w(l,u){return u==="xAxis"?"-1 1":"1 -1"}i.flip=w})(a.Value||(a.Value={}))})(e||(e={}));const _=["H","F","A"];var s;(a=>{a.positiveSizes=[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],a.negativeSizes=[-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],a.sizes=[...a.positiveSizes,...a.negativeSizes],a.borderAndOutlineStyles=["solid","dashed","dotted","double","groove","ridge","inset","outset","none","hidden"],a.overflows=["auto","hidden","scroll","visible"],a.widthHeightFractions=["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"],a.widthHeightValues=["fit","fit-screen","auto","fit-content","max-content","min-content"],a.alignSelf=["auto","flex-start","flex-end","center","baseline","stretch"]})(s||(s={}));const j={shadow:{cssNames:["box-shadow"],formatValue:e.Value.variables("shadow")},background:{cssNames:["background"],formatValue:e.Value.variables("background")},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")}},E={fill:{cssNames:["fill"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg},stroke:{cssNames:["stroke"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg}},H={hover:{className:"_h"},focus:{className:"_f"}},t={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:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},minWidth:{cssNames:["min-width"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},maxWidth:{cssNames:["max-width"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},height:{cssNames:["height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},minHeight:{cssNames:["min-height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},maxHeight:{cssNames:["max-height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},position:{cssNames:["position"],values1:{values:["static","relative","absolute","fixed","sticky"]},values2:{values:[]},values3:{values:[]}},top:{cssNames:["top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},right:{cssNames:["right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},bottom:{cssNames:["bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},left:{cssNames:["left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},inset:{cssNames:["inset"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},margin:{cssNames:["margin"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginHorizontal:{cssNames:["margin-inline"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginVertical:{cssNames:["margin-block"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginTop:{cssNames:["margin-top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginRight:{cssNames:["margin-right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginBottom:{cssNames:["margin-bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginLeft:{cssNames:["margin-left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},padding:{cssNames:["padding"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingHorizontal:{cssNames:["padding-inline"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingVertical:{cssNames:["padding-block"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingTop:{cssNames:["padding-top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingRight:{cssNames:["padding-right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingBottom:{cssNames:["padding-bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingLeft:{cssNames:["padding-left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},border:{cssNames:["border-width"],values1:{values:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderHorizontal:{cssNames:["border-inline-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderVertical:{cssNames:["border-block-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderTop:{cssNames:["border-top-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderRight:{cssNames:["border-right-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderBottom:{cssNames:["border-bottom-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderLeft:{cssNames:["border-left-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderStyle:{cssNames:["border-style"],values1:{values:s.borderAndOutlineStyles},values2:{values:[]},values3:{values:[]}},borderRadius:{cssNames:["border-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTop:{cssNames:["border-top-left-radius","border-top-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusRight:{cssNames:["border-top-right-radius","border-bottom-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottom:{cssNames:["border-bottom-left-radius","border-bottom-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusLeft:{cssNames:["border-top-left-radius","border-bottom-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopLeft:{cssNames:["border-top-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopRight:{cssNames:["border-top-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomLeft:{cssNames:["border-bottom-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomRight:{cssNames:["border-bottom-right-radius"],values1:{values:s.positiveSizes,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:s.overflows},values2:{values:[]},values3:{values:[]}},overflowX:{cssNames:["overflow-x"],values1:{values:s.overflows},values2:{values:[]},values3:{values:[]}},overflowY:{cssNames:["overflow-y"],values1:{values:s.overflows},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:s.positiveSizes,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:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},lineHeight:{cssNames:["line-height"],values1:{values:s.positiveSizes,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:[]}},justifyContent:{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:[]}},alignItems:{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:[]}},flexDirection:{cssNames:["flex-direction"],values1:{values:["row","row-reverse","column","column-reverse"]},values2:{values:[]},values3:{values:[]}},gap:{cssNames:["gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},rowGap:{cssNames:["row-gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},columnGap:{cssNames:["column-gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},order:{cssNames:["order"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},flexGrow:{cssNames:["flex-grow"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},flexShrink:{cssNames:["flex-shrink"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},alignSelf:{cssNames:["align-self"],values1:{values:s.alignSelf},values2:{values:[]},values3:{values:[]}},justifySelf:{cssNames:["justify-self"],values1:{values:s.alignSelf},values2:{values:[]},values3:{values:[]}},gridColumns:{cssNames:["grid-template-columns"],values1:{values:s.positiveSizes,formatValue:e.Value.gridColumns},values2:{values:[]},values3:{values:[]}},colSpan:{cssNames:["grid-column"],values1:{values:s.positiveSizes,formatValue:e.Value.gridColumn},values2:{values:["full-row"],formatValue:e.Value.gridColumn},values3:{values:[]}},colStart:{cssNames:["grid-column-start"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},colEnd:{cssNames:["grid-column-end"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},outline:{cssNames:["outline-width"],values1:{values:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},outlineStyle:{cssNames:["outline-style"],values1:{values:s.borderAndOutlineStyles},values2:{values:[]},values3:{values:[]}},outlineOffset:{cssNames:["outline-offset"],values1:{values:s.positiveSizes,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:[]}}},T={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:[]}}};Object.keys(T).forEach(a=>{t[a]=T[a]});Object.keys(j).forEach(a=>{t[a]=j[a],t[a].isThemeStyle=!0});Object.keys(E).forEach(a=>{t[a]=E[a],t[a].isThemeStyle=!0});const y={w:{...t.width,key:"width"},h:{...t.height,key:"height"},m:{...t.margin,key:"margin"},mx:{...t.marginHorizontal,key:"marginHorizontal"},my:{...t.marginVertical,key:"marginVertical"},mt:{...t.marginTop,key:"marginTop"},mr:{...t.marginRight,key:"marginRight"},mb:{...t.marginBottom,key:"marginBottom"},ml:{...t.marginLeft,key:"marginLeft"},p:{...t.padding,key:"padding"},px:{...t.paddingHorizontal,key:"paddingHorizontal"},py:{...t.paddingVertical,key:"paddingVertical"},pt:{...t.paddingTop,key:"paddingTop"},pr:{...t.paddingRight,key:"paddingRight"},pb:{...t.paddingBottom,key:"paddingBottom"},pl:{...t.paddingLeft,key:"paddingLeft"},b:{...t.border,key:"border"},bx:{...t.borderHorizontal,key:"borderHorizontal"},by:{...t.borderVertical,key:"borderVertical"},bt:{...t.borderTop,key:"borderTop"},br:{...t.borderRight,key:"borderRight"},bb:{...t.borderBottom,key:"borderBottom"},bl:{...t.borderLeft,key:"borderLeft"},jc:{...t.justifyContent,key:"justifyContent"},ai:{...t.alignItems,key:"alignItems"},ac:{...t.alignContent,key:"alignContent"},d:{...t.flexDirection,key:"flexDirection"}},D=Object.keys(t),M=Object.keys(y);_.forEach(a=>{D.forEach(i=>{t[`${i}${a}`]={...t[i]},t[`${i}${a}`].pseudoSuffix=a}),M.forEach(i=>{y[`${i}${a}`]={...y[i],key:`${y[i].key}${a}`},y[`${i}${a}`].pseudoSuffix=a})});var b;(a=>{a.doxClassName="_dox",a.svgClassName="_svg";const i=`: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";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),E=require("../utils/utils.cjs"),I=require("../theme.cjs");var e;(a=>{(r=>{function m(l,d){return`${l}${d.replace("/","-")}`}r.fraction=m;function n(l){return[`${l} path`,`${l} circle`,`${l} rect`,`${l} line`]}r.svg=n})(a.ClassName||(a.ClassName={})),(r=>{function m(u,t){return`${t/4}rem`}r.rem=m;function n(u,t){return`${t}px`}r.px=n;function l(u,t){const[o,v]=t.split("/");return`${+o/+v*100}%`}r.fraction=l;function d(u,t){switch(t){case"fit":return"100%";case"fit-screen":return u.toLocaleLowerCase().includes("height")?"100vh":"100vw";default:return t}}r.widthHeight=d;function g(u){return(t,o)=>`var(--${u}${o});`}r.variables=g;function x(u){return(t,o)=>`var(--${u}${o});`}r.svgVariables=x;function S(u,t){return`repeat(${t},minmax(0,1fr))`}r.gridColumns=S;function f(u,t){return t==="full-row"?"1/-1":`span ${t}/span ${t}`}r.gridColumn=f;function h(u,t){return`${t}ms`}r.ms=h;function V(u,t){return`${t}deg`}r.rotate=V;function N(u,t){return t==="xAxis"?"-1 1":"1 -1"}r.flip=N})(a.Value||(a.Value={}))})(e||(e={}));const _=["H","F","A"];var s;(a=>{a.positiveSizes=[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],a.negativeSizes=[-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],a.sizes=[...a.positiveSizes,...a.negativeSizes],a.borderAndOutlineStyles=["solid","dashed","dotted","double","groove","ridge","inset","outset","none","hidden"],a.overflows=["auto","hidden","scroll","visible"],a.widthHeightFractions=["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"],a.widthHeightValues=["fit","fit-screen","auto","fit-content","max-content","min-content"],a.alignSelf=["auto","flex-start","flex-end","center","baseline","stretch"]})(s||(s={}));const j={shadow:{cssNames:["box-shadow"],formatValue:e.Value.variables("shadow")},background:{cssNames:["background"],formatValue:e.Value.variables("background")},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")}},A={fill:{cssNames:["fill"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg},stroke:{cssNames:["stroke"],formatValue:e.Value.svgVariables("color"),formatSelector:e.ClassName.svg}},$={hover:{className:"_h"},focus:{className:"_f"}},i={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:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},minWidth:{cssNames:["min-width"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},maxWidth:{cssNames:["max-width"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},height:{cssNames:["height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},minHeight:{cssNames:["min-height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},maxHeight:{cssNames:["max-height"],values1:{values:s.widthHeightValues,formatValue:e.Value.widthHeight},values2:{values:s.positiveSizes,formatValue:e.Value.rem},values3:{values:s.widthHeightFractions,formatValue:e.Value.fraction}},position:{cssNames:["position"],values1:{values:["static","relative","absolute","fixed","sticky"]},values2:{values:[]},values3:{values:[]}},top:{cssNames:["top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},right:{cssNames:["right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},bottom:{cssNames:["bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},left:{cssNames:["left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},inset:{cssNames:["inset"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},margin:{cssNames:["margin"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginHorizontal:{cssNames:["margin-inline"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginVertical:{cssNames:["margin-block"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginTop:{cssNames:["margin-top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginRight:{cssNames:["margin-right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginBottom:{cssNames:["margin-bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},marginLeft:{cssNames:["margin-left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:["auto"]},values3:{values:[]}},padding:{cssNames:["padding"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingHorizontal:{cssNames:["padding-inline"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingVertical:{cssNames:["padding-block"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingTop:{cssNames:["padding-top"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingRight:{cssNames:["padding-right"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingBottom:{cssNames:["padding-bottom"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},paddingLeft:{cssNames:["padding-left"],values1:{values:s.sizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},border:{cssNames:["border-width"],values1:{values:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderHorizontal:{cssNames:["border-inline-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderVertical:{cssNames:["border-block-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderTop:{cssNames:["border-top-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderRight:{cssNames:["border-right-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderBottom:{cssNames:["border-bottom-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderLeft:{cssNames:["border-left-width"],values1:{values:s.sizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},borderStyle:{cssNames:["border-style"],values1:{values:s.borderAndOutlineStyles},values2:{values:[]},values3:{values:[]}},borderRadius:{cssNames:["border-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTop:{cssNames:["border-top-left-radius","border-top-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusRight:{cssNames:["border-top-right-radius","border-bottom-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottom:{cssNames:["border-bottom-left-radius","border-bottom-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusLeft:{cssNames:["border-top-left-radius","border-bottom-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopLeft:{cssNames:["border-top-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusTopRight:{cssNames:["border-top-right-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomLeft:{cssNames:["border-bottom-left-radius"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},borderRadiusBottomRight:{cssNames:["border-bottom-right-radius"],values1:{values:s.positiveSizes,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:s.overflows},values2:{values:[]},values3:{values:[]}},overflowX:{cssNames:["overflow-x"],values1:{values:s.overflows},values2:{values:[]},values3:{values:[]}},overflowY:{cssNames:["overflow-y"],values1:{values:s.overflows},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:s.positiveSizes,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:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},lineHeight:{cssNames:["line-height"],values1:{values:s.positiveSizes,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:[]}},justifyContent:{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:[]}},alignItems:{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:[]}},flexDirection:{cssNames:["flex-direction"],values1:{values:["row","row-reverse","column","column-reverse"]},values2:{values:[]},values3:{values:[]}},gap:{cssNames:["gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},rowGap:{cssNames:["row-gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},columnGap:{cssNames:["column-gap"],values1:{values:s.positiveSizes,formatValue:e.Value.rem},values2:{values:[]},values3:{values:[]}},order:{cssNames:["order"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},flexGrow:{cssNames:["flex-grow"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},flexShrink:{cssNames:["flex-shrink"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},alignSelf:{cssNames:["align-self"],values1:{values:s.alignSelf},values2:{values:[]},values3:{values:[]}},justifySelf:{cssNames:["justify-self"],values1:{values:s.alignSelf},values2:{values:[]},values3:{values:[]}},gridColumns:{cssNames:["grid-template-columns"],values1:{values:s.positiveSizes,formatValue:e.Value.gridColumns},values2:{values:[]},values3:{values:[]}},colSpan:{cssNames:["grid-column"],values1:{values:s.positiveSizes,formatValue:e.Value.gridColumn},values2:{values:["full-row"],formatValue:e.Value.gridColumn},values3:{values:[]}},colStart:{cssNames:["grid-column-start"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},colEnd:{cssNames:["grid-column-end"],values1:{values:s.positiveSizes},values2:{values:[]},values3:{values:[]}},outline:{cssNames:["outline-width"],values1:{values:s.positiveSizes,formatValue:e.Value.px},values2:{values:[]},values3:{values:[]}},outlineStyle:{cssNames:["outline-style"],values1:{values:s.borderAndOutlineStyles},values2:{values:[]},values3:{values:[]}},outlineOffset:{cssNames:["outline-offset"],values1:{values:s.positiveSizes,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:[]}}},T={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:[]}}};Object.keys(T).forEach(a=>{i[a]=T[a]});Object.keys(j).forEach(a=>{i[a]=j[a],i[a].isThemeStyle=!0});Object.keys(A).forEach(a=>{i[a]=A[a],i[a].isThemeStyle=!0});const w={w:{...i.width,key:"width"},h:{...i.height,key:"height"},m:{...i.margin,key:"margin"},mx:{...i.marginHorizontal,key:"marginHorizontal"},my:{...i.marginVertical,key:"marginVertical"},mt:{...i.marginTop,key:"marginTop"},mr:{...i.marginRight,key:"marginRight"},mb:{...i.marginBottom,key:"marginBottom"},ml:{...i.marginLeft,key:"marginLeft"},p:{...i.padding,key:"padding"},px:{...i.paddingHorizontal,key:"paddingHorizontal"},py:{...i.paddingVertical,key:"paddingVertical"},pt:{...i.paddingTop,key:"paddingTop"},pr:{...i.paddingRight,key:"paddingRight"},pb:{...i.paddingBottom,key:"paddingBottom"},pl:{...i.paddingLeft,key:"paddingLeft"},b:{...i.border,key:"border"},bx:{...i.borderHorizontal,key:"borderHorizontal"},by:{...i.borderVertical,key:"borderVertical"},bt:{...i.borderTop,key:"borderTop"},br:{...i.borderRight,key:"borderRight"},bb:{...i.borderBottom,key:"borderBottom"},bl:{...i.borderLeft,key:"borderLeft"},jc:{...i.justifyContent,key:"justifyContent"},ai:{...i.alignItems,key:"alignItems"},ac:{...i.alignContent,key:"alignContent"},d:{...i.flexDirection,key:"flexDirection"}},D=Object.keys(i),M=Object.keys(w);_.forEach(a=>{D.forEach(r=>{i[`${r}${a}`]={...i[r]},i[`${r}${a}`].pseudoSuffix=a}),M.forEach(r=>{w[`${r}${a}`]={...w[r],key:`${w[r].key}${a}`},w[`${r}${a}`].pseudoSuffix=a})});var z;(a=>{a.doxClassName="_dox",a.svgClassName="_svg";const r=`: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.doxClassName}{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
- `,m=new B.IdentityFactory,n=Object.keys(t),v=w();let d=!1;const g=n.reduce((l,u)=>(l[u]=new Set,l),{});function x(l,u){if(l in t)return f(l,u);if(l in H)return H[l].className;if(l in T)return f(l,u)}a.get=x;function S(){if(d){console.info("%c💬Flush Dox Styles","color: #00ffff");let l=h([i]);l=h(l,"H"),l=h(l,"F"),l=h(l,"A"),v.innerHTML=l.join(""),d=!1}}a.flush=S;function f(l,u){var c;g[l].has(u)||(d=!0,g[l].add(u));const r=V(l,u),o=((c=r.formatClassName)==null?void 0:c.call(r,l,u))??`${l}${u}`;return`-${m.getIdentity(o)}`}function h(l,u){return Object.entries(g).filter(([o])=>{var c;return((c=t[o])==null?void 0:c.pseudoSuffix)===u}).reduce((o,[c,L])=>(L.forEach($=>{var R;const p=V(c,$),z=`.${f(c,$)}`;let k=[];u?u==="H"?k=[...r(`${z}:hover`,p),...r(`.${H.hover.className}:hover>${z}`,p)]:u==="F"?k=[...r(`${z}:focus-within`,p),...r(`.${H.focus.className}:focus-within>${z}`,p)]:u==="A"&&(k=r(`${z}:active`,p)):k=r(z,p);const O=((R=p.formatValue)==null?void 0:R.call(p,c,$))??$,A=t[c].cssNames.map(F=>`${F}:${O};`).join("");o.push(`${k.join(",")}{${A}}`)}),o),l);function r(o,c){return c.formatSelector?c.formatSelector(o):[o]}}function V(l,u){const r=t[l];return r.isThemeStyle?r:r.values1.values.includes(u)?r.values1:r.values2.values.includes(u)?r.values2:r.values3}function w(){const l="crono-styles",r=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let o=r.getElementById(l);return o||(o=r.createElement("style"),o.setAttribute("id",l),o.setAttribute("type","text/css"),r.head.insertBefore(o,r.head.firstChild)),o}})(b||(b={}));const P=typeof window<"u"&&typeof window.document<"u",q=P?N.useLayoutEffect:N.useEffect;function W(a,i){const m=I.useTheme(a);return q(b.flush,[a]),N.useMemo(()=>{const n=[i?b.svgClassName:b.doxClassName],v=m?{...C(m),...C(a)}:C(a);return Object.entries(v).forEach(([d,g])=>{n.push(b.get(d,g))}),n},[a,m])}function C(a){const i={...a};return Object.keys(i).forEach(n=>{const v=y[n];v&&(v.key in i||(i[v.key]=i[n]),delete i[n])}),i}function G(a,i){const{tag:m="div",children:n,props:v,className:d,style:g}=a,x=W(a,m==="svg"),S=N.useMemo(()=>B.ClassNameUtils.classNames(d,x).join(" "),[a]),f={...v,className:S};g&&(f.style=g),i&&(f.ref=i);const[h,V]=N.useState(!1),w=typeof n=="function";return w&&(f.onMouseEnter=()=>V(!0),f.onMouseLeave=()=>V(!1)),N.createElement(m,f,w?n({isHover:h}):n)}const U=N.forwardRef(G),{flush:X}=b;exports.default=U;exports.flushStyles=X;
7
+ `,m=new E.IdentityFactory,n=Object.keys(i),l=N();let d=!1;const g=n.reduce((u,t)=>(u[t]=new Set,u),{});function x(u,t){if(u in i)return f(u,t);if(u in $)return $[u].className;if(u in T)return f(u,t)}a.get=x;function S(){if(d){console.info("%c💬Flush Dox Styles","color: #00ffff");let u=h([r]);u=h(u,"H"),u=h(u,"F"),u=h(u,"A"),l.innerHTML=u.join(""),d=!1}}a.flush=S;function f(u,t){var c;g[u].has(t)||(d=!0,g[u].add(t));const o=V(u,t),v=((c=o.formatClassName)==null?void 0:c.call(o,u,t))??`${u}${t}`;return`-${m.getIdentity(v)}`}function h(u,t){return Object.entries(g).filter(([v])=>{var c;return((c=i[v])==null?void 0:c.pseudoSuffix)===t}).reduce((v,[c,F])=>(F.forEach(H=>{var R;const p=V(c,H),y=`.${f(c,H)}`;let k=[];t?t==="H"?k=[...o(`${y}:hover`,p),...o(`.${$.hover.className}:hover>${y}`,p)]:t==="F"?k=[...o(`${y}:focus-within`,p),...o(`.${$.focus.className}:focus-within>${y}`,p)]:t==="A"&&(k=o(`${y}:active`,p)):k=o(y,p);const B=((R=p.formatValue)==null?void 0:R.call(p,c,H))??H,L=i[c].cssNames.map(O=>`${O}:${B};`).join("");v.push(`${k.join(",")}{${L}}`)}),v),u);function o(v,c){return c.formatSelector?c.formatSelector(v):[v]}}function V(u,t){const o=i[u];return o.isThemeStyle?o:o.values1.values.includes(t)?o.values1:o.values2.values.includes(t)?o.values2:o.values3}function N(){const u="crono-styles",o=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let v=o.getElementById(u);return v||(v=o.createElement("style"),v.setAttribute("id",u),v.setAttribute("type","text/css"),o.head.insertBefore(v,o.head.firstChild)),v}})(z||(z={}));const P=typeof window<"u"&&typeof window.document<"u",q=P?b.useLayoutEffect:b.useEffect;function W(a,r){const m=I.useTheme(a);return q(z.flush,[a]),b.useMemo(()=>{const n=[r?z.svgClassName:z.doxClassName],l=m?{...C(m),...C(a)}:C(a);return"inline"in l&&(l.display==="block"?l.display="inline-block":l.display==="flex"?l.display="inline-flex":l.display==="grid"&&(l.display="inline-grid"),delete l.inline),"inlineH"in l&&(l.displayH==="block"?l.displayH="inline-block":l.displayH==="flex"?l.displayH="inline-flex":l.displayH==="grid"&&(l.displayH="inline-grid"),delete l.inlineH),"inlineF"in l&&(l.displayF==="block"?l.displayF="inline-block":l.displayF==="flex"?l.displayF="inline-flex":l.displayF==="grid"&&(l.displayF="inline-grid"),delete l.inlineF),"inlineA"in l&&(l.displayA==="block"?l.displayA="inline-block":l.displayA==="flex"?l.displayA="inline-flex":l.displayA==="grid"&&(l.displayA="inline-grid"),delete l.inlineA),Object.entries(l).forEach(([d,g])=>{n.push(z.get(d,g))}),n},[a,m])}function C(a){const r={...a};return Object.keys(r).forEach(n=>{const l=w[n];l&&(l.key in r||(r[l.key]=r[n]),delete r[n])}),r}function G(a,r){const{tag:m="div",children:n,props:l,className:d,style:g}=a,x=W(a,m==="svg"),S=b.useMemo(()=>E.ClassNameUtils.classNames(d,x).join(" "),[a]),f={...l,className:S};g&&(f.style=g),r&&(f.ref=r);const[h,V]=b.useState(!1),N=typeof n=="function";return N&&(f.onMouseEnter=()=>V(!0),f.onMouseLeave=()=>V(!1)),b.createElement(m,f,N?n({isHover:h}):n)}const U=b.forwardRef(G);exports.default=U;
@@ -2,9 +2,11 @@ import React, { RefAttributes } from 'react';
2
2
  import ClassNameUtils from '../utils/className/classNameUtils';
3
3
  import { DoxStyleProps } from './dox/doxStyles';
4
4
  import { StylesContext } from './dox/stylesContext';
5
- type AllProps<TTag extends keyof JSX.IntrinsicElements> = React.ComponentProps<TTag>;
6
- type TagPropsType<TTag extends keyof JSX.IntrinsicElements> = Omit<AllProps<TTag>, 'className' | 'style' | 'ref'>;
7
- interface Props<TTag extends keyof JSX.IntrinsicElements> extends DoxStyleProps {
5
+ type ExtractElementType<T> = T extends React.DetailedHTMLProps<React.HTMLAttributes<infer E>, infer E> ? E : T extends React.SVGProps<infer E> ? E : never;
6
+ type ExtractElementFromTag<T extends keyof React.JSX.IntrinsicElements> = ExtractElementType<React.JSX.IntrinsicElements[T]>;
7
+ type AllProps<TTag extends keyof React.JSX.IntrinsicElements> = React.ComponentProps<TTag>;
8
+ type TagPropsType<TTag extends keyof React.JSX.IntrinsicElements> = Omit<AllProps<TTag>, 'className' | 'style' | 'ref'>;
9
+ interface Props<TTag extends keyof React.JSX.IntrinsicElements> extends DoxStyleProps {
8
10
  children?: React.ReactNode | ((props: {
9
11
  isHover: boolean;
10
12
  }) => React.ReactNode);
@@ -13,7 +15,7 @@ interface Props<TTag extends keyof JSX.IntrinsicElements> extends DoxStyleProps
13
15
  className?: ClassNameUtils.ClassNameType;
14
16
  style?: React.ComponentProps<TTag>['style'];
15
17
  }
16
- declare const _default: <TTag extends keyof JSX.IntrinsicElements = "div">(props: Props<TTag> & React.RefAttributes<ExtractElementType<JSX.IntrinsicElements[TTag]>>) => JSX.Element;
18
+ declare const _default: <TTag extends keyof React.JSX.IntrinsicElements = "div">(props: Props<TTag> & React.RefAttributes<ExtractElementType<React.JSX.IntrinsicElements[TTag]>>) => React.ReactNode;
17
19
  export default _default;
18
20
  declare const flushStyles: typeof StylesContext.flush;
19
21
  export { flushStyles };