linear-react-components-ui 1.1.2-beta.8 → 1.1.2

package/lib/form/FieldNumber.d.ts

@@ -6,6 +6,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const _default: React__default.ForwardRefExoticComponent<IFieldProps & React__default.RefAttributes<HTMLElement>>;
 

package/lib/form/FieldPeriod.d.ts

@@ -6,6 +6,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const _default: React__default.ForwardRefExoticComponent<IFieldPeriodProps & React__default.RefAttributes<HTMLElement>>;
 

package/lib/form/helpers.d.ts

@@ -6,6 +6,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const securityBeforeUnload = "securityBeforeUnload";
 declare const FormContext: React__default.Context<FormContextProps>;

package/lib/form/index.d.ts

@@ -10,6 +10,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const Form: ({ submitOnPressEnterKey, dataSource, securityBeforeUnload, handlerReset, handlerSubmit, handlerValidates, style, customClass, securityTitle, securityText, securityData, onDataChange, onValidateForm, externalFieldErrors, onSubmit, skeletonize, disabled, children, useInternalState, }: FormProps) => JSX.Element;
 

package/lib/form/types.d.ts

@@ -5,6 +5,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 type Validator = (value: string) => string | undefined;
 type PeriodValidator = (value: {
@@ -217,4 +219,4 @@ type FieldValidator = {
     [name: string]: Validator | Validator[];
 };
 
-export type { CustomEvent, CustomKeyboardEvent, FieldErrors, FieldValidator, FormContextProps, FormProps, IEventParams, IFieldArrayProps, IFieldPeriodProps, IFieldProps, IFormSecurityContext, IGetErrorMessagesParams, IWithFieldContext, IWithFormSecurity, OnFielChangeEvent, PeriodChangeEvent, PeriodValidator, Validator, WithFieldProps };
+export { CustomEvent, CustomKeyboardEvent, FieldErrors, FieldValidator, FormContextProps, FormProps, IEventParams, IFieldArrayProps, IFieldPeriodProps, IFieldProps, IFormSecurityContext, IGetErrorMessagesParams, IWithFieldContext, IWithFormSecurity, OnFielChangeEvent, PeriodChangeEvent, PeriodValidator, Validator, WithFieldProps };

package/lib/form/withFieldHOC.d.ts

@@ -6,6 +6,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const withFieldHOC: <ComponentProps extends WithFieldProps>(WrappedComponent: React__default.ComponentType<ComponentProps>) => React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<ComponentProps> & React__default.RefAttributes<HTMLElement>>;
 

package/lib/form/withFormSecurity.d.ts

@@ -6,6 +6,8 @@ import '../@types/DataCombo.js';
 import '../@types/PermissionAttr.js';
 import '../inputs/base/types.js';
 import '../@types/Period.js';
+import '../internals/types.js';
+import '../@types/Position.js';
 
 declare const FormSecurityContext: React__default.Context<IFormSecurityContext>;
 declare const withFormSecurity: <ComponentProps extends IWithFormSecurity>(WrappedComponent: React__default.ComponentType<ComponentProps>) => (props: ComponentProps) => JSX.Element;

package/lib/gridlayout/GridRow.js

@@ -7,17 +7,25 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 require("../assets/styles/gridlayout.scss");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const getClass = props => "row ".concat(props.customClass, "\n    ").concat(props.withTrim && ' -withtrim', "\n    ").concat(props.verticalAlign && " align-".concat(props.verticalAlign), "\n    ").concat(props.horizontalAlign && " justify-content-".concat(props.horizontalAlign));
+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; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const getClass = props => "row ".concat(props.customClass, "\n    ").concat(props.withTrim && ' -withtrim', "\n    ").concat(props.verticalAlign && " align-items-".concat(props.verticalAlign), "\n    ").concat(props.horizontalAlign && " justify-content-".concat(props.horizontalAlign));
 const GridRow = props => {
   const {
     style,
     children,
+    verticalAlign = 'start',
     visible = true
   } = props;
   if (!visible) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
     style: style,
-    className: getClass(props)
+    className: getClass(_objectSpread(_objectSpread({}, props), {}, {
+      verticalAlign
+    }))
   }, children);
 };
 var _default = exports.default = GridRow;

package/lib/gridlayout/types.d.ts

@@ -9,7 +9,7 @@ interface IGridCol {
 }
 interface IGridRow {
     children: ReactNode | ReactNode[];
-    verticalAlign?: string;
+    verticalAlign?: 'start' | 'center' | 'end' | 'baseline' | 'stretch';
     horizontalAlign?: string;
     style?: CSSProperties;
     withTrim?: boolean;
@@ -17,4 +17,4 @@ interface IGridRow {
     customClass?: string;
 }
 
-export type { IGridCol, IGridRow };
+export { IGridCol, IGridRow };

package/lib/hint/helpers.d.ts

@@ -0,0 +1,3 @@
+declare const showHintList: (arrayHint: string[]) => JSX.Element;
+
+export { showHintList };

package/lib/hint/helpers.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.showHintList = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const showHintList = arrayHint => /*#__PURE__*/_react.default.createElement("div", {
+  className: "rules-list",
+  style: {
+    padding: '15px 0px'
+  }
+}, /*#__PURE__*/_react.default.createElement("ul", {
+  style: {
+    listStyleType: 'none'
+  }
+}, arrayHint.map((hint, index) => /*#__PURE__*/_react.default.createElement("li", {
+  key: index.toString()
+}, "- ", hint))));
+exports.showHintList = showHintList;

package/lib/hint/index.d.ts

@@ -1,6 +1,7 @@
 import { HintProps } from './types.js';
 import 'react';
+import '../@types/ColorStyles.js';
 
-declare const Hint: ({ visible, description, customClass, skeletonize, style, }: HintProps) => JSX.Element | null;
+declare const Hint: ({ visible, description, customClass, skeletonize, style, disabled, color, }: HintProps) => JSX.Element | null;
 
 export { Hint as default };

package/lib/hint/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _helpers = require("./helpers");
 require("../assets/styles/hint.scss");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const Hint = _ref => {
@@ -13,24 +14,17 @@ const Hint = _ref => {
     description,
     customClass,
     skeletonize = false,
-    style
+    style,
+    disabled = false,
+    color
   } = _ref;
   if (!visible || !description) return null;
-  const showHintList = arrayHint => /*#__PURE__*/_react.default.createElement("div", {
-    className: "rules-list",
-    style: {
-      padding: '15px 0px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("ul", {
-    style: {
-      listStyleType: 'none'
-    }
-  }, arrayHint.map((hint, index) => /*#__PURE__*/_react.default.createElement("li", {
-    key: index.toString()
-  }, "- ", hint))));
   return /*#__PURE__*/_react.default.createElement("div", {
+    "aria-disabled": disabled,
     style: style,
-    className: "\n        hint-component\n        ".concat(customClass, "\n        ").concat(skeletonize ? '-skeletonized' : '', "\n      ")
-  }, Array.isArray(description) ? showHintList(description) : /*#__PURE__*/_react.default.createElement("span", null, description));
+    className: "\n        hint-component\n        ".concat(customClass, "\n        ").concat(skeletonize ? '-skeletonized' : '', "\n        ").concat(disabled ? '-disabled' : '', "\n        -").concat(color, "\n      ")
+  }, Array.isArray(description) ? (0, _helpers.showHintList)(description) : /*#__PURE__*/_react.default.createElement("span", {
+    "aria-disabled": disabled
+  }, description));
 };
 var _default = exports.default = Hint;

package/lib/hint/types.d.ts

@@ -1,11 +1,14 @@
 import { CSSProperties } from 'react';
+import { ColorStyles } from '../@types/ColorStyles.js';
 
 interface HintProps {
     description?: string | string[];
     visible?: boolean;
     customClass?: string;
     skeletonize?: boolean;
+    disabled?: boolean;
     style?: CSSProperties;
+    color?: ColorStyles;
 }
 
-export type { HintProps };
+export { HintProps };

package/lib/icons/helper.d.ts

@@ -603,6 +603,10 @@ declare const _default: {
         viewbox: string;
         paths: string[];
     };
+    user_block: {
+        viewbox: string;
+        paths: string[];
+    };
 };
 
 export { _default as default };

package/lib/icons/helper.js

@@ -608,5 +608,9 @@ var _default = exports.default = {
   videoCamOutline: {
     viewbox: '0 0 16 16',
     paths: ['M15.294 4.004c-0.165 0-0.335 0.058-0.491 0.168l-2.803 1.978v-1.651c0-0.825-0.675-1.5-1.5-1.5h-9c-0.825 0-1.5 0.675-1.5 1.5v7c0 0.825 0.675 1.5 1.5 1.5h9c0.825 0 1.5-0.675 1.5-1.5v-1.65l2.803 1.978c0.156 0.11 0.326 0.168 0.491 0.168 0 0 0 0 0 0 0.22 0 0.421-0.101 0.551-0.278 0.101-0.137 0.154-0.313 0.154-0.51v-6.415c-0-0.518-0.355-0.788-0.706-0.788zM15 10.743l-2.469-1.743h-1.531v2.5c0 0.271-0.229 0.5-0.5 0.5h-9c-0.271 0-0.5-0.229-0.5-0.5v-7c0-0.271 0.229-0.5 0.5-0.5h9c0.271 0 0.5 0.229 0.5 0.5v2.5h1.531l2.469-1.743v5.486z', 'M4 5l5 3-5 3z']
+  },
+  user_block: {
+    viewbox: '0 0 16 16',
+    paths: ['M7.5 16h-6.977c-0.14 0-0.274-0.059-0.369-0.163s-0.141-0.242-0.129-0.382c0.11-1.22 0.585-2.363 1.373-3.305 0.697-0.832 1.59-1.452 2.602-1.809l0-0.475c-0.562-0.385-1.037-0.926-1.385-1.582-0.402-0.758-0.615-1.634-0.615-2.535 0-1.251 0.405-2.431 1.139-3.323 0.758-0.92 1.774-1.427 2.861-1.427 2.119 0 3.874 1.966 3.993 4.476 0.013 0.276-0.2 0.51-0.476 0.523s-0.51-0.2-0.523-0.476c-0.094-1.976-1.41-3.524-2.995-3.524-1.654 0-3 1.682-3 3.75 0 1.457 0.687 2.795 1.75 3.408 0.155 0.089 0.25 0.254 0.25 0.433l-0 1.116c0 0.224-0.149 0.42-0.364 0.481-0.967 0.274-1.822 0.828-2.471 1.604-0.538 0.643-0.901 1.397-1.064 2.208h6.4c0.276 0 0.5 0.224 0.5 0.5s-0.224 0.5-0.5 0.5z', 'M11.5 7c-2.481 0-4.5 2.019-4.5 4.5s2.019 4.5 4.5 4.5 4.5-2.019 4.5-4.5-2.019-4.5-4.5-4.5zM8 11.5c0-1.93 1.57-3.5 3.5-3.5 0.785 0 1.511 0.26 2.095 0.698l-4.897 4.897c-0.438-0.584-0.698-1.31-0.698-2.095zM11.5 15c-0.785 0-1.511-0.26-2.095-0.698l4.897-4.897c0.438 0.584 0.698 1.31 0.698 2.095 0 1.93-1.57 3.5-3.5 3.5z']
   }
 };

package/lib/icons/types.d.ts

@@ -33,4 +33,4 @@ interface IIconProps {
     targetRef?: (ref: HTMLDivElement) => void;
 }
 
-export type { IIconProps, ListIconType };
+export { IIconProps, ListIconType };

package/lib/inputs/base/InputTextBase.d.ts

@@ -3,6 +3,8 @@ import 'react';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
 import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const _default: (props: IBaseProps) => JSX.Element;
 

package/lib/inputs/base/InputTextBase.js

@@ -12,6 +12,8 @@ var helpers = _interopRequireWildcard(require("./helpers"));
 var _withTooltip = _interopRequireDefault(require("../../internals/withTooltip"));
 var _permissionValidations = require("../../permissionValidations");
 var _hint = _interopRequireDefault(require("../../hint"));
+var _errorMessage = require("../errorMessage");
+var _Label = _interopRequireDefault(require("./Label"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
@@ -69,11 +71,13 @@ const InputTextBase = props => {
   } = props;
   let propsInput;
   const options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible, _permissionValidations.OPTIONS_ON_DENIED.readOnly, _permissionValidations.OPTIONS_ON_DENIED.hideContent];
+  const labelRef = (0, _react.useRef)(null);
   const onDenied = onDeniedActions || (0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr);
   const {
     hideContent,
     unvisible
   } = onDenied;
+  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
   (0, _react.useEffect)(() => {
     if (handlerSetOnDenied) handlerSetOnDenied(onDenied);
   }, []);
@@ -144,6 +148,39 @@ const InputTextBase = props => {
     }
     return propsInput;
   };
+  const onHoverLabel = e => {
+    const target = e.target;
+    if (target.offsetWidth < target.scrollWidth) {
+      setShowTooltip(true);
+    }
+  };
+  (0, _react.useEffect)(() => {
+    const resize = new ResizeObserver(_ref => {
+      let [element] = _ref;
+      const {
+        target
+      } = element;
+      setShowTooltip(prevState => {
+        var overflowing = target.clientWidth < target.scrollWidth;
+        return prevState === overflowing ? prevState : overflowing;
+      });
+    });
+    if (labelRef.current) {
+      resize.observe(labelRef.current);
+    }
+    return () => {
+      if (resize) {
+        resize.disconnect();
+      }
+    };
+  }, []);
+  if (labelRef.current) {
+    const element = labelRef.current;
+    const overflowing = element.offsetWidth < element.scrollWidth;
+    if (overflowing && !showTooltip) {
+      setShowTooltip(true);
+    }
+  }
   if (!visible || unvisible) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
     style: style,
@@ -154,12 +191,16 @@ const InputTextBase = props => {
     style: {
       textAlign: textAlign === 'center' ? 'left' : textAlign
     }
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    style: styleForLabel,
-    className: "label ".concat(customClassForLabel, " ").concat(labelUppercase && ' -uppercase')
-  }, label, required && /*#__PURE__*/_react.default.createElement("span", {
-    className: "-requiredlabel"
-  }, "*"))), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_Label.default, {
+    labelRef: labelRef,
+    label: label,
+    required: required,
+    onHoverLabel: onHoverLabel,
+    customClassForLabel: customClassForLabel,
+    labelUppercase: labelUppercase,
+    tooltip: showTooltip ? label.toString() : undefined,
+    tooltipPosition: "top"
+  })), /*#__PURE__*/_react.default.createElement("div", {
     "data-testid": "testInputWrapper",
     style: styleForWrapper,
     className: helpers.getInputWrapperClass(_objectSpread(_objectSpread({}, props), {}, {
@@ -179,9 +220,12 @@ const InputTextBase = props => {
     autoComplete: autoComplete,
     tabIndex: applyTabIndex()
   }, inputProps())), children), helpers.getRightElements(errorMessages || [], skeletonize, rightElements)), /*#__PURE__*/_react.default.createElement(_hint.default, {
+    disabled: disabled,
     visible: !!hint,
     customClass: "hint",
     description: hint
-  }), errorMessages && helpers.getErrorMessages(errorMessages));
+  }), /*#__PURE__*/_react.default.createElement(_errorMessage.ErrorMessage, {
+    messages: errorMessages
+  }));
 };
 var _default = exports.default = (0, _inputHOC.default)((0, _withTooltip.default)(InputTextBase));

package/lib/inputs/base/Label.d.ts

@@ -0,0 +1,14 @@
+import { InputLabelProps } from './types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+
+declare const _default: {
+    (props: InputLabelProps): JSX.Element;
+    displayName: string;
+};
+
+export { _default as default };

package/lib/inputs/base/Label.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _withTooltip = _interopRequireDefault(require("../../internals/withTooltip"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const Label = props => {
+  const {
+    label,
+    styleForLabel,
+    customClassForLabel,
+    labelUppercase,
+    required,
+    targetRef,
+    labelRef,
+    onHoverLabel
+  } = props;
+  return /*#__PURE__*/_react.default.createElement("span", {
+    style: styleForLabel,
+    ref: ref => {
+      if (ref) {
+        if (labelRef) labelRef.current = ref;
+        if (targetRef) targetRef(ref);
+      }
+    },
+    onMouseEnter: onHoverLabel,
+    className: "label ".concat(customClassForLabel, " ").concat(labelUppercase && ' -uppercase')
+  }, label, required && /*#__PURE__*/_react.default.createElement("span", {
+    className: "-requiredlabel"
+  }, "*"));
+};
+var _default = exports.default = (0, _withTooltip.default)(Label);

package/lib/inputs/base/helpers.d.ts

@@ -3,6 +3,8 @@ import { TextAlign } from '../../@types/Align.js';
 import 'react';
 import '../../@types/Period.js';
 import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const getInputClass: ({ textAlign, readOnly, readOnlyClass, }: {
     textAlign?: TextAlign | undefined;
@@ -10,7 +12,6 @@ declare const getInputClass: ({ textAlign, readOnly, readOnlyClass, }: {
     readOnlyClass?: string | undefined;
 }) => string;
 declare const getInputWrapperClass: (props: IBaseProps) => string;
-declare const getErrorMessages: (messages: string[]) => JSX.Element;
 declare const getRightElements: (errorMessages: string[], skeletonize: boolean, rightElements?: JSX.Element | JSX.Element[]) => JSX.Element[] | null;
 
-export { getErrorMessages, getInputClass, getInputWrapperClass, getRightElements };
+export { getInputClass, getInputWrapperClass, getRightElements };

package/lib/inputs/base/helpers.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getRightElements = exports.getInputWrapperClass = exports.getInputClass = exports.getErrorMessages = void 0;
+exports.getRightElements = exports.getInputWrapperClass = exports.getInputClass = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _lodash = _interopRequireDefault(require("lodash"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -27,13 +27,6 @@ const getInputWrapperClass = props => {
   return "inputwrapper ".concat(inputHasFocus && ' -focusable', "\n          ").concat(customClassForWrapper, "\n          ").concat(errorMessages && errorMessages.length > 0 && ' -requirederror', "\n          ").concat(rounded && ' -roundedborders', "\n          ").concat(disabled && ' -disabled');
 };
 exports.getInputWrapperClass = getInputWrapperClass;
-const getErrorMessages = messages => {
-  if (!messages || messages.length === 0) return /*#__PURE__*/_react.default.createElement("noscript", null);
-  return /*#__PURE__*/_react.default.createElement("p", {
-    className: "errormessages"
-  }, messages.join(', '));
-};
-exports.getErrorMessages = getErrorMessages;
 const getRightElements = (errorMessages, skeletonize, rightElements) => {
   let elements = rightElements || [];
   if (skeletonize) return null;

package/lib/inputs/base/types.d.ts

@@ -1,7 +1,9 @@
-import { KeyboardEvent, DragEvent, MutableRefObject, RefObject, CSSProperties } from 'react';
+import { MutableRefObject, KeyboardEvent, DragEvent, RefObject, CSSProperties } from 'react';
 import { TextAlign } from '../../@types/Align.js';
 import { Period } from '../../@types/Period.js';
 import { PermissionAttr, OnDenied } from '../../@types/PermissionAttr.js';
+import { WithTooltipProps } from '../../internals/types.js';
+import '../../@types/Position.js';
 
 interface CustomInputEvent {
     preventDefault?: () => void;
@@ -15,6 +17,16 @@ interface CustomInputEvent {
         files?: FileList | null;
     };
 }
+interface InputLabelProps extends WithTooltipProps {
+    label?: string | string[];
+    customClassForLabel?: string;
+    styleForLabel?: object;
+    labelUppercase?: boolean;
+    required?: boolean;
+    targetRef?: (ref: HTMLSpanElement | null) => void;
+    labelRef?: MutableRefObject<HTMLSpanElement | null>;
+    onHoverLabel?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;
+}
 interface IBaseProps {
     inputHasFocus?: boolean;
     onInputReceiveFocus?: () => void;
@@ -79,4 +91,4 @@ interface IBaseProps {
     autoComplete?: 'on' | 'off';
 }
 
-export type { CustomInputEvent, IBaseProps };
+export { CustomInputEvent, IBaseProps, InputLabelProps };

package/lib/inputs/color/types.d.ts

@@ -11,4 +11,4 @@ interface IColorProps {
     visible?: boolean;
 }
 
-export type { IColorProps };
+export { IColorProps };

package/lib/inputs/date/Dialog.d.ts

@@ -5,6 +5,8 @@ import '../../@types/PermissionAttr.js';
 import '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const Dialog: ({ handlerClose, children, dialogSize }: IDateDialogProps) => JSX.Element;
 

package/lib/inputs/date/Dropdown.d.ts

@@ -5,6 +5,8 @@ import '../../@types/PermissionAttr.js';
 import '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const Dropdown: (props: IDateDropdownProps) => React.ReactPortal;
 

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

@@ -6,6 +6,8 @@ import '../../@types/PermissionAttr.js';
 import '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const PT_BR_FORMAT = "DD/MM/YYYY";
 declare const EN_US_FORMAT = "YYYY-MM-DD";

package/lib/inputs/date/index.d.ts

@@ -5,6 +5,8 @@ import '../../@types/PermissionAttr.js';
 import '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const DatePicker: (props: IDatePickerProps) => JSX.Element | null;
 

package/lib/inputs/date/index.js

@@ -32,6 +32,7 @@ const DatePicker = props => {
     required = false,
     value = '',
     name = '',
+    inputRef: inputRefProp,
     dialogSize = {
       width: '350px',
       height: '350px'
@@ -233,6 +234,7 @@ const DatePicker = props => {
     },
     inputRef: el => {
       inputRef.current = el;
+      if (inputRefProp) inputRefProp.current = el;
     },
     rightElements: getButtonOpen(),
     required: required,

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

@@ -4,6 +4,8 @@ import { PermissionAttr } from '../../@types/PermissionAttr.js';
 import { CustomInputEvent } from '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 interface IDatePickerProps {
     value?: string;
@@ -12,6 +14,7 @@ interface IDatePickerProps {
     setFocusOnSelect?: boolean;
     openOnFocus?: boolean;
     showCalendarInDialog?: boolean;
+    inputRef?: React.MutableRefObject<HTMLInputElement | HTMLTextAreaElement | null>;
     dialogSize?: {
         width: string;
         height: string;
@@ -52,4 +55,4 @@ interface IDateDialogProps {
     };
 }
 
-export type { IDateDialogProps, IDateDropdownProps, IDatePickerProps };
+export { IDateDialogProps, IDateDropdownProps, IDatePickerProps };

package/lib/inputs/errorMessage/index.d.ts

@@ -0,0 +1,17 @@
+import React__default from 'react';
+import { ErrorProps } from '../types.js';
+import 'imask';
+import '../../@types/PermissionAttr.js';
+import '../../@types/DataCombo.js';
+import '../base/types.js';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+import '../../drawer/types.js';
+import '../../@types/Icon.js';
+import '../../icons/helper.js';
+
+declare const ErrorMessage: React__default.ForwardRefExoticComponent<ErrorProps & React__default.RefAttributes<HTMLParagraphElement>>;
+
+export { ErrorMessage, ErrorMessage as default };

package/lib/inputs/errorMessage/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ErrorMessage = void 0;
+var _react = _interopRequireWildcard(require("react"));
+require("../../assets/styles/error.scss");
+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; }
+const ErrorMessage = exports.ErrorMessage = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    customClass = '',
+    messages: messagesProp,
+    style
+  } = _ref;
+  if (!messagesProp || messagesProp.length === 0) return null;
+  const messages = Array.isArray(messagesProp) ? messagesProp : [messagesProp];
+  return /*#__PURE__*/_react.default.createElement("p", {
+    ref: ref,
+    style: style,
+    className: "errormessages-component ".concat(customClass)
+  }, messages.join(', '));
+});
+ErrorMessage.displayName = 'ErrorMessage';
+var _default = exports.default = ErrorMessage;

package/lib/inputs/file/DefaultFile.d.ts

@@ -5,6 +5,8 @@ import '../base/types.js';
 import '../../@types/Align.js';
 import '../../@types/Period.js';
 import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
 
 declare const DefaultFile: (props: IDefaultFileProps) => JSX.Element;