@cerberus-design/data-grid 0.25.3 → 1.0.0-rc.6

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.
Files changed (34) hide show
  1. package/dist/column-helpers.cjs +55 -21
  2. package/dist/column-helpers.js +55 -17
  3. package/dist/components/cerby-data-grid.client.cjs +12 -11
  4. package/dist/components/cerby-data-grid.client.js +12 -7
  5. package/dist/components/count-menu.client.cjs +46 -49
  6. package/dist/components/count-menu.client.js +46 -45
  7. package/dist/components/data-grid.client.cjs +89 -82
  8. package/dist/components/data-grid.client.js +89 -78
  9. package/dist/components/features.client.cjs +72 -76
  10. package/dist/components/features.client.js +72 -72
  11. package/dist/components/grid.client.cjs +280 -309
  12. package/dist/components/grid.client.js +281 -303
  13. package/dist/components/pagination.client.cjs +90 -113
  14. package/dist/components/pagination.client.js +90 -109
  15. package/dist/components/pinned-items.client.cjs +60 -59
  16. package/dist/components/pinned-items.client.js +60 -55
  17. package/dist/components/sort-items.client.cjs +44 -49
  18. package/dist/components/sort-items.client.js +44 -45
  19. package/dist/const.cjs +32 -43
  20. package/dist/const.js +33 -31
  21. package/dist/context.client.cjs +12 -12
  22. package/dist/context.client.js +12 -8
  23. package/dist/hooks.client.cjs +13 -20
  24. package/dist/hooks.client.js +13 -16
  25. package/dist/index.cjs +9 -15
  26. package/dist/index.js +5 -4
  27. package/dist/panda.buildinfo.json +23 -0
  28. package/dist/store.cjs +241 -284
  29. package/dist/store.js +241 -280
  30. package/dist/utils.cjs +23 -45
  31. package/dist/utils.js +23 -41
  32. package/dist/virtualizer.client.cjs +63 -53
  33. package/dist/virtualizer.client.js +63 -49
  34. package/package.json +33 -27
package/dist/components/pagination.client.cjs CHANGED
@@ -1,116 +1,93 @@
1
- 'use client';
2
- 'use strict';
3
-
4
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
-
6
- const jsxRuntime = require('react/jsx-runtime');
7
- const react = require('@cerberus-design/react');
8
- const jsx = require('styled-system/jsx');
9
- const context_client = require('../context.client.cjs');
10
- const countMenu_client = require('./count-menu.client.cjs');
11
- const signals = require('@cerberus-design/signals');
12
-
1
+ "use client";
2
+ "use client";
3
+ const require_context_client = require("../context.client.cjs");
4
+ const require_count_menu_client = require("./count-menu.client.cjs");
5
+ let _cerberus_design_react = require("@cerberus-design/react");
6
+ let _cerberus_design_signals = require("@cerberus-design/signals");
7
+ let styled_system_jsx = require("styled-system/jsx");
8
+ let react_jsx_runtime = require("react/jsx-runtime");
9
+ //#region src/components/pagination.client.tsx
13
10
  function GridPagination() {
14
- const store = context_client.useDataGridContext();
15
- const pageIndex = signals.useRead(store.pageIndex);
16
- const pageSize = signals.useRead(store.pageSize);
17
- const rowCount = signals.useRead(store.rowCount);
18
- function handlePageChange(details) {
19
- store.setPage(details);
20
- }
21
- function handlePageSizeChange(details) {
22
- store.setPageSize(details.pageSize);
23
- }
24
- return /* @__PURE__ */ jsxRuntime.jsx(react.Show, { when: pageSize, children: () => /* @__PURE__ */ jsxRuntime.jsx(
25
- react.PaginationParts.Root,
26
- {
27
- defaultPage: pageIndex ? pageIndex : 1,
28
- count: rowCount,
29
- onPageChange: handlePageChange,
30
- onPageSizeChange: handlePageSizeChange,
31
- page: pageIndex,
32
- pageSize,
33
- children: /* @__PURE__ */ jsxRuntime.jsx(react.PaginationParts.Context, { children: (pagination) => /* @__PURE__ */ jsxRuntime.jsxs(
34
- jsx.HStack,
35
- {
36
- bgColor: "page.surface.100",
37
- borderTop: "1px solid",
38
- borderTopColor: "page.border.initial",
39
- justify: "space-between",
40
- px: "md",
41
- py: "sm",
42
- w: "full",
43
- children: [
44
- /* @__PURE__ */ jsxRuntime.jsxs(jsx.HStack, { gap: "sm", children: [
45
- /* @__PURE__ */ jsxRuntime.jsxs(
46
- react.Text,
47
- {
48
- as: "small",
49
- color: "page.text.100",
50
- textStyle: "label-sm",
51
- userSelect: "none",
52
- children: [
53
- pagination.pageRange.start,
54
- "-",
55
- pagination.pageRange.end,
56
- " of",
57
- " ",
58
- pagination.count
59
- ]
60
- }
61
- ),
62
- /* @__PURE__ */ jsxRuntime.jsx(
63
- jsx.Divider,
64
- {
65
- color: "page.border.200",
66
- orientation: "vertical",
67
- h: "1rem",
68
- thickness: "1px"
69
- }
70
- ),
71
- /* @__PURE__ */ jsxRuntime.jsx(
72
- react.Text,
73
- {
74
- as: "small",
75
- color: "page.text.initial",
76
- textStyle: "label-sm",
77
- userSelect: "none",
78
- children: "Rows per page:"
79
- }
80
- ),
81
- /* @__PURE__ */ jsxRuntime.jsx(
82
- countMenu_client.CountMenu,
83
- {
84
- onValueChange: (details) => {
85
- pagination.setPageSize(Number(details.value));
86
- }
87
- }
88
- )
89
- ] }),
90
- /* @__PURE__ */ jsxRuntime.jsxs(react.Group, { children: [
91
- /* @__PURE__ */ jsxRuntime.jsx(react.PrevTrigger, { size: "sm" }),
92
- /* @__PURE__ */ jsxRuntime.jsxs(
93
- react.Text,
94
- {
95
- as: "small",
96
- color: "page.text.200",
97
- lineHeight: "inherit",
98
- textStyle: "label-sm",
99
- userSelect: "none",
100
- children: [
101
- pagination.page,
102
- " of ",
103
- pagination.totalPages
104
- ]
105
- }
106
- ),
107
- /* @__PURE__ */ jsxRuntime.jsx(react.NextTrigger, { size: "sm" })
108
- ] })
109
- ]
110
- }
111
- ) })
112
- }
113
- ) });
11
+ const store = require_context_client.useDataGridContext();
12
+ const pageIndex = (0, _cerberus_design_signals.useRead)(store.pageIndex);
13
+ const pageSize = (0, _cerberus_design_signals.useRead)(store.pageSize);
14
+ const rowCount = (0, _cerberus_design_signals.useRead)(store.rowCount);
15
+ function handlePageChange(details) {
16
+ store.setPage(details);
17
+ }
18
+ function handlePageSizeChange(details) {
19
+ store.setPageSize(details.pageSize);
20
+ }
21
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.Show, {
22
+ when: pageSize,
23
+ children: () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.PaginationParts.Root, {
24
+ defaultPage: pageIndex ? pageIndex : 1,
25
+ count: rowCount,
26
+ onPageChange: handlePageChange,
27
+ onPageSizeChange: handlePageSizeChange,
28
+ page: pageIndex,
29
+ pageSize,
30
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.PaginationParts.Context, { children: (pagination) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
31
+ bgColor: "page.surface.100",
32
+ borderTop: "1px solid",
33
+ borderTopColor: "page.border.initial",
34
+ justify: "space-between",
35
+ px: "md",
36
+ py: "sm",
37
+ w: "full",
38
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
39
+ gap: "sm",
40
+ children: [
41
+ /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_cerberus_design_react.Text, {
42
+ as: "small",
43
+ color: "page.text.100",
44
+ textStyle: "label-sm",
45
+ userSelect: "none",
46
+ children: [
47
+ pagination.pageRange.start,
48
+ "-",
49
+ pagination.pageRange.end,
50
+ " of",
51
+ " ",
52
+ pagination.count
53
+ ]
54
+ }),
55
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(styled_system_jsx.Divider, {
56
+ color: "page.border.200",
57
+ orientation: "vertical",
58
+ h: "1rem",
59
+ thickness: "1px"
60
+ }),
61
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.Text, {
62
+ as: "small",
63
+ color: "page.text.initial",
64
+ textStyle: "label-sm",
65
+ userSelect: "none",
66
+ children: "Rows per page:"
67
+ }),
68
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_count_menu_client.CountMenu, { onValueChange: (details) => {
69
+ pagination.setPageSize(Number(details.value));
70
+ } })
71
+ ]
72
+ }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_cerberus_design_react.Group, { children: [
73
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.PrevTrigger, { size: "sm" }),
74
+ /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_cerberus_design_react.Text, {
75
+ as: "small",
76
+ color: "page.text.200",
77
+ lineHeight: "inherit",
78
+ textStyle: "label-sm",
79
+ userSelect: "none",
80
+ children: [
81
+ pagination.page,
82
+ " of ",
83
+ pagination.totalPages
84
+ ]
85
+ }),
86
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.NextTrigger, { size: "sm" })
87
+ ] })]
88
+ }) })
89
+ })
90
+ });
114
91
  }
115
-
92
+ //#endregion
116
93
  exports.GridPagination = GridPagination;
package/dist/components/pagination.client.js CHANGED
@@ -1,112 +1,93 @@
1
- 'use client';
2
- import { jsx, jsxs } from 'react/jsx-runtime';
3
- import { Show, PaginationParts, Text, Group, PrevTrigger, NextTrigger } from '@cerberus-design/react';
4
- import { HStack, Divider } from 'styled-system/jsx';
5
- import { useDataGridContext } from '../context.client.js';
6
- import { CountMenu } from './count-menu.client.js';
7
- import { useRead } from '@cerberus-design/signals';
8
-
1
+ "use client";
2
+ "use client";
3
+ import { useDataGridContext } from "../context.client.js";
4
+ import { CountMenu } from "./count-menu.client.js";
5
+ import { Group, NextTrigger, PaginationParts, PrevTrigger, Show, Text } from "@cerberus-design/react";
6
+ import { useRead } from "@cerberus-design/signals";
7
+ import { Divider, HStack } from "styled-system/jsx";
8
+ import { jsx, jsxs } from "react/jsx-runtime";
9
+ //#region src/components/pagination.client.tsx
9
10
  function GridPagination() {
10
- const store = useDataGridContext();
11
- const pageIndex = useRead(store.pageIndex);
12
- const pageSize = useRead(store.pageSize);
13
- const rowCount = useRead(store.rowCount);
14
- function handlePageChange(details) {
15
- store.setPage(details);
16
- }
17
- function handlePageSizeChange(details) {
18
- store.setPageSize(details.pageSize);
19
- }
20
- return /* @__PURE__ */ jsx(Show, { when: pageSize, children: () => /* @__PURE__ */ jsx(
21
- PaginationParts.Root,
22
- {
23
- defaultPage: pageIndex ? pageIndex : 1,
24
- count: rowCount,
25
- onPageChange: handlePageChange,
26
- onPageSizeChange: handlePageSizeChange,
27
- page: pageIndex,
28
- pageSize,
29
- children: /* @__PURE__ */ jsx(PaginationParts.Context, { children: (pagination) => /* @__PURE__ */ jsxs(
30
- HStack,
31
- {
32
- bgColor: "page.surface.100",
33
- borderTop: "1px solid",
34
- borderTopColor: "page.border.initial",
35
- justify: "space-between",
36
- px: "md",
37
- py: "sm",
38
- w: "full",
39
- children: [
40
- /* @__PURE__ */ jsxs(HStack, { gap: "sm", children: [
41
- /* @__PURE__ */ jsxs(
42
- Text,
43
- {
44
- as: "small",
45
- color: "page.text.100",
46
- textStyle: "label-sm",
47
- userSelect: "none",
48
- children: [
49
- pagination.pageRange.start,
50
- "-",
51
- pagination.pageRange.end,
52
- " of",
53
- " ",
54
- pagination.count
55
- ]
56
- }
57
- ),
58
- /* @__PURE__ */ jsx(
59
- Divider,
60
- {
61
- color: "page.border.200",
62
- orientation: "vertical",
63
- h: "1rem",
64
- thickness: "1px"
65
- }
66
- ),
67
- /* @__PURE__ */ jsx(
68
- Text,
69
- {
70
- as: "small",
71
- color: "page.text.initial",
72
- textStyle: "label-sm",
73
- userSelect: "none",
74
- children: "Rows per page:"
75
- }
76
- ),
77
- /* @__PURE__ */ jsx(
78
- CountMenu,
79
- {
80
- onValueChange: (details) => {
81
- pagination.setPageSize(Number(details.value));
82
- }
83
- }
84
- )
85
- ] }),
86
- /* @__PURE__ */ jsxs(Group, { children: [
87
- /* @__PURE__ */ jsx(PrevTrigger, { size: "sm" }),
88
- /* @__PURE__ */ jsxs(
89
- Text,
90
- {
91
- as: "small",
92
- color: "page.text.200",
93
- lineHeight: "inherit",
94
- textStyle: "label-sm",
95
- userSelect: "none",
96
- children: [
97
- pagination.page,
98
- " of ",
99
- pagination.totalPages
100
- ]
101
- }
102
- ),
103
- /* @__PURE__ */ jsx(NextTrigger, { size: "sm" })
104
- ] })
105
- ]
106
- }
107
- ) })
108
- }
109
- ) });
11
+ const store = useDataGridContext();
12
+ const pageIndex = useRead(store.pageIndex);
13
+ const pageSize = useRead(store.pageSize);
14
+ const rowCount = useRead(store.rowCount);
15
+ function handlePageChange(details) {
16
+ store.setPage(details);
17
+ }
18
+ function handlePageSizeChange(details) {
19
+ store.setPageSize(details.pageSize);
20
+ }
21
+ return /* @__PURE__ */ jsx(Show, {
22
+ when: pageSize,
23
+ children: () => /* @__PURE__ */ jsx(PaginationParts.Root, {
24
+ defaultPage: pageIndex ? pageIndex : 1,
25
+ count: rowCount,
26
+ onPageChange: handlePageChange,
27
+ onPageSizeChange: handlePageSizeChange,
28
+ page: pageIndex,
29
+ pageSize,
30
+ children: /* @__PURE__ */ jsx(PaginationParts.Context, { children: (pagination) => /* @__PURE__ */ jsxs(HStack, {
31
+ bgColor: "page.surface.100",
32
+ borderTop: "1px solid",
33
+ borderTopColor: "page.border.initial",
34
+ justify: "space-between",
35
+ px: "md",
36
+ py: "sm",
37
+ w: "full",
38
+ children: [/* @__PURE__ */ jsxs(HStack, {
39
+ gap: "sm",
40
+ children: [
41
+ /* @__PURE__ */ jsxs(Text, {
42
+ as: "small",
43
+ color: "page.text.100",
44
+ textStyle: "label-sm",
45
+ userSelect: "none",
46
+ children: [
47
+ pagination.pageRange.start,
48
+ "-",
49
+ pagination.pageRange.end,
50
+ " of",
51
+ " ",
52
+ pagination.count
53
+ ]
54
+ }),
55
+ /* @__PURE__ */ jsx(Divider, {
56
+ color: "page.border.200",
57
+ orientation: "vertical",
58
+ h: "1rem",
59
+ thickness: "1px"
60
+ }),
61
+ /* @__PURE__ */ jsx(Text, {
62
+ as: "small",
63
+ color: "page.text.initial",
64
+ textStyle: "label-sm",
65
+ userSelect: "none",
66
+ children: "Rows per page:"
67
+ }),
68
+ /* @__PURE__ */ jsx(CountMenu, { onValueChange: (details) => {
69
+ pagination.setPageSize(Number(details.value));
70
+ } })
71
+ ]
72
+ }), /* @__PURE__ */ jsxs(Group, { children: [
73
+ /* @__PURE__ */ jsx(PrevTrigger, { size: "sm" }),
74
+ /* @__PURE__ */ jsxs(Text, {
75
+ as: "small",
76
+ color: "page.text.200",
77
+ lineHeight: "inherit",
78
+ textStyle: "label-sm",
79
+ userSelect: "none",
80
+ children: [
81
+ pagination.page,
82
+ " of ",
83
+ pagination.totalPages
84
+ ]
85
+ }),
86
+ /* @__PURE__ */ jsx(NextTrigger, { size: "sm" })
87
+ ] })]
88
+ }) })
89
+ })
90
+ });
110
91
  }
111
-
92
+ //#endregion
112
93
  export { GridPagination };
package/dist/components/pinned-items.client.cjs CHANGED
@@ -1,70 +1,71 @@
1
- 'use client';
2
- 'use strict';
3
-
4
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
-
6
- const jsxRuntime = require('react/jsx-runtime');
7
- const react = require('@cerberus-design/react');
8
- const signals = require('@cerberus-design/signals');
9
- const jsx = require('styled-system/jsx');
10
-
1
+ "use client";
2
+ "use client";
3
+ let _cerberus_design_react = require("@cerberus-design/react");
4
+ let _cerberus_design_signals = require("@cerberus-design/signals");
5
+ let styled_system_jsx = require("styled-system/jsx");
6
+ let react_jsx_runtime = require("react/jsx-runtime");
7
+ //#region src/components/pinned-items.client.tsx
11
8
  function MatchPinnedItems(props) {
12
- const pinned = signals.useRead(props.pinned);
13
- const MenuItems = {
14
- right: PinRightItem,
15
- left: PinLeftItem,
16
- unpinRight: UnpinRightItem,
17
- unpinLeft: UnpinLeftItem
18
- };
19
- switch (pinned) {
20
- case "right":
21
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
22
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.unpinRight, {}),
23
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.left, {})
24
- ] });
25
- case "left":
26
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
27
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.right, {}),
28
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.unpinLeft, {})
29
- ] });
30
- default:
31
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
32
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.right, {}),
33
- /* @__PURE__ */ jsxRuntime.jsx(MenuItems.left, {})
34
- ] });
35
- }
9
+ const pinned = (0, _cerberus_design_signals.useRead)(props.pinned);
10
+ const MenuItems = {
11
+ right: PinRightItem,
12
+ left: PinLeftItem,
13
+ unpinRight: UnpinRightItem,
14
+ unpinLeft: UnpinLeftItem
15
+ };
16
+ switch (pinned) {
17
+ case "right": return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.unpinRight, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.left, {})] });
18
+ case "left": return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.right, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.unpinLeft, {})] });
19
+ default: return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.right, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuItems.left, {})] });
20
+ }
36
21
  }
37
22
  function UnpinRightItem() {
38
- const { icons } = react.useCerberusContext();
39
- const Icon = icons.pinRightFilled;
40
- return /* @__PURE__ */ jsxRuntime.jsx(react.MenuItem, { value: "unpin_right", children: /* @__PURE__ */ jsxRuntime.jsxs(jsx.HStack, { gap: "sm", w: "full", children: [
41
- /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
42
- "Unpin Right"
43
- ] }) });
23
+ const { icons } = (0, _cerberus_design_react.useCerberusContext)();
24
+ const Icon = icons.pinRightFilled;
25
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.MenuItem, {
26
+ value: "unpin_right",
27
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
28
+ gap: "sm",
29
+ w: "full",
30
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}), "Unpin Right"]
31
+ })
32
+ });
44
33
  }
45
34
  function UnpinLeftItem() {
46
- const { icons } = react.useCerberusContext();
47
- const Icon = icons.pinLeftFilled;
48
- return /* @__PURE__ */ jsxRuntime.jsx(react.MenuItem, { value: "unpin_left", children: /* @__PURE__ */ jsxRuntime.jsxs(jsx.HStack, { gap: "sm", w: "full", children: [
49
- /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
50
- "Unpin Left"
51
- ] }) });
35
+ const { icons } = (0, _cerberus_design_react.useCerberusContext)();
36
+ const Icon = icons.pinLeftFilled;
37
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.MenuItem, {
38
+ value: "unpin_left",
39
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
40
+ gap: "sm",
41
+ w: "full",
42
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}), "Unpin Left"]
43
+ })
44
+ });
52
45
  }
53
46
  function PinRightItem() {
54
- const { icons } = react.useCerberusContext();
55
- const Icon = icons.pinRight;
56
- return /* @__PURE__ */ jsxRuntime.jsx(react.MenuItem, { value: "pin_right", children: /* @__PURE__ */ jsxRuntime.jsxs(jsx.HStack, { gap: "sm", w: "full", children: [
57
- /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
58
- "Pin Right"
59
- ] }) });
47
+ const { icons } = (0, _cerberus_design_react.useCerberusContext)();
48
+ const Icon = icons.pinRight;
49
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.MenuItem, {
50
+ value: "pin_right",
51
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
52
+ gap: "sm",
53
+ w: "full",
54
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}), "Pin Right"]
55
+ })
56
+ });
60
57
  }
61
58
  function PinLeftItem() {
62
- const { icons } = react.useCerberusContext();
63
- const Icon = icons.pinLeft;
64
- return /* @__PURE__ */ jsxRuntime.jsx(react.MenuItem, { value: "pin_left", children: /* @__PURE__ */ jsxRuntime.jsxs(jsx.HStack, { gap: "sm", w: "full", children: [
65
- /* @__PURE__ */ jsxRuntime.jsx(Icon, {}),
66
- "Pin Left"
67
- ] }) });
59
+ const { icons } = (0, _cerberus_design_react.useCerberusContext)();
60
+ const Icon = icons.pinLeft;
61
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_cerberus_design_react.MenuItem, {
62
+ value: "pin_left",
63
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(styled_system_jsx.HStack, {
64
+ gap: "sm",
65
+ w: "full",
66
+ children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {}), "Pin Left"]
67
+ })
68
+ });
68
69
  }
69
-
70
+ //#endregion
70
71
  exports.MatchPinnedItems = MatchPinnedItems;