@caseparts-org/caseblocks 0.0.95 → 0.0.97

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 (8) hide show
  1. package/dist/assets/CategoryNav.css +1 -1
  2. package/dist/atoms/HorizontalScroll/HorizontalScroll.js +41 -35
  3. package/dist/atoms/HorizontalScroll/HorizontalScroll.stories.js +48 -35
  4. package/dist/atoms/Tooltip/Tooltip.stories.d.ts +1 -0
  5. package/dist/atoms/Tooltip/Tooltip.stories.js +93 -30
  6. package/dist/molecules/CategoryNav/CategoryNav.js +11 -11
  7. package/dist/molecules/CategoryNav/CategoryNav.stories.js +36 -4
  8. package/package.json +1 -1
package/dist/assets/CategoryNav.css CHANGED
@@ -1 +1 @@
1
- ._categories_13aed_1{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0;margin:0 90px 0 47px}@media (max-width: 1281px){._categories_13aed_1{display:none}}._category_13aed_17{list-style:none}._category_13aed_17 a{color:var(--text-text-primary);font-weight:var(--font-weight-semibold);text-decoration:none;display:flex;flex-direction:row;align-items:center}@media (max-width: 1281px){._category_13aed_17 a{justify-content:space-between;width:100%}}._category_13aed_17 a:hover{color:var(--color-brand-primary-primary-teal-blue);text-decoration:none}._category_13aed_17 a path{fill:var(--color-brand-primary-primary-teal-blue)}._submenuTooltip_13aed_43{list-style:none;padding:0;margin:0;height:min-content;display:flex;flex-direction:column;gap:var(--spacing-spacing-3xs)}
1
+ ._categories_1of98_1{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0;margin:0 90px 0 47px}@media (max-width: 1281px){._categories_1of98_1{display:none}}._category_1of98_17{list-style:none}._category_1of98_17 a{color:var(--text-text-primary);font-weight:var(--font-weight-semibold);text-decoration:none;display:flex;flex-direction:row;align-items:center}@media (max-width: 1281px){._category_1of98_17 a{justify-content:space-between;width:100%}}._category_1of98_17 a:hover{color:var(--color-brand-primary-primary-teal-blue);text-decoration:none}._category_1of98_17 a path{fill:var(--color-brand-primary-primary-teal-blue)}._submenuTooltip_1of98_43{list-style:none;padding:0;margin:0;height:min-content;display:flex;flex-direction:column;gap:var(--spacing-spacing-3xs);flex-wrap:wrap;max-height:400px}
package/dist/atoms/HorizontalScroll/HorizontalScroll.js CHANGED
@@ -1,49 +1,55 @@
1
- import { jsx as p } from "react/jsx-runtime";
2
- import { useRef as a, useState as v } from "react";
3
- import { c as x } from "../../clsx-OuTLNxxd.js";
4
- import '../../assets/HorizontalScroll.css';const h = "_container_aum2v_1", b = "_dragging_aum2v_14", l = {
5
- container: h,
6
- dragging: b,
1
+ import { jsx as x } from "react/jsx-runtime";
2
+ import { useRef as c, useState as D, useEffect as L } from "react";
3
+ import { c as b } from "../../clsx-OuTLNxxd.js";
4
+ import '../../assets/HorizontalScroll.css';const P = "_container_aum2v_1", S = "_dragging_aum2v_14", s = {
5
+ container: P,
6
+ dragging: S,
7
7
  "scrollVisibility--false": "_scrollVisibility--false_aum2v_19"
8
8
  };
9
- function S({
10
- className: u,
11
- showScrollbar: f = !1,
12
- children: g
9
+ function M({
10
+ className: d,
11
+ showScrollbar: g = !1,
12
+ children: p
13
13
  }) {
14
- const r = a(null), [o, c] = v(!1), e = a({ x: 0, scroll: 0 }), d = (t) => {
15
- r.current && (c(!0), e.current.x = t.clientX, e.current.scroll = r.current.scrollLeft);
16
- }, m = (t) => {
17
- if (!o || !r.current) return;
18
- const n = t.clientX - e.current.x;
19
- r.current.scrollLeft = e.current.scroll - n;
20
- }, s = () => {
21
- r.current && c(!1);
14
+ const r = c(null), [a, i] = D(!1), n = c({ x: 0, scroll: 0 }), l = c(!1), v = 5, m = (t) => {
15
+ r.current && (i(!0), n.current.x = t.clientX, n.current.scroll = r.current.scrollLeft, l.current = !1);
16
+ }, h = (t) => {
17
+ if (!a || !r.current) return;
18
+ const o = t.clientX - n.current.x;
19
+ r.current.scrollLeft = n.current.scroll - o, Math.abs(t.clientX - n.current.x) > v && (l.current = !0);
20
+ }, u = () => {
21
+ r.current && i(!1);
22
22
  }, _ = (t) => {
23
- const n = r.current;
24
- if (!n || !(n.scrollWidth > n.clientWidth)) return;
25
- const i = Math.abs(t.deltaY) >= Math.abs(t.deltaX) && t.deltaY !== 0 ? t.deltaY : t.deltaX;
26
- i !== 0 ? (t.preventDefault(), n.scrollLeft += i) : t.preventDefault();
23
+ l.current && (t.preventDefault(), t.stopPropagation(), l.current = !1);
27
24
  };
28
- return /* @__PURE__ */ p(
25
+ return L(() => {
26
+ const t = r.current;
27
+ if (!t) return;
28
+ const o = (e) => {
29
+ if (!(t.scrollWidth > t.clientWidth)) return;
30
+ const f = Math.abs(e.deltaY) >= Math.abs(e.deltaX) && e.deltaY !== 0 ? e.deltaY : e.deltaX;
31
+ f !== 0 ? (e.preventDefault(), t.scrollLeft += f) : e.preventDefault();
32
+ };
33
+ return t.addEventListener("wheel", o, { passive: !1 }), () => t.removeEventListener("wheel", o);
34
+ }, []), /* @__PURE__ */ x(
29
35
  "div",
30
36
  {
31
37
  ref: r,
32
- className: x(
33
- u,
34
- l.container,
35
- l[`scrollVisibility--${f}`],
36
- o ? l.dragging : ""
38
+ className: b(
39
+ d,
40
+ s.container,
41
+ s[`scrollVisibility--${g}`],
42
+ a ? s.dragging : ""
37
43
  ),
38
- onPointerDown: d,
39
- onPointerMove: m,
40
- onPointerLeave: s,
41
- onPointerUp: s,
42
- onWheel: _,
43
- children: g
44
+ onPointerDown: m,
45
+ onPointerMove: h,
46
+ onPointerLeave: u,
47
+ onPointerUp: u,
48
+ onClickCapture: _,
49
+ children: p
44
50
  }
45
51
  );
46
52
  }
47
53
  export {
48
- S as HorizontalScroll
54
+ M as HorizontalScroll
49
55
  };
package/dist/atoms/HorizontalScroll/HorizontalScroll.stories.js CHANGED
@@ -1,8 +1,8 @@
1
- import { jsxs as o, jsx as r } from "react/jsx-runtime";
2
- import { HorizontalScroll as t } from "./HorizontalScroll.js";
3
- const b = {
1
+ import { jsxs as t, jsx as o } from "react/jsx-runtime";
2
+ import { HorizontalScroll as r } from "./HorizontalScroll.js";
3
+ const S = {
4
4
  title: "Case Parts/Atoms/HorizontalScroll",
5
- component: t,
5
+ component: r,
6
6
  tags: ["autodocs"],
7
7
  parameters: {
8
8
  layout: "fullscreen",
@@ -60,48 +60,59 @@ Use for carousels, chip lists, card rails, horizontally overflowing panels.
60
60
  rounded: !0,
61
61
  gradient: !0
62
62
  }
63
- }, i = (e) => {
64
- const { itemCount: a, itemWidth: s, itemHeight: n, gap: d, rounded: c, gradient: h } = e;
65
- return Array.from({ length: a }, (p, m) => {
66
- const l = m + 1;
67
- return /* @__PURE__ */ r(
68
- "div",
63
+ }, l = /* @__PURE__ */ o("style", { children: `
64
+ .horizontalDemoScroll {
65
+ touch-action: none; /* ensure pointer events for horizontal drag */
66
+ }
67
+ .horizontalDemoScroll a {
68
+ -webkit-user-drag: none; /* Safari/Chrome: prevent ghost dragging of link */
69
+ }
70
+ ` }), n = (e) => {
71
+ const { itemCount: s, itemWidth: c, itemHeight: i, gap: d, rounded: h, gradient: m } = e;
72
+ return Array.from({ length: s }, (p, g) => {
73
+ const a = g + 1;
74
+ return /* @__PURE__ */ o(
75
+ "a",
69
76
  {
77
+ href: "/",
78
+ draggable: !1,
70
79
  style: {
71
80
  flex: "0 0 auto",
72
- width: s,
73
- height: n,
81
+ width: c,
82
+ height: i,
74
83
  marginRight: d,
75
- borderRadius: c ? 8 : 0,
76
- background: h ? "linear-gradient(135deg,#4F46E5,#6366F1)" : "#4F46E5",
84
+ borderRadius: h ? 8 : 0,
85
+ background: m ? "linear-gradient(135deg,#4F46E5,#6366F1)" : "#4F46E5",
77
86
  color: "#fff",
78
87
  display: "flex",
79
88
  alignItems: "center",
80
89
  justifyContent: "center",
81
- fontSize: Math.max(12, Math.min(24, n / 3)),
90
+ fontSize: Math.max(12, Math.min(24, i / 3)),
82
91
  fontWeight: 600,
83
92
  userSelect: "none",
84
93
  boxShadow: "0 2px 6px rgba(0,0,0,0.25)"
85
94
  },
86
- children: l
95
+ children: a
87
96
  },
88
- l
97
+ a
89
98
  );
90
99
  });
91
100
  }, y = {
92
101
  name: "Playground",
93
- render: (e) => /* @__PURE__ */ o("div", { style: { padding: 24 }, children: [
94
- /* @__PURE__ */ r("h3", { style: { margin: "0 0 12px" }, children: "HorizontalScroll Playground" }),
95
- /* @__PURE__ */ r("p", { style: { margin: "0 0 16px", fontSize: 14, color: "#555" }, children: "Drag horizontally or use the mouse wheel. Tweak values in Controls." }),
96
- /* @__PURE__ */ r(t, { showScrollbar: e.showScrollbar, children: i(e) })
102
+ render: (e) => /* @__PURE__ */ t("div", { style: { padding: 24 }, children: [
103
+ l,
104
+ /* @__PURE__ */ o("h3", { style: { margin: "0 0 12px" }, children: "HorizontalScroll Playground" }),
105
+ /* @__PURE__ */ o("p", { style: { margin: "0 0 16px", fontSize: 14, color: "#555" }, children: "Drag horizontally or use the mouse wheel. Tweak values in Controls." }),
106
+ /* @__PURE__ */ o(r, { className: "horizontalDemoScroll", showScrollbar: e.showScrollbar, children: n(e) })
97
107
  ] })
98
108
  }, f = {
99
109
  args: { showScrollbar: !0 },
100
- render: (e) => /* @__PURE__ */ o("div", { style: { padding: 24 }, children: [
101
- /* @__PURE__ */ r("h3", { style: { margin: "0 0 12px" }, children: "Scrollbar Visible" }),
102
- /* @__PURE__ */ r(t, { showScrollbar: !0, children: i(e) })
110
+ render: (e) => /* @__PURE__ */ t("div", { style: { padding: 24 }, children: [
111
+ l,
112
+ /* @__PURE__ */ o("h3", { style: { margin: "0 0 12px" }, children: "Scrollbar Visible" }),
113
+ /* @__PURE__ */ o(r, { className: "horizontalDemoScroll", showScrollbar: !0, children: n(e) })
103
114
  ] })
104
- }, S = {
115
+ }, w = {
105
116
  args: {
106
117
  itemCount: 40,
107
118
  itemWidth: 90,
@@ -109,11 +120,12 @@ Use for carousels, chip lists, card rails, horizontally overflowing panels.
109
120
  gap: 8,
110
121
  showScrollbar: !1
111
122
  },
112
- render: (e) => /* @__PURE__ */ o("div", { style: { padding: 24 }, children: [
113
- /* @__PURE__ */ r("h3", { style: { margin: "0 0 12px" }, children: "Dense Small Items" }),
114
- /* @__PURE__ */ r(t, { showScrollbar: e.showScrollbar, children: i(e) })
123
+ render: (e) => /* @__PURE__ */ t("div", { style: { padding: 24 }, children: [
124
+ l,
125
+ /* @__PURE__ */ o("h3", { style: { margin: "0 0 12px" }, children: "Dense Small Items" }),
126
+ /* @__PURE__ */ o(r, { className: "horizontalDemoScroll", showScrollbar: e.showScrollbar, children: n(e) })
115
127
  ] })
116
- }, w = {
128
+ }, x = {
117
129
  args: {
118
130
  itemCount: 12,
119
131
  itemWidth: 260,
@@ -121,15 +133,16 @@ Use for carousels, chip lists, card rails, horizontally overflowing panels.
121
133
  gap: 16,
122
134
  gradient: !1
123
135
  },
124
- render: (e) => /* @__PURE__ */ o("div", { style: { padding: 24 }, children: [
125
- /* @__PURE__ */ r("h3", { style: { margin: "0 0 12px" }, children: "Large Cards" }),
126
- /* @__PURE__ */ r(t, { showScrollbar: e.showScrollbar, children: i(e) })
136
+ render: (e) => /* @__PURE__ */ t("div", { style: { padding: 24 }, children: [
137
+ l,
138
+ /* @__PURE__ */ o("h3", { style: { margin: "0 0 12px" }, children: "Large Cards" }),
139
+ /* @__PURE__ */ o(r, { className: "horizontalDemoScroll", showScrollbar: e.showScrollbar, children: n(e) })
127
140
  ] })
128
141
  };
129
142
  export {
130
- S as DenseSmallItems,
131
- w as LargeCards,
143
+ w as DenseSmallItems,
144
+ x as LargeCards,
132
145
  y as Playground,
133
146
  f as WithScrollbar,
134
- b as default
147
+ S as default
135
148
  };
package/dist/atoms/Tooltip/Tooltip.stories.d.ts CHANGED
@@ -62,3 +62,4 @@ export declare const BottomHover: Story;
62
62
  export declare const PositionRight: Story;
63
63
  export declare const PositionLeft: Story;
64
64
  export declare const AbsolutelyPositioned: Story;
65
+ export declare const LargeContent: Story;
package/dist/atoms/Tooltip/Tooltip.stories.js CHANGED
@@ -1,9 +1,9 @@
1
- import { jsxs as o, jsx as t } from "react/jsx-runtime";
2
- import { Tooltip as e } from "./Tooltip.js";
1
+ import { jsxs as e, jsx as t } from "react/jsx-runtime";
2
+ import { Tooltip as o } from "./Tooltip.js";
3
3
  import { Button as i } from "../Button/Button.js";
4
- const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family:'Roboto',sans-serif;}" }), c = {
4
+ const l = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family:'Roboto',sans-serif;}" }), p = {
5
5
  title: "Case Parts/Atoms/Tooltip",
6
- component: e,
6
+ component: o,
7
7
  parameters: {
8
8
  layout: "centered",
9
9
  controls: { sort: "requiredFirst" },
@@ -60,13 +60,13 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
60
60
  description: "Tooltip content."
61
61
  }
62
62
  }
63
- }, d = {
63
+ }, c = {
64
64
  args: {
65
65
  position: "top center",
66
66
  openDelay: 0,
67
67
  closeDelay: 0
68
68
  },
69
- render: (n) => /* @__PURE__ */ o(
69
+ render: (n) => /* @__PURE__ */ e(
70
70
  "div",
71
71
  {
72
72
  style: {
@@ -78,9 +78,9 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
78
78
  justifyContent: "center"
79
79
  },
80
80
  children: [
81
- /* @__PURE__ */ t(r, {}),
81
+ /* @__PURE__ */ t(l, {}),
82
82
  /* @__PURE__ */ t(
83
- e,
83
+ o,
84
84
  {
85
85
  ...n,
86
86
  contentClassName: "storyRoboto",
@@ -91,8 +91,8 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
91
91
  ]
92
92
  }
93
93
  )
94
- }, p = {
95
- render: () => /* @__PURE__ */ o(
94
+ }, d = {
95
+ render: () => /* @__PURE__ */ e(
96
96
  "div",
97
97
  {
98
98
  style: {
@@ -104,9 +104,9 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
104
104
  justifyContent: "center"
105
105
  },
106
106
  children: [
107
- /* @__PURE__ */ t(r, {}),
107
+ /* @__PURE__ */ t(l, {}),
108
108
  /* @__PURE__ */ t(
109
- e,
109
+ o,
110
110
  {
111
111
  contentClassName: "storyRoboto",
112
112
  trigger: /* @__PURE__ */ t("div", { className: "tooltip-story", children: /* @__PURE__ */ t(i, { size: "md", variant: "secondary", children: "Hover me" }) }),
@@ -119,8 +119,8 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
119
119
  ]
120
120
  }
121
121
  )
122
- }, h = {
123
- render: () => /* @__PURE__ */ o(
122
+ }, a = {
123
+ render: () => /* @__PURE__ */ e(
124
124
  "div",
125
125
  {
126
126
  style: {
@@ -132,9 +132,9 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
132
132
  justifyContent: "center"
133
133
  },
134
134
  children: [
135
- /* @__PURE__ */ t(r, {}),
135
+ /* @__PURE__ */ t(l, {}),
136
136
  /* @__PURE__ */ t(
137
- e,
137
+ o,
138
138
  {
139
139
  contentClassName: "storyRoboto",
140
140
  trigger: /* @__PURE__ */ t("div", { className: "tooltip-story", children: /* @__PURE__ */ t(i, { size: "md", variant: "cta-primary", children: "Hover right" }) }),
@@ -145,8 +145,8 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
145
145
  ]
146
146
  }
147
147
  )
148
- }, m = {
149
- render: () => /* @__PURE__ */ o(
148
+ }, f = {
149
+ render: () => /* @__PURE__ */ e(
150
150
  "div",
151
151
  {
152
152
  style: {
@@ -158,9 +158,9 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
158
158
  justifyContent: "center"
159
159
  },
160
160
  children: [
161
- /* @__PURE__ */ t(r, {}),
161
+ /* @__PURE__ */ t(l, {}),
162
162
  /* @__PURE__ */ t(
163
- e,
163
+ o,
164
164
  {
165
165
  contentClassName: "storyRoboto",
166
166
  trigger: /* @__PURE__ */ t("div", { className: "tooltip-story", children: /* @__PURE__ */ t(i, { size: "md", variant: "tertiary", children: "Hover left" }) }),
@@ -171,8 +171,8 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
171
171
  ]
172
172
  }
173
173
  )
174
- }, g = {
175
- render: () => /* @__PURE__ */ o(
174
+ }, m = {
175
+ render: () => /* @__PURE__ */ e(
176
176
  "div",
177
177
  {
178
178
  style: {
@@ -185,9 +185,9 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
185
185
  right: "300px"
186
186
  },
187
187
  children: [
188
- /* @__PURE__ */ t(r, {}),
188
+ /* @__PURE__ */ t(l, {}),
189
189
  /* @__PURE__ */ t(
190
- e,
190
+ o,
191
191
  {
192
192
  contentClassName: "storyRoboto",
193
193
  trigger: /* @__PURE__ */ t("div", { className: "tooltip-story", children: /* @__PURE__ */ t(i, { size: "md", variant: "cta-primary", children: "Hover right" }) }),
@@ -198,12 +198,75 @@ const r = () => /* @__PURE__ */ t("style", { children: ".storyRoboto{font-family
198
198
  ]
199
199
  }
200
200
  )
201
+ }, g = {
202
+ render: () => /* @__PURE__ */ e(
203
+ "div",
204
+ {
205
+ style: {
206
+ height: "100vh",
207
+ width: "100%",
208
+ display: "flex",
209
+ flexDirection: "row",
210
+ alignItems: "center",
211
+ justifyContent: "center"
212
+ },
213
+ children: [
214
+ /* @__PURE__ */ t(l, {}),
215
+ /* @__PURE__ */ t(
216
+ o,
217
+ {
218
+ contentClassName: "storyRoboto",
219
+ trigger: /* @__PURE__ */ t("div", { className: "tooltip-story", children: /* @__PURE__ */ t(i, { size: "md", variant: "tertiary", children: "Hover left" }) }),
220
+ position: "left center",
221
+ children: /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", flexWrap: "wrap", gap: 4, maxHeight: 400 }, children: [
222
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
223
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
224
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
225
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
226
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
227
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
228
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
229
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
230
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
231
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
232
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
233
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
234
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
235
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
236
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
237
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
238
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
239
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
240
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
241
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
242
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
243
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
244
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
245
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
246
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
247
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
248
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
249
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
250
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
251
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
252
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
253
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
254
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
255
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." }),
256
+ /* @__PURE__ */ t("p", { children: "Tooltip on the left." })
257
+ ] })
258
+ }
259
+ )
260
+ ]
261
+ }
262
+ )
201
263
  };
202
264
  export {
203
- g as AbsolutelyPositioned,
204
- p as BottomHover,
205
- d as OnHover,
206
- m as PositionLeft,
207
- h as PositionRight,
208
- c as default
265
+ m as AbsolutelyPositioned,
266
+ d as BottomHover,
267
+ g as LargeContent,
268
+ c as OnHover,
269
+ f as PositionLeft,
270
+ a as PositionRight,
271
+ p as default
209
272
  };
package/dist/molecules/CategoryNav/CategoryNav.js CHANGED
@@ -3,21 +3,21 @@ import { c as a } from "../../clsx-OuTLNxxd.js";
3
3
  import { Text as n } from "../../atoms/Text/Text.js";
4
4
  import { Link as s } from "../../atoms/Link/Link.js";
5
5
  import { Icon as m } from "../../atoms/Icon/Icon.js";
6
- import { getHideAtStyles as d } from "../../atoms/HideAt.js";
7
- import { Tooltip as c } from "../../atoms/Tooltip/Tooltip.js";
8
- import '../../assets/CategoryNav.css';const h = "_categories_13aed_1", u = "_category_13aed_17", p = "_submenuTooltip_13aed_43", l = {
6
+ import { getHideAtStyles as c } from "../../atoms/HideAt.js";
7
+ import { Tooltip as d } from "../../atoms/Tooltip/Tooltip.js";
8
+ import '../../assets/CategoryNav.css';const h = "_categories_1of98_1", f = "_category_1of98_17", u = "_submenuTooltip_1of98_43", o = {
9
9
  categories: h,
10
- category: u,
11
- submenuTooltip: p
10
+ category: f,
11
+ submenuTooltip: u
12
12
  };
13
13
  function z({
14
- categories: o
14
+ categories: l
15
15
  }) {
16
- return !o || o.length === 0 ? null : /* @__PURE__ */ e("ul", { className: a(l.categories, d(["sm"])), children: o.map(
16
+ return !l || l.length === 0 ? null : /* @__PURE__ */ e("ul", { className: a(o.categories, c(["sm"])), children: l.map(
17
17
  (i) => i.children.length > 0 ? /* @__PURE__ */ e(
18
- c,
18
+ d,
19
19
  {
20
- trigger: /* @__PURE__ */ e("li", { className: l.category, tabIndex: 0, children: /* @__PURE__ */ t(s, { href: i.route, children: [
20
+ trigger: /* @__PURE__ */ e("li", { className: o.category, tabIndex: 0, children: /* @__PURE__ */ t(s, { href: i.route, children: [
21
21
  /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: i.label }),
22
22
  i.showChevron && /* @__PURE__ */ e(
23
23
  m,
@@ -29,10 +29,10 @@ function z({
29
29
  )
30
30
  ] }) }),
31
31
  position: "bottom center",
32
- children: /* @__PURE__ */ e("ul", { className: l.submenuTooltip, children: i.children.map((r) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(s, { href: r.route, children: /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: r.label }) }) }, r.id)) })
32
+ children: /* @__PURE__ */ e("ul", { className: o.submenuTooltip, children: i.children.map((r) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(s, { href: r.route, children: /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: r.label }) }) }, r.id)) })
33
33
  },
34
34
  i.id
35
- ) : /* @__PURE__ */ e("li", { className: l.category, children: /* @__PURE__ */ t(s, { href: i.route, children: [
35
+ ) : /* @__PURE__ */ e("li", { className: o.category, children: /* @__PURE__ */ t(s, { href: i.route, children: [
36
36
  /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: i.label }),
37
37
  i.showChevron && /* @__PURE__ */ e(
38
38
  m,
package/dist/molecules/CategoryNav/CategoryNav.stories.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { CategoryNav as e } from "./CategoryNav.js";
2
- const t = {
2
+ const i = {
3
3
  title: "Case Parts/Molecules/CategoryNav",
4
4
  component: e,
5
5
  parameters: {
@@ -14,6 +14,38 @@ const t = {
14
14
  { id: 20, label: "Anthony", route: "/anthony" },
15
15
  { id: 21, label: "Beverage Air", route: "/beverage" },
16
16
  { id: 22, label: "Continental", route: "/continental" },
17
+ { id: 23, label: "Delfield", route: "/delfield" },
18
+ { id: 23, label: "Delfield", route: "/delfield" },
19
+ { id: 23, label: "Delfield", route: "/delfield" },
20
+ { id: 23, label: "Delfield", route: "/delfield" },
21
+ { id: 23, label: "Delfield", route: "/delfield" },
22
+ { id: 23, label: "Delfield", route: "/delfield" },
23
+ { id: 23, label: "Delfield", route: "/delfield" },
24
+ { id: 23, label: "Delfield", route: "/delfield" },
25
+ { id: 23, label: "Delfield", route: "/delfield" },
26
+ { id: 23, label: "Delfield", route: "/delfield" },
27
+ { id: 23, label: "Delfield", route: "/delfield" },
28
+ { id: 23, label: "Delfield", route: "/delfield" },
29
+ { id: 23, label: "Delfield", route: "/delfield" },
30
+ { id: 23, label: "Delfield", route: "/delfield" },
31
+ { id: 23, label: "Delfield", route: "/delfield" },
32
+ { id: 23, label: "Delfield", route: "/delfield" },
33
+ { id: 23, label: "Delfield", route: "/delfield" },
34
+ { id: 23, label: "Delfield", route: "/delfield" },
35
+ { id: 23, label: "Delfield", route: "/delfield" },
36
+ { id: 23, label: "Delfield", route: "/delfield" },
37
+ { id: 23, label: "Delfield", route: "/delfield" },
38
+ { id: 23, label: "Delfield", route: "/delfield" },
39
+ { id: 23, label: "Delfield", route: "/delfield" },
40
+ { id: 23, label: "Delfield", route: "/delfield" },
41
+ { id: 23, label: "Delfield", route: "/delfield" },
42
+ { id: 23, label: "Delfield", route: "/delfield" },
43
+ { id: 23, label: "Delfield", route: "/delfield" },
44
+ { id: 23, label: "Delfield", route: "/delfield" },
45
+ { id: 23, label: "Delfield", route: "/delfield" },
46
+ { id: 23, label: "Delfield", route: "/delfield" },
47
+ { id: 23, label: "Delfield", route: "/delfield" },
48
+ { id: 23, label: "Delfield", route: "/delfield" },
17
49
  { id: 23, label: "Delfield", route: "/delfield" }
18
50
  ],
19
51
  showChevron: !0
@@ -78,12 +110,12 @@ const t = {
78
110
  route: "#",
79
111
  children: []
80
112
  }
81
- ], a = {
113
+ ], r = {
82
114
  args: {
83
115
  categories: l
84
116
  }
85
117
  };
86
118
  export {
87
- a as Default,
88
- t as default
119
+ r as Default,
120
+ i as default
89
121
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@caseparts-org/caseblocks",
3
3
  "private": false,
4
- "version": "0.0.95",
4
+ "version": "0.0.97",
5
5
  "type": "module",
6
6
  "module": "dist/main.js",
7
7
  "types": "dist/main.d.ts",