@cronocode/react-box 1.6.9 → 1.7.1

package/{plugins.mjs → theme.js}

@@ -1,12 +1,61 @@
-var c;
-((i) => {
-  function h(r) {
-    const _ = Object.entries(r.colors).map(([o, e]) => `--color${o}: ${e};`).join(`
-  `), t = Object.entries(r.shadows).map(([o, e]) => `--shadow${o}: ${e};`).join(`
-  `), n = Object.entries(r.backgrounds).map(([o, e]) => `--background${o}: ${e};`).join(`
-  `), l = [":root {"];
-    _ && l.push(`  ${_}`), t && l.push(`  ${t}`), n && l.push(`  ${n}`), l.push("}");
-    const $ = Object.keys(r.colors).map((o) => `
+import { useMemo as g } from "react";
+const b = {
+  button: {
+    styles: {
+      display: "inline-block",
+      p: 3,
+      cursor: "pointer",
+      b: 1,
+      borderRadius: 1
+    },
+    disabled: {
+      cursor: "default"
+    }
+  },
+  checkbox: {
+    styles: {
+      display: "inline-block",
+      b: 1,
+      p: 2
+    }
+  },
+  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
+    }
+  }
+};
+let _ = b;
+var u;
+((h) => {
+  function d(r) {
+    _ = r, i();
+  }
+  h.setup = d;
+  function $(r, e) {
+    const t = Object.entries(r.colors).map(([o, c]) => `--color${o}: ${c};`).join(`
+  `), l = Object.entries(r.shadows).map(([o, c]) => `--shadow${o}: ${c};`).join(`
+  `), n = Object.entries(r.backgrounds).map(([o, c]) => `--background${o}: ${c};`).join(`
+  `), s = [":root {"];
+    t && s.push(`  ${t}`), l && s.push(`  ${l}`), n && s.push(`  ${n}`), s.push("}");
+    const a = Object.keys(r.colors).map((o) => `
   .color_${o},
   .color_h_${o}:hover,
   ._h:hover>.color_h_${o} {
@@ -125,7 +174,7 @@ var c;
     line {
       stroke: var(--color${o});
     }
-  }`), s = Object.keys(r.shadows).map((o) => `
+  }`), y = Object.keys(r.shadows).map((o) => `
   .shadow_${o},
   .shadow_h_${o}:hover,
   ._h:hover>.shadow_h_${o} {
@@ -139,7 +188,7 @@ var c;
   
   .shadow_a_${o}:active {
     box-shadow: var(--shadow${o});
-  }`), b = Object.keys(r.backgrounds).map((o) => `
+  }`), f = Object.keys(r.backgrounds).map((o) => `
   .bg_${o},
   .bg_h_${o}:hover,
   ._h:hover>.bg_h_${o} {
@@ -153,12 +202,14 @@ var c;
   
   .bg_a_${o}:active {
     background: var(--background${o});
-  }`), p = Object.keys(r.colors).map((o) => `'${o}'`).join(" | "), u = Object.keys(r.backgrounds).map((o) => `'${o}'`).join(" | "), C = Object.keys(r.shadows).map((o) => `'${o}'`).join(" | "), d = `import '@cronocode/react-box';
+  }`), p = [...a, ...y, ...f].join(`
+`) + `
+`, C = Object.keys(r.colors).map((o) => `'${o}'`).join(" | "), v = Object.keys(r.backgrounds).map((o) => `'${o}'`).join(" | "), k = Object.keys(r.shadows).map((o) => `'${o}'`).join(" | "), T = `import '@cronocode/react-box';
   
-  declare module '@cronocode/react-box/types' {
-    type ColorType = ${p};
-    type BackgroundType = ${u};
-    type ShadowType = ${C};
+  declare module '${(e == null ? void 0 : e.namespacePath) ?? "@cronocode/react-box/types"}' {
+    type ColorType = ${C};
+    type BackgroundType = ${v};
+    type ShadowType = ${k};
   
     namespace Augmented {
       interface BoxProps {
@@ -170,10 +221,6 @@ var c;
         bgColorH?: ColorType;
         bgColorF?: ColorType;
         bgColorA?: ColorType;
-        backgroundColor?: ColorType;
-        backgroundColorH?: ColorType;
-        backgroundColorF?: ColorType;
-        backgroundColorA?: ColorType;
         borderColor?: ColorType;
         borderColorH?: ColorType;
         borderColorF?: ColorType;
@@ -182,10 +229,6 @@ var c;
         outlineColorH?: ColorType;
         outlineColorF?: ColorType;
         outlineColorA?: ColorType;
-        bg?: BackgroundType;
-        bgH?: BackgroundType;
-        bgF?: BackgroundType;
-        bgA?: BackgroundType;
         background?: BackgroundType;
         backgroundH?: BackgroundType;
         backgroundF?: BackgroundType;
@@ -210,12 +253,35 @@ var c;
   }
   `;
     return {
-      themeCss: [l.join(`
-`), ...$, ...s, ...b].join(`
-`) + `
-`,
-      boxDts: d
+      variables: s.join(`
+`),
+      themeCss: p,
+      boxDts: T
     };
   }
-  i.boxTheme = h;
-})(c || (c = {}));
+  h.setupAugmentedProps = $;
+  function i() {
+    Object.keys(b).forEach((e) => {
+      const t = _[e], l = b[e];
+      t ? (t.styles = { ...l.styles, ...t.styles }, t.disabled && l.disabled && (t.disabled = { ...l.disabled, ...t.disabled })) : _[e] = b[e];
+    });
+  }
+})(u || (u = {}));
+const j = u;
+function x(h) {
+  const { clean: d, disabled: $, theme: i, component: r } = h;
+  return g(() => {
+    var l, n, s;
+    if (d)
+      return;
+    let e = _[r] ?? ((l = _.components) == null ? void 0 : l[r]);
+    if (!e)
+      return;
+    let t = i ? { ...e.styles, ...(n = e.themes) == null ? void 0 : n[i].styles } : e.styles;
+    return $ ? i ? { ...t, ...e.disabled, ...(s = e.themes) == null ? void 0 : s[i].disabled } : { ...t, ...e.disabled } : t;
+  }, [r, d, $, i]);
+}
+export {
+  j as T,
+  x as u
+};

package/utils.js

@@ -0,0 +1,107 @@
+import { useMemo as x } from "react";
+var p;
+((c) => {
+  function i(...u) {
+    return u.reduce((n, o) => o ? typeof o == "string" ? (n.push(o), n) : Array.isArray(o) ? (n.push(...i(...o)), n) : (Object.entries(o).forEach(([r, e]) => {
+      e && n.push(r);
+    }), n) : n, []);
+  }
+  c.classNames = i;
+})(p || (p = {}));
+const y = p;
+class I {
+  constructor() {
+    this._index = 0, this._cache = {};
+  }
+  getIdentity(i) {
+    return this._cache[i] || (this._cache[i] = this.getByIndex(this._index++)), this._cache[i];
+  }
+  getByIndex(i) {
+    const { first: u, next: n } = m, o = i - u.length;
+    if (o < 0)
+      return u[i];
+    const r = Math.floor(o / n.length), e = o - r * n.length;
+    return this.getByIndex(r) + n[e];
+  }
+}
+const m = {
+  first: "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ",
+  next: "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"
+};
+var l;
+((c) => {
+  function i(n, ...o) {
+    const r = { ...n }, e = {};
+    return o.forEach((t) => {
+      t in r && (e[t] = r[t], delete r[t]);
+    }), [e, r];
+  }
+  c.moveToTagProps = i;
+  function u(n, o, r) {
+    const e = { ...n }, t = e.props || {};
+    return o.forEach((s) => {
+      if (s in e) {
+        if (t[s] = e[s], s === "disabled")
+          return;
+        delete e[s];
+      }
+    }), r && Object.entries(r).forEach(([s, f]) => {
+      t[s] = f;
+    }), e.props = t, e;
+  }
+  c.buildProps = u;
+})(l || (l = {}));
+const E = l;
+var g;
+((c) => {
+  function i(n) {
+    const o = Array.from(n.elements).reduce((r, e) => {
+      const t = e.name;
+      return t && (r[t] || (r[t] = []), r[t].push(e)), r;
+    }, {});
+    return Object.entries(o).reduce((r, [e, t]) => {
+      if (t.length === 1) {
+        const s = t[0];
+        u(r, e, s.type === "checkbox" || s.type === "radio" ? s.checked : s.value);
+      } else {
+        const s = t.reduce((f, d) => (d.type === "checkbox" || d.type === "radio" ? d.checked && f.push(d.value) : f.push(d.value), f), []);
+        u(r, e, s);
+      }
+      return r;
+    }, {});
+  }
+  c.getFormEntries = i;
+  function u(n, o, r) {
+    if (o.includes(".")) {
+      const e = o.split(".");
+      let t = n;
+      e.forEach((s, f) => {
+        if (e.length > f + 1) {
+          const d = s.match(/^(.+)\[(\d)\]$/);
+          if (d) {
+            const [, h, a] = d;
+            t[h] = t[h] || [], t[h][a] = t[h][a] || {}, t = t[h][a];
+          } else
+            t[s] = t[s] || {}, t = t[s];
+        } else
+          t[s] = r;
+      });
+    } else
+      n[o] = r;
+  }
+})(g || (g = {}));
+const P = g;
+function v() {
+  return x(() => {
+    const c = "crono-box";
+    let i = document.getElementById(c);
+    return i || (i = document.createElement("div"), i.id = c, document.body.appendChild(i)), i;
+  }, []);
+}
+export {
+  y as C,
+  P as F,
+  I,
+  E as O,
+  v as u
+};

package/box.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./components/dox.cjs");require("react");require("./utils.cjs");require("./theme.cjs");exports.default=e.default;

package/box.mjs

@@ -1,7 +0,0 @@
-import r from "./components/dox.mjs";
-import "react";
-import "./utils.mjs";
-import "./theme.mjs";
-export {
-  r as default
-};