linear-react-components-ui 1.1.26-beta.9 → 1.1.27-rc.0

package/lib/tabs/DropdownTabs.js

@@ -1,84 +1,86 @@
-import { j as s } from "../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as k } from "../chunks/compiler-runtime.Cu50tn6L.js";
-import { _ as N } from "../chunks/lodash.CIAK_hAg.js";
-import C from "../buttons/Button.js";
-import $ from "../icons/index.js";
-import '../assets/radio.css';import '../assets/toolbar.css';import '../assets/label.css';import '../assets/panel.css';import '../assets/noPermission.css';import '../assets/gridlayout.css';import '../assets/button.css';/* empty css                        */
-import A from "../list/index.js";
-import { useTabs as D } from "./useTabs.js";
-import "react";
-/* empty css                            */
-import "../panel/helpers.js";
-/* empty css                              */
-/* empty css                       */
-import "../toolbar/helpers.js";
-import "../labels/DefaultLabel.js";
-/* empty css                       */
-/* empty css                         */
-/* empty css                       */
-import "../popover/PopoverText.js";
-import "../popover/index.js";
-import "../textContent/index.js";
-import "./MenuTabs.js";
-import "./tabHelpers.js";
-import { L } from "../chunks/tabs.BvKfeA6Y.js";
-import "./context.js";
-import "../chunks/index.aw0XaUkg.js";
-const M = (v) => {
-  const t = k.c(25), {
-    id: e,
-    title: b,
-    closeable: a,
-    iconAlign: p,
-    icon: d,
-    iconName: i,
-    disabled: x,
-    tabMenuSize: f
-  } = v, {
-    selectTab: T,
-    removeTab: u,
-    selectedTabId: j
-  } = D();
-  let n;
-  t[0] !== e || t[1] !== T ? (n = () => T(e), t[0] = e, t[1] = T, t[2] = n) : n = t[2];
-  let r;
-  t[3] !== e || t[4] !== j ? (r = j === e ? /* @__PURE__ */ s.jsx($, { name: "checkmark", color: "#A10D0D" }) : /* @__PURE__ */ s.jsx("div", { style: {
-    width: 16,
-    height: 16
-  } }), t[3] = e, t[4] = j, t[5] = r) : r = t[5];
-  let l;
-  t[6] !== x || t[7] !== d || t[8] !== p || t[9] !== i || t[10] !== f || t[11] !== b ? (l = /* @__PURE__ */ s.jsx(C, { className: "btn menubutton", boxShadow: !1, iconAlign: p, iconName: i, icon: d, disabled: x, label: b, size: f, transparent: !0 }), t[6] = x, t[7] = d, t[8] = p, t[9] = i, t[10] = f, t[11] = b, t[12] = l) : l = t[12];
-  let m;
-  t[13] !== a || t[14] !== e || t[15] !== u ? (m = a && /* @__PURE__ */ s.jsx("button", { className: "closepanel", onClick: () => u(e) }), t[13] = a, t[14] = e, t[15] = u, t[16] = m) : m = t[16];
-  let o;
-  t[17] !== r || t[18] !== l || t[19] !== m ? (o = /* @__PURE__ */ s.jsxs("div", { className: "menuitem", children: [
-    r,
-    l,
-    m
-  ] }), t[17] = r, t[18] = l, t[19] = m, t[20] = o) : o = t[20];
-  let c;
-  return t[21] !== e || t[22] !== n || t[23] !== o ? (c = /* @__PURE__ */ s.jsx(L, { onClick: n, children: o }, e), t[21] = e, t[22] = n, t[23] = o, t[24] = c) : c = t[24], c;
-}, rt = (v) => {
-  const t = k.c(11), {
-    tabs: e,
-    tabMenuSize: b
-  } = v, a = e === void 0 ? [] : e, p = b === void 0 ? "medium" : b, {
-    selectedTabId: d
-  } = D();
-  let i;
-  t[0] !== d ? (i = (S) => S.id === d, t[0] = d, t[1] = i) : i = t[1];
-  const x = a.some(i), f = a.length > 0, T = N.uniqBy(a, "id");
-  if (!f)
-    return null;
-  const u = C, j = !0, n = "right", r = !0, l = !1, m = "large", o = `dropdownbutton ${f ? "show" : ""} ${x ? "has-selected" : ""}`, c = A, I = "dropdown-hide-tabs";
-  let w;
-  t[2] !== p ? (w = (S) => /* @__PURE__ */ s.jsx(M, { tabMenuSize: p, ...S }, S.id), t[2] = p, t[3] = w) : w = t[3];
-  const z = T.map(w);
-  let h;
-  t[4] !== c || t[5] !== z ? (h = /* @__PURE__ */ s.jsx(c, { customClass: I, children: z }), t[4] = c, t[5] = z, t[6] = h) : h = t[6];
-  let g;
-  return t[7] !== u || t[8] !== h || t[9] !== o ? (g = /* @__PURE__ */ s.jsx(u, { dropdown: j, dropdownAlign: n, transparent: r, boxShadow: l, size: m, customClass: o, children: h }), t[7] = u, t[8] = h, t[9] = o, t[10] = g) : g = t[10], g;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _lodash = _interopRequireDefault(require("lodash"));
+var _react = _interopRequireDefault(require("react"));
+var _buttons = _interopRequireDefault(require("../buttons"));
+var _list = _interopRequireWildcard(require("../list"));
+var _useTabs = require("./useTabs");
+var _2 = require("..");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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 DropdownTab = _ref => {
+  let {
+    id,
+    title,
+    closeable,
+    iconAlign,
+    icon,
+    iconName,
+    disabled,
+    tabMenuSize
+  } = _ref;
+  const {
+    selectTab,
+    removeTab,
+    selectedTabId
+  } = (0, _useTabs.useTabs)();
+  return /*#__PURE__*/_react.default.createElement(_list.ListItem, {
+    key: id,
+    onClick: () => selectTab(id)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "menuitem"
+  }, selectedTabId === id ? /*#__PURE__*/_react.default.createElement(_2.Icon, {
+    name: "checkmark",
+    color: "#A10D0D"
+  }) : /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: 16,
+      height: 16
+    }
+  }), /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    className: "btn menubutton",
+    boxShadow: false,
+    iconAlign: iconAlign,
+    iconName: iconName,
+    icon: icon,
+    disabled: disabled,
+    label: title,
+    size: tabMenuSize,
+    transparent: true
+  }), closeable && /*#__PURE__*/_react.default.createElement("button", {
+    className: "closepanel",
+    onClick: () => removeTab(id)
+  })));
 };
-export {
-  rt as default
+const DropdownTabs = _ref2 => {
+  let {
+    tabs = [],
+    tabMenuSize = 'medium'
+  } = _ref2;
+  const {
+    selectedTabId
+  } = (0, _useTabs.useTabs)();
+  const hasSelectedTab = tabs.some(tab => tab.id === selectedTabId);
+  const hasTabs = tabs.length > 0;
+  const uniqueTabs = _lodash.default.uniqBy(tabs, 'id');
+  if (!hasTabs) return null;
+  return /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    dropdown: true,
+    dropdownAlign: "right",
+    transparent: true,
+    boxShadow: false,
+    size: "large",
+    customClass: "dropdownbutton ".concat(hasTabs ? 'show' : '', " ").concat(hasSelectedTab ? 'has-selected' : '')
+  }, /*#__PURE__*/_react.default.createElement(_list.default, {
+    customClass: "dropdown-hide-tabs"
+  }, uniqueTabs.map(tab => /*#__PURE__*/_react.default.createElement(DropdownTab, _extends({
+    key: tab.id,
+    tabMenuSize: tabMenuSize
+  }, tab)))));
 };
+var _default = exports.default = DropdownTabs;

package/lib/tabs/Menu.d.ts

@@ -1,3 +1,11 @@
-import { MenuProps } from './types';
-declare const Menu: ({ toolbar, customClassForToolBar, tabWidth, ...props }: MenuProps) => import("react/jsx-runtime").JSX.Element;
-export default Menu;
+import { MenuProps } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+
+declare const Menu: ({ toolbar, customClassForToolBar, tabWidth, tabsWithError, ...props }: MenuProps) => JSX.Element;
+
+export { Menu as default };

package/lib/tabs/Menu.js

@@ -1,38 +1,48 @@
-import { j as c } from "../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as T } from "../chunks/compiler-runtime.Cu50tn6L.js";
-import p from "react";
-import g from "./MenuTabs.js";
-import z from "./DropdownTabs.js";
-import { useTabs as A } from "./useTabs.js";
-const v = (u) => {
-  const t = T.c(25);
-  let e, r, b, n;
-  t[0] !== u ? ({
-    toolbar: n,
-    customClassForToolBar: r,
-    tabWidth: b,
-    ...e
-  } = u, t[0] = u, t[1] = e, t[2] = r, t[3] = b, t[4] = n) : (e = t[1], r = t[2], b = t[3], n = t[4]);
-  const m = r === void 0 ? "" : r, a = b === void 0 ? "auto" : b, {
-    menuTabs: f,
-    menuRef: d,
-    dropdownTabs: M
-  } = A();
-  let s;
-  t[5] !== d || t[6] !== f || t[7] !== e.firstTabIdent || t[8] !== e.tabMenuAlign || t[9] !== e.tabMenuSize || t[10] !== a ? (s = /* @__PURE__ */ c.jsx(g, { tabs: f, tabWidth: a, tabMenuSize: e.tabMenuSize, tabMenuAlign: e.tabMenuAlign, firstTabIdent: e.firstTabIdent, ref: d }), t[5] = d, t[6] = f, t[7] = e.firstTabIdent, t[8] = e.tabMenuAlign, t[9] = e.tabMenuSize, t[10] = a, t[11] = s) : s = t[11];
-  let i;
-  t[12] !== M || t[13] !== e.firstTabIdent || t[14] !== e.tabMenuAlign || t[15] !== e.tabMenuSize || t[16] !== a ? (i = /* @__PURE__ */ c.jsx(z, { tabs: M, tabWidth: a, tabMenuSize: e.tabMenuSize, tabMenuAlign: e.tabMenuAlign, firstTabIdent: e.firstTabIdent }), t[12] = M, t[13] = e.firstTabIdent, t[14] = e.tabMenuAlign, t[15] = e.tabMenuSize, t[16] = a, t[17] = i) : i = t[17];
-  let o;
-  t[18] !== m || t[19] !== n ? (o = n && p.cloneElement(n, {
-    customClass: `menubar ${m}`
-  }), t[18] = m, t[19] = n, t[20] = o) : o = t[20];
-  let l;
-  return t[21] !== s || t[22] !== i || t[23] !== o ? (l = /* @__PURE__ */ c.jsxs("div", { className: "menucontainer", children: [
-    s,
-    i,
-    o
-  ] }), t[21] = s, t[22] = i, t[23] = o, t[24] = l) : l = t[24], l;
-};
-export {
-  v as default
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _MenuTabs = _interopRequireDefault(require("./MenuTabs"));
+var _DropdownTabs = _interopRequireDefault(require("./DropdownTabs"));
+var _useTabs = require("./useTabs");
+const _excluded = ["toolbar", "customClassForToolBar", "tabWidth", "tabsWithError"];
+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 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 Menu = _ref => {
+  let {
+      toolbar,
+      customClassForToolBar = '',
+      tabWidth = 'auto',
+      tabsWithError
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const {
+    menuTabs,
+    menuRef,
+    dropdownTabs
+  } = (0, _useTabs.useTabs)();
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "menucontainer"
+  }, /*#__PURE__*/_react.default.createElement(_MenuTabs.default, {
+    tabsWithError: tabsWithError,
+    tabs: menuTabs,
+    tabWidth: tabWidth,
+    tabMenuSize: props.tabMenuSize,
+    tabMenuAlign: props.tabMenuAlign,
+    firstTabIdent: props.firstTabIdent,
+    ref: menuRef
+  }), /*#__PURE__*/_react.default.createElement(_DropdownTabs.default, {
+    tabs: dropdownTabs,
+    tabWidth: tabWidth,
+    tabMenuSize: props.tabMenuSize,
+    tabMenuAlign: props.tabMenuAlign,
+    firstTabIdent: props.firstTabIdent
+  }), toolbar && /*#__PURE__*/_react.default.cloneElement(toolbar, {
+    customClass: "menubar ".concat(customClassForToolBar)
+  }));
 };
+var _default = exports.default = Menu;

package/lib/tabs/MenuTabs.d.ts

@@ -1,4 +1,11 @@
-import { default as React } from 'react';
-import { MenuProps } from './types';
-declare const MenuTabs: React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLUListElement>>;
-export default MenuTabs;
+import React__default from 'react';
+import { MenuProps } from './types.js';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+
+declare const MenuTabs: React__default.ForwardRefExoticComponent<MenuProps & React__default.RefAttributes<HTMLUListElement>>;
+
+export { MenuTabs as default };

package/lib/tabs/MenuTabs.js

@@ -1,64 +1,90 @@
-import { j as M } from "../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as y } from "../chunks/compiler-runtime.Cu50tn6L.js";
-import S from "react";
-import { _ as z } from "../chunks/lodash.CIAK_hAg.js";
-import A from "../buttons/Button.js";
-import "../icons/index.js";
-import '../assets/button.css';/* empty css                        */
-import { menuStyles as R, onDeniedOptions as W } from "./tabHelpers.js";
-import { actionsOnPermissionDenied as $ } from "../permissionValidations.js";
-import { useTabs as g } from "./useTabs.js";
-const w = (N) => {
-  const e = y.c(21), {
-    id: t,
-    title: l,
-    tabWidth: m,
-    iconAlign: c,
-    iconName: r,
-    icon: b,
-    disabled: s,
-    permissionAttr: i,
-    tabMenuSize: o,
-    tooltip: n,
-    tooltipPosition: u,
-    tooltipWidth: T,
-    closeable: p
-  } = N, {
-    selectedTabId: f,
-    selectTab: x,
-    removeTab: v,
-    tabsCount: h
-  } = g();
-  let a;
-  e[0] !== i ? (a = $(W, i), e[0] = i, e[1] = a) : a = e[1];
-  const d = a;
-  let j;
-  return e[2] !== p || e[3] !== s || e[4] !== b || e[5] !== c || e[6] !== r || e[7] !== t || e[8] !== d.disabled || e[9] !== d.unvisible || e[10] !== v || e[11] !== x || e[12] !== f || e[13] !== o || e[14] !== m || e[15] !== h || e[16] !== l || e[17] !== n || e[18] !== u || e[19] !== T ? (j = d.unvisible ? null : /* @__PURE__ */ M.jsxs("li", { style: {
-    width: m
-  }, className: `menuitem ${f === t && "selected"}`, children: [
-    /* @__PURE__ */ M.jsx(A, { className: "btn menubutton", boxShadow: !1, onClick: () => x(t), iconAlign: c, iconName: r, icon: b, disabled: s || !!d.disabled, label: l, size: o, tooltip: n || l, tooltipPosition: u, tooltipWidth: T }),
-    p && h > 1 && /* @__PURE__ */ M.jsx("button", { className: "closepanel", onClick: () => v(t) })
-  ] }, t), e[2] = p, e[3] = s, e[4] = b, e[5] = c, e[6] = r, e[7] = t, e[8] = d.disabled, e[9] = d.unvisible, e[10] = v, e[11] = x, e[12] = f, e[13] = o, e[14] = m, e[15] = h, e[16] = l, e[17] = n, e[18] = u, e[19] = T, e[20] = j) : j = e[20], j;
-}, C = S.forwardRef((N, e) => {
-  const t = y.c(20), {
-    tabs: l,
-    tabWidth: m,
-    tabMenuSize: c,
-    tabMenuAlign: r,
-    firstTabIdent: b
-  } = N;
-  let s, i, o, n;
-  if (t[0] !== e || t[1] !== l || t[2] !== m || t[3] !== c || t[4] !== r || t[5] !== b) {
-    const T = l === void 0 ? [] : l, p = m === void 0 ? "auto" : m, f = c === void 0 ? "medium" : c, x = r === void 0 ? "left" : r, v = b === void 0 ? !1 : b, h = z.uniqBy(T, "id");
-    s = `menu ${v && "-firsttabident"}`, t[10] !== x ? (i = R(x), t[10] = x, t[11] = i) : i = t[11], o = e;
-    let a;
-    t[12] !== f || t[13] !== p ? (a = (d) => /* @__PURE__ */ M.jsx(w, { tabMenuSize: f, tabWidth: p, ...d }, d.id), t[12] = f, t[13] = p, t[14] = a) : a = t[14], n = h.map(a), t[0] = e, t[1] = l, t[2] = m, t[3] = c, t[4] = r, t[5] = b, t[6] = s, t[7] = i, t[8] = o, t[9] = n;
-  } else
-    s = t[6], i = t[7], o = t[8], n = t[9];
-  let u;
-  return t[15] !== s || t[16] !== i || t[17] !== o || t[18] !== n ? (u = /* @__PURE__ */ M.jsx("ul", { className: s, style: i, ref: o, children: n }), t[15] = s, t[16] = i, t[17] = o, t[18] = n, t[19] = u) : u = t[19], u;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-C.displayName = "MenuTabs";
-export {
-  C as default
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _buttons = _interopRequireDefault(require("../buttons"));
+var helpers = _interopRequireWildcard(require("./tabHelpers"));
+var _permissionValidations = require("../permissionValidations");
+var _useTabs = require("./useTabs");
+var _lodash = _interopRequireDefault(require("lodash"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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 MenuTab = _ref => {
+  let {
+    id,
+    title,
+    tabWidth,
+    iconAlign,
+    iconName,
+    icon,
+    disabled,
+    permissionAttr,
+    tabMenuSize,
+    tooltip,
+    tooltipPosition,
+    tooltipWidth,
+    closeable,
+    tabsWithError
+  } = _ref;
+  const {
+    selectedTabId,
+    selectTab,
+    removeTab,
+    tabsCount
+  } = (0, _useTabs.useTabs)();
+  const onDenied = (0, _permissionValidations.actionsOnPermissionDenied)(helpers.onDeniedOptions, permissionAttr);
+  const withErrorInContent = tabsWithError === null || tabsWithError === void 0 ? void 0 : tabsWithError.includes(id);
+  return onDenied.unvisible ? null : /*#__PURE__*/_react.default.createElement("li", {
+    key: id,
+    style: {
+      width: tabWidth
+    },
+    className: "\n          menuitem \n          ".concat(selectedTabId === id && 'selected', " \n          ").concat(withErrorInContent && 'witherrorcontent', "\n        ")
+  }, /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    className: "btn menubutton",
+    boxShadow: false,
+    onClick: () => selectTab(id),
+    iconAlign: iconAlign,
+    iconName: iconName,
+    icon: icon,
+    disabled: disabled || !!onDenied.disabled,
+    label: title,
+    size: tabMenuSize,
+    tooltip: tooltip || title,
+    tooltipPosition: tooltipPosition,
+    tooltipWidth: tooltipWidth
+  }), closeable && tabsCount > 1 && /*#__PURE__*/_react.default.createElement("button", {
+    className: "closepanel",
+    onClick: () => removeTab(id)
+  }));
 };
+const MenuTabs = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
+  let {
+    tabs = [],
+    tabWidth = 'auto',
+    tabMenuSize = 'medium',
+    tabMenuAlign = 'left',
+    firstTabIdent = false,
+    tabsWithError
+  } = _ref2;
+  const {
+    keepPanelsInOrder
+  } = (0, _useTabs.useTabs)();
+  const uniqueTabs = keepPanelsInOrder ? _lodash.default.sortBy(_lodash.default.uniqBy(tabs, 'id'), tabPanel => keepPanelsInOrder.indexOf(tabPanel.id)) : _lodash.default.uniqBy(tabs, 'id');
+  return /*#__PURE__*/_react.default.createElement("ul", {
+    className: "menu ".concat(firstTabIdent && '-firsttabident'),
+    style: helpers.menuStyles(tabMenuAlign),
+    ref: ref
+  }, uniqueTabs.map(tab => /*#__PURE__*/_react.default.createElement(MenuTab, _extends({
+    key: tab.id,
+    tabMenuSize: tabMenuSize,
+    tabWidth: tabWidth,
+    tabsWithError: tabsWithError
+  }, tab))));
+});
+MenuTabs.displayName = 'MenuTabs';
+var _default = exports.default = MenuTabs;

package/lib/tabs/Panel.d.ts

@@ -1,3 +1,11 @@
-import { PanelProps } from './types';
-declare const Panel: (props: PanelProps) => import("react/jsx-runtime").JSX.Element;
-export default Panel;
+import { PanelProps } from './types.js';
+import 'react';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+
+declare const Panel: (props: PanelProps) => JSX.Element;
+
+export { Panel as default };

package/lib/tabs/Panel.js

@@ -1,62 +1,85 @@
-import { j as P } from "../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as N } from "../chunks/compiler-runtime.Cu50tn6L.js";
-import { useRef as g, useState as A, useEffect as I } from "react";
-import { onDeniedOptions as _, getCurrentThreshold as k } from "./tabHelpers.js";
-import { actionsOnPermissionDenied as q } from "../permissionValidations.js";
-import B from "../noPermission/index.js";
-import { useTabs as F } from "./useTabs.js";
-const W = (j) => {
-  const e = N.c(18), {
-    id: c,
-    children: u,
-    onEndReached: s,
-    permissionAttr: f,
-    customClass: x,
-    onEndReachedThreshold: T,
-    style: h
-  } = j, C = x === void 0 ? "" : x, p = T === void 0 ? 0.1 : T, {
-    selectedTabId: L
-  } = F(), w = c !== L ? "hidepanel" : "", t = g(null);
-  let i;
-  e[0] !== f ? (i = q(_, f), e[0] = f, e[1] = i) : i = e[1];
-  const [z] = A(i), {
-    hideContent: E
-  } = z, v = g(!0), H = g(0);
-  let l;
-  e[2] !== s || e[3] !== p ? (l = async () => {
-    const n = t.current;
-    if (n && s) {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _tabHelpers = require("./tabHelpers");
+var _permissionValidations = require("../permissionValidations");
+var _noPermission = _interopRequireDefault(require("../noPermission"));
+var _useTabs = require("./useTabs");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const Panel = props => {
+  const {
+    id,
+    children,
+    onEndReached,
+    permissionAttr,
+    customClass = '',
+    onEndReachedThreshold = 0.1,
+    style
+  } = props;
+  const {
+    selectedTabId
+  } = (0, _useTabs.useTabs)();
+  const hidePanel = id !== selectedTabId ? 'hidepanel' : '';
+  const rootElementRef = (0, _react.useRef)(null);
+  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(_tabHelpers.onDeniedOptions, permissionAttr));
+  const {
+    hideContent
+  } = onDenied;
+  const enableOnEndReached = (0, _react.useRef)(true);
+  const lastScrollHeight = (0, _react.useRef)(0);
+  const onScrollEndReached = (0, _react.useCallback)(async () => {
+    const element = rootElementRef.current;
+    if (element && onEndReached) {
       const {
-        scrollTop: b,
-        scrollHeight: O,
-        clientHeight: D
-      } = n, S = O - D - b - 1, $ = k(n, p);
-      S <= $ && v.current && (v.current = !1, await new Promise((y) => {
-        y(s());
-      }), H.current = O);
+        scrollTop,
+        scrollHeight,
+        clientHeight
+      } = element;
+      const scrollOffset = scrollHeight - clientHeight - scrollTop - 1;
+      const threshold = (0, _tabHelpers.getCurrentThreshold)(element, onEndReachedThreshold);
+      if (scrollOffset <= threshold && enableOnEndReached.current) {
+        enableOnEndReached.current = false;
+        await new Promise(resolve => {
+          resolve(onEndReached());
+        });
+        lastScrollHeight.current = scrollHeight;
+      }
     }
-  }, e[2] = s, e[3] = p, e[4] = l) : l = e[4];
-  const r = l;
-  let d;
-  e[5] !== s || e[6] !== r ? (d = () => {
-    let n;
-    return t.current && s && (n = new ResizeObserver(() => {
-      const {
-        scrollHeight: b
-      } = t.current;
-      b !== H.current && (v.current = !0, n?.disconnect());
-    }), n.observe(t.current), t.current.addEventListener("scroll", r), t.current.addEventListener("resize", r)), () => {
-      t.current?.removeEventListener("scroll", r), t.current?.removeEventListener("resize", r), n?.disconnect();
+  }, [onEndReached, onEndReachedThreshold, rootElementRef.current, lastScrollHeight.current]);
+  (0, _react.useEffect)(() => {
+    let observer;
+    if (rootElementRef.current && onEndReached) {
+      observer = new ResizeObserver(() => {
+        const {
+          scrollHeight
+        } = rootElementRef.current;
+        if (scrollHeight !== lastScrollHeight.current) {
+          var _observer;
+          enableOnEndReached.current = true;
+          (_observer = observer) === null || _observer === void 0 ? void 0 : _observer.disconnect();
+        }
+      });
+      observer.observe(rootElementRef.current);
+      rootElementRef.current.addEventListener('scroll', onScrollEndReached);
+      rootElementRef.current.addEventListener('resize', onScrollEndReached);
+    }
+    return () => {
+      var _rootElementRef$curre, _rootElementRef$curre2, _observer2;
+      (_rootElementRef$curre = rootElementRef.current) === null || _rootElementRef$curre === void 0 ? void 0 : _rootElementRef$curre.removeEventListener('scroll', onScrollEndReached);
+      (_rootElementRef$curre2 = rootElementRef.current) === null || _rootElementRef$curre2 === void 0 ? void 0 : _rootElementRef$curre2.removeEventListener('resize', onScrollEndReached);
+      (_observer2 = observer) === null || _observer2 === void 0 ? void 0 : _observer2.disconnect();
     };
-  }, e[5] = s, e[6] = r, e[7] = d) : d = e[7];
-  let a;
-  e[8] !== r ? (a = [r], e[8] = r, e[9] = a) : a = e[9], I(d, a);
-  const R = `${C} panel ${w}`;
-  let o;
-  e[10] !== u || e[11] !== E ? (o = E ? /* @__PURE__ */ P.jsx(B, {}) : u, e[10] = u, e[11] = E, e[12] = o) : o = e[12];
-  let m;
-  return e[13] !== c || e[14] !== h || e[15] !== R || e[16] !== o ? (m = /* @__PURE__ */ P.jsx("div", { ref: t, id: c, className: R, style: h, children: o }), e[13] = c, e[14] = h, e[15] = R, e[16] = o, e[17] = m) : m = e[17], m;
-};
-export {
-  W as default
+  }, [onScrollEndReached]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: rootElementRef,
+    id: id,
+    className: "".concat(customClass, " panel ").concat(hidePanel),
+    style: style
+  }, hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : children);
 };
+var _default = exports.default = Panel;

package/lib/tabs/context.d.ts

@@ -1,4 +1,12 @@
-import { default as React } from 'react';
-import { TabsContextType, TabsProviderProps } from './types';
-export declare const TabsContext: React.Context<TabsContextType>;
-export declare function TabsProvider({ children, tabs: tabsProp, container, selectedTab, onTabChange, onTabClose, tabsWidth: tabsWidthProp, firstTabIdent, keepTabOriginalPosition, }: TabsProviderProps): import("react/jsx-runtime").JSX.Element;
+import React__default from 'react';
+import { TabsContextType, TabsProviderProps } from './types.js';
+import '../@types/Size.js';
+import '../@types/Position.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+
+declare const TabsContext: React__default.Context<TabsContextType>;
+declare function TabsProvider({ children, tabs: tabsProp, container, selectedTab, onTabChange, onTabClose, tabsWidth: tabsWidthProp, firstTabIdent, keepPanelsInOrder, keepTabOriginalPosition, }: TabsProviderProps): JSX.Element;
+
+export { TabsContext, TabsProvider };