@cronocode/react-box 1.3.4 → 1.3.6

package/baseSvg.module.css.mjs

@@ -1,4 +1,4 @@
-const t = { base: "cGQ", rotate0: "cGR", rotateH0: "cGS", hovertrue: "_h", rotate90: "cGT", rotateH90: "cGU", rotate180: "cGV", rotateH180: "cGW", rotate270: "cGX", rotateH270: "cGY", flipxAxis: "cGZ", flipHxAxis: "cG0", flipyAxis: "cG1", flipHyAxis: "cG2", rotateF0: "cG3", focustrue: "_f", rotateF90: "cG4", rotateF180: "cG5", rotateF270: "cG6", flipFxAxis: "cG7", flipFyAxis: "cG8", rotateA0: "cG9", rotateA90: "cHa", rotateA180: "cHb", rotateA270: "cHc", flipAxAxis: "cHd", flipAyAxis: "cHe" };
+const t = { base: "bDG", rotate0: "bDH", rotateH0: "bDI", hovertrue: "_h", rotate90: "bDJ", rotateH90: "bDK", rotate180: "bDL", rotateH180: "bDM", rotate270: "bDN", rotateH270: "bDO", flipxAxis: "bDP", flipHxAxis: "bDQ", flipyAxis: "bDR", flipHyAxis: "bDS", rotateF0: "bDT", focustrue: "_f", rotateF90: "bDU", rotateF180: "bDV", rotateF270: "bDW", flipFxAxis: "bDX", flipFyAxis: "bDY", rotateA0: "bDZ", rotateA90: "bD0", rotateA180: "bD1", rotateA270: "bD2", flipAxAxis: "bD3", flipAyAxis: "bD4" };
 export {
   t as c
 };

package/box.d.ts

@@ -4,7 +4,11 @@ import ClassNameUtils from './utils/className/classNameUtils';
 import { ThemeComponentProps } from './theme';
 type AllProps<TTag extends keyof React.ReactHTML> = React.ComponentProps<TTag>;
 type TagPropsType<TTag extends keyof React.ReactHTML> = Omit<AllProps<TTag>, 'className' | 'style' | 'ref'>;
-interface Props<TTag extends keyof React.ReactHTML> extends BoxStyles, ThemeComponentProps {
+export declare namespace Augmented {
+    interface Props {
+    }
+}
+interface Props<TTag extends keyof React.ReactHTML> extends BoxStyles, ThemeComponentProps, Augmented.Props {
     children?: React.ReactNode | ((props: {
         isHover: boolean;
     }) => React.ReactNode);

package/box.mjs

@@ -1,20 +1,54 @@
-import b, { forwardRef as g, useMemo as E, useState as H } from "react";
-import { c as n } from "./box.module.css.mjs";
-import { C as M, a as d } from "./utils/utils.mjs";
-import { useTheme as P } from "./theme.mjs";
-function S(e, r) {
-  const { tag: h, children: t, props: p, className: c, style: l } = e, N = P(e), x = E(() => {
-    const o = c ? M.classNames(n.box, c) : [n.box], C = { ...N, ...e };
-    return Object.entries(C).forEach(([a, i]) => {
-      const u = n[a + i];
-      u ? o.push(u) : a in d && o.push(`${d[a]}${i}`);
-    }), o.join(" ");
-  }, [e]), s = { ...p, className: x };
-  l && (s.style = l), r && (s.ref = r);
-  const [v, m] = H(!1), f = typeof t == "function";
-  return f && (s.onMouseEnter = () => m(!0), s.onMouseLeave = () => m(!1)), b.createElement(h || "div", s, f ? t({ isHover: v }) : t);
+import T, { forwardRef as j, useMemo as C, useState as N } from "react";
+import { c as m } from "./box.module.css.mjs";
+import { C as y, a as p } from "./utils/utils.mjs";
+import { useTheme as B } from "./theme.mjs";
+function P(t, e) {
+  const { tag: s, children: o, props: n, className: c, style: l } = t, h = B(t), x = C(() => {
+    const a = c ? y.classNames(m.box, c) : [m.box], H = { ...u(h), ...u(t) };
+    return Object.entries(H).forEach(([i, b]) => {
+      const g = m[i + b];
+      g ? a.push(g) : i in p && a.push(`${p[i]}${b}`);
+    }), a.join(" ");
+  }, [t]), r = { ...n, className: x };
+  l && (r.style = l), e && (r.ref = e);
+  const [$, d] = N(!1), f = typeof o == "function";
+  return f && (r.onMouseEnter = () => d(!0), r.onMouseLeave = () => d(!1)), T.createElement(s || "div", r, f ? o({ isHover: $ }) : o);
+}
+const z = j(P), R = {
+  m: "margin",
+  mx: "marginHorizontal",
+  my: "marginVertical",
+  mt: "marginTop",
+  mr: "marginRight",
+  mb: "marginBottom",
+  ml: "marginLeft",
+  p: "padding",
+  px: "paddingHorizontal",
+  py: "paddingVertical",
+  pt: "paddingTop",
+  pr: "paddingRight",
+  pb: "paddingBottom",
+  pl: "paddingLeft",
+  b: "border",
+  bx: "borderHorizontal",
+  by: "borderVertical",
+  bt: "borderTop",
+  br: "borderRight",
+  bb: "borderBottom",
+  bl: "borderLeft",
+  bg: "background",
+  jc: "justifyContent",
+  ai: "alignItems",
+  ac: "alignContent",
+  d: "flexDirection"
+}, v = Object.entries(R).reduce((t, [e, s]) => (t[e] = s, t[`${e}H`] = `${s}H`, t[`${e}F`] = `${s}F`, t[`${e}A`] = `${s}A`, t), {});
+function u(t) {
+  const e = { ...t };
+  return Object.keys(e).forEach((o) => {
+    const n = v[o];
+    n && (n in e || (e[n] = e[o]), delete e[o]);
+  }), e;
 }
-const y = g(S);
 export {
-  y as default
+  z as default
 };