pixel-react 1.10.10-4 → 1.10.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/index.esm.js CHANGED
@@ -14567,7 +14567,7 @@ const MiniModal = /*#__PURE__*/forwardRef(({
14567
14567
  }), document.body);
14568
14568
  });
14569
14569
 
14570
- var css_248z$R = ":root {\n --table-height: auto;\n}\n\n.tree-table-space-block {\n display: inline-block;\n width: 20px;\n height: 16px;\n text-align: center;\n line-height: 16px;\n vertical-align: top;\n font-size: 19px;\n position: relative;\n box-sizing: border-box;\n border-radius: 50%;\n /* Hover background for all elements of the same level */\n}\n.tree-table-space-block.btn-toggle {\n position: relative;\n cursor: pointer;\n width: 22px;\n height: 18px;\n z-index: 12;\n}\n.tree-table-space-block.btn-toggle::before {\n display: none;\n}\n.tree-table-space-block.last-block::after, .tree-table-space-block.no-folder::after {\n position: absolute;\n content: \"\";\n height: 1px;\n background: var(--tree-connecting-lines-color);\n top: 50%;\n margin-top: -1px;\n}\n.tree-table-space-block.last-block::after {\n width: 12px;\n left: -10px;\n}\n.tree-table-space-block.no-folder {\n width: 8px;\n}\n.tree-table-space-block.no-folder::after {\n width: 22px;\n left: -10px;\n}\n.tree-table-space-block:not(.last-block, .no-lines, .last-node)::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 40px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: 99;\n}\n.tree-table-space-block.last-node::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 12px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: -1;\n}\n.tree-table-space-block.folder.last-node::before {\n height: 13px;\n}\n.tree-table-space-block.tree-table-hovered::before, .tree-table-space-block.tree-table-hovered::after {\n background-color: var(--brand-color);\n}\n\n.tree-title-container .tree-table-space-block {\n width: 16px;\n}\n\n.hidden {\n display: none;\n}\n\n.show {\n display: table-row;\n visibility: visible;\n}\n\n.btn-toggle {\n cursor: pointer;\n}\n.btn-toggle.is-close {\n background: #f1f1f1;\n border: 1px solid transparent;\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n}\n.btn-toggle::before, .btn-toggle::after {\n display: none;\n}\n\n.tree-table-wrap {\n width: 100%;\n padding-left: 4px;\n overflow: hidden;\n overflow-x: auto;\n}\n\n.table-scrollable {\n height: var(--table-height);\n /* Adjust height as needed */\n overflow-y: auto;\n position: relative;\n}\n\n.ff-table-tree-body {\n overflow: scroll;\n}\n\n.tree-table {\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n overflow: scroll;\n}\n.tree-table .ff-table-tree-head {\n position: sticky;\n top: 0;\n z-index: 2;\n}\n.tree-table .ff-table-tree-row:hover,\n.tree-table .ff-table-tree-row.hover {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .ff-table-tree-td:first-child,\n.tree-table .ff-table-tree-row.hover .ff-table-tree-td:first-child {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action {\n display: inline-flex;\n align-items: center;\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action svg,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action svg {\n height: 14px;\n width: 14px;\n}\n.tree-table .ff-table-tree-row {\n background-color: var(--base-bg-color);\n}\n.tree-table .ff-table-tree-row .table-tree-row-action {\n display: none;\n}\n.tree-table .ff-table-tree-row .table-row-add-button {\n display: inline-flex;\n z-index: 9999;\n align-items: center;\n}\n.tree-table .ff-table-tree-row::after {\n content: \"\";\n display: block;\n visibility: hidden;\n clear: both;\n}\n.tree-table .ff-table-tree-th,\n.tree-table .ff-table-tree-td {\n text-align: left;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.tree-table .ff-table-tree-th {\n color: var(--table-header-text-color);\n background: var(--border-color);\n font-size: 12px;\n font-weight: 600;\n width: 400px;\n height: 32px;\n box-sizing: border-box;\n}\n.tree-table .ff-table-tree-th:first-child {\n width: 600px !important;\n position: sticky;\n left: 0;\n padding-left: 8px;\n}\n.tree-table .ff-table-tree-td {\n font-size: 12px;\n color: var(--nlp-color);\n height: 18px;\n}\n.tree-table .ff-table-tree-td:first-child {\n overflow: initial;\n position: sticky;\n left: 0;\n background-color: white;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n margin-left: 8px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content {\n padding-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content .tree-table-td-content-text {\n margin-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n font-weight: 700;\n}\n.tree-table .ff-table-tree-td.folder {\n height: 28px;\n}\n\n.tree-table-td-content {\n display: inline-flex;\n align-items: center;\n font-size: 12px;\n font-family: \"Poppins\", sans-serif;\n}\n.tree-table-td-content.folder {\n font-weight: 600;\n}\n\n.tree-row-expanded span svg,\n.tree-row-collapsed span svg {\n height: 12px;\n width: 12px;\n transition: transform 0.3s ease;\n}\n.tree-row-expanded span svg path,\n.tree-row-collapsed span svg path {\n fill: var(--brand-color);\n}\n\n.tree-row-collapsed svg {\n transform: rotate(-90deg);\n transition: transform 0.3s ease;\n}\n\n.tree-table-space-container {\n display: inline-flex;\n}\n\n.tree-title-container {\n display: inline-flex;\n align-items: center;\n}";
14570
+ var css_248z$R = ":root {\n --table-height: auto;\n}\n\n.tree-table-space-block {\n display: inline-block;\n width: 20px;\n height: 16px;\n text-align: center;\n line-height: 16px;\n vertical-align: top;\n font-size: 19px;\n position: relative;\n box-sizing: border-box;\n border-radius: 50%;\n /* Hover background for all elements of the same level */\n}\n.tree-table-space-block.btn-toggle {\n position: relative;\n cursor: pointer;\n width: 22px;\n height: 18px;\n z-index: 12;\n}\n.tree-table-space-block.btn-toggle::before {\n display: none;\n}\n.tree-table-space-block.last-block::after, .tree-table-space-block.no-folder::after {\n position: absolute;\n content: \"\";\n height: 1px;\n background: var(--tree-connecting-lines-color);\n top: 50%;\n margin-top: -1px;\n}\n.tree-table-space-block.last-block::after {\n width: 12px;\n left: -10px;\n}\n.tree-table-space-block.no-folder {\n width: 8px;\n}\n.tree-table-space-block.no-folder::after {\n width: 22px;\n left: -10px;\n}\n.tree-table-space-block:not(.last-block, .no-lines, .last-node)::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 40px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: 99;\n}\n.tree-table-space-block.last-node::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 12px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: -1;\n}\n.tree-table-space-block.folder.last-node::before {\n height: 13px;\n}\n.tree-table-space-block.tree-table-hovered::before, .tree-table-space-block.tree-table-hovered::after {\n background-color: var(--brand-color);\n}\n\n.tree-title-container .tree-table-space-block {\n width: 16px;\n}\n\n.hidden {\n display: none;\n}\n\n.show {\n display: table-row;\n visibility: visible;\n}\n\n.btn-toggle {\n cursor: pointer;\n}\n.btn-toggle.is-close {\n background: #f1f1f1;\n border: 1px solid transparent;\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n}\n.btn-toggle::before, .btn-toggle::after {\n display: none;\n}\n\n.tree-table-wrap {\n width: 100%;\n padding-left: 4px;\n overflow: hidden;\n overflow-x: auto;\n}\n\n.table-scrollable {\n height: var(--table-height);\n /* Adjust height as needed */\n overflow-y: auto;\n position: relative;\n}\n\n.ff-table-tree-body {\n overflow: scroll;\n}\n\n.tree-table {\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n overflow: scroll;\n}\n.tree-table .ff-table-tree-head {\n position: sticky;\n top: 0;\n z-index: 2;\n}\n.tree-table .ff-table-tree-row:hover,\n.tree-table .ff-table-tree-row.hover {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .ff-table-tree-td:first-child,\n.tree-table .ff-table-tree-row.hover .ff-table-tree-td:first-child {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action {\n display: inline-flex;\n align-items: center;\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action svg,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action svg {\n height: 14px;\n width: 14px;\n}\n.tree-table .ff-table-tree-row {\n background-color: var(--base-bg-color);\n}\n.tree-table .ff-table-tree-row .table-tree-row-action {\n display: none;\n}\n.tree-table .ff-table-tree-row .table-row-add-button {\n display: inline-flex;\n z-index: 9999;\n align-items: center;\n}\n.tree-table .ff-table-tree-row::after {\n content: \"\";\n display: block;\n visibility: hidden;\n clear: both;\n}\n.tree-table .ff-table-tree-th,\n.tree-table .ff-table-tree-td {\n text-align: left;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.tree-table .ff-table-tree-th {\n color: var(--table-header-text-color);\n background: var(--border-color);\n font-size: 12px;\n font-weight: 600;\n width: 400px;\n height: 32px;\n box-sizing: border-box;\n}\n.tree-table .ff-table-tree-th:first-child {\n width: 600px !important;\n position: sticky;\n left: 0;\n padding-left: 8px;\n}\n.tree-table .ff-table-tree-td {\n font-size: 12px;\n color: var(--nlp-color);\n height: 18px;\n}\n.tree-table .ff-table-tree-td:first-child {\n overflow: initial;\n position: sticky;\n left: 0;\n background-color: white;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n margin-left: 8px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content {\n padding-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content .tree-table-td-content-text {\n margin-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n font-weight: 700;\n}\n.tree-table .ff-table-tree-td.folder {\n height: 28px;\n}\n\n.tree-table-td-content {\n display: inline-flex;\n align-items: center;\n font-size: 12px;\n font-family: \"Poppins\", sans-serif;\n}\n.tree-table-td-content.folder {\n font-weight: 600;\n}\n\n.tree-row-expanded span svg,\n.tree-row-collapsed span svg {\n height: 12px;\n width: 12px;\n transition: transform 0.3s ease;\n cursor: pointer;\n}\n.tree-row-expanded span svg path,\n.tree-row-collapsed span svg path {\n fill: var(--brand-color);\n}\n\n.tree-row-collapsed svg {\n transform: rotate(-90deg);\n transition: transform 0.3s ease;\n}\n\n.tree-table-space-container {\n display: inline-flex;\n}\n\n.tree-title-container {\n display: inline-flex;\n align-items: center;\n}";
14571
14571
  styleInject(css_248z$R);
14572
14572
 
14573
14573
  const TableHead = /*#__PURE__*/React__default.memo(({
@@ -15012,15 +15012,15 @@ const TreeTable = ({
15012
15012
  if (expanding) return;
15013
15013
  setExpanding(node.key);
15014
15014
  onExpand?.(node, index);
15015
- }, [onExpand]);
15015
+ }, [onExpand, expanding]);
15016
15016
  const handleCheckBoxChange = useCallback((e, node) => {
15017
15017
  if (expanding) return;
15018
15018
  onChange?.(e, node);
15019
- }, [onChange]);
15019
+ }, [onChange, expanding]);
15020
15020
  const handleRowClick = useCallback((e, node) => {
15021
15021
  if (expanding) return;
15022
15022
  onClick?.(e, node);
15023
- }, [onClick]);
15023
+ }, [onClick, expanding]);
15024
15024
  return jsx("div", {
15025
15025
  className: "tree-table-wrap",
15026
15026
  children: jsx("div", {