@cronocode/react-box 1.1.7 → 1.2.0

package/components/baseSvg.d.ts

@@ -7,10 +7,10 @@ interface SvgNormalStyles {
     rotate?: 0 | 90 | 180 | 270;
     flip?: 'xAxis' | 'yAxis';
 }
-export declare type SvgStyles = SvgNormalStyles & Hovered<SvgNormalStyles>;
-declare type AllSvgProps = React.SVGProps<SVGElement>;
-declare type SvgPropsType = Omit<AllSvgProps, 'className' | 'style' | 'width' | 'height'>;
-declare type SvgStyleType = Omit<React.CSSProperties, 'width' | 'height'>;
+export type SvgStyles = SvgNormalStyles & Hovered<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 {
     children?: React.ReactNode | ((props: {
         isHover: boolean;

package/components/baseSvg.mjs

@@ -1,22 +1,22 @@
-import g, { useState as w } from "react";
-import { C as v } from "../utils/utils.mjs";
-const s = { base: "cLL", fillnone: "cLM", fillHnone: "cLN", hovertrue: "d", filltransparent: "cLO", fillHtransparent: "cLP", fillblack: "cLQ", fillHblack: "cLR", fillwhite: "cLS", fillHwhite: "cLT", fillblue: "cLU", fillHblue: "cLV", fillred: "cLW", fillHred: "cLX", fillpurple: "cLY", fillHpurple: "cLZ", fillyellow: "cL0", fillHyellow: "cL1", fillpink: "cL2", fillHpink: "cL3", fillgreen: "cL4", fillHgreen: "cL5", fillorange: "cL6", fillHorange: "cL7", fillnavy: "cL8", fillHnavy: "cL9", fillteal: "cMa", fillHteal: "cMb", fillviolet: "cMc", fillHviolet: "cMd", fillgray: "cMe", fillHgray: "cMf", fillbrown: "cMg", fillHbrown: "cMh", strokenone: "cMi", strokeHnone: "cMj", stroketransparent: "cMk", strokeHtransparent: "cMl", strokeblack: "cMm", strokeHblack: "cMn", strokewhite: "cMo", strokeHwhite: "cMp", strokeblue: "cMq", strokeHblue: "cMr", strokered: "cMs", strokeHred: "cMt", strokepurple: "cMu", strokeHpurple: "cMv", strokeyellow: "cMw", strokeHyellow: "cMx", strokepink: "cMy", strokeHpink: "cMz", strokegreen: "cMA", strokeHgreen: "cMB", strokeorange: "cMC", strokeHorange: "cMD", strokenavy: "cME", strokeHnavy: "cMF", stroketeal: "cMG", strokeHteal: "cMH", strokeviolet: "cMI", strokeHviolet: "cMJ", strokegray: "cMK", strokeHgray: "cML", strokebrown: "cMM", strokeHbrown: "cMN", rotate0: "cMO", rotateH0: "cMP", rotate90: "cMQ", rotateH90: "cMR", rotate180: "cMS", rotateH180: "cMT", rotate270: "cMU", rotateH270: "cMV", flipxAxis: "cMW", flipHxAxis: "cMX", flipyAxis: "cMY", flipHyAxis: "cMZ" }, b = ["fill", "fillH", "stroke", "strokeH"];
-function m(o) {
-  const { children: e, props: f, className: r, style: H, viewBox: k, width: p, height: L } = o, l = r ? v.classNames(r, s.base) : [s.base];
-  Object.entries(o).forEach(([c, n]) => {
-    const M = s[c + n];
-    M ? l.push(M) : b.includes(c) && l.push(`${c}${n}`);
+import x, { useState as v } from "react";
+import { C as d } from "../utils/utils.mjs";
+const a = { base: "cGH", rotate0: "cGI", rotateH0: "cGJ", hovertrue: "_h", rotate90: "cGK", rotateH90: "cGL", rotate180: "cGM", rotateH180: "cGN", rotate270: "cGO", rotateH270: "cGP", flipxAxis: "cGQ", flipHxAxis: "cGR", flipyAxis: "cGS", flipHyAxis: "cGT" }, g = ["fill", "fillH", "stroke", "strokeH"];
+function A(c) {
+  const { children: s, props: m, className: r, style: p, viewBox: G, width: u, height: H } = c, e = r ? d.classNames(r, a.base) : [a.base];
+  Object.entries(c).forEach(([o, n]) => {
+    const f = a[o + n];
+    f ? e.push(f) : g.includes(o) && e.push(`${o}${n}`);
   });
   const t = {
-    ...f,
-    style: { ...H, width: p, height: L },
-    className: l.join(" "),
-    viewBox: k || "0 0 24 24",
+    ...m,
+    style: { ...p, width: u, height: H },
+    className: e.join(" "),
+    viewBox: G || "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none"
-  }, [u, i] = w(!1), a = typeof e == "function";
-  return a && (t.onMouseEnter = () => i(!0), t.onMouseLeave = () => i(!1)), g.createElement("svg", t, a ? e({ isHover: u }) : e);
+  }, [h, i] = v(!1), l = typeof s == "function";
+  return l && (t.onMouseEnter = () => i(!0), t.onMouseLeave = () => i(!1)), x.createElement("svg", t, l ? s({ isHover: h }) : s);
 }
 export {
-  m as default
+  A as default
 };

package/components/buttonCore.d.ts

@@ -1,8 +1,8 @@
 import Box from '../box';
-declare type BoxProps = Omit<React.ComponentProps<typeof Box<'button'>>, 'ref' | 'tag'>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type ButtonTagProps = Omit<BoxTagProps, 'type' | 'onClick' | 'disabled'>;
-declare type ButtonType = Required<React.ComponentProps<'button'>>['type'];
+type BoxProps = Omit<React.ComponentProps<typeof Box<'button'>>, 'ref' | 'tag'>;
+type BoxTagProps = Required<BoxProps>['props'];
+type ButtonTagProps = Omit<BoxTagProps, 'type' | 'onClick' | 'disabled'>;
+type ButtonType = Required<React.ComponentProps<'button'>>['type'];
 interface Props extends Omit<BoxProps, 'props'> {
     props?: ButtonTagProps;
     type?: ButtonType;

package/components/checkboxCore.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import Box from '../box';
-declare type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type CheckboxCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'value' | 'autoFocus' | 'readOnly' | 'required' | 'checked' | 'defaultChecked'>;
+type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
+type BoxTagProps = Required<BoxProps>['props'];
+type CheckboxCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'value' | 'autoFocus' | 'readOnly' | 'required' | 'checked' | 'defaultChecked'>;
 interface Props extends Omit<BoxProps, 'props'> {
     name?: string;
     props?: CheckboxCoreTagProps;

package/components/flex.d.ts

@@ -1,6 +1,6 @@
 import Box from '../box';
 import { Activated, Focused, Hovered } from '../types';
-declare type BoxProps = React.ComponentProps<typeof Box>;
+type BoxProps = React.ComponentProps<typeof Box>;
 interface FlexStylesShortCuts {
     wrap?: BoxProps['flexWrap'];
     jc?: BoxProps['justifyContent'];
@@ -12,6 +12,6 @@ interface FlexStylesShortCuts {
     as?: BoxProps['alignSelf'];
     js?: BoxProps['justifySelf'];
 }
-declare type Props = BoxProps & FlexStylesShortCuts & Hovered<FlexStylesShortCuts> & Focused<FlexStylesShortCuts> & Activated<FlexStylesShortCuts>;
+type Props = BoxProps & FlexStylesShortCuts & Hovered<FlexStylesShortCuts> & Focused<FlexStylesShortCuts> & Activated<FlexStylesShortCuts>;
 export default function Flex(props: Props): JSX.Element;
 export {};

package/components/formAsync.d.ts

@@ -1,7 +1,7 @@
 import Box from '../box';
-declare type BoxProps = React.ComponentProps<typeof Box<'form'>>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type FormAsyncTagProps = Omit<BoxTagProps, 'onSubmit' | 'ref'>;
+type BoxProps = React.ComponentProps<typeof Box<'form'>>;
+type BoxTagProps = Required<BoxProps>['props'];
+type FormAsyncTagProps = Omit<BoxTagProps, 'onSubmit' | 'ref'>;
 interface Props<T> extends Omit<BoxProps, 'props' | 'tag'> {
     props?: FormAsyncTagProps;
     onSubmit: (obj: T, e: React.FormEvent<HTMLFormElement>) => void;

package/components/radioButtonCore.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import Box from '../box';
-declare type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type RadioButtonCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'value' | 'autoFocus' | 'readOnly' | 'required' | 'checked' | 'defaultChecked'>;
+type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
+type BoxTagProps = Required<BoxProps>['props'];
+type RadioButtonCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'value' | 'autoFocus' | 'readOnly' | 'required' | 'checked' | 'defaultChecked'>;
 interface Props extends Omit<BoxProps, 'props'> {
     name?: string;
     props?: RadioButtonCoreTagProps;

package/components/textareaCore.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import Box from '../box';
-declare type BoxProps = Omit<React.ComponentProps<typeof Box<'textarea'>>, 'ref' | 'tag'>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type TextareaCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'placeholder' | 'disabled' | 'value' | 'defaultValue' | 'rows' | 'cols' | 'autoFocus' | 'maxLength' | 'minLength' | 'readOnly' | 'required'>;
+type BoxProps = Omit<React.ComponentProps<typeof Box<'textarea'>>, 'ref' | 'tag'>;
+type BoxTagProps = Required<BoxProps>['props'];
+type TextareaCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'placeholder' | 'disabled' | 'value' | 'defaultValue' | 'rows' | 'cols' | 'autoFocus' | 'maxLength' | 'minLength' | 'readOnly' | 'required'>;
 interface Props extends Omit<BoxProps, 'props'> {
     name?: string;
     props?: TextareaCoreTagProps;

package/components/textboxCore.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
 import Box from '../box';
-declare type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
-declare type BoxTagProps = Required<BoxProps>['props'];
-declare type TextboxCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'defaultValue' | 'autoFocus' | 'readOnly' | 'required' | 'value' | 'pattern'>;
-declare type TextboxCoreType = 'date' | 'datetime-local' | 'email' | 'hidden' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week';
+type BoxProps = Omit<React.ComponentProps<typeof Box<'input'>>, 'ref' | 'tag'>;
+type BoxTagProps = Required<BoxProps>['props'];
+type TextboxCoreTagProps = Omit<BoxTagProps, 'name' | 'onInput' | 'onChange' | 'type' | 'placeholder' | 'disabled' | 'defaultValue' | 'autoFocus' | 'readOnly' | 'required' | 'value' | 'pattern'>;
+type TextboxCoreType = 'date' | 'datetime-local' | 'email' | 'hidden' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week';
 interface Props extends Omit<BoxProps, 'props'> {
     name?: string;
     props?: TextboxCoreTagProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cronocode/react-box",
-  "version": "1.1.7",
+  "version": "1.2.0",
   "main": "./box.mjs",
   "module": "./box.mjs",
   "types": "./box.d.ts",
@@ -43,20 +43,22 @@
   "devDependencies": {
     "@cronocode/identity-factory": "^0.0.6",
     "@rollup/pluginutils": "^5.0.2",
-    "@types/node": "^18.11.18",
+    "@types/node": "^18.15.7",
     "@types/postcss-mixins": "^9.0.0",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",
-    "@vitejs/plugin-react": "^3.0.1",
-    "autoprefixer": "^10.4.13",
+    "@vitejs/plugin-react": "^3.1.0",
+    "autoprefixer": "^10.4.14",
     "postcss": "^8.4.21",
+    "postcss-each": "^1.1.0",
     "postcss-mixins": "^9.0.4",
     "postcss-nested": "^6.0.1",
-    "prettier": "^2.8.3",
+    "postcss-simple-vars": "^7.0.1",
+    "prettier": "^2.8.7",
     "react": "^18.1.0",
     "react-dom": "^18.2.0",
-    "typescript": "^4.9.4",
-    "vite": "^4.0.4",
-    "vite-plugin-dts": "^1.7.1"
+    "typescript": "^5.0.2",
+    "vite": "^4.2.1",
+    "vite-plugin-dts": "^2.1.0"
   }
 }