@consumidor-positivo/aurora 0.0.51 → 0.0.52

package/dist/components/CheckboxField/index.es.js

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+import { j as COLOR_NEUTRAL_00, aK as Field } from "../../tokens-N1zNCjKI.js";
+import "../Icon/index.es.js";
+import { IconCheck } from "../icons/IconCheck/index.es.js";
+import '../styles/styles3.css';import '../styles/styles5.css';import '../styles/styles4.css';import '../styles/styles2.css';import '../styles/styles.css';/* empty css                    */
+/* empty css                    */
+import "../Header/index.es.js";
+import "react";
+import "../NavbarVertical/index.es.js";
+import "../Text/index.es.js";
+/* empty css                    */
+/* empty css                    */
+/* empty css                    */
+const CheckboxField = ({
+  label,
+  error,
+  errorMessage,
+  disabled,
+  id,
+  ...props
+}) => {
+  const checkboxClasses = classNames("au-checkbox", {
+    "au-checkbox--error": !!error,
+    "au-checkbox--disabled": !!disabled
+  });
+  return /* @__PURE__ */ jsxs("div", { className: checkboxClasses, children: [
+    /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-checkbox__holder", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          className: "au-checkbox__input",
+          type: "checkbox",
+          id,
+          disabled,
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "au-checkbox__check", children: /* @__PURE__ */ jsx(IconCheck, { rawColor: COLOR_NEUTRAL_00 }) }),
+      /* @__PURE__ */ jsx("span", { className: "au-checkbox__label", children: label })
+    ] }),
+    /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
+  ] });
+};
+export {
+  CheckboxField
+};
+//# sourceMappingURL=index.es.js.map

package/dist/components/CheckboxField/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/CheckboxField/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport Field from '../Field'\nimport { IconCheck } from '../../icons'\nimport { COLOR_NEUTRAL_00 } from '../../../main'\n\nimport './styles.scss'\n\ntype CheckboxFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  label: string\n  error: boolean\n  errorMessage: string\n}\n\nexport const CheckboxField = ({\n  label,\n  error,\n  errorMessage,\n  disabled,\n  id,\n  ...props\n}: CheckboxFieldProps) => {\n  const checkboxClasses = classNames('au-checkbox', {\n    'au-checkbox--error': !!error,\n    'au-checkbox--disabled': !!disabled,\n  })\n\n  return (\n    <div className={checkboxClasses}>\n      <label htmlFor={id} className=\"au-checkbox__holder\">\n        <input\n          className=\"au-checkbox__input\"\n          type=\"checkbox\"\n          id={id}\n          disabled={disabled}\n          {...props}\n        />\n        <span className=\"au-checkbox__check\">\n          <IconCheck rawColor={COLOR_NEUTRAL_00} />\n        </span>\n        <span className=\"au-checkbox__label\">\n          {label}\n        </span>\n      </label>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAaO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AAClB,QAAA,kBAAkB,WAAW,eAAe;AAAA,IAChD,sBAAsB,CAAC,CAAC;AAAA,IACxB,yBAAyB,CAAC,CAAC;AAAA,EAAA,CAC5B;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,iBACd,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,uBAC5B,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACC,GAAG;AAAA,QAAA;AAAA,MACN;AAAA,MACA,oBAAC,UAAK,WAAU,sBACd,8BAAC,WAAU,EAAA,UAAU,kBAAkB,EACzC,CAAA;AAAA,MACC,oBAAA,QAAA,EAAK,WAAU,sBACb,UACH,OAAA;AAAA,IAAA,GACF;AAAA,IACA,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,EAChE,EAAA,CAAA;AAEJ;"}

package/dist/components/form/CheckboxField/index.d.ts

@@ -0,0 +1,8 @@
+
+type CheckboxFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    label: string;
+    error: boolean;
+    errorMessage: string;
+};
+export declare const CheckboxField: ({ label, error, errorMessage, disabled, id, ...props }: CheckboxFieldProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/tokens/styles.css

@@ -1 +1 @@
-html{box-sizing:border-box;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*,*:before,*:after{box-sizing:inherit;margin:0;padding:0}:focus{outline:none}body{font-family:"Source Sans 3",sans-serif;background-color:#fff}.au-field{cursor:pointer}.au-field__input{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-size:16px;line-height:22px;padding:16px;height:56px;width:100%}.au-field__input:hover{border:1px solid #16181d}.au-field__input:focus{border-color:#0048db;outline:1px solid #0048db}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}.au-token-field{max-width:max-content}.au-token-field__container{display:flex;gap:8px}.au-token-field__input{font-size:20px;text-align:center;padding:8px}.au-token-field__input[type=number]::-webkit-inner-spin-button,.au-token-field__input[type=number]::-webkit-outer-spin-button{display:none}.au-password-field__container{position:relative;height:56px}.au-password-field__input{position:absolute;padding:16px 92px 16px 16px}.au-password-field__btn{background-color:transparent;border:none;color:#0048db;cursor:pointer;font-family:"Source Sans 3",sans-serif;font-size:14px;font-weight:600;text-transform:uppercase;position:absolute;z-index:1;background-position-y:center;right:16px;height:56px}.au-password-field__btn:disabled{cursor:not-allowed}
+html{box-sizing:border-box;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*,*:before,*:after{box-sizing:inherit;margin:0;padding:0}:focus{outline:none}body{font-family:"Source Sans 3",sans-serif;background-color:#fff}.au-field{cursor:pointer}.au-field__input{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-size:16px;line-height:22px;padding:16px;height:56px;width:100%}.au-field__input:hover{border:1px solid #16181d}.au-field__input:focus{border-color:#0048db;outline:1px solid #0048db}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}.au-token-field{max-width:max-content}.au-token-field__container{display:flex;gap:8px}.au-token-field__input{font-size:20px;text-align:center;padding:8px}.au-token-field__input[type=number]::-webkit-inner-spin-button,.au-token-field__input[type=number]::-webkit-outer-spin-button{display:none}.au-password-field__container{position:relative;height:56px}.au-password-field__input{position:absolute;padding:16px 92px 16px 16px}.au-password-field__btn{background-color:transparent;border:none;color:#0048db;cursor:pointer;font-family:"Source Sans 3",sans-serif;font-size:14px;font-weight:600;text-transform:uppercase;position:absolute;z-index:1;background-position-y:center;right:16px;height:56px}.au-password-field__btn:disabled{cursor:not-allowed}.au-checkbox{position:relative}.au-checkbox__holder{cursor:pointer;display:flex;gap:8px;align-items:start}.au-checkbox__input{position:absolute;opacity:0;width:0;height:0}.au-checkbox__input:checked~.au-checkbox__check{background-color:#0048db;border-color:#0048db}.au-checkbox__input:checked~.au-checkbox__check .au-icon svg{opacity:1}.au-checkbox__input:hover:not(:focus)~.au-checkbox__check{border-color:#0048db;outline:2px solid #F2F5FC}.au-checkbox__input:focus~.au-checkbox__check{box-shadow:0 0 0 1px #fff,0 0 0 3px #0048db}.au-checkbox__check{background-color:#fff;border:2px solid #454a54;border-radius:4px;height:24px;width:24px;transition:background-color .2s ease}.au-checkbox__check .au-icon svg{position:absolute;left:0;top:0;opacity:0;transition:opacity .2s ease}.au-checkbox__label{color:#454a54;font-family:"Source Sans 3",sans-serif;font-size:16px;line-height:24px;word-wrap:break-word;max-width:calc(100% - 32px)}.au-checkbox--error .au-checkbox__input:focus~.au-checkbox__check{box-shadow:0 0 0 1px #fff,0 0 0 3px #991717}.au-checkbox--disabled .au-checkbox__holder{cursor:not-allowed}.au-checkbox--disabled .au-checkbox__input:checked~.au-checkbox__check{background-color:#c4c9d4;border-color:#c4c9d4}.au-checkbox--disabled .au-checkbox__input:hover~.au-checkbox__check{border-color:#c4c9d4;outline:none}.au-checkbox--disabled .au-checkbox__check{border:2px solid #c4c9d4}.au-checkbox--disabled .au-checkbox__label{color:#c4c9d4}

package/dist/main.d.ts

@@ -12,6 +12,7 @@ export { Footer } from './components/Footer';
 export { InputField } from './components/form/InputField';
 export { TokenField } from './components/form/TokenField';
 export { PasswordField } from './components/form/PasswordField';
+export { CheckboxField } from './components/form/CheckboxField';
 export { useDrawer } from './components/Drawer/hooks';
 export * from './components/Logo';
 export * from './components/icons';

package/dist/main.es.js

@@ -12,6 +12,7 @@ import { Footer } from "./components/Footer/index.es.js";
 import { InputField } from "./components/InputField/index.es.js";
 import { TokenField } from "./components/TokenField/index.es.js";
 import { PasswordField } from "./components/PasswordField/index.es.js";
+import { CheckboxField } from "./components/CheckboxField/index.es.js";
 import { useState } from "react";
 import { L as L2, a as a10, b as b2, c as c2, d as d2, e as e2, f as f2, g as g2, h as h2, i as i2, j as j2, k as k2, l as l2, m as m2 } from "./Tertiary-DMp-1eWT.js";
 import { IconActivity } from "./components/icons/IconActivity/index.es.js";
@@ -407,6 +408,7 @@ export {
   U as COLOR_WARNING_50,
   T as COLOR_WARNING_60,
   ak as CONTAINER_SIZE,
+  CheckboxField,
   Conditional,
   Drawer,
   av as FONT_BODY,

package/dist/main.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.es.js","sources":["../lib/components/Drawer/hooks.ts"],"sourcesContent":["import { useState } from 'react'\n\ntype UseDrawerProps = Record<string, boolean>\n\nexport function useDrawer(props: UseDrawerProps) {\n  const [drawerOpen, setDrawerOpen] = useState<UseDrawerProps>(props)\n\n  function handleOpenDrawer(name: string) {\n    setDrawerOpen((prev) => {\n      return {\n        ...prev,\n        [name]: !prev[name],\n      }\n    })\n  }\n\n  return {\n    handleOpenDrawer,\n    drawerOpen,\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIO,SAAS,UAAU,OAAuB;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAyB,KAAK;AAElE,WAAS,iBAAiB,MAAc;AACtC,kBAAc,CAAC,SAAS;AACf,aAAA;AAAA,QACL,GAAG;AAAA,QACH,CAAC,IAAI,GAAG,CAAC,KAAK,IAAI;AAAA,MAAA;AAAA,IACpB,CACD;AAAA,EACH;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"main.es.js","sources":["../lib/components/Drawer/hooks.ts"],"sourcesContent":["import { useState } from 'react'\n\ntype UseDrawerProps = Record<string, boolean>\n\nexport function useDrawer(props: UseDrawerProps) {\n  const [drawerOpen, setDrawerOpen] = useState<UseDrawerProps>(props)\n\n  function handleOpenDrawer(name: string) {\n    setDrawerOpen((prev) => {\n      return {\n        ...prev,\n        [name]: !prev[name],\n      }\n    })\n  }\n\n  return {\n    handleOpenDrawer,\n    drawerOpen,\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIO,SAAS,UAAU,OAAuB;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAyB,KAAK;AAElE,WAAS,iBAAiB,MAAc;AACtC,kBAAc,CAAC,SAAS;AACf,aAAA;AAAA,QACL,GAAG;AAAA,QACH,CAAC,IAAI,GAAG,CAAC,KAAK,IAAI;AAAA,MAAA;AAAA,IACpB,CACD;AAAA,EACH;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@consumidor-positivo/aurora",
   "private": false,
-  "version": "0.0.51",
+  "version": "0.0.52",
   "type": "module",
   "main": "./dist/main.es.js",
   "modules": "./dist/main.es.js",