@cronocode/react-box 1.3.9 → 1.4.1

package/components/baseSvg.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react"),o=require("../utils/utils.cjs.js"),n=require("../baseSvg.module.css.cjs.js");function w(l){const{children:s,props:v,className:c,style:m,viewBox:h,width:d,height:S}=l,e=c?o.ClassNameUtils.classNames(c,n.classes.base):[n.classes.base];Object.entries(l).forEach(([a,u])=>{const f=n.classes[a+u];f?e.push(f):a in o.themeSvgClasses&&e.push(`${o.themeSvgClasses[a]}${u}`)});const t={...v,style:{...m,width:d,height:S},className:e.join(" "),viewBox:h||"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",fill:"none"},[p,i]=g.useState(!1),r=typeof s=="function";return r&&(t.onMouseEnter=()=>i(!0),t.onMouseLeave=()=>i(!1)),g.createElement("svg",t,r?s({isHover:p}):s)}exports.default=w;

package/components/baseSvg.d.ts

@@ -1,17 +1,14 @@
 import React from 'react';
-import { Activated, ColorType, Focused, Hovered } from '../types';
+import { SvgStyles } from '../types';
 import ClassNameUtils from '../utils/className/classNameUtils';
-interface SvgNormalStyles {
-    fill?: ColorType | string;
-    stroke?: ColorType | string;
-    rotate?: 0 | 90 | 180 | 270;
-    flip?: 'xAxis' | 'yAxis';
-}
-export type SvgStyles = SvgNormalStyles & Hovered<SvgNormalStyles> & Focused<SvgNormalStyles> & Activated<SvgNormalStyles>;
 type AllSvgProps = React.SVGProps<SVGElement>;
 type SvgPropsType = Omit<AllSvgProps, 'className' | 'style' | 'width' | 'height'>;
 type SvgStyleType = Omit<React.CSSProperties, 'width' | 'height'>;
-interface Props extends SvgStyles {
+export declare namespace Augmented {
+    interface Props {
+    }
+}
+interface Props extends SvgStyles, Augmented.Props {
     children?: React.ReactNode | ((props: {
         isHover: boolean;
     }) => React.ReactNode);

package/components/{baseSvg.mjs → baseSvg.es.js}

@@ -1,6 +1,6 @@
 import d, { useState as N } from "react";
-import { C as x, t as m } from "../utils/utils.mjs";
-import { c as a } from "../baseSvg.module.css.mjs";
+import { C as x, t as m } from "../utils/utils.es.js";
+import { c as a } from "../baseSvg.module.css.es.js";
 function C(n) {
   const { children: s, props: p, className: r, style: h, viewBox: u, width: v, height: g } = n, e = r ? x.classNames(r, a.base) : [a.base];
   Object.entries(n).forEach(([o, l]) => {

package/components/button.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs.js"),s=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");const i=["type","onClick","disabled"];function c(t,e){const o=s.ObjectUtils.buildProps(t,i);return r.jsx(u.default,{ref:e,tag:"button",component:"button",...o})}const l=n.forwardRef(c);exports.default=l;

package/components/{button.mjs → button.es.js}

@@ -1,9 +1,9 @@
 import { jsx as n } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
-import i from "../box.mjs";
-import { O as m } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import i from "../box.es.js";
+import { O as m } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 const s = ["type", "onClick", "disabled"];
 function e(o, t) {
   const r = m.buildProps(o, s);

package/components/checkbox.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),t=require("../box.cjs.js"),i=require("../utils/utils.cjs.js"),u=require("./flex.cjs.js"),l=require("../box.module.css.cjs.js");require("../theme.cjs.js");const a=["name","onInput","onChange","disabled","autoFocus","readOnly","required","value","checked","defaultChecked"];function d(n,s){const{native:o}=n,r=i.ObjectUtils.buildProps(n,a,{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(d);exports.default=x;

package/components/{checkbox.mjs → checkbox.es.js}

@@ -1,10 +1,10 @@
 import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import { forwardRef as s } from "react";
-import t from "../box.mjs";
-import { O as a } from "../utils/utils.mjs";
-import l from "./flex.mjs";
-import { c as d } from "../box.module.css.mjs";
-import "../theme.mjs";
+import t from "../box.es.js";
+import { O as a } from "../utils/utils.es.js";
+import l from "./flex.es.js";
+import { c as d } from "../box.module.css.es.js";
+import "../theme.es.js";
 const p = [
   "name",
   "onInput",

package/components/dataGrid.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),u=require("../box.cjs.js");require("react");require("../box.module.css.cjs.js");require("../utils/utils.cjs.js");require("../theme.cjs.js");function o(r){if(!(r!=null&&r.length))return{rows:[],columns:[]};const t=Object.keys(r[0]);return{rows:r.map(e=>({dataRow:e,cells:t.map(n=>({key:n,value:e[n]}))})),columns:t.map(e=>({key:e}))}}function c(r){const{data:t}=r,e=o(t);return e.columns.length===0?i.jsx(u.default,{display:"grid",children:"empty grid"}):i.jsxs(u.default,{display:"grid",children:[e.columns.map((n,s)=>i.jsx(u.default,{style:{gridColumn:s+1},children:n.key.toString()},n.key.toString())),e.rows.map((n,s)=>n.cells.map(l=>i.jsx(u.default,{children:l.value},l.key.toString()+s)))]})}exports.default=c;

package/components/{dataGrid.mjs → dataGrid.es.js}

@@ -1,9 +1,9 @@
 import { jsx as s, jsxs as l } from "react/jsx-runtime";
-import t from "../box.mjs";
+import t from "../box.es.js";
 import "react";
-import "../box.module.css.mjs";
-import "../utils/utils.mjs";
-import "../theme.mjs";
+import "../box.module.css.es.js";
+import "../utils/utils.es.js";
+import "../theme.es.js";
 function p(i) {
   if (!(i != null && i.length))
     return {

package/components/flex.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs.js");require("../box.module.css.cjs.js");require("../utils/utils.cjs.js");require("../theme.cjs.js");function l(e,r){const{inline:t}=e;return i.jsx(u.default,{ref:r,display:t?"inline-flex":"flex",...e})}const o=n.forwardRef(l);exports.default=o;

package/components/{flex.mjs → flex.es.js}

@@ -1,9 +1,9 @@
 import { jsx as t } from "react/jsx-runtime";
 import { forwardRef as e } from "react";
-import f from "../box.mjs";
-import "../box.module.css.mjs";
-import "../utils/utils.mjs";
-import "../theme.mjs";
+import f from "../box.es.js";
+import "../box.module.css.es.js";
+import "../utils/utils.es.js";
+import "../theme.es.js";
 function m(o, r) {
   const { inline: i } = o;
   return /* @__PURE__ */ t(f, { ref: r, display: i ? "inline-flex" : "flex", ...o });

package/components/form.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),o=require("react"),a=require("../box.cjs.js"),f=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");function m(e){const{onSubmit:n,props:u}=e,r=o.useRef(null),s=o.useCallback(t=>{t.preventDefault();const c=f.FormUtils.getFormEntries(r.current);n(c,t)},[]),i={...u,onSubmit:s,ref:r};return l.jsx(a.default,{tag:"form",...e,props:i})}exports.default=m;

package/components/{form.mjs → form.es.js}

@@ -1,9 +1,9 @@
 import { jsx as i } from "react/jsx-runtime";
 import { useRef as p, useCallback as u } from "react";
-import a from "../box.mjs";
-import { F as c } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import a from "../box.es.js";
+import { F as c } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 function d(o) {
   const { onSubmit: m, props: n } = o, r = p(null), e = u((t) => {
     t.preventDefault();

package/components/radioButton.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs.js"),i=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");const a=["name","onInput","onChange","disabled","value","autoFocus","readOnly","required","checked","defaultChecked"];function s(e,t){const o=i.ObjectUtils.buildProps(e,a,{type:"radio"});return r.jsx(u.default,{ref:t,tag:"input",component:"radioButton",...o})}const c=n.forwardRef(s);exports.default=c;

package/components/{radioButton.mjs → radioButton.es.js}

@@ -1,9 +1,9 @@
 import { jsx as e } from "react/jsx-runtime";
 import { forwardRef as n } from "react";
-import a from "../box.mjs";
-import { O as i } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import a from "../box.es.js";
+import { O as i } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 const d = [
   "name",
   "onInput",

package/components/textarea.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("react"),n=require("../box.cjs.js"),u=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");const s=["name","onInput","onChange","placeholder","disabled","value","defaultValue","rows","cols","autoFocus","maxLength","minLength","readOnly","required"];function i(e,t){const r=u.ObjectUtils.buildProps(e,s);return a.jsx(n.default,{ref:t,tag:"textarea",component:"textarea",...r})}const c=o.forwardRef(i);exports.default=c;

package/components/{textarea.mjs → textarea.es.js}

@@ -1,9 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
 import { forwardRef as a } from "react";
-import n from "../box.mjs";
-import { O as m } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import n from "../box.es.js";
+import { O as m } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 const s = [
   "name",
   "onInput",

package/components/textbox.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),n=require("react"),u=require("../box.cjs.js"),a=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");const s=["name","onInput","onChange","type","placeholder","disabled","defaultValue","autoFocus","readOnly","required","value","pattern"];function i(e,t){const r=a.ObjectUtils.buildProps(e,s);return o.jsx(u.default,{ref:t,tag:"input",component:"textbox",...r})}const c=n.forwardRef(i);exports.default=c;

package/components/{textbox.mjs → textbox.es.js}

@@ -1,9 +1,9 @@
 import { jsx as r } from "react/jsx-runtime";
 import { forwardRef as n } from "react";
-import a from "../box.mjs";
-import { O as p } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import a from "../box.es.js";
+import { O as p } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 const i = [
   "name",
   "onInput",

package/components/tooltip.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),v=require("react-dom"),d=require("../box.cjs.js"),s=require("react"),q=require("../utils/utils.cjs.js");require("../box.module.css.cjs.js");require("../theme.cjs.js");function x(u){const{children:f,onPositionChange:c}=u,o=s.useRef(null),[e,p]=s.useState(),w=q.usePortalContainer(),b=s.useCallback((t,r)=>{const n=a=>{a.target.contains(t)&&r()};return document.addEventListener("scroll",n,{capture:!0}),()=>{document.removeEventListener("scroll",n,{capture:!0})}},[e]),m=s.useCallback((t,r)=>{const n=a=>{r()};return window.addEventListener("resize",n,{capture:!0}),()=>{window.removeEventListener("resize",n,{capture:!0})}},[e]),i=s.useCallback(()=>{if(o.current){const t=o.current.getBoundingClientRect(),r=t.top+window.scrollY,n=t.left+window.scrollX;((e==null?void 0:e.top)!==r||(e==null?void 0:e.left)!==n)&&(c==null||c({top:r,left:n}),p({top:t.top+window.scrollY,left:t.left+window.scrollX}))}},[e]);return s.useLayoutEffect(()=>{if(o.current){i();const t=b(o.current,i),r=m(o.current,i);return()=>{t(),r()}}},[e]),l.jsxs(l.Fragment,{children:[l.jsx(d.default,{ref:o,position:"absolute",top:0,left:0,...u,children:void 0}),e&&v.createPortal(l.jsx(d.default,{position:"absolute",top:0,left:0,transition:"none",style:{transform:`translate(${e.left}px,${e.top}px)`},children:f}),w)]})}exports.default=x;

package/components/{tooltip.mjs → tooltip.es.js}

@@ -1,10 +1,10 @@
 import { jsxs as x, Fragment as b, jsx as a } from "react/jsx-runtime";
 import { createPortal as E } from "react-dom";
-import f from "../box.mjs";
+import f from "../box.es.js";
 import { useRef as L, useState as z, useCallback as c, useLayoutEffect as g } from "react";
-import { u as C } from "../utils/utils.mjs";
-import "../box.module.css.mjs";
-import "../theme.mjs";
+import { u as C } from "../utils/utils.es.js";
+import "../box.module.css.es.js";
+import "../theme.es.js";
 function P(i) {
   const { children: p, onPositionChange: s } = i, n = L(null), [t, d] = z(), m = C(), w = c(
     (e, r) => {

package/package.json

@@ -1,25 +1,30 @@
 {
   "name": "@cronocode/react-box",
-  "version": "1.3.9",
-  "main": "./box.mjs",
-  "module": "./box.mjs",
+  "version": "1.4.1",
+  "main": "./box.cjs.js",
+  "module": "./box.mjs.js",
   "types": "./box.d.ts",
   "exports": {
     ".": {
-      "import": "./box.mjs",
-      "require": "./box.mjs",
+      "import": "./box.mjs.js",
+      "require": "./box.cjs.js",
       "types": "./box.d.ts"
     },
     "./style.css": "./style.css",
     "./theme": {
-      "import": "./theme.mjs",
-      "require": "./theme.mjs",
+      "import": "./theme.mjs.js",
+      "require": "./theme.cjs.js",
       "types": "./theme.d.ts"
     },
     "./components/*": {
-      "import": "./components/*.mjs",
-      "require": "./components/*.mjs",
+      "import": "./components/*.mjs.js",
+      "require": "./components/*.cjs.js",
       "types": "./components/*.d.ts"
+    },
+    "./plugins": {
+      "import": "./plugins.mjs.js",
+      "require": "./plugins.cjs.js",
+      "types": "./plugins.d.ts"
     }
   },
   "scripts": {
@@ -28,7 +33,7 @@
     "preview": "vite preview",
     "build": "vite build",
     "build:dev": "vite build --mode dev",
-    "postbuild": "cp package.json dist & cp LICENSE dist & cp -r plugins dist & rm ./dist/index.d.ts & rm ./dist/index.js",
+    "postbuild": "cp package.json dist & cp LICENSE dist & rm ./dist/index.d.ts & rm ./dist/index.js",
     "compile": "tsc --noEmit --skipLibCheck",
     "test": "echo \"Error: no test specified\" && exit 1"
   },

package/plugins.cjs.js

@@ -0,0 +1,220 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function u(r){return{name:"boxTheme",configResolved(y){const n=Object.entries(r.colors).map(([o,e])=>`--color${o}: ${e};`).join(`
+`),_=Object.entries(r.shadows).map(([o,e])=>`--shadow${o}: ${e};`).join(`
+`),i=Object.entries(r.backgrounds).map(([o,e])=>`--background${o}: ${e};`).join(`
+`),$=`:root {
+  ${n}
+  ${_}
+  ${i}
+}`,h=Object.keys(r.colors).map(o=>`
+.color_${o},
+.color_h_${o}:hover,
+._h:hover>.color_h_${o} {
+  color: var(--color${o});
+}
+
+.color_f_${o}:focus-within,
+._f:focus-within>.color_f_${o} {
+  color: var(--color${o});
+}
+
+.color_a_${o}:active {
+  color: var(--color${o});
+}
+
+.bgColor_${o},
+.bgColor_h_${o}:hover,
+._h:hover>.bgColor_h_${o} {
+  background-color: var(--color${o});
+}
+
+.bgColor_f_${o}:focus-within,
+._f:focus-within>.bgColor_f_${o} {
+  background-color: var(--color${o});
+}
+
+.bgColor_a_${o}:active {
+  background-color: var(--color${o});
+}
+
+.borderColor_${o},
+.borderColor_h_${o}:hover,
+._h:hover>.borderColor_h_${o} {
+  border-color: var(--color${o});
+}
+
+.borderColor_f_${o}:focus-within,
+._f:focus-within>.borderColor_f_${o} {
+  border-color: var(--color${o});
+}
+
+.borderColor_a_${o}:active {
+  border-color: var(--color${o});
+}
+
+.outlineColor_${o},
+.outlineColor_h_${o}:hover,
+._h:hover>.outlineColor_h_${o} {
+  outline-color: var(--color${o});
+}
+
+.outlineColor_f_${o}:focus-within,
+._f:focus-within>.outlineColor_f_${o} {
+  outline-color: var(--color${o});
+}
+
+.outlineColor_a_${o}:active {
+  outline-color: var(--color${o});
+}
+
+.fill_${o},
+.fill_h_${o}:hover,
+._h:hover>.fill_h_${o} {
+  path,
+  circle,
+  rect,
+  line {
+    fill: var(--color${o});
+  }
+}
+
+.fill_f_${o}:focus-within,
+._f:focus-within>.fill_f_${o} {
+  path,
+  circle,
+  rect,
+  line {
+    fill: var(--color${o});
+  }
+}
+
+.fill_a_${o}:active {
+  path,
+  circle,
+  rect,
+  line {
+    fill: var(--color${o});
+  }
+}
+
+.stroke_${o},
+.stroke_h_${o}:hover,
+._h:hover>.stroke_h_${o} {
+  path,
+  circle,
+  rect,
+  line {
+    stroke: var(--color${o});
+  }
+}
+
+.stroke_f_${o}:focus-within,
+._f:focus-within>.stroke_f_${o} {
+  path,
+  circle,
+  rect,
+  line {
+    stroke: var(--color${o});
+  }
+}
+
+.stroke_a_${o}:active {
+  path,
+  circle,
+  rect,
+  line {
+    stroke: var(--color${o});
+  }
+}`),s=Object.keys(r.shadows).map(o=>`
+.shadow_${o},
+.shadow_h_${o}:hover,
+._h:hover>.shadow_h_${o} {
+  box-shadow: var(--shadow${o});
+}
+
+.shadow_f_${o}:focus-within,
+._f:focus-within>.shadow_f_${o} {
+  box-shadow: var(--shadow${o});
+}
+
+.shadow_a_${o}:active {
+  box-shadow: var(--shadow${o});
+}`),b=Object.keys(r.backgrounds).map(o=>`
+.bg_${o},
+.bg_h_${o}:hover,
+._h:hover>.bg_h_${o} {
+  background: var(--background${o});
+}
+
+.bg_f_${o}:focus-within,
+._f:focus-within>.bg_f_${o} {
+  background: var(--background${o});
+}
+
+.bg_a_${o}:active {
+  background: var(--background${o});
+}`),l=Object.keys(r.colors).map(o=>`'${o}'`).join(" | "),t=Object.keys(r.backgrounds).map(o=>`'${o}'`).join(" | "),c=Object.keys(r.shadows).map(o=>`'${o}'`).join(" | "),d=`import '@cronocode/react-box';
+
+declare module '@cronocode/react-box' {
+  type ColorType = ${l};
+  type BackgroundType = ${t};
+  type ShadowType = ${c};
+
+  namespace Augmented {
+    interface Props {
+      color?: ColorType;
+      colorH?: ColorType;
+      colorF?: ColorType;
+      colorA?: ColorType;
+      bgColor?: ColorType;
+      bgColorH?: ColorType;
+      bgColorF?: ColorType;
+      bgColorA?: ColorType;
+      backgroundColor?: ColorType;
+      backgroundColorH?: ColorType;
+      backgroundColorF?: ColorType;
+      backgroundColorA?: ColorType;
+      borderColor?: ColorType;
+      borderColorH?: ColorType;
+      borderColorF?: ColorType;
+      borderColorA?: ColorType;
+      outlineColor?: ColorType;
+      outlineColorH?: ColorType;
+      outlineColorF?: ColorType;
+      outlineColorA?: ColorType;
+      bg?: BackgroundType;
+      bgH?: BackgroundType;
+      bgF?: BackgroundType;
+      bgA?: BackgroundType;
+      background?: BackgroundType;
+      backgroundH?: BackgroundType;
+      backgroundF?: BackgroundType;
+      backgroundA?: BackgroundType;
+      shadow?: ShadowType;
+      shadowH?: ShadowType;
+      shadowF?: ShadowType;
+      shadowA?: ShadowType;
+    }
+  }
+}
+`,p=`import '@cronocode/react-box/components/baseSvg';
+
+declare module '@cronocode/react-box/components/baseSvg' {
+  type ColorType = ${l};
+  type BackgroundType = ${t};
+  type ShadowType = ${c};
+
+  namespace Augmented {
+    interface Props {
+      fill?: ColorType;
+      fillH?: ColorType;
+      fillF?: ColorType;
+      fillA?: ColorType;
+      stroke?: ColorType;
+      strokeH?: ColorType;
+      strokeF?: ColorType;
+      strokeA?: ColorType;
+    }
+  }
+}
+`;(void 0)(r.cssPath,[$,...h,...s,...b].join(`
+`)),(void 0)(r.boxDtsPath,d),(void 0)(r.baseSvgDtsPath,p)}}}exports.boxTheme=u;

package/plugins.d.ts

@@ -0,0 +1,11 @@
+import { PluginOption } from 'vite';
+interface BoxThemeOptions {
+    cssPath: string;
+    boxDtsPath: string;
+    baseSvgDtsPath: string;
+    colors: Record<string, string>;
+    shadows: Record<string, string>;
+    backgrounds: Record<string, string>;
+}
+export declare function boxTheme(options: BoxThemeOptions): PluginOption;
+export {};