@economic/taco 3.0.2-row-active-search.1 → 3.0.3-save-spinner-size.0
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/dist/taco.cjs +30 -33
- package/dist/taco.cjs.map +1 -1
- package/dist/taco.d.ts +1 -1
- package/dist/taco.js +30 -33
- package/dist/taco.js.map +1 -1
- package/package.json +2 -2
package/dist/taco.cjs
CHANGED
|
@@ -811,6 +811,16 @@ function IconClamp(props, svgRef) {
|
|
|
811
811
|
));
|
|
812
812
|
}
|
|
813
813
|
const Clamp = React__namespace.forwardRef(IconClamp);
|
|
814
|
+
function IconClickToPay(props, svgRef) {
|
|
815
|
+
return /* @__PURE__ */ React__namespace.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ref: svgRef, ...props }, /* @__PURE__ */ React__namespace.createElement(
|
|
816
|
+
"path",
|
|
817
|
+
{
|
|
818
|
+
d: "M23.804 11.52l-5.752-6.676a.692.692 0 00-1.282.357c0 .2.086.38.224.506l5.209 6.275-5.152 6.157h-2.225l4.869-5.629.009-.01a.7.7 0 00.192-.491.7.7 0 00-.192-.492l-.01-.01-5.813-6.651-.004-.005a.692.692 0 00-.595-.337H9.2a.689.689 0 00-.691.687c0 .115.015.235.079.32l5.411 6.512-4.611 5.497c-.028.028-.425.59-1.124.59H2.757c-.75 0-1.37-.58-1.37-1.353v-9.53c0-.671.62-1.361 1.386-1.361H6.2c.403 0 .691-.274.691-.676s-.286-.7-.69-.7l-3.461.013C1.101 4.514 0 5.858 0 7.223v9.544c0 1.471 1.304 2.723 2.74 2.723h5.506c.277 0 .532-.04.76-.105l.096-.029a2.966 2.966 0 001.306-.853l5.19-6.01c.245-.277.278-.677.004-.977l-.008-.01-4.91-5.63h2.266l5.13 6.13-5.399 6.472s.001.007.01.016a.685.685 0 00.611 1.006h4.084a.69.69 0 00.594-.337s.002-.003.005-.004l5.813-6.65.009-.01c.274-.3.241-.7-.005-.977",
|
|
819
|
+
fill: "currentColor"
|
|
820
|
+
}
|
|
821
|
+
));
|
|
822
|
+
}
|
|
823
|
+
const ClickToPay = React__namespace.forwardRef(IconClickToPay);
|
|
814
824
|
function IconClose(props, svgRef) {
|
|
815
825
|
return /* @__PURE__ */ React__namespace.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", ref: svgRef, ...props }, /* @__PURE__ */ React__namespace.createElement(
|
|
816
826
|
"path",
|
|
@@ -3065,6 +3075,7 @@ const icons = {
|
|
|
3065
3075
|
"circle-warning": CircleWarning,
|
|
3066
3076
|
"clamp-open": ClampOpen,
|
|
3067
3077
|
clamp: Clamp,
|
|
3078
|
+
"click-to-pay": ClickToPay,
|
|
3068
3079
|
close: Close$3,
|
|
3069
3080
|
"column-freeze": ColumnFreeze,
|
|
3070
3081
|
"column-unfreeze": ColumnUnfreeze,
|
|
@@ -24130,7 +24141,7 @@ const Spinner = React.forwardRef(function Spinner2(props, ref) {
|
|
|
24130
24141
|
return /* @__PURE__ */ React.createElement("div", { ...otherProps, className, "data-taco": "spinner", ref }, /* @__PURE__ */ React.createElement(
|
|
24131
24142
|
"svg",
|
|
24132
24143
|
{
|
|
24133
|
-
className: "
|
|
24144
|
+
className: "animate-[spinnerRotation_2s_linear_infinite]",
|
|
24134
24145
|
viewBox: "0 0 100 100",
|
|
24135
24146
|
xmlns: "http://www.w3.org/2000/svg"
|
|
24136
24147
|
},
|
|
@@ -43906,23 +43917,6 @@ const useIsHoverStatePaused = () => {
|
|
|
43906
43917
|
}, [shouldPauseHoverState]);
|
|
43907
43918
|
return [shouldPauseHoverState, setShouldPauseHoverState];
|
|
43908
43919
|
};
|
|
43909
|
-
function focusActiveRow(tableRef) {
|
|
43910
|
-
var _a;
|
|
43911
|
-
const activeRow = ((_a = (tableRef == null ? void 0 : tableRef.current) ?? document) == null ? void 0 : _a.querySelector('tbody tr[data-row-active="true"]')) ?? null;
|
|
43912
|
-
if (activeRow) {
|
|
43913
|
-
if (!isElementInsideOrTriggeredFromContainer(document.activeElement, activeRow) && !isElementInteractive(document.activeElement)) {
|
|
43914
|
-
activeRow.focus({ preventScroll: true });
|
|
43915
|
-
}
|
|
43916
|
-
}
|
|
43917
|
-
}
|
|
43918
|
-
function useTableRowActiveListener$1(table, tableRef) {
|
|
43919
|
-
const tableMeta = table.options.meta;
|
|
43920
|
-
React.useEffect(() => {
|
|
43921
|
-
if (tableMeta.rowActive.rowActiveIndex !== void 0) {
|
|
43922
|
-
focusActiveRow(tableRef);
|
|
43923
|
-
}
|
|
43924
|
-
}, [tableMeta.rowActive.rowActiveIndex, tableRef]);
|
|
43925
|
-
}
|
|
43926
43920
|
function useTableRowActive$1(isEnabled = false, initialRowActiveIndex) {
|
|
43927
43921
|
const [rowActiveIndex, setRowActiveIndex] = React.useState(initialRowActiveIndex);
|
|
43928
43922
|
const [rowHoverIndex, setRowHoverIndex] = React.useState(void 0);
|
|
@@ -43930,11 +43924,7 @@ function useTableRowActive$1(isEnabled = false, initialRowActiveIndex) {
|
|
|
43930
43924
|
const move = (direction, length, scrollToIndex) => {
|
|
43931
43925
|
const nextIndex = rowActiveIndex === void 0 ? 0 : getNextIndex(direction, rowActiveIndex, length);
|
|
43932
43926
|
scrollToIndex(nextIndex);
|
|
43933
|
-
|
|
43934
|
-
setTimeout(() => focusActiveRow(), 0);
|
|
43935
|
-
} else {
|
|
43936
|
-
setTimeout(() => setRowActiveIndex(nextIndex), 50);
|
|
43937
|
-
}
|
|
43927
|
+
setTimeout(() => setRowActiveIndex(nextIndex), 50);
|
|
43938
43928
|
};
|
|
43939
43929
|
const onKeyDown = React.useCallback(
|
|
43940
43930
|
(event, length, scrollToIndex) => {
|
|
@@ -44651,7 +44641,7 @@ function useTableRowDrop(isEnabled = false, onRowDrop) {
|
|
|
44651
44641
|
handleDrop: isEnabled ? onRowDrop : void 0
|
|
44652
44642
|
};
|
|
44653
44643
|
}
|
|
44654
|
-
function useTableRowActiveListener(table, onRowActive) {
|
|
44644
|
+
function useTableRowActiveListener$1(table, onRowActive) {
|
|
44655
44645
|
var _a;
|
|
44656
44646
|
const meta = table.options.meta;
|
|
44657
44647
|
const rows = table.getRowModel().flatRows;
|
|
@@ -44763,7 +44753,7 @@ function useTableManager(props, ref, meta, internalColumns) {
|
|
|
44763
44753
|
useTableDataListener(instance, length);
|
|
44764
44754
|
useTableFilterListener(instance, props.onChangeFilter);
|
|
44765
44755
|
useTableFontSizeListener(instance);
|
|
44766
|
-
useTableRowActiveListener(instance, props.onRowActive);
|
|
44756
|
+
useTableRowActiveListener$1(instance, props.onRowActive);
|
|
44767
44757
|
useTableRowHeightListener(instance);
|
|
44768
44758
|
useTableRowSelectionListener(instance, props.onRowSelect);
|
|
44769
44759
|
useTableSearchListener(instance);
|
|
@@ -44965,11 +44955,6 @@ function getCellWidthPadding(fontSize) {
|
|
|
44965
44955
|
return "16px";
|
|
44966
44956
|
}
|
|
44967
44957
|
}
|
|
44968
|
-
function getReachableRowCount(table) {
|
|
44969
|
-
const tableMeta = table.options.meta;
|
|
44970
|
-
const isFilteringActive = table.options.enableGlobalFilter && table.getState().globalFilter;
|
|
44971
|
-
return isFilteringActive ? table.getRowModel().rows.length + table.getBottomRows().length : tableMeta.length + table.getBottomRows().length;
|
|
44972
|
-
}
|
|
44973
44958
|
function useTableGlobalShortcuts(table, tableRef, scrollToIndex, localShortcuts = false) {
|
|
44974
44959
|
const tableMeta = table.options.meta;
|
|
44975
44960
|
const rows = table.getRowModel().rows;
|
|
@@ -44982,7 +44967,7 @@ function useTableGlobalShortcuts(table, tableRef, scrollToIndex, localShortcuts
|
|
|
44982
44967
|
if (isElementInsideExternalRelatedOverlay(trigger, tableRef)) {
|
|
44983
44968
|
return;
|
|
44984
44969
|
}
|
|
44985
|
-
const reachableRows =
|
|
44970
|
+
const reachableRows = tableMeta.length + table.getBottomRows().length;
|
|
44986
44971
|
tableMeta.rowActive.handleKeyDown(event, reachableRows, scrollToIndex);
|
|
44987
44972
|
tableMeta.rowSelection.handleKeyDown(event, table);
|
|
44988
44973
|
if (tableMeta.rowActive.rowActiveIndex !== void 0) {
|
|
@@ -45948,6 +45933,18 @@ function useRowGroupVirtualisation(table) {
|
|
|
45948
45933
|
);
|
|
45949
45934
|
return isTableGrouped ? rangeExtractor : void 0;
|
|
45950
45935
|
}
|
|
45936
|
+
function useTableRowActiveListener(table, tableRef) {
|
|
45937
|
+
const tableMeta = table.options.meta;
|
|
45938
|
+
React.useEffect(() => {
|
|
45939
|
+
var _a, _b;
|
|
45940
|
+
if (tableMeta.rowActive.rowActiveIndex !== void 0) {
|
|
45941
|
+
const activeRow = ((_a = tableRef.current) == null ? void 0 : _a.querySelector('tbody tr[data-row-active="true"]')) ?? null;
|
|
45942
|
+
if (!isElementInsideOrTriggeredFromContainer(document.activeElement, activeRow) && !isElementInteractive(document.activeElement)) {
|
|
45943
|
+
(_b = activeRow == null ? void 0 : activeRow.focus) == null ? void 0 : _b.call(activeRow, { preventScroll: true });
|
|
45944
|
+
}
|
|
45945
|
+
}
|
|
45946
|
+
}, [tableMeta.rowActive.rowActiveIndex]);
|
|
45947
|
+
}
|
|
45951
45948
|
function Actions(props) {
|
|
45952
45949
|
var _a, _b;
|
|
45953
45950
|
const { actions, actionsLength, data, isActiveRow, rowId, table } = props;
|
|
@@ -46282,7 +46279,7 @@ function useTable$1(props, externalRef, renderers, meta) {
|
|
|
46282
46279
|
const { style, stylesheet } = useTableStyle(manager.id, manager.instance);
|
|
46283
46280
|
useTableGlobalShortcuts(manager.instance, ref, renderer2.scrollToIndex, props.enableLocalKeyboardShortcuts);
|
|
46284
46281
|
useTableRef(manager.instance, ref);
|
|
46285
|
-
useTableRowActiveListener
|
|
46282
|
+
useTableRowActiveListener(manager.instance, ref);
|
|
46286
46283
|
return {
|
|
46287
46284
|
...manager,
|
|
46288
46285
|
props: {
|
|
@@ -47165,7 +47162,7 @@ function Body(props) {
|
|
|
47165
47162
|
}
|
|
47166
47163
|
if (tableMeta.rowActive.rowActiveIndex !== void 0) {
|
|
47167
47164
|
const isFirstRow = tableMeta.rowActive.rowActiveIndex === 0;
|
|
47168
|
-
const reachableRows =
|
|
47165
|
+
const reachableRows = tableMeta.length + table.getBottomRows().length;
|
|
47169
47166
|
const isLastRow = tableMeta.rowActive.rowActiveIndex === reachableRows - 1;
|
|
47170
47167
|
if (event.key === "Tab" || enableHorizontalArrowKeyNavigation && (event.key === "ArrowLeft" || event.key === "ArrowRight")) {
|
|
47171
47168
|
if (event.key === "Tab" && !hasFocusableElement(event.target.closest("tr[data-row-id]"))) {
|