linear-react-components-ui 1.1.22 → 1.1.24-beta.0

package/lib/inputs2/date/dateperiodfield/triggers.js

@@ -0,0 +1,120 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Triggers = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _moment = _interopRequireDefault(require("moment"));
+var _buttons = _interopRequireDefault(require("../../../buttons"));
+var BaseDate = _interopRequireWildcard(require("../base"));
+var _list = _interopRequireWildcard(require("../../../list"));
+var _context = require("./context");
+var _helpers = require("../helpers");
+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 _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Triggers = () => {
+  const {
+    initialInputId,
+    initialInputRef,
+    finalInputRef,
+    isReadOnly,
+    isDisabled,
+    selectedDate,
+    calendarBoxOpen,
+    showCalendarButton,
+    skeletonize,
+    showPredefinedPeriodsButton,
+    showClearDateButton,
+    hasValidPeriodSelected,
+    handleChangeCalendarBoxState,
+    handleChangeActiveDescendant,
+    handleChangeCalendarDisplayDate,
+    handleOnClickClearSelectedPeriod,
+    handleChangeUpdateDateStateWithPredefinedPeriod
+  } = (0, _context.useDatePeriodFieldContext)();
+  const shouldHavePermitClickOnTrigger = !isReadOnly && !isDisabled;
+  const handleOnClickTriggerSelectPredefinedPeriods = (event, periodSelected) => {
+    if (!shouldHavePermitClickOnTrigger) event?.preventDefault?.();else {
+      if (periodSelected) handleChangeUpdateDateStateWithPredefinedPeriod(periodSelected);
+    }
+  };
+  const handleOnClickTriggerCalendar = event => {
+    if (!shouldHavePermitClickOnTrigger) event.preventDefault();else {
+      handleChangeCalendarBoxState(!calendarBoxOpen);
+      if (!calendarBoxOpen) {
+        switch (document.activeElement?.id) {
+          case initialInputRef.current?.id:
+            {
+              handleChangeActiveDescendant((selectedDate.inicial ?? (0, _moment.default)()).format(_helpers.TOKEN_ISO_FORMAT));
+              handleChangeCalendarDisplayDate(selectedDate.inicial ?? (0, _moment.default)());
+              initialInputRef.current?.focus();
+              break;
+            }
+          case finalInputRef.current?.id:
+            {
+              handleChangeActiveDescendant((selectedDate.final ?? (0, _moment.default)()).format(_helpers.TOKEN_ISO_FORMAT));
+              handleChangeCalendarDisplayDate(selectedDate.final ?? (0, _moment.default)());
+              finalInputRef.current?.focus();
+              break;
+            }
+          default:
+            initialInputRef.current?.focus();
+            break;
+        }
+      }
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(BaseDate.Triggers, {
+    clearButtonTestId: "test-date-period-field-trigger-clean-selected-period",
+    calendarButtonTestId: "test-date-period-field-trigger-open-calendar",
+    isDisabled: isDisabled,
+    isReadOnly: isReadOnly,
+    skeletonize: skeletonize,
+    inputFieldId: initialInputId,
+    calendarBoxOpen: calendarBoxOpen,
+    showClearButton: showClearDateButton,
+    showCalendarButton: showCalendarButton,
+    hasValidDateSelection: false,
+    hasValidPeriodSelected: hasValidPeriodSelected,
+    onClearSelectedDate: handleOnClickClearSelectedPeriod,
+    onClickTriggerCalendar: handleOnClickTriggerCalendar
+  }, /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    "data-testid": "test-date-period-field-trigger-select-predefined-periods",
+    className: "select-predefined-periods",
+    dropdown: true,
+    transparent: true,
+    boxShadow: false,
+    showIconDropdown: false,
+    visible: showPredefinedPeriodsButton,
+    type: "button",
+    title: "Selecionar Periodos Pr\xE9 Definidos",
+    tabIndex: -1,
+    disabled: isDisabled,
+    "aria-label": "Selecionar Periodos Pr\xE9 Definidos",
+    "aria-controls": initialInputId,
+    "aria-readonly": isReadOnly,
+    "data-state-read-only": isReadOnly,
+    "data-state-visible": showPredefinedPeriodsButton,
+    iconName: "more1",
+    dropdownAlign: "right",
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, /*#__PURE__*/_react.default.createElement(_list.default, {
+    condensed: true
+  }, _helpers.PERIOD_OPTIONS_LIST.map(period => /*#__PURE__*/_react.default.createElement(_list.ListItem, {
+    key: period.id,
+    itemId: period.id,
+    text: period.label,
+    onMouseDown: event => {
+      event?.preventDefault?.();
+    },
+    onClick: event => {
+      handleOnClickTriggerSelectPredefinedPeriods(event, period.id);
+    }
+  })))));
+};
+exports.Triggers = Triggers;
+Triggers.displayName = 'DatePeriodFieldTriggers';

package/lib/inputs2/date/dateperiodfield/types.d.ts

@@ -0,0 +1,99 @@
+import React__default from 'react';
+import { Moment } from 'moment';
+import { TextAlign } from '../../../@types/Align.js';
+import { ColorTheme } from '../../../@types/ColorStyles.js';
+import { ITooltipCommonProps } from '../../../tooltip/types.js';
+import { HintPosition, Position } from '../../../@types/Position.js';
+import { PermissionAttr, OnDenied } from '../../../@types/PermissionAttr.js';
+
+type DatePeriodTypes = 'today' | 'week' | 'lastweek' | 'last15' | 'month' | 'lastmonth';
+type PeriodOptions = {
+    id: DatePeriodTypes;
+    label?: string;
+};
+type InputType = 'initial' | 'final';
+type SelectedDateType = {
+    inicial: Moment | null;
+    final: Moment | null;
+};
+type UpdateDateStateParams = {
+    date: Moment;
+    inputType: InputType;
+    typing?: boolean;
+};
+type InputHTMLProps = Omit<React__default.ComponentPropsWithoutRef<'input'>, 'type' | 'multiple' | 'value'>;
+interface DatePeriodFieldProps extends InputHTMLProps, ITooltipCommonProps {
+    value?: any;
+    initialName?: string;
+    initialRef?: React__default.MutableRefObject<HTMLInputElement | null>;
+    finalName?: string;
+    finalRef?: React__default.MutableRefObject<HTMLInputElement | null>;
+    hint?: string;
+    label?: string;
+    errors?: string[];
+    gridLayout?: string;
+    customClass?: string;
+    customClassLabel?: string;
+    customClassWrapper?: string;
+    customClassInputContainer?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    undigitable?: boolean;
+    skeletonize?: boolean;
+    labelUppercase?: boolean;
+    showCalendarButton?: boolean;
+    openCalendarOnFocus?: boolean;
+    shouldCloseOnSelect?: boolean;
+    showClearDateButton?: boolean;
+    showPredefinedPeriodsButton?: boolean;
+    textAlign?: TextAlign;
+    hintPosition?: HintPosition;
+    themePopover?: ColorTheme;
+    popoverAlign?: Extract<Position, 'left' | 'right'>;
+    permissionAttr?: PermissionAttr;
+    onDeniedActions?: OnDenied;
+}
+interface DatePeriodContextProps {
+    initialInputId: string;
+    finalInputId: string;
+    activeDescendant: string;
+    isReadOnly: boolean;
+    isDisabled: boolean;
+    undigitable: boolean;
+    skeletonize: boolean;
+    calendarBoxOpen: boolean;
+    showCalendarButton: boolean;
+    openCalendarOnFocus: boolean;
+    hasValidationErrors: boolean;
+    showClearDateButton: boolean;
+    hasValidPeriodSelected: boolean;
+    showPredefinedPeriodsButton: boolean;
+    selectedDate: SelectedDateType;
+    calendarDisplayDate: Moment;
+    initialInputRef: React__default.RefObject<HTMLInputElement | null>;
+    finalInputRef: React__default.RefObject<HTMLInputElement | null>;
+    dateContainerRef: React__default.RefObject<HTMLDivElement | null>;
+    handleChangeUpdateDateState: (params: UpdateDateStateParams) => void;
+    handleChangeNextMonth: () => void;
+    handleChangePreviousMonth: () => void;
+    handleChangeCalendarBoxState: (value: boolean) => void;
+    handleChangeActiveDescendant: (value: string) => void;
+    handleChangeCalendarDisplayDate: (value: Moment) => void;
+    handleOnClickClearSelectedPeriod: () => void;
+    handleChangeUpdateDateStateWithPredefinedPeriod: (period: DatePeriodTypes) => void;
+}
+declare enum Keys {
+    arrowLeft = "ArrowLeft",
+    arrowRight = "ArrowRight",
+    arrowUp = "ArrowUp",
+    arrowDown = "ArrowDown",
+    pageUp = "PageUp",
+    pageDown = "PageDown",
+    home = "Home",
+    end = "End",
+    escape = "Escape",
+    enter = "Enter"
+}
+
+export { DatePeriodContextProps, DatePeriodFieldProps, DatePeriodTypes, InputType, Keys, PeriodOptions, SelectedDateType, UpdateDateStateParams };

package/lib/inputs2/date/dateperiodfield/types.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Keys = void 0;
+let Keys = exports.Keys = /*#__PURE__*/function (Keys) {
+  Keys["arrowLeft"] = "ArrowLeft";
+  Keys["arrowRight"] = "ArrowRight";
+  Keys["arrowUp"] = "ArrowUp";
+  Keys["arrowDown"] = "ArrowDown";
+  Keys["pageUp"] = "PageUp";
+  Keys["pageDown"] = "PageDown";
+  Keys["home"] = "Home";
+  Keys["end"] = "End";
+  Keys["escape"] = "Escape";
+  Keys["enter"] = "Enter";
+  return Keys;
+}({});

package/lib/inputs2/date/helpers.d.ts

@@ -0,0 +1,20 @@
+import * as lodash from 'lodash';
+import { Moment } from 'moment';
+import { PeriodOptions } from './dateperiodfield/types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/ColorStyles.js';
+import '../../tooltip/types.js';
+import '../../@types/Position.js';
+import '../../@types/PermissionAttr.js';
+
+declare const TOKEN_MASK = "00/00/0000";
+declare const TOKEN_ISO_FORMAT = "YYYY-MM-DD";
+declare const TOKEN_PTBR_FORMAT = "DD/MM/YYYY";
+declare const options: string[];
+declare const NAVIGATION_KEYS: string[];
+declare const PERIOD_OPTIONS_LIST: PeriodOptions[];
+declare const isWithinBounds: (date: Moment, minDate?: string, maxDate?: string) => boolean;
+declare const generateCalendarWeeks: ((monthSelected: Moment) => Moment[][]) & lodash.MemoizedFunction;
+
+export { NAVIGATION_KEYS, PERIOD_OPTIONS_LIST, TOKEN_ISO_FORMAT, TOKEN_MASK, TOKEN_PTBR_FORMAT, generateCalendarWeeks, isWithinBounds, options };

package/lib/inputs2/date/helpers.js

@@ -0,0 +1,62 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.options = exports.isWithinBounds = exports.generateCalendarWeeks = exports.TOKEN_PTBR_FORMAT = exports.TOKEN_MASK = exports.TOKEN_ISO_FORMAT = exports.PERIOD_OPTIONS_LIST = exports.NAVIGATION_KEYS = void 0;
+var _moment = _interopRequireDefault(require("moment"));
+var _memoize = _interopRequireDefault(require("lodash/memoize"));
+var _permissionValidations = require("../../permissionValidations");
+var _types = require("./types");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const TOKEN_MASK = exports.TOKEN_MASK = '00/00/0000';
+const TOKEN_ISO_FORMAT = exports.TOKEN_ISO_FORMAT = 'YYYY-MM-DD';
+const TOKEN_PTBR_FORMAT = exports.TOKEN_PTBR_FORMAT = 'DD/MM/YYYY';
+const options = exports.options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible, _permissionValidations.OPTIONS_ON_DENIED.readOnly, _permissionValidations.OPTIONS_ON_DENIED.hideContent];
+const NAVIGATION_KEYS = exports.NAVIGATION_KEYS = [_types.Keys.arrowLeft, _types.Keys.arrowRight, _types.Keys.arrowUp, _types.Keys.arrowDown, _types.Keys.pageUp, _types.Keys.pageDown, _types.Keys.home, _types.Keys.end, _types.Keys.escape, _types.Keys.enter];
+const PERIOD_OPTIONS_LIST = exports.PERIOD_OPTIONS_LIST = [{
+  id: 'today',
+  label: 'Hoje'
+}, {
+  id: 'week',
+  label: 'Semana Atual'
+}, {
+  id: 'lastweek',
+  label: 'Última Semana'
+}, {
+  id: 'last15',
+  label: 'Últimos 15 dias'
+}, {
+  id: 'month',
+  label: 'Mês atual'
+}, {
+  id: 'lastmonth',
+  label: 'Último Mês'
+}];
+const isWithinBounds = (date, minDate, maxDate) => {
+  if (minDate) {
+    const min = (0, _moment.default)(minDate, TOKEN_ISO_FORMAT);
+    if (date.isBefore(min, 'day')) return false;
+  }
+  if (maxDate) {
+    const max = (0, _moment.default)(maxDate, TOKEN_ISO_FORMAT);
+    if (date.isAfter(max, 'day')) return false;
+  }
+  return true;
+};
+exports.isWithinBounds = isWithinBounds;
+const generateCalendarWeeks = exports.generateCalendarWeeks = (0, _memoize.default)(monthSelected => {
+  const startOfCalendar = monthSelected.clone().startOf('month').startOf('week');
+  const endOfCalendar = monthSelected.clone().endOf('month').endOf('week');
+  const weeks = [];
+  let currentWeek = startOfCalendar.clone();
+  while (currentWeek.isSameOrBefore(endOfCalendar, 'day')) {
+    const week = [];
+    for (let days = 0; days < 7; days++) {
+      week.push(currentWeek.clone());
+      currentWeek.add(1, 'day');
+    }
+    weeks.push(week);
+  }
+  return weeks;
+}, monthSelected => monthSelected.format('YYYY-MM'));

package/lib/inputs2/date/types.d.ts

@@ -0,0 +1,59 @@
+import { ColorTheme } from '../../@types/ColorStyles.js';
+import { HintPosition, Position } from '../../@types/Position.js';
+
+declare enum Keys {
+    arrowLeft = "ArrowLeft",
+    arrowRight = "ArrowRight",
+    arrowUp = "ArrowUp",
+    arrowDown = "ArrowDown",
+    pageUp = "PageUp",
+    pageDown = "PageDown",
+    home = "Home",
+    end = "End",
+    escape = "Escape",
+    enter = "Enter"
+}
+interface BaseDateInputRootProps extends React.ComponentPropsWithoutRef<'div'> {
+    customClassWrapper?: string;
+    hasValidationErrors?: boolean;
+}
+interface BaseDateInputLabelProps extends React.ComponentPropsWithoutRef<'span'> {
+    hint?: string;
+    customClassLabel?: string;
+    skeletonize?: boolean;
+    label?: string;
+    inputId?: string;
+    isDisabled?: boolean;
+    isReadOnly?: boolean;
+    required?: boolean;
+    labelUppercase?: boolean;
+    hasHintMessages?: boolean;
+    hintPosition?: HintPosition;
+    themePopover?: ColorTheme;
+    popoverAlign?: Extract<Position, 'left' | 'right'>;
+}
+interface BaseDateInputContainerProps extends React.ComponentPropsWithoutRef<'div'> {
+    skeletonize?: boolean;
+    customClassInputContainer?: string;
+}
+type InputHTMLProps = Omit<React.ComponentPropsWithoutRef<'input'>, 'type' | 'multiple'>;
+interface BaseDateInputProps extends InputHTMLProps {
+    customClass?: string;
+}
+interface BaseDateInputTriggersProps extends React.ComponentPropsWithoutRef<'div'> {
+    isDisabled?: boolean;
+    isReadOnly?: boolean;
+    skeletonize?: boolean;
+    inputFieldId?: string;
+    calendarBoxOpen?: boolean;
+    showClearButton?: boolean;
+    showCalendarButton?: boolean;
+    hasValidDateSelection?: boolean;
+    hasValidPeriodSelected?: boolean;
+    clearButtonTestId?: string;
+    calendarButtonTestId?: string;
+    onClearSelectedDate: () => void;
+    onClickTriggerCalendar: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}
+
+export { BaseDateInputContainerProps, BaseDateInputLabelProps, BaseDateInputProps, BaseDateInputRootProps, BaseDateInputTriggersProps, Keys };

package/lib/inputs2/date/types.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Keys = void 0;
+let Keys = exports.Keys = /*#__PURE__*/function (Keys) {
+  Keys["arrowLeft"] = "ArrowLeft";
+  Keys["arrowRight"] = "ArrowRight";
+  Keys["arrowUp"] = "ArrowUp";
+  Keys["arrowDown"] = "ArrowDown";
+  Keys["pageUp"] = "PageUp";
+  Keys["pageDown"] = "PageDown";
+  Keys["home"] = "Home";
+  Keys["end"] = "End";
+  Keys["escape"] = "Escape";
+  Keys["enter"] = "Enter";
+  return Keys;
+}({});

package/lib/inputs2/index.d.ts

@@ -0,0 +1,29 @@
+export { i as TextField } from '../index-772f9f1a.js';
+export { i as DateField } from '../index-368f781f.js';
+export { i as SelectField } from '../index-18a64236.js';
+export { i as ColorField } from '../index-8a59cf4b.js';
+export { B as BaseMaskNumber } from '../BaseNumber-797088d7.js';
+export { N as NumberField } from '../Number-9c6aceff.js';
+export { D as DecimalField } from '../Decimal-55e836d5.js';
+export { C as CurrencyField } from '../Currency-b33d3a22.js';
+export { B as MaskField } from '../BaseMask-3d5d581d.js';
+export { C as CpfField } from '../Cpf-4d6b9079.js';
+export { C as CnpjField } from '../Cnpj-1602be21.js';
+export { P as PhoneField } from '../Phone-79e5e3b4.js';
+export { Z as ZipCodeField } from '../ZipCode-8c2e9d8b.js';
+export { i as CheckboxField } from '../index-43ad8140.js';
+export { i as DatePeriodField } from '../index-c9247c1f.js';
+import 'react';
+import '../@types/Align.js';
+import '../@types/ColorStyles.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import './slot/index.js';
+import '../tooltip/types.js';
+import './date/datefield/types.js';
+import 'moment';
+import './selectfield/item.js';
+import './selectfield/types.js';
+import 'imask';
+import '../@types/Size.js';
+import './date/dateperiodfield/types.js';

package/lib/inputs2/index.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ZipCodeField = exports.TextField = exports.SelectField = exports.PhoneField = exports.NumberField = exports.MaskField = exports.DecimalField = exports.DatePeriodField = exports.DateField = exports.CurrencyField = exports.CpfField = exports.ColorField = exports.CnpjField = exports.CheckboxField = exports.BaseMaskNumber = void 0;
+var TextField = _interopRequireWildcard(require("./textfield"));
+exports.TextField = TextField;
+var DateField = _interopRequireWildcard(require("./date/datefield"));
+exports.DateField = DateField;
+var SelectField = _interopRequireWildcard(require("./selectfield"));
+exports.SelectField = SelectField;
+var ColorField = _interopRequireWildcard(require("./colorfield"));
+exports.ColorField = ColorField;
+var BaseMaskNumber = _interopRequireWildcard(require("./number/BaseNumber"));
+exports.BaseMaskNumber = BaseMaskNumber;
+var NumberField = _interopRequireWildcard(require("./number/Number"));
+exports.NumberField = NumberField;
+var DecimalField = _interopRequireWildcard(require("./number/Decimal"));
+exports.DecimalField = DecimalField;
+var CurrencyField = _interopRequireWildcard(require("./number/Currency"));
+exports.CurrencyField = CurrencyField;
+var MaskField = _interopRequireWildcard(require("./mask/BaseMask"));
+exports.MaskField = MaskField;
+var CpfField = _interopRequireWildcard(require("./mask/Cpf"));
+exports.CpfField = CpfField;
+var CnpjField = _interopRequireWildcard(require("./mask/Cnpj"));
+exports.CnpjField = CnpjField;
+var PhoneField = _interopRequireWildcard(require("./mask/Phone"));
+exports.PhoneField = PhoneField;
+var ZipCodeField = _interopRequireWildcard(require("./mask/ZipCode"));
+exports.ZipCodeField = ZipCodeField;
+var CheckboxField = _interopRequireWildcard(require("./checkboxfield"));
+exports.CheckboxField = CheckboxField;
+var DatePeriodField = _interopRequireWildcard(require("./date/dateperiodfield"));
+exports.DatePeriodField = DatePeriodField;
+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; }

package/lib/inputs2/mask/BaseMask.d.ts

@@ -0,0 +1,10 @@
+import 'react';
+import '../../index-772f9f1a.js';
+import 'imask';
+export { I as Input, M as MaskFieldProps } from '../../BaseMask-3d5d581d.js';
+import '../../@types/Align.js';
+import '../../@types/ColorStyles.js';
+import '../../@types/Position.js';
+import '../../@types/PermissionAttr.js';
+import '../slot/index.js';
+import '../../tooltip/types.js';

package/lib/inputs2/mask/BaseMask.js

@@ -0,0 +1,95 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Input = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactImask = require("react-imask");
+var _textfield = require("../textfield");
+var _helpers = require("../../form2/helpers");
+const _excluded = ["maskOptions", "autoCompleteMask", "name", "value", "onComplete", "onChange", "onBlur", "onAccept"];
+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 _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 _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+const Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+      maskOptions = {
+        mask: '',
+        lazy: false,
+        placeholderChar: '_'
+      },
+      autoCompleteMask = '',
+      name,
+      value: valueFromProps,
+      onComplete,
+      onChange,
+      onBlur,
+      onAccept
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const inputRef = (0, _react.useRef)(null);
+  const {
+    value,
+    unmaskedValue,
+    setValue: setMaskValue,
+    maskRef: refMask
+  } = (0, _reactImask.useIMask)(maskOptions, {
+    ref: inputRef,
+    onComplete: (__, maskRef) => {
+      onComplete?.(maskRef.value, maskRef);
+    },
+    onAccept: (__, maskRef) => {
+      const syntheticEvent = {
+        target: {
+          name,
+          value: maskRef.unmaskedValue
+        }
+      };
+      onChange?.(syntheticEvent);
+      onAccept?.(maskRef.value);
+    }
+  });
+  _react.default.useEffect(() => {
+    const currentValue = valueFromProps ?? '';
+    if (currentValue === '') {
+      if (refMask.current) {
+        refMask.current.value = '';
+      }
+    } else {
+      setMaskValue(currentValue);
+    }
+  }, [valueFromProps]);
+  return /*#__PURE__*/_react.default.createElement(_textfield.Input, _extends({}, rest, {
+    type: "text",
+    name: name,
+    value: value,
+    onBlur: e => {
+      if (unmaskedValue.trim().length && autoCompleteMask) {
+        const currentValue = unmaskedValue;
+        const sizeMask = maskOptions?.mask?.toString().replace(/\D+/g, '').length;
+        if (sizeMask && sizeMask > currentValue.length) {
+          switch (autoCompleteMask) {
+            case 'left':
+              setMaskValue(currentValue.padStart(sizeMask, '0'));
+              break;
+            case 'right':
+              setMaskValue(currentValue.padEnd(sizeMask, '0'));
+              break;
+            default:
+              setMaskValue(currentValue);
+              break;
+          }
+        }
+      }
+      if (onBlur) onBlur(e);
+    },
+    onChange: e => {
+      if (onChange) onChange(e);
+    },
+    ref: (0, _helpers.mergeRefs)(ref, inputRef)
+  }));
+});
+Input.displayName = 'MaskInputField';

package/lib/inputs2/mask/Cnpj.d.ts

@@ -0,0 +1,11 @@
+import 'react';
+import '../../BaseMask-3d5d581d.js';
+export { a as CnpjFieldProps, I as Input } from '../../Cnpj-1602be21.js';
+import '../../index-772f9f1a.js';
+import '../../@types/Align.js';
+import '../../@types/ColorStyles.js';
+import '../../@types/Position.js';
+import '../../@types/PermissionAttr.js';
+import '../slot/index.js';
+import '../../tooltip/types.js';
+import 'imask';

package/lib/inputs2/mask/Cnpj.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Input = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _helpers = require("../../../lib/form2/helpers");
+var _helpers2 = require("./helpers");
+var _BaseMask = require("./BaseMask");
+const _excluded = ["name", "onValidate", "onChange", "onBlur", "errors"];
+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 _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 _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+const CNPJ_INVALID_MESSAGE = 'CNPJ inválido';
+const Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  const {
+      name,
+      onValidate,
+      onChange,
+      onBlur,
+      errors: externalErrors = []
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const inputRef = (0, _react.useRef)(null);
+  const validateCnpj = raw => {
+    const hasCnpjError = externalErrors.includes(CNPJ_INVALID_MESSAGE);
+    const isValid = (0, _helpers2.CNPJValidation)(raw);
+    if (!isValid && hasCnpjError) {
+      onValidate?.([CNPJ_INVALID_MESSAGE]);
+    }
+    if (isValid && !hasCnpjError) {
+      onValidate?.([]);
+    }
+  };
+  const handleChange = e => {
+    const rawValue = e.target.value.replace(/\D/g, '');
+    validateCnpj(rawValue);
+    onChange?.(e);
+  };
+  return /*#__PURE__*/_react.default.createElement(_BaseMask.Input, _extends({}, rest, {
+    type: "text",
+    name: name,
+    errors: externalErrors,
+    maskOptions: {
+      mask: '00.000.000/0000-00',
+      placeholderChar: '_',
+      lazy: false
+    },
+    onBlur: onBlur,
+    onChange: handleChange,
+    ref: (0, _helpers.mergeRefs)(ref, inputRef)
+  }));
+});
+Input.displayName = 'CnpjInputField';

package/lib/inputs2/mask/Cpf.d.ts

@@ -0,0 +1,11 @@
+import 'react';
+import '../../BaseMask-3d5d581d.js';
+export { a as CpfFieldProps, I as Input } from '../../Cpf-4d6b9079.js';
+import '../../index-772f9f1a.js';
+import '../../@types/Align.js';
+import '../../@types/ColorStyles.js';
+import '../../@types/Position.js';
+import '../../@types/PermissionAttr.js';
+import '../slot/index.js';
+import '../../tooltip/types.js';
+import 'imask';