linear-react-components-ui 1.1.14-beta.0 → 1.1.14-beta.1

package/lib/drawer/helpers.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var DrawerContext = /*#__PURE__*/_react.default.createContext({});
-var _default = DrawerContext;
-exports.default = _default;
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const DrawerContext = /*#__PURE__*/_react.default.createContext({});
+var _default = exports.default = DrawerContext;

package/lib/drawer/index.js

@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "DrawerContent", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Content.default;
   }
 });
 Object.defineProperty(exports, "DrawerHeader", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Header.default;
   }
 });
@@ -21,6 +21,5 @@ var _Header = _interopRequireDefault(require("./Header"));
 var _Content = _interopRequireDefault(require("./Content"));
 require("../assets/styles/drawers.scss");
 var _withFormSecurity = _interopRequireDefault(require("../form/withFormSecurity"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = (0, _withFormSecurity.default)(_Drawer.default);
-exports.default = _default;
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = (0, _withFormSecurity.default)(_Drawer.default);

package/lib/dropdown/Popup.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { IPopUpProps } from './types.js';
 
-declare const DropdownPopup: ({ customClassForDropdown, align, isFloatMenu, topPosition, leftPosition, rightPosition, minWidth, ...props }: IPopUpProps) => React.ReactPortal;
+declare const DropdownPopup: ({ id, customClassForDropdown, align, isFloatMenu, topPosition, leftPosition, rightPosition, minWidth, ...props }: IPopUpProps) => React.ReactPortal;
 
 export { DropdownPopup as default };

package/lib/dropdown/Popup.js

@@ -6,18 +6,21 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 var _reactDom = _interopRequireDefault(require("react-dom"));
-var _excluded = ["customClassForDropdown", "align", "isFloatMenu", "topPosition", "leftPosition", "rightPosition", "minWidth"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-var getCalendarDropdownStyle = function getCalendarDropdownStyle(_ref) {
-  var topPosition = _ref.topPosition,
-    leftPosition = _ref.leftPosition,
-    rightPosition = _ref.rightPosition,
-    align = _ref.align,
-    isFloatMenu = _ref.isFloatMenu,
-    minWidth = _ref.minWidth;
-  var style = "top: ".concat(topPosition + (isFloatMenu ? 6 : 2), "px; min-width: ").concat(minWidth, "px;");
+var _uuid = require("uuid");
+const _excluded = ["id", "customClassForDropdown", "align", "isFloatMenu", "topPosition", "leftPosition", "rightPosition", "minWidth"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(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 (e.includes(n)) continue; t[n] = r[n]; } return t; }
+const getCalendarDropdownStyle = _ref => {
+  let {
+    topPosition,
+    leftPosition,
+    rightPosition,
+    align,
+    isFloatMenu,
+    minWidth
+  } = _ref;
+  let style = "top: ".concat(topPosition + (isFloatMenu ? 6 : 2), "px; min-width: ").concat(minWidth, "px;");
   if (align === 'left') {
     style += "left: ".concat(leftPosition, "px;");
   } else if (align === 'right') {
@@ -25,46 +28,42 @@ var getCalendarDropdownStyle = function getCalendarDropdownStyle(_ref) {
   }
   return style;
 };
-var body = document.getElementsByTagName('body')[0];
-var DropdownPopup = function DropdownPopup(_ref2) {
-  var _ref2$customClassForD = _ref2.customClassForDropdown,
-    customClassForDropdown = _ref2$customClassForD === void 0 ? '' : _ref2$customClassForD,
-    _ref2$align = _ref2.align,
-    align = _ref2$align === void 0 ? 'left' : _ref2$align,
-    _ref2$isFloatMenu = _ref2.isFloatMenu,
-    isFloatMenu = _ref2$isFloatMenu === void 0 ? false : _ref2$isFloatMenu,
-    _ref2$topPosition = _ref2.topPosition,
-    topPosition = _ref2$topPosition === void 0 ? 0 : _ref2$topPosition,
-    _ref2$leftPosition = _ref2.leftPosition,
-    leftPosition = _ref2$leftPosition === void 0 ? 0 : _ref2$leftPosition,
-    _ref2$rightPosition = _ref2.rightPosition,
-    rightPosition = _ref2$rightPosition === void 0 ? 0 : _ref2$rightPosition,
-    _ref2$minWidth = _ref2.minWidth,
-    minWidth = _ref2$minWidth === void 0 ? 0 : _ref2$minWidth,
+const body = document.getElementsByTagName('body')[0];
+const DropdownPopup = _ref2 => {
+  let {
+      id,
+      customClassForDropdown = '',
+      align = 'left',
+      isFloatMenu = false,
+      topPosition = 0,
+      leftPosition = 0,
+      rightPosition = 0,
+      minWidth = 0
+    } = _ref2,
     props = _objectWithoutProperties(_ref2, _excluded);
-  var popup = (0, _react.useRef)(document.createElement('div'));
+  const popup = (0, _react.useRef)(document.createElement('div'));
   popup.current.className = "dropdown-component ".concat(customClassForDropdown);
   popup.current.dataset.testid = 'dropdown-component';
   popup.current.style.cssText = getCalendarDropdownStyle({
-    topPosition: topPosition,
-    leftPosition: leftPosition,
-    rightPosition: rightPosition,
-    align: align,
-    isFloatMenu: isFloatMenu,
-    minWidth: minWidth
+    topPosition,
+    leftPosition,
+    rightPosition,
+    align,
+    isFloatMenu,
+    minWidth
   });
   if (popup && popup.current) {
-    var modalContainers = document.body.getElementsByClassName('modalcontainer');
-    var lastModalContainer = modalContainers[modalContainers.length - 1];
-    popup.current.style.zIndex = "".concat(modalContainers.length ? lastModalContainer.style.zIndex : 99999);
+    const modalContainers = document.body.getElementsByClassName('modalcontainer');
+    const lastModalContainer = modalContainers[modalContainers.length - 1];
+    popup.current.style.zIndex = "".concat(modalContainers.length ? Number(lastModalContainer.style.zIndex) + 1 : 99999);
   }
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     body.appendChild(popup.current);
-    return function () {
+    popup.current.id = id || "dropdown-component-".concat((0, _uuid.v1)());
+    return () => {
       body.removeChild(popup.current);
     };
   }, []);
   return /*#__PURE__*/_reactDom.default.createPortal(props.children, popup.current);
 };
-var _default = DropdownPopup;
-exports.default = _default;
+var _default = exports.default = DropdownPopup;

package/lib/dropdown/helper.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getDropdownItemCssClass = exports.contentClass = void 0;
-var contentClass = function contentClass(showClearButton) {
-  return "content ".concat(showClearButton ? '' : 'noclear');
-};
+const contentClass = showClearButton => "content ".concat(showClearButton ? '' : 'noclear');
 exports.contentClass = contentClass;
-var getDropdownItemCssClass = function getDropdownItemCssClass(selected, disabled, striped) {
-  var className = 'item';
+const getDropdownItemCssClass = (selected, disabled, striped) => {
+  let className = 'item';
   className += selected && !disabled ? ' -selected ' : '';
   className += disabled ? ' -disabled' : '';
   className += !selected && !disabled && striped ? ' -striped ' : '';

package/lib/dropdown/types.d.ts

@@ -22,6 +22,7 @@ interface WithDropdownContextProps {
     handleDropdownClose: () => void;
 }
 interface IPopUpProps {
+    id?: string;
     children?: ReactNode;
     customClassForDropdown?: string;
     align: 'left' | 'right';

package/lib/dropdown/withDropdown.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -8,63 +7,48 @@ exports.default = exports.WithDropdownContext = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _Popup = _interopRequireDefault(require("./Popup"));
 require("../assets/styles/dropdown.scss");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var WithDropdownContext = /*#__PURE__*/(0, _react.createContext)({});
-exports.WithDropdownContext = WithDropdownContext;
-var getDisplayName = function getDisplayName(Component) {
-  return Component.displayName || Component.name || 'Component';
-};
-var withDropdown = function withDropdown(WrappedComponent) {
-  var EnhancedComponent = function EnhancedComponent(props) {
-    var dropdownOpened = props.dropdownOpened,
-      showDropdown = props.showDropdown,
-      dropdown = props.dropdown,
-      _props$closeDropdownO = props.closeDropdownOnClickOutside,
-      closeDropdownOnClickOutside = _props$closeDropdownO === void 0 ? true : _props$closeDropdownO,
-      customClassForDropdown = props.customClassForDropdown,
-      children = props.children,
-      _props$dropdownAlign = props.dropdownAlign,
-      dropdownAlign = _props$dropdownAlign === void 0 ? 'left' : _props$dropdownAlign,
-      isFloatMenu = props.isFloatMenu,
-      isDropdownOpened = props.isDropdownOpened;
-    var _useState = (0, _react.useState)(dropdownOpened),
-      _useState2 = _slicedToArray(_useState, 2),
-      opened = _useState2[0],
-      setOpened = _useState2[1];
-    var _useState3 = (0, _react.useState)(dropdownOpened),
-      _useState4 = _slicedToArray(_useState3, 2),
-      prevOpened = _useState4[0],
-      setPrevOpened = _useState4[1];
-    var popupRef = (0, _react.useRef)(null);
-    var wrappedComponentRef = (0, _react.useRef)(null);
+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); }
+const WithDropdownContext = exports.WithDropdownContext = /*#__PURE__*/(0, _react.createContext)({});
+const getDisplayName = Component => Component.displayName || Component.name || 'Component';
+const withDropdown = WrappedComponent => {
+  const EnhancedComponent = props => {
+    const {
+      dropdownOpened,
+      showDropdown,
+      dropdown,
+      closeDropdownOnClickOutside = true,
+      customClassForDropdown,
+      children,
+      dropdownAlign = 'left',
+      isFloatMenu,
+      isDropdownOpened
+    } = props;
+    const [opened, setOpened] = (0, _react.useState)(dropdownOpened);
+    const [prevOpened, setPrevOpened] = (0, _react.useState)(dropdownOpened);
+    const popupRef = (0, _react.useRef)(null);
+    const wrappedComponentRef = (0, _react.useRef)(null);
     if (dropdownOpened !== prevOpened) {
       setOpened(dropdownOpened);
       setPrevOpened(dropdownOpened);
     }
-    var onClickOutside = function onClickOutside(event) {
-      var target = event.target;
+    const onClickOutside = event => {
+      const {
+        target
+      } = event;
       if (popupRef !== null && popupRef !== void 0 && popupRef.current && target !== (popupRef === null || popupRef === void 0 ? void 0 : popupRef.current) && !event.composedPath().includes(popupRef.current) && wrappedComponentRef.current !== target) {
         setOpened(false);
       }
     };
-    var onDropdownClick = function onDropdownClick() {
-      setOpened(function (prevState) {
-        return !prevState;
-      });
+    const onDropdownClick = () => {
+      setOpened(prevState => !prevState);
     };
-    var getDropdown = function getDropdown(targetRef) {
+    const getDropdown = targetRef => {
       if (!targetRef || !opened) return null;
       wrappedComponentRef.current = targetRef;
-      var targetDimensions = targetRef.getBoundingClientRect();
+      const targetDimensions = targetRef.getBoundingClientRect();
       return /*#__PURE__*/_react.default.createElement(_Popup.default, {
         topPosition: targetDimensions.top + window.scrollY + targetDimensions.height,
         rightPosition: !isFloatMenu ? window.innerWidth - targetDimensions.x - targetDimensions.width - 4 : undefined,
@@ -74,31 +58,27 @@ var withDropdown = function withDropdown(WrappedComponent) {
         isFloatMenu: isFloatMenu
       }, /*#__PURE__*/_react.default.createElement("div", {
         className: isFloatMenu ? 'items' : undefined,
-        ref: function ref(r) {
+        ref: r => {
           popupRef.current = r;
         }
       }, children));
     };
-    (0, _react.useEffect)(function () {
+    (0, _react.useEffect)(() => {
       if (dropdown && closeDropdownOnClickOutside) {
         document.addEventListener('click', onClickOutside);
       }
-      return function () {
+      return () => {
         if (dropdown && closeDropdownOnClickOutside) {
           document.removeEventListener('click', onClickOutside);
         }
       };
     }, []);
-    var contextValues = {
+    const contextValues = {
       handleDropdownClose: onDropdownClick
     };
-    var newProps = {
-      getDropdownPopup: function getDropdownPopup(targetRef) {
-        return getDropdown(targetRef);
-      },
-      showDropdown: !showDropdown ? function () {
-        return setOpened(!opened);
-      } : showDropdown,
+    const newProps = {
+      getDropdownPopup: targetRef => getDropdown(targetRef),
+      showDropdown: !showDropdown ? () => setOpened(!opened) : showDropdown,
       isDropdownOpened: isDropdownOpened || opened
     };
     if (!dropdown) return /*#__PURE__*/_react.default.createElement(WrappedComponent, props);
@@ -109,5 +89,4 @@ var withDropdown = function withDropdown(WrappedComponent) {
   EnhancedComponent.displayName = "withDropdown(".concat(getDisplayName(WrappedComponent), ")");
   return EnhancedComponent;
 };
-var _default = withDropdown;
-exports.default = _default;
+var _default = exports.default = withDropdown;

package/lib/fieldset/index.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -10,52 +9,50 @@ var _gridlayout = _interopRequireDefault(require("../gridlayout"));
 var _permissionValidations = require("../permissionValidations");
 var _noPermission = _interopRequireDefault(require("../noPermission"));
 require("../assets/styles/fieldset.scss");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var Fieldset = function Fieldset(props) {
-  var gridCols = props.gridCols,
-    children = props.children,
-    title = props.title,
-    _props$titleAlign = props.titleAlign,
-    titleAlign = _props$titleAlign === void 0 ? 'left' : _props$titleAlign,
-    style = props.style,
-    styleContent = props.styleContent,
-    styleTitle = props.styleTitle,
-    _props$template = props.template,
-    template = _props$template === void 0 ? 'none' : _props$template,
-    titleCustomClass = props.titleCustomClass,
-    permissionAttr = props.permissionAttr;
-  var hideContent = _permissionValidations.OPTIONS_ON_DENIED.hideContent,
-    unvisible = _permissionValidations.OPTIONS_ON_DENIED.unvisible;
-  var _useState = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)([hideContent, unvisible], permissionAttr)),
-    _useState2 = _slicedToArray(_useState, 1),
-    onDenied = _useState2[0];
-  var getCssClass = function getCssClass(_ref) {
-    var type = _ref.type,
-      customClass = _ref.customClass,
-      hasError = _ref.hasError;
-    var cssClass = "fieldset-component ".concat(customClass);
+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 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 Fieldset = props => {
+  const {
+    gridCols,
+    children,
+    title,
+    titleAlign = 'left',
+    style,
+    styleContent,
+    styleTitle,
+    template = 'none',
+    titleCustomClass,
+    permissionAttr,
+    leftElements = null,
+    rightElements = null
+  } = props;
+  const {
+    hideContent,
+    unvisible
+  } = _permissionValidations.OPTIONS_ON_DENIED;
+  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)([hideContent, unvisible], permissionAttr));
+  const getCssClass = _ref => {
+    let {
+      type,
+      customClass,
+      hasError
+    } = _ref;
+    let cssClass = "fieldset-component ".concat(customClass);
     if (type) cssClass = "".concat(cssClass, " -").concat(type);
     if (hasError) cssClass = "".concat(cssClass, " -witherror");
     return cssClass;
   };
-  var getContentStyle = function getContentStyle(_ref2) {
-    var _ref2$colsCount = _ref2.colsCount,
-      colsCount = _ref2$colsCount === void 0 ? 2 : _ref2$colsCount,
-      _ref2$rowsCount = _ref2.rowsCount,
-      rowsCount = _ref2$rowsCount === void 0 ? 2 : _ref2$rowsCount;
+  const getContentStyle = _ref2 => {
+    let {
+      colsCount = 2,
+      rowsCount = 2
+    } = _ref2;
     if (template === 'rows') {
       return {
         gridTemplateRows: "repeat(".concat(rowsCount, ", 1fr)")
@@ -67,23 +64,20 @@ var Fieldset = function Fieldset(props) {
     }
     return {};
   };
-  var renderContent = function renderContent() {
-    return /*#__PURE__*/_react.default.createElement("fieldset", {
-      style: style,
-      className: getCssClass(_objectSpread({}, props))
-    }, onDenied.hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, title && /*#__PURE__*/_react.default.createElement("legend", {
-      style: styleTitle,
-      align: titleAlign,
-      className: "legend ".concat(titleCustomClass)
-    }, title), /*#__PURE__*/_react.default.createElement("div", {
-      className: "contentfieldset -template".concat(template, " "),
-      style: Object.assign(getContentStyle(props), styleContent)
-    }, children)));
-  };
+  const renderContent = () => /*#__PURE__*/_react.default.createElement("fieldset", {
+    style: style,
+    className: getCssClass(_objectSpread({}, props))
+  }, onDenied.hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, title && /*#__PURE__*/_react.default.createElement("legend", {
+    style: styleTitle,
+    align: titleAlign,
+    className: "legend ".concat(titleCustomClass)
+  }, leftElements, title, rightElements), /*#__PURE__*/_react.default.createElement("div", {
+    className: "contentfieldset -template".concat(template, " "),
+    style: Object.assign(getContentStyle(props), styleContent)
+  }, children)));
   if (onDenied.unvisible) return null;
   return gridCols ? /*#__PURE__*/_react.default.createElement(_gridlayout.default, {
     cols: gridCols
   }, renderContent()) : renderContent();
 };
-var _default = Fieldset;
-exports.default = _default;
+var _default = exports.default = Fieldset;

package/lib/fieldset/types.d.ts

@@ -18,6 +18,8 @@ interface IFieldsetProps {
     hasError?: boolean;
     gridCols?: string;
     permissionAttr?: PermissionAttr | PermissionAttr[];
+    leftElements?: ReactNode;
+    rightElements?: ReactNode;
 }
 interface ExpandedElement extends Element {
     name?: string;

package/lib/form/Field.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<Pick<IFieldProps & React__default.RefAttributes<unknown>, "key" | keyof IFieldProps> & React__default.RefAttributes<HTMLElement>>;