linear-react-components-ui 1.1.26-beta.17 → 1.1.26-beta.19

package/lib/index.js

@@ -1,26 +1,69 @@
-import { default as p } from "./panel/Default.js";
-import './assets/styles/label.css';import './assets/styles/button.css';import './assets/styles/panel.css';/* empty css                         */
-import { default as d } from "./toolbar/index.js";
-import "react/jsx-runtime";
-import "./_virtual/compiler-runtime.js";
-import { default as u } from "./buttons/Button.js";
-/* empty css                          */
-import { default as i } from "./labels/DefaultLabel.js";
-/* empty css                         */
-import { default as n } from "./icons/index.js";
-import { default as T } from "./list/index.js";
-import { default as g } from "./radio/index.js";
-import { default as D } from "./tabs/index.js";
-import { default as P } from "./dialog/base/index.js";
-export {
-  u as Button,
-  P as Dialog,
-  n as Icon,
-  i as Label,
-  T as List,
-  p as Panel,
-  g as Radio,
-  D as Tab,
-  d as Toolbar
-};
-//# sourceMappingURL=index.js.map
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Button", {
+  enumerable: true,
+  get: function () {
+    return _buttons.default;
+  }
+});
+Object.defineProperty(exports, "Dialog", {
+  enumerable: true,
+  get: function () {
+    return _base.default;
+  }
+});
+Object.defineProperty(exports, "Icon", {
+  enumerable: true,
+  get: function () {
+    return _icons.default;
+  }
+});
+Object.defineProperty(exports, "Label", {
+  enumerable: true,
+  get: function () {
+    return _labels.default;
+  }
+});
+Object.defineProperty(exports, "List", {
+  enumerable: true,
+  get: function () {
+    return _list.default;
+  }
+});
+Object.defineProperty(exports, "Panel", {
+  enumerable: true,
+  get: function () {
+    return _panel.default;
+  }
+});
+Object.defineProperty(exports, "Radio", {
+  enumerable: true,
+  get: function () {
+    return _radio.default;
+  }
+});
+Object.defineProperty(exports, "Tab", {
+  enumerable: true,
+  get: function () {
+    return _tabs.default;
+  }
+});
+Object.defineProperty(exports, "Toolbar", {
+  enumerable: true,
+  get: function () {
+    return _toolbar.default;
+  }
+});
+var _panel = _interopRequireDefault(require("./panel"));
+var _toolbar = _interopRequireDefault(require("./toolbar"));
+var _buttons = _interopRequireDefault(require("./buttons"));
+var _labels = _interopRequireDefault(require("./labels"));
+var _icons = _interopRequireDefault(require("./icons"));
+var _list = _interopRequireDefault(require("./list"));
+var _radio = _interopRequireDefault(require("./radio"));
+var _tabs = _interopRequireDefault(require("./tabs"));
+var _base = _interopRequireDefault(require("./dialog/base"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

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

@@ -1,3 +1,11 @@
-import { IBaseProps } from './types';
-declare const _default: (props: IBaseProps) => import("react/jsx-runtime").JSX.Element;
-export default _default;
+import { IBaseProps } from './types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../@types/PermissionAttr.js';
+import '../../tooltip/types.js';
+import '../../@types/Position.js';
+
+declare const _default: (props: IBaseProps) => JSX.Element;
+
+export { _default as default };

package/lib/inputs/base/InputTextBase.js

@@ -1,188 +1,277 @@
-import { jsxs as i, jsx as n } from "react/jsx-runtime";
-import { useRef as A, useState as Ie, useEffect as z } from "react";
-import De from "../../_virtual/lodash.js";
-import we from "../inputHOC.js";
-import '../../assets/styles/input.css';/* empty css                             */
-import { getRightElements as Oe, getInputWrapperClass as Fe, getInputClass as Ne } from "./helpers.js";
-import { actionsOnPermissionDenied as Pe, OPTIONS_ON_DENIED as f } from "../../permissionValidations.js";
-import Re from "../../hint/index.js";
-import { ErrorMessage as We } from "../errorMessage/index.js";
-import H from "../../textContent/index.js";
-import Be from "../../popover/index.js";
-import Te from "../../tooltip/index.js";
-import Ee from "../../popover/PopoverText.js";
-const Le = (t) => {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _lodash = _interopRequireDefault(require("lodash"));
+var _inputHOC = _interopRequireDefault(require("../inputHOC"));
+require("../../assets/styles/input.scss");
+var helpers = _interopRequireWildcard(require("./helpers"));
+var _permissionValidations = require("../../permissionValidations");
+var _hint = _interopRequireDefault(require("../../hint"));
+var _errorMessage = require("../errorMessage");
+var _textContent = _interopRequireDefault(require("../../textContent"));
+var _popover = _interopRequireWildcard(require("../../popover"));
+var _tooltip = require("../../tooltip");
+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 _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; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+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 InputTextBase = props => {
   const {
-    textAlign: m = "left",
-    value: j,
-    defaultValue: q,
-    type: v = "text",
-    readOnly: p = !1,
-    placeHolder: M,
-    required: y,
-    leftElements: x,
-    rightElements: U,
-    children: V,
-    customClass: G,
-    customClassForInputContent: J,
-    customClassForLabel: C,
-    customClassForSideButtons: Q,
-    inputRef: l,
-    inputBaseRef: X,
-    label: r,
-    labelUppercase: I,
-    hint: a,
-    hintPosition: D = "below",
-    errorMessages: w,
-    visible: Y = !0,
-    permissionAttr: Z,
-    onDeniedActions: ee,
-    handlerSetOnDenied: O,
-    skeletonize: h = !1,
-    style: te,
-    styleForInputContent: ne,
-    styleForWrapper: oe,
-    styleForSideButtons: se,
-    disabled: F = !1,
-    autoFocus: ie,
-    maxLength: le,
-    name: re,
-    id: ae,
-    multiple: ce = !1,
-    accept: de,
-    onChange: N,
-    onDragOver: P,
-    onDrop: R,
-    onDragLeave: W,
-    onClick: B,
-    readOnlyClass: ue,
-    autoComplete: fe = "on",
-    themePopover: me = "light",
-    popoverAlign: pe = "left",
-    tabIndex: T,
-    tooltip: he,
-    tooltipPosition: ge,
-    tooltipWidth: be
-  } = t;
-  let c;
-  const ve = [f.disabled, f.unvisible, f.readOnly, f.hideContent], s = A(null), d = ee || Pe(ve, Z), {
-    hideContent: u,
-    unvisible: ye
-  } = d, [xe, g] = Ie(!1), E = A(null);
-  z(() => {
-    O && O(d);
+    textAlign = 'left',
+    value,
+    defaultValue,
+    type = 'text',
+    readOnly = false,
+    placeHolder,
+    required,
+    leftElements,
+    rightElements,
+    children,
+    customClass,
+    customClassForInputContent,
+    customClassForLabel,
+    customClassForSideButtons,
+    inputRef,
+    inputBaseRef,
+    label,
+    labelUppercase,
+    hint,
+    hintPosition = 'below',
+    errorMessages,
+    visible = true,
+    permissionAttr,
+    onDeniedActions,
+    handlerSetOnDenied,
+    skeletonize = false,
+    style,
+    styleForInputContent,
+    styleForWrapper,
+    styleForSideButtons,
+    disabled = false,
+    autoFocus,
+    maxLength,
+    name,
+    id,
+    multiple = false,
+    accept,
+    onChange,
+    onDragOver,
+    onDrop,
+    onDragLeave,
+    onClick,
+    readOnlyClass,
+    autoComplete = 'on',
+    themePopover = 'light',
+    popoverAlign = 'left',
+    tabIndex,
+    tooltip,
+    tooltipPosition,
+    tooltipWidth
+  } = 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);
+  const inputElementRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (handlerSetOnDenied) handlerSetOnDenied(onDenied);
   }, []);
-  const L = () => p ? -1 : T || 0, b = () => F || d.disabled, S = () => p || d.readOnly, _ = () => {
-    const o = S() || b() || u;
-    return c = {
-      value: u ? "" : j,
-      defaultValue: q,
-      accept: de,
-      type: v,
-      readOnly: S(),
-      placeholder: M,
-      disabled: b() || u,
-      autoFocus: ie,
-      maxLength: le,
-      name: re,
-      id: ae,
-      multiple: ce,
-      className: Ne({
-        textAlign: m,
-        readOnly: p,
-        readOnlyClass: ue
+  const applyTabIndex = () => {
+    if (readOnly) return -1;
+    if (tabIndex) return tabIndex;
+    return 0;
+  };
+  const shouldDisable = () => disabled || onDenied.disabled;
+  const shouldBeReadOnly = () => readOnly || onDenied.readOnly;
+  const inputProps = () => {
+    const disableCallbacks = shouldBeReadOnly() || shouldDisable() || hideContent;
+    propsInput = {
+      value: hideContent ? '' : value,
+      defaultValue,
+      accept,
+      type,
+      readOnly: shouldBeReadOnly(),
+      placeholder: placeHolder,
+      disabled: shouldDisable() || hideContent,
+      autoFocus,
+      maxLength,
+      name,
+      id,
+      multiple,
+      className: helpers.getInputClass({
+        textAlign,
+        readOnly,
+        readOnlyClass
       }),
-      ref: (e) => {
-        l && (De.isFunction(l) ? l(e) : l.current = e), E.current = e;
+      ref: r => {
+        if (inputRef) {
+          if (!_lodash.default.isFunction(inputRef)) {
+            inputRef.current = r;
+          } else {
+            inputRef(r);
+          }
+        }
+        inputElementRef.current = r;
       }
-    }, o || (c = {
-      ...c,
-      onFocus: (e) => {
-        t.onInputReceiveFocus?.(), t.onFocus && t.onFocus(e);
-      },
-      onBlur: (e) => {
-        t.onInputLostFocus?.(), t.onBlur && t.onBlur(e);
-      },
-      onKeyDown: (e) => {
-        t.onKeyDown && t.onKeyDown(e);
-      },
-      onKeyPress: (e) => {
-        t.onKeyPress && t.onKeyPress(e);
-      },
-      onChange: (e) => {
-        N && N(e);
-      },
-      onDragOver: (e) => {
-        P && P(e);
-      },
-      onDrop: (e) => {
-        R && R(e);
-      },
-      onDragLeave: (e) => {
-        W && W(e);
-      },
-      onClick: (e) => {
-        B && B(e);
-      }
-    }), c;
-  }, Ce = (o) => {
-    const e = o.target;
-    e.offsetWidth < e.scrollWidth && g(!0);
+    };
+    if (!disableCallbacks) {
+      propsInput = _objectSpread(_objectSpread({}, propsInput), {}, {
+        onFocus: e => {
+          props.onInputReceiveFocus?.();
+          if (props.onFocus) props.onFocus(e);
+        },
+        onBlur: e => {
+          props.onInputLostFocus?.();
+          if (props.onBlur) props.onBlur(e);
+        },
+        onKeyDown: e => {
+          if (props.onKeyDown) props.onKeyDown(e);
+        },
+        onKeyPress: e => {
+          if (props.onKeyPress) props.onKeyPress(e);
+        },
+        onChange: e => {
+          if (onChange) onChange(e);
+        },
+        onDragOver: e => {
+          if (onDragOver) onDragOver(e);
+        },
+        onDrop: e => {
+          if (onDrop) onDrop(e);
+        },
+        onDragLeave: e => {
+          if (onDragLeave) onDragLeave(e);
+        },
+        onClick: e => {
+          if (onClick) onClick(e);
+        }
+      });
+    }
+    return propsInput;
+  };
+  const onHoverLabel = e => {
+    const target = e.target;
+    if (target.offsetWidth < target.scrollWidth) {
+      setShowTooltip(true);
+    }
   };
-  if (z(() => {
-    const o = new ResizeObserver(([e]) => {
+  (0, _react.useEffect)(() => {
+    const resize = new ResizeObserver(_ref => {
+      let [element] = _ref;
       const {
-        target: $
-      } = e;
-      g((K) => {
-        const k = $.clientWidth < $.scrollWidth;
-        return K === k ? K : k;
+        target
+      } = element;
+      setShowTooltip(prevState => {
+        var overflowing = target.clientWidth < target.scrollWidth;
+        return prevState === overflowing ? prevState : overflowing;
       });
     });
-    return s.current && o.observe(s.current), () => {
-      o && o.disconnect();
+    if (labelRef.current) {
+      resize.observe(labelRef.current);
+    }
+    return () => {
+      if (resize) {
+        resize.disconnect();
+      }
     };
-  }, []), s.current) {
-    const o = s.current;
-    o.offsetWidth < o.scrollWidth && !xe && g(!0);
+  }, []);
+  if (labelRef.current) {
+    const element = labelRef.current;
+    const overflowing = element.offsetWidth < element.scrollWidth;
+    if (overflowing && !showTooltip) {
+      setShowTooltip(true);
+    }
   }
-  return !Y || ye ? null : /* @__PURE__ */ i("div", { style: te, className: `input-base-component ${h ? "-skeletonized" : ""} ${G}`, ref: X, children: [
-    r && /* @__PURE__ */ i("div", { className: "labelcontainer", style: {
-      textAlign: m === "center" ? "left" : m
-    }, children: [
-      /* @__PURE__ */ n(H, { ref: s, required: y, label: r, onHoverLabel: Ce, className: C, labelUppercase: I, tooltip: r.toString(), tooltipPosition: "top" }),
-      /* @__PURE__ */ n("div", { className: "text-content", style: {
-        display: "flex"
-      }, children: /* @__PURE__ */ i("div", { className: `label ${C} ${I && " -uppercase"}`, style: {
-        alignSelf: "center"
-      }, children: [
-        r,
-        y && /* @__PURE__ */ n("span", { className: "-requiredlabel", children: "*" }),
-        !!a && D === "onLabelRight" && !h && /* @__PURE__ */ n(Be, { theme: me, align: pe, customClass: "-hint", iconColor: "#03bde2", style: {
-          margin: "0px 5px",
-          height: "auto",
-          width: 20
-        }, children: /* @__PURE__ */ n(Ee, { text: a }) })
-      ] }) }),
-      /* @__PURE__ */ n(H, {})
-    ] }),
-    /* @__PURE__ */ i("div", { "data-testid": "testInputWrapper", style: oe, className: Fe({
-      ...t,
-      disabled: b() || u
-    }), children: [
-      x && /* @__PURE__ */ n("div", { style: se, className: `sidebuttons ${Q}`, children: x }),
-      /* @__PURE__ */ i("div", { "data-testid": "testInputContent", style: ne, className: `inputcontent ${J}`, children: [
-        v === "textarea" ? /* @__PURE__ */ n("textarea", { rows: t.rows, cols: t.cols, tabIndex: L(), ..._() }) : /* @__PURE__ */ n("input", { autoComplete: fe, tabIndex: L(), "data-testid": "teste-123", ..._() }),
-        V
-      ] }),
-      Oe(w || [], h, U)
-    ] }),
-    /* @__PURE__ */ n(Re, { disabled: F, visible: !!a && D === "below", customClass: "hint", description: a }),
-    /* @__PURE__ */ n(We, { messages: w }),
-    /* @__PURE__ */ n(Te, { targetRef: E, text: he, width: be, position: ge })
-  ] });
-}, Ge = we(Le);
-export {
-  Ge as default
+  if (!visible || unvisible) return null;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: style,
+    className: `input-base-component ${skeletonize ? '-skeletonized' : ''} ${customClass}`,
+    ref: inputBaseRef
+  }, label && /*#__PURE__*/_react.default.createElement("div", {
+    className: "labelcontainer",
+    style: {
+      textAlign: textAlign === 'center' ? 'left' : textAlign
+    }
+  }, /*#__PURE__*/_react.default.createElement(_textContent.default, {
+    ref: labelRef,
+    required: required,
+    label: label,
+    onHoverLabel: onHoverLabel,
+    className: customClassForLabel,
+    labelUppercase: labelUppercase,
+    tooltip: label.toString(),
+    tooltipPosition: "top"
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "text-content",
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: `label ${customClassForLabel} ${labelUppercase && ' -uppercase'}`,
+    style: {
+      alignSelf: 'center'
+    }
+  }, label, required && /*#__PURE__*/_react.default.createElement("span", {
+    className: "-requiredlabel"
+  }, "*"), !!hint && hintPosition === 'onLabelRight' && !skeletonize && /*#__PURE__*/_react.default.createElement(_popover.default, {
+    theme: themePopover,
+    align: popoverAlign,
+    customClass: "-hint",
+    iconColor: "#03bde2",
+    style: {
+      margin: '0px 5px',
+      height: 'auto',
+      width: 20
+    }
+  }, /*#__PURE__*/_react.default.createElement(_popover.PopoverText, {
+    text: hint
+  })))), /*#__PURE__*/_react.default.createElement(_textContent.default, null)), /*#__PURE__*/_react.default.createElement("div", {
+    "data-testid": "testInputWrapper",
+    style: styleForWrapper,
+    className: helpers.getInputWrapperClass(_objectSpread(_objectSpread({}, props), {}, {
+      disabled: shouldDisable() || hideContent
+    }))
+  }, leftElements && /*#__PURE__*/_react.default.createElement("div", {
+    style: styleForSideButtons,
+    className: `sidebuttons ${customClassForSideButtons}`
+  }, leftElements), /*#__PURE__*/_react.default.createElement("div", {
+    "data-testid": "testInputContent",
+    style: styleForInputContent,
+    className: `inputcontent ${customClassForInputContent}`
+  }, type === 'textarea' ? /*#__PURE__*/_react.default.createElement("textarea", _extends({
+    rows: props.rows,
+    cols: props.cols,
+    tabIndex: applyTabIndex()
+  }, inputProps())) : /*#__PURE__*/_react.default.createElement("input", _extends({
+    autoComplete: autoComplete,
+    tabIndex: applyTabIndex(),
+    "data-testid": "teste-123"
+  }, inputProps())), children), helpers.getRightElements(errorMessages || [], skeletonize, rightElements)), /*#__PURE__*/_react.default.createElement(_hint.default, {
+    disabled: disabled,
+    visible: !!hint && hintPosition === 'below',
+    customClass: "hint",
+    description: hint
+  }), /*#__PURE__*/_react.default.createElement(_errorMessage.ErrorMessage, {
+    messages: errorMessages
+  }), /*#__PURE__*/_react.default.createElement(_tooltip.Tooltip, {
+    targetRef: inputElementRef,
+    text: tooltip,
+    width: tooltipWidth,
+    position: tooltipPosition
+  }));
 };
-//# sourceMappingURL=InputTextBase.js.map
+var _default = exports.default = (0, _inputHOC.default)(InputTextBase);

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

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