linear-react-components-ui 1.1.25-rc.2 → 1.1.25-rc.4

package/lib/@types/ColorStyles.d.ts

@@ -1,3 +1,4 @@
 type ColorStyles = 'primary' | 'success' | 'danger' | 'info' | 'warning';
+type ColorTheme = 'light' | 'dark';
 
-export { ColorStyles };
+export { ColorStyles, ColorTheme };

package/lib/@types/Position.d.ts

@@ -1,3 +1,4 @@
 type Position = 'left' | 'right' | 'center' | 'top' | 'bottom';
+type HintPosition = 'below' | 'onLabelRight';
 
-export { Position };
+export { HintPosition, Position };

package/lib/BaseMask-0c14ef51.d.ts

@@ -0,0 +1,24 @@
+import React__default from 'react';
+import { T as TextFieldInputProps } from './index-3b70931d.js';
+import { FactoryOpts } from 'imask';
+
+interface MaskFieldProps extends TextFieldInputProps {
+    maskOptions?: FactoryOpts;
+    onAccept?: (value: string) => void;
+    onComplete?: (value: string, maskRef: any, e?: InputEvent) => void;
+    onChange?: (e: React__default.ChangeEvent<HTMLInputElement>) => void;
+    autoCompleteMask?: string;
+    value?: string;
+}
+declare const Input: React__default.ForwardRefExoticComponent<MaskFieldProps & React__default.RefAttributes<HTMLInputElement>>;
+
+declare const BaseMask_Input: typeof Input;
+type BaseMask_MaskFieldProps = MaskFieldProps;
+declare namespace BaseMask {
+  export {
+    BaseMask_Input as Input,
+    BaseMask_MaskFieldProps as MaskFieldProps,
+  };
+}
+
+export { BaseMask as B, Input as I, MaskFieldProps as M };

package/lib/Cnpj-bde01dd0.d.ts

@@ -0,0 +1,18 @@
+import React__default from 'react';
+import { M as MaskFieldProps } from './BaseMask-0c14ef51.js';
+
+interface CnpjFieldProps extends MaskFieldProps {
+    onValidate?: (errors: string[]) => void;
+}
+declare const Input: React__default.ForwardRefExoticComponent<CnpjFieldProps & React__default.RefAttributes<HTMLInputElement>>;
+
+type Cnpj_CnpjFieldProps = CnpjFieldProps;
+declare const Cnpj_Input: typeof Input;
+declare namespace Cnpj {
+  export {
+    Cnpj_CnpjFieldProps as CnpjFieldProps,
+    Cnpj_Input as Input,
+  };
+}
+
+export { Cnpj as C, Input as I, CnpjFieldProps as a };

package/lib/Cpf-3fa496ad.d.ts

@@ -0,0 +1,18 @@
+import React__default from 'react';
+import { M as MaskFieldProps } from './BaseMask-0c14ef51.js';
+
+interface CpfFieldProps extends MaskFieldProps {
+    onValidate?: (errors: string[]) => void;
+}
+declare const Input: React__default.ForwardRefExoticComponent<CpfFieldProps & React__default.RefAttributes<HTMLInputElement>>;
+
+type Cpf_CpfFieldProps = CpfFieldProps;
+declare const Cpf_Input: typeof Input;
+declare namespace Cpf {
+  export {
+    Cpf_CpfFieldProps as CpfFieldProps,
+    Cpf_Input as Input,
+  };
+}
+
+export { Cpf as C, Input as I, CpfFieldProps as a };

package/lib/Phone-2bb0b397.d.ts

@@ -0,0 +1,18 @@
+import React__default from 'react';
+import { M as MaskFieldProps } from './BaseMask-0c14ef51.js';
+
+interface PhoneFieldProps extends MaskFieldProps {
+    isCellphone?: boolean;
+}
+declare const Input: React__default.ForwardRefExoticComponent<PhoneFieldProps & React__default.RefAttributes<HTMLInputElement>>;
+
+declare const Phone_Input: typeof Input;
+type Phone_PhoneFieldProps = PhoneFieldProps;
+declare namespace Phone {
+  export {
+    Phone_Input as Input,
+    Phone_PhoneFieldProps as PhoneFieldProps,
+  };
+}
+
+export { Input as I, Phone as P, PhoneFieldProps as a };

package/lib/ZipCode-09460e18.d.ts

@@ -0,0 +1,13 @@
+import React__default from 'react';
+import { M as MaskFieldProps } from './BaseMask-0c14ef51.js';
+
+declare const Input: React__default.ForwardRefExoticComponent<MaskFieldProps & React__default.RefAttributes<HTMLInputElement>>;
+
+declare const ZipCode_Input: typeof Input;
+declare namespace ZipCode {
+  export {
+    ZipCode_Input as Input,
+  };
+}
+
+export { Input as I, ZipCode as Z };

package/lib/alerts/AlertProvider.js

@@ -11,8 +11,7 @@ var _AlertContainer = _interopRequireDefault(require("./AlertContainer"));
 var _Message = _interopRequireDefault(require("./Message"));
 var _helpers = _interopRequireDefault(require("./helpers"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }

package/lib/alerts/BaseAlert.js

@@ -26,7 +26,7 @@ const BaseAlert = _ref => {
       alert.appendChild(messageContainerEl);
     }
     return () => {
-      alert?.removeChild(messageContainerEl);
+      alert === null || alert === void 0 ? void 0 : alert.removeChild(messageContainerEl);
     };
   }, []);
   return /*#__PURE__*/_reactDom.default.createPortal(children, messageContainerEl);

package/lib/alerts/Message.js

@@ -8,14 +8,13 @@ var _react = _interopRequireWildcard(require("react"));
 var _icons = _interopRequireDefault(require("../icons"));
 var _progress = _interopRequireDefault(require("../progress"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const getClass = _ref => {
   let {
     customClass,
     className
   } = _ref;
-  return `${className} ${customClass}`;
+  return "".concat(className, " ").concat(customClass);
 };
 const getIcon = (icon, iconName, color) => {
   if (icon !== null) {

package/lib/alerts/withAlert.js

@@ -7,8 +7,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _helpers = _interopRequireDefault(require("./helpers"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const withAlert = WrapperComponent => {
   const GetAlert = props => {

package/lib/assets/styles/button.scss

@@ -366,7 +366,7 @@ $shadow-button-inset-default: inset 0 0 0 1px $default-border-color, $shadow-but
   border-color: transparent !important;
   transition: none;
 
-  > svg {
+  svg {
     opacity: 0;
     visibility: hidden;
   }

package/lib/assets/styles/calendar.scss

@@ -44,10 +44,10 @@ $border-radius-size: 5px;
       justify-content: center;
       background-color: transparent;
       font-weight: bold;
-      border: none;
+      border: 1px solid transparent;
 
       svg {
-        margin: 0;
+        margin: 0 !important;
       }
 
       &:hover {
@@ -110,7 +110,7 @@ $border-radius-size: 5px;
       width: 100%;
       padding: 0;
       font-size: 13px;
-      border: none;
+      border: 2px solid transparent;
       background-color: transparent;
 
       &.-nowday {

package/lib/assets/styles/checkbox2.scss

@@ -0,0 +1,199 @@
+@import "commons.scss";
+@import "colors.scss";
+@import "effects.scss";
+@import "fonts.scss";
+
+/* Chrome, Safari, Edge, Opera */
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+.checkbox-field-root {
+  display: flex;
+  flex-direction: column;
+  text-align: start;
+  .container {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+    text-align: start;
+    gap: 6px;
+    width: 100%;
+    height: 28px;
+    margin: 0;
+    padding: 0;
+    &[data-state-skeletonize=true] {
+      @extend %skeleton-component;
+      color: transparent;
+      background-color: transparent;
+    }
+    .input-root {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .input {
+        @extend %component-fonts;
+        position: relative;
+        padding: 6px;
+        font-size: 0.875rem;
+        line-height: 0.875rem;
+        border: 1px solid $component-border-color;
+        background: $font-color-second left top no-repeat;
+        cursor: pointer;
+        vertical-align: middle;
+        transition: background-color 0.1s, border-color 0.1s;
+        flex-shrink: 0;
+        appearance: none;
+        -webkit-appearance: none;
+        -moz-appearance: none;
+        &:focus, &:hover {
+          transition: box-shadow 0.2s;
+        }
+        &:checked {
+          border-color: $default-actived-color;
+        }
+        &[data-state-rounded=true] {
+          border-radius: 2px;
+        }
+        &[data-state-variant=default] {
+          &:checked {
+            background-color: $checked-effect;
+          }
+          &:focus, &:hover, &[data-state-in-focus-select-field=true] {
+            box-shadow: 0 0 0 2px $checked-effect;
+          }
+        }
+        &[data-state-variant=secondary] {
+          &:checked {
+            background-color: $font-selected-color;
+          }
+          &:focus, &:hover, &[data-state-in-focus-select-field=true] {
+            box-shadow: 0 0 0 2px $font-selected-color;
+          }
+        }
+        &[data-state-size=small] {
+          width: 14px;
+          height: 14px;
+        }
+        &[data-state-size=default] {
+          width: 18px;
+          height: 18px;
+        }
+        &[data-state-size=medium] {
+          width: 20px;
+          height: 20px;
+        }
+        &[data-state-size=large] {
+          width: 22px;
+          height: 22px;
+        }
+        &[data-state-read-only=true], &[data-state-read-only=true]:checked {
+          cursor: default;
+          pointer-events: none;
+          border-color: $font-color-disabled;
+          background-color: $input-read-only-bg-color;
+        }
+        &:disabled, &:disabled:checked {
+          border-color: $font-color-disabled;
+          background-color: $input-disabled-bg-color;
+          cursor: not-allowed;
+          pointer-events: none;
+          transition: color 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
+        }
+        &[data-state-skeletonize=true] {
+          border: none !important;
+          color: transparent !important;
+          background-color: transparent !important;
+        }
+      }
+      .checkmark {
+        display: block;
+        position: absolute;
+        margin: 0;
+        opacity: 0;
+        visibility: hidden;
+        transition: opacity 0.1s, visibility 0.1s;
+        pointer-events: none;
+        fill: $font-color-second;
+      }
+      &:has(input:checked) {
+        .checkmark {
+          opacity: 1;
+          visibility: initial;
+          width: 75%;
+          height: 75%;
+        }
+      }
+      &:has(input[data-state-read-only=true]) {
+        .checkmark {
+          fill: $font-color-disabled;
+        }
+      }
+      &:has(input:disabled) {
+        .checkmark {
+          fill: $font-color-disabled;
+        }
+      }
+      &:has(input[data-state-skeletonize=true]) {
+        .checkmark {
+          fill: transparent !important;
+        }
+      }
+    }
+    .label {
+      @extend %input-label;
+      font-size: 0.875rem;
+      line-height: normal;
+      color: $font-color-default;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      &[data-state-input-required=true]::after {
+        content: "*";
+        color: $font-color-default;
+      }
+      &[data-state-uppercase=true] {
+        text-transform: uppercase;
+      }
+      &[data-state-required-label=true] {
+        color: $error-color;
+        font-weight: 600;
+        font-size: 0.875rem;
+        margin-left: 1px;
+      }
+      &[data-state-skeletonize=true] {
+        color: transparent;
+      }
+      &[data-state-read-only=true], &[data-state-disabled=true] {
+        cursor: default;
+        pointer-events: none;
+      }
+    }
+    >button {
+      width: 20px;
+      height: auto;
+      margin: 0px !important;
+    }
+  }
+  .hint {
+    span {
+      display: inline-block;
+      width: 100%;
+    }
+  }
+  .error {
+    width: 100%;
+    color: $error-color;
+    margin-top: 5px;
+    font-size: 0.8125rem;
+    line-height: 0.8125rem;
+    &[data-state-skeletonize=true] {
+      @extend %skeleton-component;
+      color: transparent;
+    }
+  }
+}

package/lib/assets/styles/colorpicker.scss

@@ -1,9 +1,8 @@
 .colorpicker-colormirror {
   height: 31px;
-  width: 20px; 
+  width: 20px;
   border-top-left-radius: 2px;
   border-bottom-left-radius: 2px;
-  margin: -3px -5px 0;
 }
 
 .colorpicker-palettebutton {
@@ -11,7 +10,3 @@
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
-
-.colorpicker-hideinputcolor {
-  display: none;
-}

package/lib/assets/styles/colors.scss

@@ -18,13 +18,12 @@ $font-color-default: #333333;
 $font-color-second: #ffffff;
 $font-color-soft: #777777;
 $font-selected-color: #6C757D;
-$font-color-disabled: #cacaca!important;
-
+$font-color-disabled: #cacaca !important;
 
 // COMPONENTS DEFAULTS
 $component-border-color: #dae1e8;
 $component-border-color-soft: #e6e6e6;
-$component-selected-color: rgb(161, 13, 13);
+$component-selected-color: #a10d0d;
 $component-bg-selected-color: #dbf1ff;
 $component-bg-default: #fff;
 $component-item-hover: #eeebeb; //Usado para hover de table rows ou li
@@ -39,8 +38,8 @@ $color-light-dark: #858585;
 
 // TABLES
 $table-striped-bg-color: #fcfcfc;
-$table-vertical-header-bg-color: rgb(240, 240, 240);
-$table-vertical-row-bg-color: rgb(248, 248, 248);
+$table-vertical-header-bg-color: #f0f0f0;
+$table-vertical-row-bg-color: #f8f8f8;
 
 //COLORS DEFAULT
 $default-color: #ffffff;
@@ -103,18 +102,19 @@ $alert-danger-border: #f5c6cb;
 
 //COLOR CHECKBOX DEFAULT
 $checked: #d30f0f;
-$checked-effect: $component-selected-color;
+$checked-effect: #a10d0d;
 $check-background: #C3C3C3;
 
 // COLOR LIST DEFAULT 
 // TODO - Refatorar o css da lista para reaproveitar variaveis genericas já existens
 $list-container-border: #E8E8E8;
 $list-container-box-shadow: #d1d1d1;
-$list-header-title:rgba(0, 0, 0, 0.54);
+$list-header-title: rgba(0, 0, 0, 0.54);
 $list-item-text: rgba(0, 0, 0, 0.54);
 $list-item-hover: #e1e1e1;
 $list-item-focus: #e1e1e1;
 $list-separator: #e1e1e1;
+$list-striped-bg: #e0e0e0;
 
 //COLORS TOOLBAR DEFAULT
 // TODO - Refatorar o css para reaproveitar variaveis genericas já existens
@@ -123,22 +123,58 @@ $separator-border-left: #d1d3d4;
 $separator-border-right: #b8c4ce;
 
 // INPUTS
-$input-error-border-color:#f48181;
+$input-read-only-bg-color: #fff5e5;
+$input-disabled-bg-color: #f5f5f5;
 $input-error-bg-color: #f9d6d6;
+$input-error-border-color: #f48181;
+
+// SELECTFIELD
+$selectfield-bg-selected: #f2f9fc;
+$selectfield-border-color: #c9e6f2;
 
 //PLACEHOLDER
 $placeholder-color: #8e8e8e;
+
 %input-placeholder {
-  &::-webkit-input-placeholder { /* Chrome/Opera/Safari */
+  &::-webkit-input-placeholder {
+    /* Chrome/Opera/Safari */
     color: $placeholder-color;
   }
-  &::-moz-placeholder { /* Firefox 19+ */
+
+  &::-moz-placeholder {
+    /* Firefox 19+ */
     color: $placeholder-color;
   }
-  &:-ms-input-placeholder { /* IE 10+ */
+
+  &:-ms-input-placeholder {
+    /* IE 10+ */
     color: $placeholder-color;
   }
-  &:-moz-placeholder { /* Firefox 18- */
+
+  &:-moz-placeholder {
+    /* Firefox 18- */
     color: $placeholder-color;
   }
 }
+
+%input-placeholder-transparent {
+  &::-webkit-input-placeholder {
+    /* Chrome/Opera/Safari */
+    color: transparent;
+  }
+
+  &::-moz-placeholder {
+    /* Firefox 19+ */
+    color: transparent;
+  }
+
+  &:-ms-input-placeholder {
+    /* IE 10+ */
+    color: transparent;
+  }
+
+  &:-moz-placeholder {
+    /* Firefox 18- */
+    color: transparent;
+  }
+}