@dmsi/wedgekit-react 0.0.503 → 0.0.504
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/{chunk-VOSQMHNF.js → chunk-U5V2IRZX.js} +4 -29
- package/dist/{chunk-S5ZJ3Q7P.js → chunk-VJVY6NPF.js} +3 -3
- package/dist/components/CalendarRange.cjs +75 -128
- package/dist/components/CalendarRange.js +1 -7
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.cjs +33 -86
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.js +1 -7
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs +43 -96
- package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js +1 -7
- package/dist/components/DataGrid/PinnedColumns.cjs +58 -111
- package/dist/components/DataGrid/PinnedColumns.js +1 -7
- package/dist/components/DataGrid/TableBody/LoadingCell.cjs +34 -87
- package/dist/components/DataGrid/TableBody/LoadingCell.js +1 -7
- package/dist/components/DataGrid/TableBody/TableBodyRow.cjs +40 -93
- package/dist/components/DataGrid/TableBody/TableBodyRow.js +1 -7
- package/dist/components/DataGrid/TableBody/index.cjs +55 -108
- package/dist/components/DataGrid/TableBody/index.js +1 -7
- package/dist/components/DataGrid/index.cjs +144 -197
- package/dist/components/DataGrid/index.js +1 -7
- package/dist/components/DataGrid/utils.cjs +34 -87
- package/dist/components/DataGrid/utils.js +1 -7
- package/dist/components/DateInput.cjs +94 -147
- package/dist/components/DateInput.js +1 -7
- package/dist/components/DateRangeInput.cjs +94 -147
- package/dist/components/DateRangeInput.js +1 -7
- package/dist/components/MobileDataGrid/ColumnSelector/index.cjs +41 -94
- package/dist/components/MobileDataGrid/ColumnSelector/index.js +1 -7
- package/dist/components/MobileDataGrid/MobileDataGridHeader.cjs +49 -102
- package/dist/components/MobileDataGrid/MobileDataGridHeader.js +1 -7
- package/dist/components/MobileDataGrid/index.cjs +868 -921
- package/dist/components/MobileDataGrid/index.js +1 -7
- package/dist/components/PDFViewer/PDFElement.cjs +5 -31
- package/dist/components/PDFViewer/PDFElement.js +2 -3
- package/dist/components/PDFViewer/PDFPage.cjs +3 -3
- package/dist/components/PDFViewer/PDFPage.js +1 -1
- package/dist/components/PDFViewer/index.cjs +5 -35
- package/dist/components/PDFViewer/index.js +111 -8
- package/dist/components/index.cjs +56 -402
- package/dist/components/index.js +1 -10
- package/package.json +1 -1
- package/src/components/PDFViewer/PDFElement.tsx +3 -38
- package/src/components/PDFViewer/PDFPage.tsx +2 -4
- package/src/components/PDFViewer/index.tsx +1 -9
- package/src/components/index.ts +0 -1
- package/dist/chunk-6XLESQ2U.js +0 -119
- /package/dist/{chunk-C2YTC2CN.js → chunk-JWVZOEF5.js} +0 -0
|
@@ -62,7 +62,7 @@ __export(ColumnSelector_exports, {
|
|
|
62
62
|
ColumnSelector: () => ColumnSelector
|
|
63
63
|
});
|
|
64
64
|
module.exports = __toCommonJS(ColumnSelector_exports);
|
|
65
|
-
var
|
|
65
|
+
var import_react37 = require("react");
|
|
66
66
|
|
|
67
67
|
// src/components/DataGridCell.tsx
|
|
68
68
|
var import_sortable = require("@dnd-kit/sortable");
|
|
@@ -5591,68 +5591,15 @@ var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
|
5591
5591
|
var import_clsx36 = __toESM(require("clsx"), 1);
|
|
5592
5592
|
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
5593
5593
|
|
|
5594
|
-
// src/components/
|
|
5595
|
-
var import_react35 = require("react");
|
|
5596
|
-
|
|
5597
|
-
// src/components/PDFViewer/PDFElement.tsx
|
|
5598
|
-
var import_react34 = require("react");
|
|
5599
|
-
|
|
5600
|
-
// src/components/Spinner.tsx
|
|
5601
|
-
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
5602
|
-
var Spinner = ({ size = "small", testid }) => {
|
|
5603
|
-
const dimension = size === "large" ? 48 : 24;
|
|
5604
|
-
return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
|
|
5605
|
-
"svg",
|
|
5606
|
-
{
|
|
5607
|
-
"data-testid": testid,
|
|
5608
|
-
width: dimension,
|
|
5609
|
-
height: dimension,
|
|
5610
|
-
viewBox: "0 0 24 24",
|
|
5611
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
5612
|
-
fill: "#1D1E1E",
|
|
5613
|
-
className: "spinner",
|
|
5614
|
-
"aria-label": "Loading",
|
|
5615
|
-
children: [
|
|
5616
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "12", cy: "4", r: "2", opacity: "1" }),
|
|
5617
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "17.666", cy: "6.334", r: "2", opacity: "0.125" }),
|
|
5618
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "20", cy: "12", r: "2", opacity: "0.25" }),
|
|
5619
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "17.666", cy: "17.666", r: "2", opacity: "0.375" }),
|
|
5620
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "12", cy: "20", r: "2", opacity: "0.5" }),
|
|
5621
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "6.334", cy: "17.666", r: "2", opacity: "0.625" }),
|
|
5622
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "4", cy: "12", r: "2", opacity: "0.75" }),
|
|
5623
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("circle", { cx: "6.334", cy: "6.334", r: "2", opacity: "0.875" })
|
|
5624
|
-
]
|
|
5625
|
-
}
|
|
5626
|
-
);
|
|
5627
|
-
};
|
|
5628
|
-
Spinner.displayName = "Spinner";
|
|
5629
|
-
|
|
5630
|
-
// src/components/PDFViewer/PDFPage.tsx
|
|
5594
|
+
// src/components/ListGroup.tsx
|
|
5631
5595
|
var import_react33 = require("react");
|
|
5632
|
-
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
5633
|
-
|
|
5634
|
-
// src/components/PDFViewer/PDFElement.tsx
|
|
5635
5596
|
var import_clsx37 = __toESM(require("clsx"), 1);
|
|
5636
|
-
var
|
|
5637
|
-
|
|
5638
|
-
// src/components/PDFViewer/DownloadIcon.tsx
|
|
5639
|
-
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
5640
|
-
|
|
5641
|
-
// src/components/PDFViewer/PDFNavigation.tsx
|
|
5642
|
-
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
5643
|
-
|
|
5644
|
-
// src/components/PDFViewer/index.tsx
|
|
5645
|
-
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
5646
|
-
|
|
5647
|
-
// src/components/ListGroup.tsx
|
|
5648
|
-
var import_react36 = require("react");
|
|
5649
|
-
var import_clsx38 = __toESM(require("clsx"), 1);
|
|
5650
|
-
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
5597
|
+
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
5651
5598
|
|
|
5652
5599
|
// src/components/Pagination.tsx
|
|
5653
|
-
var
|
|
5654
|
-
var
|
|
5655
|
-
var
|
|
5600
|
+
var import_react34 = require("react");
|
|
5601
|
+
var import_clsx38 = __toESM(require("clsx"), 1);
|
|
5602
|
+
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
5656
5603
|
var Pagination = ({
|
|
5657
5604
|
totalPages,
|
|
5658
5605
|
currentPage,
|
|
@@ -5662,7 +5609,7 @@ var Pagination = ({
|
|
|
5662
5609
|
className,
|
|
5663
5610
|
disabled
|
|
5664
5611
|
}) => {
|
|
5665
|
-
const goTo = (0,
|
|
5612
|
+
const goTo = (0, import_react34.useCallback)(
|
|
5666
5613
|
(page) => {
|
|
5667
5614
|
if (disabled) return;
|
|
5668
5615
|
onPageChange(page);
|
|
@@ -5679,7 +5626,7 @@ var Pagination = ({
|
|
|
5679
5626
|
goTo(currentPage + 1);
|
|
5680
5627
|
}
|
|
5681
5628
|
};
|
|
5682
|
-
const pageTokens = (0,
|
|
5629
|
+
const pageTokens = (0, import_react34.useMemo)(() => {
|
|
5683
5630
|
if (totalPages <= 5) {
|
|
5684
5631
|
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
|
5685
5632
|
}
|
|
@@ -5716,7 +5663,7 @@ var Pagination = ({
|
|
|
5716
5663
|
return tokens;
|
|
5717
5664
|
}, [totalPages, currentPage]);
|
|
5718
5665
|
if (totalPages <= 1) return null;
|
|
5719
|
-
const buttonClass = (0,
|
|
5666
|
+
const buttonClass = (0, import_clsx38.default)(
|
|
5720
5667
|
"cursor-pointer disabled:cursor-default",
|
|
5721
5668
|
paddingUsingComponentGap,
|
|
5722
5669
|
"w-8 h-8",
|
|
@@ -5727,14 +5674,14 @@ var Pagination = ({
|
|
|
5727
5674
|
"focus:bg-background-grouped-secondary-normal focus:outline-0",
|
|
5728
5675
|
"disabled:bg-transparent disabled:text-text-action-primary-disabled"
|
|
5729
5676
|
);
|
|
5730
|
-
return /* @__PURE__ */ (0,
|
|
5677
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
|
|
5731
5678
|
"nav",
|
|
5732
5679
|
{
|
|
5733
5680
|
id,
|
|
5734
5681
|
"data-testid": testid,
|
|
5735
5682
|
"aria-label": "Pagination",
|
|
5736
5683
|
onKeyDown: handleKey,
|
|
5737
|
-
className: (0,
|
|
5684
|
+
className: (0, import_clsx38.default)(
|
|
5738
5685
|
"flex items-center",
|
|
5739
5686
|
"border border-border-primary-normal",
|
|
5740
5687
|
"bg-background-grouped-primary-normal",
|
|
@@ -5742,19 +5689,19 @@ var Pagination = ({
|
|
|
5742
5689
|
className
|
|
5743
5690
|
),
|
|
5744
5691
|
children: [
|
|
5745
|
-
/* @__PURE__ */ (0,
|
|
5692
|
+
/* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
5746
5693
|
"button",
|
|
5747
5694
|
{
|
|
5748
5695
|
disabled: disabled || currentPage <= 1,
|
|
5749
5696
|
"aria-label": "Previous page",
|
|
5750
5697
|
onClick: () => goTo(currentPage - 1),
|
|
5751
|
-
className: (0,
|
|
5752
|
-
children: /* @__PURE__ */ (0,
|
|
5698
|
+
className: (0, import_clsx38.default)(buttonClass, "border-r-1 border-border-primary-normal"),
|
|
5699
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Icon, { name: "keyboard_arrow_left" })
|
|
5753
5700
|
}
|
|
5754
5701
|
),
|
|
5755
|
-
/* @__PURE__ */ (0,
|
|
5702
|
+
/* @__PURE__ */ (0, import_jsx_runtime55.jsx)("ul", { className: (0, import_clsx38.default)("flex items-center"), children: pageTokens.map((token, index) => {
|
|
5756
5703
|
if (token === "ellipsis") {
|
|
5757
|
-
return /* @__PURE__ */ (0,
|
|
5704
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
5758
5705
|
"li",
|
|
5759
5706
|
{
|
|
5760
5707
|
className: "w-8 h-8 select-none text-text-action-primary-disabled",
|
|
@@ -5764,29 +5711,29 @@ var Pagination = ({
|
|
|
5764
5711
|
);
|
|
5765
5712
|
}
|
|
5766
5713
|
const selected = token === currentPage;
|
|
5767
|
-
return /* @__PURE__ */ (0,
|
|
5714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
5768
5715
|
"button",
|
|
5769
5716
|
{
|
|
5770
5717
|
"aria-label": `Page ${token}`,
|
|
5771
5718
|
"aria-current": selected ? "page" : void 0,
|
|
5772
5719
|
disabled,
|
|
5773
5720
|
onClick: () => goTo(token),
|
|
5774
|
-
className: (0,
|
|
5721
|
+
className: (0, import_clsx38.default)(
|
|
5775
5722
|
buttonClass,
|
|
5776
5723
|
selected && "border-x-1 bg-background-grouped-secondary-normal border-border-primary-normal"
|
|
5777
5724
|
),
|
|
5778
|
-
children: /* @__PURE__ */ (0,
|
|
5725
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Subheader, { align: "center", weight: "bold", children: token })
|
|
5779
5726
|
}
|
|
5780
5727
|
) }, token);
|
|
5781
5728
|
}) }),
|
|
5782
|
-
/* @__PURE__ */ (0,
|
|
5729
|
+
/* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
|
|
5783
5730
|
"button",
|
|
5784
5731
|
{
|
|
5785
5732
|
disabled: disabled || currentPage >= totalPages,
|
|
5786
5733
|
"aria-label": "Next page",
|
|
5787
5734
|
onClick: () => goTo(currentPage + 1),
|
|
5788
|
-
className: (0,
|
|
5789
|
-
children: /* @__PURE__ */ (0,
|
|
5735
|
+
className: (0, import_clsx38.default)(buttonClass, "border-l-1 border-border-primary-normal"),
|
|
5736
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Icon, { name: "keyboard_arrow_right" })
|
|
5790
5737
|
}
|
|
5791
5738
|
)
|
|
5792
5739
|
]
|
|
@@ -5796,29 +5743,29 @@ var Pagination = ({
|
|
|
5796
5743
|
Pagination.displayName = "Pagination";
|
|
5797
5744
|
|
|
5798
5745
|
// src/components/SkeletonParagraph.tsx
|
|
5799
|
-
var
|
|
5746
|
+
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
5800
5747
|
|
|
5801
5748
|
// src/components/EmptyCartIcon.tsx
|
|
5802
|
-
var
|
|
5749
|
+
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
5803
5750
|
|
|
5804
5751
|
// src/components/SearchResultImage/index.tsx
|
|
5805
|
-
var
|
|
5806
|
-
var
|
|
5752
|
+
var import_react35 = require("react");
|
|
5753
|
+
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
5807
5754
|
|
|
5808
5755
|
// src/components/Alert.tsx
|
|
5809
|
-
var
|
|
5810
|
-
var
|
|
5811
|
-
var
|
|
5756
|
+
var import_clsx39 = __toESM(require("clsx"), 1);
|
|
5757
|
+
var import_react36 = require("react");
|
|
5758
|
+
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
5812
5759
|
|
|
5813
5760
|
// src/components/OrderCheckIcon.tsx
|
|
5814
|
-
var
|
|
5761
|
+
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
5815
5762
|
|
|
5816
5763
|
// src/components/MobileDataGrid/ColumnSelector/index.tsx
|
|
5817
|
-
var
|
|
5764
|
+
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
5818
5765
|
function ColumnSelector() {
|
|
5819
5766
|
const context = useGridContext();
|
|
5820
|
-
const ref = (0,
|
|
5821
|
-
const [show, setShow] = (0,
|
|
5767
|
+
const ref = (0, import_react37.useRef)(null);
|
|
5768
|
+
const [show, setShow] = (0, import_react37.useState)(false);
|
|
5822
5769
|
const {
|
|
5823
5770
|
columns,
|
|
5824
5771
|
id,
|
|
@@ -5829,13 +5776,13 @@ function ColumnSelector() {
|
|
|
5829
5776
|
resetColumnVisibility,
|
|
5830
5777
|
dispatch
|
|
5831
5778
|
} = context;
|
|
5832
|
-
const toggleColumnVisibility = (0,
|
|
5779
|
+
const toggleColumnVisibility = (0, import_react37.useCallback)(
|
|
5833
5780
|
(index, visible) => {
|
|
5834
5781
|
dispatch({ type: "UPDATE", index, payload: { meta: { visible } } });
|
|
5835
5782
|
},
|
|
5836
5783
|
[dispatch]
|
|
5837
5784
|
);
|
|
5838
|
-
return /* @__PURE__ */ (0,
|
|
5785
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
|
|
5839
5786
|
"div",
|
|
5840
5787
|
{
|
|
5841
5788
|
id: id ? `${id}-column-selector` : void 0,
|
|
@@ -5843,7 +5790,7 @@ function ColumnSelector() {
|
|
|
5843
5790
|
className: "text-text-secondary-normal border-l border-brand-200 p-mobile-container-padding",
|
|
5844
5791
|
ref,
|
|
5845
5792
|
children: [
|
|
5846
|
-
/* @__PURE__ */ (0,
|
|
5793
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5847
5794
|
Button,
|
|
5848
5795
|
{
|
|
5849
5796
|
id: id ? `${id}-button` : void 0,
|
|
@@ -5852,10 +5799,10 @@ function ColumnSelector() {
|
|
|
5852
5799
|
variant: "navigation",
|
|
5853
5800
|
iconOnly: true,
|
|
5854
5801
|
size: 24,
|
|
5855
|
-
leftIcon: /* @__PURE__ */ (0,
|
|
5802
|
+
leftIcon: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Icon, { name: "tune" })
|
|
5856
5803
|
}
|
|
5857
5804
|
),
|
|
5858
|
-
/* @__PURE__ */ (0,
|
|
5805
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
|
|
5859
5806
|
Menu,
|
|
5860
5807
|
{
|
|
5861
5808
|
id: id ? `${id}-menu` : void 0,
|
|
@@ -5866,7 +5813,7 @@ function ColumnSelector() {
|
|
|
5866
5813
|
setShow,
|
|
5867
5814
|
calculateMinMaxHeight: true,
|
|
5868
5815
|
children: [
|
|
5869
|
-
/* @__PURE__ */ (0,
|
|
5816
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5870
5817
|
Button,
|
|
5871
5818
|
{
|
|
5872
5819
|
id: id ? `${id}-reset-button` : void 0,
|
|
@@ -5884,11 +5831,11 @@ function ColumnSelector() {
|
|
|
5884
5831
|
return (_a = x.meta) == null ? void 0 : _a.inVisibilityMenu;
|
|
5885
5832
|
}).map((column) => {
|
|
5886
5833
|
var _a, _b, _c;
|
|
5887
|
-
return /* @__PURE__ */ (0,
|
|
5834
|
+
return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5888
5835
|
MenuOption,
|
|
5889
5836
|
{
|
|
5890
5837
|
testid: testid ? `${testid}-option-${column.id}` : void 0,
|
|
5891
|
-
children: /* @__PURE__ */ (0,
|
|
5838
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
5892
5839
|
Checkbox,
|
|
5893
5840
|
{
|
|
5894
5841
|
id: id ? `${id}-checkbox-${column.id}` : void 0,
|
|
@@ -1,16 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColumnSelector
|
|
3
|
-
} from "../../../chunk-
|
|
3
|
+
} from "../../../chunk-JWVZOEF5.js";
|
|
4
4
|
import "../../../chunk-M7INAUAJ.js";
|
|
5
5
|
import "../../../chunk-ELXVDRWS.js";
|
|
6
6
|
import "../../../chunk-3UUCDNX3.js";
|
|
7
7
|
import "../../../chunk-FJRYHJUV.js";
|
|
8
8
|
import "../../../chunk-BQNPOGD5.js";
|
|
9
9
|
import "../../../chunk-Y5GD2FJA.js";
|
|
10
|
-
import "../../../chunk-6XLESQ2U.js";
|
|
11
|
-
import "../../../chunk-VOSQMHNF.js";
|
|
12
|
-
import "../../../chunk-YJGDVWTH.js";
|
|
13
|
-
import "../../../chunk-S5ZJ3Q7P.js";
|
|
14
10
|
import "../../../chunk-MBZ55T2D.js";
|
|
15
11
|
import "../../../chunk-2IKT6IHB.js";
|
|
16
12
|
import "../../../chunk-YCDDBSVU.js";
|
|
@@ -20,7 +16,6 @@ import "../../../chunk-5YNEY3WO.js";
|
|
|
20
16
|
import "../../../chunk-5IFPG6TS.js";
|
|
21
17
|
import "../../../chunk-AJ5M6MVX.js";
|
|
22
18
|
import "../../../chunk-UI7P5J5S.js";
|
|
23
|
-
import "../../../chunk-56RPZLV7.js";
|
|
24
19
|
import "../../../chunk-MDB26F6T.js";
|
|
25
20
|
import "../../../chunk-AT4AWD6B.js";
|
|
26
21
|
import "../../../chunk-EWGHVZL5.js";
|
|
@@ -36,7 +31,6 @@ import "../../../chunk-CMMQTIVM.js";
|
|
|
36
31
|
import "../../../chunk-AG43RS4Q.js";
|
|
37
32
|
import "../../../chunk-AKJUBFJK.js";
|
|
38
33
|
import "../../../chunk-SUSUNSVZ.js";
|
|
39
|
-
import "../../../chunk-SBRRNFOP.js";
|
|
40
34
|
import "../../../chunk-Y2GK27RX.js";
|
|
41
35
|
import "../../../chunk-QVWYTQKL.js";
|
|
42
36
|
import "../../../chunk-F6RZ7MUE.js";
|