linear-react-components-ui 1.1.25-rc.2 → 1.1.26-beta-0

package/lib/list/Header.d.ts

@@ -1,10 +1,3 @@
-import { IListHeaderProps } from './types.js';
-import 'react';
-import '../@types/PermissionAttr.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
-import '../@types/Position.js';
-
-declare const Header: ({ title, children, style, customClass }: IListHeaderProps) => JSX.Element;
-
-export { Header as default };
+import { IListHeaderProps } from './types';
+declare const Header: ({ title, children, style, customClass }: IListHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export default Header;

package/lib/list/Header.js

@@ -1,23 +1,8 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const Header = _ref => {
-  let {
-    title,
-    children,
-    style,
-    customClass
-  } = _ref;
-  return /*#__PURE__*/_react.default.createElement("li", {
-    className: `list-header ${customClass}`,
-    style: style
-  }, /*#__PURE__*/_react.default.createElement("h1", {
-    className: "title"
-  }, title), children);
+import { j as s } from "../chunks/jsx-runtime.CYK1ROHF.js";
+const i = ({ title: e, children: a, style: t, customClass: l }) => /* @__PURE__ */ s.jsxs("li", { className: `list-header ${l}`, style: t, children: [
+  /* @__PURE__ */ s.jsx("h1", { className: "title", children: e }),
+  a
+] });
+export {
+  i as default
 };
-var _default = exports.default = Header;

package/lib/list/Item.d.ts

@@ -1,13 +1,6 @@
-import { IListItemProps } from './types.js';
-import 'react';
-import '../@types/PermissionAttr.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
-import '../@types/Position.js';
-
+import { IListItemProps } from './types';
 declare const _default: {
-    (props: IListItemProps): JSX.Element;
+    (props: IListItemProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
-
-export { _default as default };
+export default _default;

package/lib/list/Item.js

@@ -1,162 +1,13 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactRouterDom = require("react-router-dom");
-var _icons = _interopRequireDefault(require("../icons"));
-var _checkbox = _interopRequireDefault(require("../checkbox"));
-var _helpers = require("./helpers");
-var _withDropdown = require("../dropdown/withDropdown");
-var constants = _interopRequireWildcard(require("../internals/constants"));
-var _withTooltip = _interopRequireWildcard(require("../internals/withTooltip"));
-var _permissionValidations = require("../permissionValidations");
-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 Item = props => {
-  const {
-    onClick,
-    leftIconName,
-    leftIcon,
-    displayCheckbox,
-    url,
-    leftElement,
-    hovered = true,
-    customClass,
-    text,
-    subText,
-    rightIcon,
-    rightIconName,
-    itemId = '',
-    rightElement,
-    style,
-    children,
-    disabled,
-    separator = true,
-    visible = true,
-    permissionAttr,
-    skeletonize,
-    targetRef,
-    target,
-    onDeniedText = 'Permissão Negada! Consulte o Administrador do sistema.'
-  } = props;
-  const {
-    handleSelectItem,
-    selectable,
-    selectedItemId,
-    selectedItemRef,
-    selectOnEnter
-  } = (0, _react.useContext)(_helpers.ListContext);
-  const dropdownContext = (0, _react.useContext)(_withDropdown.WithDropdownContext);
-  const {
-    handlerSetOnDeniedText
-  } = (0, _react.useContext)(_withTooltip.TooltipContext);
-  const options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible];
-  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr));
-  const navigate = (0, _reactRouterDom.useNavigate)();
-  const disabledByPermission = onDenied.disabled;
-  const shouldDisable = () => disabled || onDenied.disabled;
-  const disabledIconColor = 'rgb(193, 193, 193)';
-  const getClass = () => `item ${customClass} ${separator && 'list-separator'} ${shouldDisable() && 'disabled'}
-    ${displayCheckbox && 'list-checkbox'}`;
-  const getIcon = (iconName, icon) => {
-    const noIconDisabledByPermission = !icon && !displayCheckbox && !leftElement && !leftIconName && !leftIcon && onDenied.disabled;
-    if (icon) {
-      return icon;
-    } else if (noIconDisabledByPermission) {
-      return /*#__PURE__*/_react.default.createElement(_icons.default, {
-        name: "padlock",
-        color: disabledIconColor
-      });
-    } else if (iconName) {
-      return /*#__PURE__*/_react.default.createElement(_icons.default, {
-        name: !disabledByPermission ? iconName : 'padlock',
-        color: !disabledByPermission ? '' : disabledIconColor
-      });
-    }
-    return null;
-  };
-  const handleOnSelectItem = e => {
-    if (onClick !== undefined) onClick(e, itemId);
-    if (dropdownContext && dropdownContext.handleDropdownClose) {
-      dropdownContext.handleDropdownClose();
-    }
-    if (selectable) handleSelectItem(itemId, onClick);
-  };
-  const onKeyDown = (0, _react.useCallback)(e => {
-    if ([constants.keyCodes.ENTER].includes(e.keyCode) && !skeletonize && itemId && selectedItemId === itemId) {
-      e.preventDefault();
-      handleOnSelectItem(e);
-      if (url) {
-        if (target === '_blank') {
-          window.open(url, '_blank')?.focus();
-        } else {
-          navigate(url);
-        }
-      }
-    }
-  }, [url, selectedItemId, itemId]);
-  const getProps = () => {
-    if (shouldDisable()) return undefined;
-    if (onClick === undefined && dropdownContext === undefined && !selectable) return null;
-    return {
-      onClick: event => {
-        handleOnSelectItem(event);
-      },
-      role: 'button',
-      tabIndex: 0
-    };
-  };
-  (0, _react.useEffect)(() => {
-    if (selectOnEnter) document.addEventListener('keydown', onKeyDown);
-    return () => {
-      document.removeEventListener('keydown', onKeyDown);
-    };
-  }, [url, selectedItemId, itemId]);
-  (0, _react.useEffect)(() => {
-    if (disabledByPermission) handlerSetOnDeniedText(onDeniedText);
-  }, [disabledByPermission]);
-  const renderCheckBox = (0, _react.useMemo)(() => {
-    if (!disabledByPermission && displayCheckbox) {
-      return /*#__PURE__*/_react.default.createElement(_checkbox.default, {
-        name: "checkbox"
-      });
-    } else if (disabledByPermission && displayCheckbox) {
-      return /*#__PURE__*/_react.default.createElement(_icons.default, {
-        name: "padlock"
-      });
-    }
-    return null;
-  }, [disabledByPermission && displayCheckbox]);
-  if (!visible || onDenied.unvisible) return null;
-  return /*#__PURE__*/_react.default.createElement("li", _extends({
-    ref: ref => {
-      if (targetRef) targetRef(ref);
-      return itemId && selectedItemId === itemId ? selectedItemRef : null;
-    },
-    style: style,
-    className: `item-container ${hovered && 'hovered'}
-        ${itemId && selectedItemId === itemId ? '-activedlist' : ''}`
-  }, getProps(), {
-    key: itemId
-  }), url && !shouldDisable() && /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
-    className: "linkitem",
-    to: url,
-    target: target
-  }), (displayCheckbox || leftElement || leftIconName || leftIcon) && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${getClass()} -icon-left`
-  }, renderCheckBox, leftElement, getIcon(leftIconName, leftIcon)), (text || subText || children) && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${getClass()}`
-  }, text && /*#__PURE__*/_react.default.createElement("p", {
-    className: `${text && 'text'}`
-  }, text), subText && /*#__PURE__*/_react.default.createElement("p", {
-    className: `${subText && 'subtext'}`
-  }, subText), children), (rightIconName || rightIcon || rightElement || disabledByPermission) && /*#__PURE__*/_react.default.createElement("div", {
-    className: `${getClass()} -icon-right`
-  }, getIcon(rightIconName, rightIcon), rightElement));
+import "../chunks/jsx-runtime.CYK1ROHF.js";
+import "react";
+import "../chunks/index.CmrLK9Qe.js";
+import "../icons/index.js";
+import { L as s } from "../chunks/tabs.Cvj2MJH6.js";
+import "./helpers.js";
+import "../dropdown/withDropdown.js";
+import "../internals/constants.js";
+import "../internals/withTooltip.js";
+import "../permissionValidations.js";
+export {
+  s as default
 };
-var _default = exports.default = (0, _withTooltip.default)(Item);

package/lib/list/Separator.d.ts

@@ -1,3 +1,2 @@
-declare const Separator: () => JSX.Element;
-
-export { Separator as default };
+declare const Separator: () => import("react/jsx-runtime").JSX.Element;
+export default Separator;

package/lib/list/Separator.js

@@ -1,12 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const Separator = () => /*#__PURE__*/_react.default.createElement("li", {
-  className: "list-separator"
-});
-var _default = exports.default = Separator;
+import { j as s } from "../chunks/jsx-runtime.CYK1ROHF.js";
+const t = () => /* @__PURE__ */ s.jsx("li", { className: "list-separator" });
+export {
+  t as default
+};

package/lib/list/helpers.d.ts

@@ -1,15 +1,9 @@
-import React__default from 'react';
-import { IListContext } from './types.js';
-import '../@types/PermissionAttr.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
-import '../@types/Position.js';
-
-declare const ListContext: React__default.Context<IListContext>;
+import { default as React } from 'react';
+import { IListContext } from './types';
+declare const ListContext: React.Context<IListContext>;
 declare const LIST_ITEMS_TYPES: {
     listHeader: string;
     listItem: string;
     listSeparator: string;
 };
-
-export { LIST_ITEMS_TYPES, ListContext };
+export { ListContext, LIST_ITEMS_TYPES, };

package/lib/list/helpers.js

@@ -1,14 +1,10 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ListContext = exports.LIST_ITEMS_TYPES = void 0;
-var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const ListContext = exports.ListContext = /*#__PURE__*/_react.default.createContext({});
-const LIST_ITEMS_TYPES = exports.LIST_ITEMS_TYPES = {
-  listHeader: 'Header',
-  listItem: 'Item',
-  listSeparator: 'Separator'
-};
+import t from "react";
+const r = t.createContext({}), a = {
+  listHeader: "Header",
+  listItem: "Item",
+  listSeparator: "Separator"
+};
+export {
+  a as LIST_ITEMS_TYPES,
+  r as ListContext
+};

package/lib/list/index.d.ts

@@ -1,13 +1,7 @@
-export { default as ListHeader } from './Header.js';
-export { default as ListItem } from './Item.js';
-export { default as ListSeparator } from './Separator.js';
-import { IListProps } from './types.js';
-import 'react';
-import '../@types/PermissionAttr.js';
-import '../@types/Icon.js';
-import '../icons/helper.js';
-import '../@types/Position.js';
-
-declare const List: (props: IListProps) => JSX.Element;
-
-export { List as default };
+import { default as ListHeader } from './Header';
+import { default as ListItem } from './Item';
+import { default as ListSeparator } from './Separator';
+import { IListProps } from './types';
+declare const List: (props: IListProps) => import("react/jsx-runtime").JSX.Element;
+export default List;
+export { ListHeader, ListItem, ListSeparator };

package/lib/list/index.js

@@ -1,182 +1,101 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ListHeader", {
-  enumerable: true,
-  get: function () {
-    return _Header.default;
-  }
-});
-Object.defineProperty(exports, "ListItem", {
-  enumerable: true,
-  get: function () {
-    return _Item.default;
-  }
-});
-Object.defineProperty(exports, "ListSeparator", {
-  enumerable: true,
-  get: function () {
-    return _Separator.default;
-  }
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _Header = _interopRequireDefault(require("./Header"));
-var _Item = _interopRequireDefault(require("./Item"));
-var constants = _interopRequireWildcard(require("../internals/constants"));
-var _Separator = _interopRequireDefault(require("./Separator"));
-require("../assets/styles/list.scss");
-var _helpers = require("./helpers");
-var _skeleton = _interopRequireDefault(require("../skeleton"));
-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; }
-const List = props => {
+import { j as l } from "../chunks/jsx-runtime.CYK1ROHF.js";
+import { useRef as R, useState as h, useEffect as f, Fragment as S } from "react";
+import { default as q } from "./Header.js";
+import { L as P } from "../chunks/tabs.Cvj2MJH6.js";
+import { keyCodes as m } from "../internals/constants.js";
+import { default as J } from "./Separator.js";
+import { LIST_ITEMS_TYPES as O, ListContext as b } from "./helpers.js";
+import D from "../skeleton/index.js";
+const K = (u) => {
   const {
-    children,
-    customClass,
-    condensed,
-    transparent,
-    style,
-    selectable,
-    onSelectItem,
-    skeletonize = false,
-    skeletonHeight = 48,
-    skeletonItens = 5,
-    selectOnEnter = false
-  } = props;
-  const selectedItemRef = (0, _react.useRef)(null);
-  const listRef = (0, _react.useRef)(null);
-  const [selectedItemId, setSelectedItemId] = (0, _react.useState)('');
-  const [itensId, setItensId] = (0, _react.useState)([]);
-  const [newChildren, setNewChildren] = (0, _react.useState)(children);
-  const contextValues = {
-    selectable,
-    selectOnEnter,
-    selectedItemId,
-    selectedItemRef,
-    children,
-    skeletonize,
-    handleSelectItem: (itemId, onClick) => {
-      if (!onSelectItem && onClick) setSelectedItemId(itemId);
-      if (onSelectItem) onSelectItem(itemId);
+    children: t,
+    customClass: E,
+    condensed: L,
+    transparent: j,
+    style: v,
+    selectable: T,
+    onSelectItem: p,
+    skeletonize: c = !1,
+    skeletonHeight: W = 48,
+    skeletonItens: I = 5,
+    selectOnEnter: C = !1
+  } = u, i = R(null), r = R(null), [o, d] = h(""), [s, g] = h([]), [w, x] = h(t), N = {
+    selectable: T,
+    selectOnEnter: C,
+    selectedItemId: o,
+    selectedItemRef: i,
+    children: t,
+    skeletonize: c,
+    handleSelectItem: (e, n) => {
+      !p && n && d(e), p && p(e);
     }
-  };
-  const onKeyDown = e => {
-    if ([constants.keyCodes.ARROW_DOWN, constants.keyCodes.ARROW_UP].includes(e.keyCode) && !skeletonize) {
-      e.preventDefault();
-      if (e.keyCode === constants.keyCodes.ARROW_DOWN) {
-        if (selectedItemId === itensId[itensId.length - 1]) {
-          setSelectedItemId(itensId[0]);
-        } else {
-          const index = itensId.indexOf(selectedItemId === '' ? '0' : selectedItemId);
-          setSelectedItemId(itensId[index + 1]);
+  }, k = (e) => {
+    if ([m.ARROW_DOWN, m.ARROW_UP].includes(e.keyCode) && !c) {
+      if (e.preventDefault(), e.keyCode === m.ARROW_DOWN)
+        if (o === s[s.length - 1])
+          d(s[0]);
+        else {
+          const n = s.indexOf(o === "" ? "0" : o);
+          d(s[n + 1]);
         }
-      } else if (e.keyCode === constants.keyCodes.ARROW_UP) {
-        if (selectedItemId === itensId[0]) {
-          setSelectedItemId(itensId[itensId.length - 1]);
-        } else {
-          const index = itensId.indexOf(selectedItemId);
-          setSelectedItemId(itensId[index - 1]);
+      else if (e.keyCode === m.ARROW_UP)
+        if (o === s[0])
+          d(s[s.length - 1]);
+        else {
+          const n = s.indexOf(o);
+          d(s[n - 1]);
         }
-      }
-      return selectedItemRef.current && selectedItemRef.current.focus();
+      return i.current && i.current.focus();
     }
     return null;
-  };
-  const getSkeleton = function () {
-    let length = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
-    const maxSkeletonsItensExceeded = 2;
-    const skeletonItensCount = length > skeletonItens ? maxSkeletonsItensExceeded : Math.floor(skeletonItens / length);
-    const skeletonItensList = Array.from(Array(skeletonItensCount).keys());
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "skeleton-transparency"
-    }, skeletonItensList.map(id => /*#__PURE__*/_react.default.createElement(_Item.default, {
-      key: id,
-      hovered: false,
-      style: {
-        pointerEvents: 'none'
-      }
-    }, /*#__PURE__*/_react.default.createElement(_skeleton.default, {
-      height: skeletonHeight,
-      style: {
-        margin: '6px 0'
-      }
-    }))));
-  };
-  const getNewChildren = headersChildren => {
-    if (!headersChildren) return getSkeleton();
-    return Array.isArray(headersChildren) && headersChildren.length > 0 ? headersChildren.map(item => /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-      key: item.props.title
-    }, item, getSkeleton(headersChildren.length))) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, headersChildren, getSkeleton());
-  };
-  (0, _react.useEffect)(() => {
-    if (selectedItemRef.current && listRef.current && listRef.current.scroll) {
-      const selectedItemRect = selectedItemRef.current.getBoundingClientRect();
-      const listRect = listRef.current.getBoundingClientRect();
-      const defaultScrollTop = 0;
-      const defaultBottomOffset = 100;
-      if (selectedItemRect.top - selectedItemRect.height > listRect.bottom) {
-        listRef.current.scroll({
-          top: selectedItemRect.top
-        });
-      } else if (selectedItemRect.top + selectedItemRect.height - listRect.y >= listRect.height) {
-        listRef.current.scroll({
-          top: listRef.current.scrollTop + selectedItemRect.height
-        });
-      } else if (selectedItemRect.bottom < defaultBottomOffset) {
-        listRef.current.scroll({
-          top: defaultScrollTop
-        });
-      } else {
-        listRef.current.scroll({
-          top: listRef.current.scrollTop - selectedItemRect.height
-        });
-      }
+  }, y = (e = 1) => {
+    const a = e > I ? 2 : Math.floor(I / e), A = Array.from(Array(a).keys());
+    return /* @__PURE__ */ l.jsx("div", { className: "skeleton-transparency", children: A.map((B) => /* @__PURE__ */ l.jsx(P, { hovered: !1, style: { pointerEvents: "none" }, children: /* @__PURE__ */ l.jsx(D, { height: W, style: { margin: "6px 0" } }) }, B)) });
+  }, _ = (e) => e ? Array.isArray(e) && e.length > 0 ? e.map((n) => /* @__PURE__ */ l.jsxs(S, { children: [
+    n,
+    y(e.length)
+  ] }, n.props.title)) : /* @__PURE__ */ l.jsxs(S, { children: [
+    e,
+    y()
+  ] }) : y();
+  return f(() => {
+    if (i.current && r.current && r.current.scroll) {
+      const e = i.current.getBoundingClientRect(), n = r.current.getBoundingClientRect();
+      e.top - e.height > n.bottom ? r.current.scroll({ top: e.top }) : e.top + e.height - n.y >= n.height ? r.current.scroll({ top: r.current.scrollTop + e.height }) : e.bottom < 100 ? r.current.scroll({ top: 0 }) : r.current.scroll({ top: r.current.scrollTop - e.height });
     }
-  }, [selectedItemRef.current]);
-  (0, _react.useEffect)(() => {
-    if (!skeletonize) document.addEventListener('keydown', onKeyDown);
-    return () => {
-      document.removeEventListener('keydown', onKeyDown);
-    };
-  }, [skeletonize, selectedItemId, itensId]);
-  (0, _react.useEffect)(() => {
-    if (onSelectItem && props.selectedItemId) setSelectedItemId(props.selectedItemId);
-  }, [props.selectedItemId]);
-  (0, _react.useEffect)(() => {
-    if (Array.isArray(children) && children.length > 0) {
-      const newItensIds = children.map(item => item.props && item.props.itemId).filter(Boolean);
-      setItensId(newItensIds);
-    } else if (!Array.isArray(children) && children.props) {
-      const childrenWithProps = children;
-      if (childrenWithProps.props.itemId) setItensId([childrenWithProps.props.itemId]);
+  }, [i.current]), f(() => (c || document.addEventListener("keydown", k), () => {
+    document.removeEventListener("keydown", k);
+  }), [c, o, s]), f(() => {
+    p && u.selectedItemId && d(u.selectedItemId);
+  }, [u.selectedItemId]), f(() => {
+    if (Array.isArray(t) && t.length > 0) {
+      const e = t.map((n) => n.props && n.props.itemId).filter(Boolean);
+      g(e);
+    } else if (!Array.isArray(t) && t.props) {
+      const e = t;
+      e.props.itemId && g([e.props.itemId]);
     }
-  }, [children]);
-  (0, _react.useEffect)(() => {
-    if (skeletonize) {
-      let headersChildren = null;
-      if (Array.isArray(children) && children.length > 0) {
-        const childrenWithType = children;
-        headersChildren = childrenWithType.filter(item => item.type && typeof item.type !== 'string' && item.type.name === _helpers.LIST_ITEMS_TYPES.listHeader);
-      } else if (!Array.isArray(children)) {
-        headersChildren = children.type && typeof children.type !== 'string' && children.type.name === _helpers.LIST_ITEMS_TYPES.listHeader ? children : null;
-      }
-      setNewChildren(getNewChildren(headersChildren));
-    } else {
-      setNewChildren(children);
+  }, [t]), f(() => {
+    if (c) {
+      let e = null;
+      Array.isArray(t) && t.length > 0 ? e = t.filter((a) => a.type && typeof a.type != "string" && a.type.name === O.listHeader) : Array.isArray(t) || (e = t.type && typeof t.type != "string" && t.type.name === O.listHeader ? t : null), x(_(e));
+    } else
+      x(t);
+  }, [c, t]), /* @__PURE__ */ l.jsx(b.Provider, { value: N, children: /* @__PURE__ */ l.jsx(
+    "ul",
+    {
+      "data-testid": "list-component",
+      style: v,
+      ref: r,
+      className: `list-component ${L && "-condensed"}
+        ${E} ${!j && "-listbackground"}`,
+      children: w
     }
-  }, [skeletonize, children]);
-  return /*#__PURE__*/_react.default.createElement(_helpers.ListContext.Provider, {
-    value: contextValues
-  }, /*#__PURE__*/_react.default.createElement("ul", {
-    "data-testid": "list-component",
-    style: style,
-    ref: listRef,
-    className: `list-component ${condensed && '-condensed'}
-        ${customClass} ${!transparent && '-listbackground'}`
-  }, newChildren));
+  ) });
+};
+export {
+  q as ListHeader,
+  P as ListItem,
+  J as ListSeparator,
+  K as default
 };
-var _default = exports.default = List;

package/lib/list/list.spec.d.ts

@@ -0,0 +1 @@
+export {};