@phillips/seldon 1.180.0 → 1.182.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.
Files changed (67) hide show
  1. package/dist/components/AddToCalendar/AddToCalendar.js +1 -1
  2. package/dist/components/Article/Article.js +2 -2
  3. package/dist/components/ComboBox/ComboBox.js +115 -116
  4. package/dist/components/ComposedModal/ComposedModal.js +2 -2
  5. package/dist/components/ExitGateCard/ExitGateCard.js +2 -2
  6. package/dist/components/FavoritingTileButton/FavoritingTileButton.js +15 -15
  7. package/dist/components/Filter/FilterHeader.js +1 -1
  8. package/dist/components/Link/types.d.ts +1 -2
  9. package/dist/components/Link/types.js +1 -1
  10. package/dist/components/Text/Text.js +1 -1
  11. package/dist/components/Text/types.d.ts +0 -17
  12. package/dist/components/Text/types.js +3 -3
  13. package/dist/components/Text/utils.js +6 -6
  14. package/dist/index.d.ts +2 -0
  15. package/dist/index.js +104 -102
  16. package/dist/patterns/AccountPageHeader/AccountPageHeader.js +21 -21
  17. package/dist/patterns/BidSnapshot/BidMessage.js +6 -6
  18. package/dist/patterns/FavoritesCollectionTile/FavoritesCollectionTile.js +1 -1
  19. package/dist/patterns/FiltersInline/FilterButton.js +8 -8
  20. package/dist/patterns/FiltersInline/FilterDropdownMenuDesktop.js +41 -41
  21. package/dist/patterns/FiltersInline/FilterDropdownMenuMobile.js +38 -38
  22. package/dist/patterns/HeroBanner/HeroBanner.d.ts +1 -1
  23. package/dist/patterns/SaleCard/SaleCard.js +25 -25
  24. package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.js +45 -45
  25. package/dist/patterns/SaleHeaderBanner/SaleHeaderBrowseAuctions.js +7 -7
  26. package/dist/patterns/TextBanner/TextBanner.d.ts +26 -0
  27. package/dist/patterns/TextBanner/TextBanner.js +19 -0
  28. package/dist/patterns/TextBanner/TextBanner.stories.d.ts +25 -0
  29. package/dist/patterns/TextBanner/TextBanner.test.d.ts +1 -0
  30. package/dist/patterns/TextBanner/index.d.ts +1 -0
  31. package/dist/patterns/UserManagement/UserManagement.js +10 -10
  32. package/dist/patterns/ViewingDetails/ViewingDetails.js +12 -12
  33. package/dist/scss/_type.scss +63 -142
  34. package/dist/scss/_vars.scss +45 -74
  35. package/dist/scss/_vars.scss.js +47 -76
  36. package/dist/scss/componentStyles.scss +1 -0
  37. package/dist/scss/components/Accordion/_accordion.scss +4 -4
  38. package/dist/scss/components/AddToCalendar/_addToCalendar.scss +2 -2
  39. package/dist/scss/components/Article/_article.scss +0 -5
  40. package/dist/scss/components/Breadcrumb/_breadcrumb.scss +1 -1
  41. package/dist/scss/components/Button/_button.scss +1 -1
  42. package/dist/scss/components/ComboBox/_combobox.scss +4 -4
  43. package/dist/scss/components/Countdown/_countdown.scss +2 -2
  44. package/dist/scss/components/Countdown/_duration.scss +1 -1
  45. package/dist/scss/components/Detail/_detail.scss +1 -1
  46. package/dist/scss/components/Drawer/_drawerHeader.scss +2 -2
  47. package/dist/scss/components/Dropdown/_dropdown.scss +2 -2
  48. package/dist/scss/components/Filter/_filter.scss +3 -3
  49. package/dist/scss/components/Icon/_icon.stories.scss +1 -1
  50. package/dist/scss/components/Input/_input.scss +3 -3
  51. package/dist/scss/components/Link/_link.scss +4 -4
  52. package/dist/scss/components/Navigation/_navigation.scss +4 -1
  53. package/dist/scss/components/Pagination/_pagination.scss +1 -1
  54. package/dist/scss/components/Search/_search.scss +5 -10
  55. package/dist/scss/components/Tabs/_tabs.scss +1 -1
  56. package/dist/scss/components/Tags/_tags.scss +1 -1
  57. package/dist/scss/components/TextArea/_textArea.scss +2 -2
  58. package/dist/scss/components/TextSymbol/_textSymbol.scss +2 -2
  59. package/dist/scss/patterns/HeroBanner/_heroBanner.scss +20 -14
  60. package/dist/scss/patterns/SaleHeaderBanner/_saleHeaderBanner.scss +1 -1
  61. package/dist/scss/patterns/Social/_social.scss +1 -1
  62. package/dist/scss/patterns/Subscribe/_subscribe.scss +3 -3
  63. package/dist/scss/patterns/TextBanner/_textBanner.scss +35 -0
  64. package/dist/scss/site-furniture/Footer/_footer.scss +2 -2
  65. package/dist/scss/site-furniture/Header/_header.scss +5 -1
  66. package/dist/site-furniture/Footer/Footer.js +1 -1
  67. package/package.json +1 -1
@@ -37,7 +37,7 @@ const G = C(
37
37
  {
38
38
  className: `${l}-atcb-item`,
39
39
  onSelect: () => k(a.action, a.link),
40
- children: a.action === "link" ? /* @__PURE__ */ e(d, { className: `${l}-atcb-item-link`, href: a.link, children: a.label }) : /* @__PURE__ */ e("button", { className: `${l}-atcb-item-link`, children: /* @__PURE__ */ e(O, { variant: N.bodyMd, children: a.label }) })
40
+ children: a.action === "link" ? /* @__PURE__ */ e(d, { className: `${l}-atcb-item-link`, href: a.link, children: a.label }) : /* @__PURE__ */ e("button", { className: `${l}-atcb-item-link`, children: /* @__PURE__ */ e(O, { variant: N.body2, children: a.label }) })
41
41
  },
42
42
  a.label
43
43
  ))
@@ -14,8 +14,8 @@ const b = u(
14
14
  a ? /* @__PURE__ */ l($, { aspectRatio: "16/9", src: a, alt: "bull" }) : null,
15
15
  /* @__PURE__ */ c("div", { className: `${t}__content`, children: [
16
16
  n ? /* @__PURE__ */ l(r, { variant: e.label, className: `${t}__content-label`, children: n }) : null,
17
- o ? /* @__PURE__ */ l(r, { variant: e.heading2, className: `${t}__content-title`, children: o }) : null,
18
- m ? /* @__PURE__ */ l(r, { variant: e.bodyMd, className: `${t}__content-description`, children: m }) : null,
17
+ o ? /* @__PURE__ */ l(r, { variant: e.heading3, className: `${t}__content-title`, children: o }) : null,
18
+ m ? /* @__PURE__ */ l(r, { variant: e.body2, className: `${t}__content-description`, children: m }) : null,
19
19
  s ? /* @__PURE__ */ l(f, { href: p, className: `${t}__content-link`, children: s }) : null
20
20
  ] })
21
21
  ] });
@@ -1,8 +1,8 @@
1
- import { jsxs as x, jsx as i } from "react/jsx-runtime";
2
- import { Root as ht, Trigger as _t, Portal as vt, Content as $t } from "../../node_modules/@radix-ui/react-popover/dist/index.js";
1
+ import { jsxs as T, jsx as i } from "react/jsx-runtime";
2
+ import { Root as ht, Trigger as _t, Portal as vt, Content as Ct } from "../../node_modules/@radix-ui/react-popover/dist/index.js";
3
3
  import d from "../../node_modules/classnames/index.js";
4
- import { Command as yt, CommandInput as Ct, CommandList as bt, CommandGroup as wt, CommandItem as gt } from "../../node_modules/cmdk/dist/index.js";
5
- import Nt, { useState as S, useCallback as g, useRef as O, useMemo as V } from "react";
4
+ import { Command as bt, CommandInput as yt, CommandList as $t, CommandGroup as wt, CommandItem as gt } from "../../node_modules/cmdk/dist/index.js";
5
+ import Nt, { useState as B, useCallback as g, useRef as k, useMemo as x } from "react";
6
6
  import { useOnClickOutside as It } from "../../node_modules/usehooks-ts/dist/index.js";
7
7
  import "../../assets/formatted/AccountActive.js";
8
8
  import "../../assets/formatted/Account.js";
@@ -83,218 +83,217 @@ import "../../assets/formatted/VolumeMaximum.js";
83
83
  import "../../assets/formatted/VolumeMid.js";
84
84
  import "../../assets/formatted/VolumeMinimum.js";
85
85
  import "../../assets/formatted/WeChat.js";
86
- import { getCommonProps as xt, useNormalizedInputProps as Ot } from "../../utils/index.js";
87
- import H from "../IconButton/IconButton.js";
88
- import { ButtonVariants as J } from "../Button/types.js";
89
- import { usePrevious as Vt } from "../../utils/usePrevious.js";
86
+ import { getCommonProps as xt, useNormalizedInputProps as Lt } from "../../utils/index.js";
87
+ import U from "../IconButton/IconButton.js";
88
+ import { ButtonVariants as W } from "../Button/types.js";
89
+ import { usePrevious as Ot } from "../../utils/usePrevious.js";
90
90
  const Dt = Nt.forwardRef(function({
91
- options: a = [],
92
- className: Q,
93
- id: l,
94
- labelText: Y,
95
- placeholder: Z,
96
- name: D,
91
+ options: n = [],
92
+ className: X,
93
+ id: s,
94
+ labelText: H,
95
+ placeholder: J,
96
+ name: L,
97
97
  value: p,
98
98
  onChange: u,
99
- onBlur: tt,
100
- renderOption: j,
101
- ariaLabelDropdown: N,
102
- ariaLabelInput: q,
103
- ariaLabelClear: I,
104
- ariaLabelContent: z,
99
+ onBlur: Q,
100
+ renderOption: S,
101
+ ariaLabelDropdown: O,
102
+ ariaLabelInput: Y,
103
+ ariaLabelClear: Z,
104
+ ariaLabelContent: tt,
105
105
  hideLabel: et = !1,
106
106
  popoverContainerRef: rt,
107
107
  noOptionsMessage: ot = "No Options.",
108
- invalid: T = !1,
108
+ invalid: N = !1,
109
109
  invalidText: it,
110
- countOfCharsBeforeDropdown: G = 0,
111
- ...lt
112
- }, M) {
113
- const { className: e, ...st } = xt({ id: l }, "ComboBox"), nt = Tt, at = kt, K = Ot({
114
- id: l,
115
- invalid: T,
110
+ countOfCharsBeforeDropdown: j = 0,
111
+ ...at
112
+ }, D) {
113
+ const { className: e, ...lt } = xt({ id: s }, "ComboBox"), st = Tt, nt = kt, q = Lt({
114
+ id: s,
115
+ invalid: N,
116
116
  invalidText: it,
117
117
  type: "text"
118
- }), [f, U] = S(!1), [mt, ct] = S(""), W = Vt(p), R = g((t) => t.label || t.value, []), [o, $] = S(() => {
118
+ }), [f, z] = B(!1), [mt, ct] = B(""), G = Ot(p), V = g((t) => t.label || t.value, []), [o, C] = B(() => {
119
119
  if (p !== void 0) {
120
- const t = a.find((r) => r.value === p);
121
- return t ? t.displayValue || R(t) : "";
120
+ const t = n.find((r) => r.value === p);
121
+ return t ? t.displayValue || V(t) : "";
122
122
  }
123
123
  return "";
124
- }), y = O(null), C = O(null), b = O(!1), E = O(null), m = g((t) => R(t), [R]), h = p !== void 0, F = h ? p : mt, s = V(() => a.find((t) => t.value === F) || null, [a, F]), _ = V(() => s ? s.displayValue || m(s) : "", [s, m]), c = V(() => {
125
- if (!o || s && o === _)
126
- return a;
124
+ }), b = k(null), y = k(null), $ = k(!1), M = k(null), m = g((t) => V(t), [V]), h = p !== void 0, R = h ? p : mt, a = x(() => n.find((t) => t.value === R) || null, [n, R]), _ = x(() => a ? a.displayValue || m(a) : "", [a, m]), c = x(() => {
125
+ if (!o || a && o === _)
126
+ return n;
127
127
  const t = o.toLowerCase().trim();
128
- return a.filter((r) => {
129
- const w = m(r).toLowerCase().includes(t), A = r.value.toLowerCase().includes(t), B = r.displayValue?.toLowerCase().includes(t) || !1;
128
+ return n.filter((r) => {
129
+ const w = m(r).toLowerCase().includes(t), P = r.value.toLowerCase().includes(t), A = r.displayValue?.toLowerCase().includes(t) || !1;
130
130
  let v = !1;
131
- return r.filterTerms && r.filterTerms.length > 0 && (v = r.filterTerms.some((dt) => dt.toLowerCase().includes(t))), w || A || B || v;
131
+ return r.filterTerms && r.filterTerms.length > 0 && (v = r.filterTerms.some((dt) => dt.toLowerCase().includes(t))), w || P || A || v;
132
132
  });
133
- }, [o, _, s, m, a]), n = g(
133
+ }, [o, _, a, m, n]), l = g(
134
134
  (t, r) => {
135
- const w = (r?.length || o.length) >= G;
136
- (!t || t && w) && U(t), t && s && c.length > 5 && requestAnimationFrame(() => {
137
- E.current && E.current.scrollIntoView({
135
+ const w = (r?.length || o.length) >= j;
136
+ (!t || t && w) && z(t), t && a && c.length > 5 && requestAnimationFrame(() => {
137
+ M.current && M.current.scrollIntoView({
138
138
  block: "nearest",
139
139
  behavior: "auto"
140
140
  });
141
141
  });
142
142
  },
143
- [G, o.length, s, c.length]
144
- ), k = g(
143
+ [j, o.length, a, c.length]
144
+ ), I = g(
145
145
  (t) => {
146
146
  h || ct(t.value);
147
147
  const r = t.displayValue || m(t);
148
- $(r), u && u(t.value, t), n(!1), b.current = !0, requestAnimationFrame(() => {
149
- b.current = !1;
148
+ C(r), u && u(t.value, t), l(!1), $.current = !0, requestAnimationFrame(() => {
149
+ $.current = !1;
150
150
  });
151
151
  },
152
- [h, u, n, m]
152
+ [h, u, l, m]
153
153
  ), pt = (t) => {
154
- n(!1), b.current = !0, t.preventDefault(), t.stopPropagation(), u && h && u("", null), $(""), C.current?.focus(), requestAnimationFrame(() => {
155
- b.current = !1;
154
+ l(!1), $.current = !0, t.preventDefault(), t.stopPropagation(), u && h && u("", null), C(""), y.current?.focus(), requestAnimationFrame(() => {
155
+ $.current = !1;
156
156
  });
157
157
  }, ut = () => {
158
- U(!f), C.current?.focus();
158
+ z(!f), y.current?.focus();
159
159
  }, ft = (t) => {
160
- $(t), t !== "" && c.length > 0 && n(!0, t);
161
- }, X = V(() => {
160
+ C(t), t !== "" && c.length > 0 && l(!0, t);
161
+ }, K = x(() => {
162
162
  if (h) {
163
- if (p !== W)
164
- return s ? _ : o;
165
- if (s) {
163
+ if (p !== G)
164
+ return a ? _ : o;
165
+ if (a) {
166
166
  const t = _;
167
167
  return t !== o ? o : t;
168
168
  } else
169
169
  return o;
170
170
  }
171
171
  return o;
172
- }, [h, o, p, W, s, _]), P = (t) => {
173
- if (s) {
172
+ }, [h, o, p, G, a, _]), E = (t) => {
173
+ if (a) {
174
174
  const r = _;
175
- r !== X && !t && $(r);
175
+ r !== K && !t && C(r);
176
176
  } else
177
- $("");
178
- }, L = g(() => {
179
- const t = a.filter((r) => {
180
- const w = m(r).toLowerCase(), A = r.value.toLowerCase(), B = r.displayValue?.toLowerCase(), v = o.toLowerCase();
181
- return w === v || A === v || B === v;
177
+ C("");
178
+ }, F = g(() => {
179
+ const t = n.filter((r) => {
180
+ const w = m(r).toLowerCase(), P = r.value.toLowerCase(), A = r.displayValue?.toLowerCase(), v = o.toLowerCase();
181
+ return w === v || P === v || A === v;
182
182
  });
183
- t.length === 1 && k(t[0]);
184
- }, [o, a, k, m]);
185
- return It(y, (t) => {
186
- t.target.closest(`.${e}__item`) || t.target.closest(`.${e}__content`) || y.current?.contains(t.target) || t.target === y.current || (L(), P(), n(!1));
187
- }), /* @__PURE__ */ x("div", { ref: M, className: d(e, Q), id: l, ...st, ...lt, children: [
188
- D && /* @__PURE__ */ i(
183
+ t.length === 1 && I(t[0]);
184
+ }, [o, n, I, m]);
185
+ return It(b, (t) => {
186
+ t.target.closest(`.${e}__item`) || t.target.closest(`.${e}__content`) || b.current?.contains(t.target) || t.target === b.current || (F(), E(), l(!1));
187
+ }), /* @__PURE__ */ T("div", { ref: D, className: d(e, X), id: s, ...lt, ...at, children: [
188
+ L && /* @__PURE__ */ i(
189
189
  "input",
190
190
  {
191
191
  type: "hidden",
192
- name: D,
193
- id: D,
194
- value: F || "",
192
+ name: L,
193
+ id: L,
194
+ value: R || "",
195
195
  ref: (t) => {
196
- typeof M == "function" && t && M(t);
196
+ typeof D == "function" && t && D(t);
197
197
  }
198
198
  }
199
199
  ),
200
- /* @__PURE__ */ x("div", { ref: y, className: `${e}__wrapper`, children: [
200
+ /* @__PURE__ */ T("div", { ref: b, className: `${e}__wrapper`, children: [
201
201
  /* @__PURE__ */ i(
202
202
  "label",
203
203
  {
204
- htmlFor: `${l}-input`,
204
+ htmlFor: `${s}-input`,
205
205
  className: d(`${e}__label`, {
206
206
  [`${e}__label--hidden`]: et,
207
- [`${e}__label--invalid`]: T
207
+ [`${e}__label--invalid`]: N
208
208
  }),
209
- "data-testid": `${l}-label`,
210
- children: Y
209
+ "data-testid": `${s}-label`,
210
+ children: H
211
211
  }
212
212
  ),
213
213
  /* @__PURE__ */ i(
214
- yt,
214
+ bt,
215
215
  {
216
216
  loop: !0,
217
217
  onKeyDown: (t) => {
218
218
  setTimeout(() => {
219
- t.key === "Escape" && n(!1);
219
+ t.key === "Escape" && l(!1);
220
220
  }, 0);
221
221
  },
222
222
  shouldFilter: !1,
223
223
  className: `${e}__command-wrapper`,
224
- children: /* @__PURE__ */ x(ht, { open: f, modal: !1, children: [
225
- /* @__PURE__ */ i(_t, { asChild: !0, children: /* @__PURE__ */ x(
224
+ children: /* @__PURE__ */ T(ht, { open: f, modal: !1, children: [
225
+ /* @__PURE__ */ i(_t, { asChild: !0, children: /* @__PURE__ */ T(
226
226
  "div",
227
227
  {
228
228
  className: d(`${e}__input-wrapper`, {
229
- [`${e}__input-wrapper--invalid`]: T
229
+ [`${e}__input-wrapper--invalid`]: N
230
230
  }),
231
231
  children: [
232
232
  /* @__PURE__ */ i(
233
- Ct,
233
+ yt,
234
234
  {
235
- id: `${l}-input`,
236
- placeholder: Z,
237
- value: X,
235
+ id: `${s}-input`,
236
+ placeholder: J,
237
+ value: K,
238
238
  onValueChange: ft,
239
239
  tabIndex: 0,
240
240
  onFocus: () => {
241
- c.length > 0 && !b.current && !f && n(!0);
241
+ c.length > 0 && !$.current && !f && l(!0);
242
242
  },
243
243
  onClick: (t) => {
244
- n(!0), t.preventDefault(), t.currentTarget.focus();
244
+ l(!0), t.preventDefault(), t.currentTarget.focus();
245
245
  },
246
246
  onKeyDown: (t) => {
247
- t.key === "Tab" ? (n(!1), L(), P()) : t.key === "Enter" && !f ? (u && u(o, null), c.length === 1 && k(c[0])) : t.key === "Escape" ? (n(!1), t.preventDefault(), L(), P()) : (t.key === "ArrowDown" || t.key === "ArrowUp") && !f && c.length > 0 && (n(!0), t.preventDefault());
247
+ t.key === "Tab" ? (l(!1), F(), E()) : t.key === "Enter" && !f ? (u && u(o, null), c.length === 1 && I(c[0])) : t.key === "Escape" ? (l(!1), t.preventDefault(), F(), E()) : (t.key === "ArrowDown" || t.key === "ArrowUp") && !f && c.length > 0 && (l(!0), t.preventDefault());
248
248
  },
249
- onBlur: tt,
249
+ onBlur: Q,
250
250
  className: d(`${e}__input`, {
251
- [`${e}__input--invalid`]: T
251
+ [`${e}__input--invalid`]: N
252
252
  }),
253
- "aria-label": q || `${l}-input`,
254
- "data-testid": `${l}-input`,
255
- ref: C
253
+ "aria-label": Y,
254
+ "data-testid": `${s}-input`,
255
+ ref: y
256
256
  }
257
257
  ),
258
258
  o && /* @__PURE__ */ i(
259
- H,
259
+ U,
260
260
  {
261
261
  className: `${e}__close-button`,
262
- "data-testid": `${l}-clear-button`,
262
+ "data-testid": `${s}-clear-button`,
263
263
  onClick: pt,
264
- "aria-label": I || `${l}-clear`,
264
+ "aria-label": Z,
265
265
  tabIndex: -1,
266
- variant: J.tertiary,
266
+ variant: W.tertiary,
267
267
  children: /* @__PURE__ */ i(
268
- at,
268
+ nt,
269
269
  {
270
270
  color: "currentColor",
271
271
  height: 18,
272
272
  width: 18,
273
- className: `${e}__icon-button`,
274
- title: I || `${l}-clear`
273
+ className: `${e}__icon-button`
275
274
  }
276
275
  )
277
276
  }
278
277
  ),
279
278
  /* @__PURE__ */ i(
280
- H,
279
+ U,
281
280
  {
282
- "aria-label": N || `${l}-dropdown`,
281
+ "aria-label": O,
283
282
  className: d(`${e}__dropdown-button`, {
284
283
  [`${e}__dropdown-button--open`]: f
285
284
  }),
286
285
  onClick: ut,
287
- "data-testid": `${l}-dropdown`,
286
+ "data-testid": `${s}-dropdown`,
288
287
  tabIndex: -1,
289
- variant: J.tertiary,
288
+ variant: W.tertiary,
290
289
  children: /* @__PURE__ */ i(
291
- nt,
290
+ st,
292
291
  {
293
292
  color: "currentColor",
294
293
  height: 18,
295
294
  width: 18,
296
295
  className: `${e}__icon-button`,
297
- title: N || `${l}-dropdown`
296
+ title: O || `${s}-dropdown`
298
297
  }
299
298
  )
300
299
  }
@@ -303,30 +302,30 @@ const Dt = Nt.forwardRef(function({
303
302
  }
304
303
  ) }),
305
304
  f && /* @__PURE__ */ i(vt, { container: rt?.current || document.body, children: /* @__PURE__ */ i(
306
- $t,
305
+ Ct,
307
306
  {
308
307
  className: `${e}__content`,
309
- "aria-label": z || `${l}-content`,
308
+ "aria-label": tt,
310
309
  side: "bottom",
311
310
  sideOffset: -5,
312
311
  align: "start",
313
312
  alignOffset: 0,
314
313
  onFocus: () => {
315
- document.activeElement !== C.current && C.current?.focus();
314
+ document.activeElement !== y.current && y.current?.focus();
316
315
  },
317
316
  style: {
318
- width: y.current?.offsetWidth || "100%"
317
+ width: b.current?.offsetWidth || "100%"
319
318
  },
320
- children: /* @__PURE__ */ i(bt, { className: `${e}__list`, children: c.length > 0 ? /* @__PURE__ */ i(wt, { className: `${e}__group`, children: c.map((t) => /* @__PURE__ */ i(
319
+ children: /* @__PURE__ */ i($t, { className: `${e}__list`, children: c.length > 0 ? /* @__PURE__ */ i(wt, { className: `${e}__group`, children: c.map((t) => /* @__PURE__ */ i(
321
320
  gt,
322
321
  {
323
322
  className: d(`${e}__item`, {
324
- [`${e}__item--selected`]: s?.value === t.value
323
+ [`${e}__item--selected`]: a?.value === t.value
325
324
  }),
326
325
  value: t.value,
327
- onSelect: () => k(t),
328
- ...s?.value === t.value ? { ref: E } : {},
329
- children: j ? j(t) : m(t)
326
+ onSelect: () => I(t),
327
+ ...a?.value === t.value ? { ref: M } : {},
328
+ children: S ? S(t) : m(t)
330
329
  },
331
330
  t.value
332
331
  )) }) : /* @__PURE__ */ i("div", { className: `${e}__no-options`, children: ot }) })
@@ -335,7 +334,7 @@ const Dt = Nt.forwardRef(function({
335
334
  ] })
336
335
  }
337
336
  ),
338
- K.validation ? K.validation : /* @__PURE__ */ i("p", { className: d(`${e}__validation`), children: " " })
337
+ q.validation ? q.validation : /* @__PURE__ */ i("p", { className: d(`${e}__validation`), children: " " })
339
338
  ] })
340
339
  ] });
341
340
  });
@@ -39,7 +39,7 @@ const L = x(
39
39
  id: m,
40
40
  ref: _,
41
41
  children: [
42
- /* @__PURE__ */ i(c, { variant: n.heading2, className: `${a}__title`, children: N }),
42
+ /* @__PURE__ */ i(c, { variant: n.heading3, className: `${a}__title`, children: N }),
43
43
  /* @__PURE__ */ i(
44
44
  "div",
45
45
  {
@@ -54,7 +54,7 @@ const L = x(
54
54
  r && /* @__PURE__ */ i(d, { id: `${m}-secondary-btn`, variant: t.secondary, onClick: r.onClick, children: r.buttonLabel }),
55
55
  e && /* @__PURE__ */ i(d, { id: `${m}-primary-btn`, variant: t.primary, onClick: e.onClick, children: e.buttonLabel })
56
56
  ] }),
57
- o && /* @__PURE__ */ i(c, { variant: n.heading3, className: `${a}__disclaimer`, children: o })
57
+ o && /* @__PURE__ */ i(c, { variant: n.heading5, className: `${a}__disclaimer`, children: o })
58
58
  ] })
59
59
  ]
60
60
  }
@@ -36,9 +36,9 @@ const G = $(
36
36
  }
37
37
  ) : null,
38
38
  /* @__PURE__ */ p("div", { className: `${t}__content`, children: [
39
- o ? /* @__PURE__ */ a(r, { variant: e.bodyMd, element: "span", className: `${t}__content-label`, children: o }) : null,
39
+ o ? /* @__PURE__ */ a(r, { variant: e.body2, element: "span", className: `${t}__content-label`, children: o }) : null,
40
40
  m ? /* @__PURE__ */ a(r, { variant: e.heading1, element: "span", className: `${t}__content-title`, children: m }) : null,
41
- s ? /* @__PURE__ */ a(r, { variant: e.bodyMd, element: "span", className: `${t}__content-description`, children: s }) : null,
41
+ s ? /* @__PURE__ */ a(r, { variant: e.body2, element: "span", className: `${t}__content-description`, children: s }) : null,
42
42
  (l || c) && i ? /* @__PURE__ */ a(c, { href: i, children: /* @__PURE__ */ a(C, { variant: _, className: `${t}__content-link`, children: l }) }) : null
43
43
  ] })
44
44
  ] });
@@ -1,38 +1,38 @@
1
- import { jsxs as s, jsx as o } from "react/jsx-runtime";
1
+ import { jsxs as l, jsx as o } from "react/jsx-runtime";
2
2
  import { forwardRef as v } from "react";
3
- import { getCommonProps as b } from "../../utils/index.js";
4
- import h from "../../node_modules/classnames/index.js";
3
+ import { getCommonProps as h } from "../../utils/index.js";
4
+ import b from "../../node_modules/classnames/index.js";
5
5
  import { TextVariants as t } from "../Text/types.js";
6
6
  import e from "../Text/Text.js";
7
- const N = v(
7
+ const g = v(
8
8
  ({
9
9
  className: d,
10
10
  actionAddText: i = "Add to",
11
11
  actionRemoveText: m = "Remove from",
12
12
  isLotInList: r,
13
- listTitle: l,
13
+ listTitle: n,
14
14
  numberOfObjects: c,
15
15
  onClick: f,
16
- ...n
16
+ ...s
17
17
  }, p) => {
18
- const { className: a, ...u } = b(n, "FavoritingTileButton");
19
- return /* @__PURE__ */ s(
18
+ const { className: a, ...u } = h(s, "FavoritingTileButton");
19
+ return /* @__PURE__ */ l(
20
20
  "button",
21
21
  {
22
22
  ...u,
23
- className: h(a, d, {
23
+ className: b(a, d, {
24
24
  [`${a}--lot-in-list`]: r
25
25
  }),
26
26
  onClick: f,
27
27
  ref: p,
28
- id: n?.id,
29
- "aria-label": `${r ? m : i} ${l}`,
28
+ id: s?.id,
29
+ "aria-label": `${r ? m : i} ${n}`,
30
30
  "aria-pressed": r,
31
31
  role: "switch",
32
32
  children: [
33
- /* @__PURE__ */ s("div", { className: `${a}__text`, children: [
33
+ /* @__PURE__ */ l("div", { className: `${a}__text`, children: [
34
34
  /* @__PURE__ */ o(e, { variant: t.button, children: r ? m : i }),
35
- /* @__PURE__ */ o(e, { variant: t.labelMd, children: l })
35
+ /* @__PURE__ */ o(e, { variant: t.string2, children: n })
36
36
  ] }),
37
37
  /* @__PURE__ */ o(e, { variant: t.button, children: c })
38
38
  ]
@@ -40,7 +40,7 @@ const N = v(
40
40
  );
41
41
  }
42
42
  );
43
- N.displayName = "FavoritingTileButton";
43
+ g.displayName = "FavoritingTileButton";
44
44
  export {
45
- N as default
45
+ g as default
46
46
  };
@@ -18,7 +18,7 @@ const g = p(
18
18
  /* @__PURE__ */ r(
19
19
  x,
20
20
  {
21
- variant: N.heading3,
21
+ variant: N.heading4,
22
22
  className: `${e}__heading`,
23
23
  element: (d) => /* @__PURE__ */ r("legend", { ...d, children: i })
24
24
  }
@@ -5,6 +5,5 @@ export declare enum LinkVariants {
5
5
  /** link is being rendered in a footer|header */
6
6
  snwFlyoutLink = "snwFlyoutLink",
7
7
  /** standard link */
8
- link = "link",
9
- labelLg = "labelLg"
8
+ link = "link"
10
9
  }
@@ -1,6 +1,6 @@
1
1
  import { TextVariants as l } from "../Text/types.js";
2
2
  import "../Text/Text.js";
3
- var o = ((e) => (e[e.email = l.email] = "email", e[e.snwHeaderLink = l.snwHeaderLink] = "snwHeaderLink", e[e.snwFlyoutLink = l.snwFlyoutLink] = "snwFlyoutLink", e[e.link = l.link] = "link", e[e.labelLg = l.labelLg] = "labelLg", e))(o || {});
3
+ var o = ((e) => (e[e.email = l.email] = "email", e[e.snwHeaderLink = l.snwHeaderLink] = "snwHeaderLink", e[e.snwFlyoutLink = l.snwFlyoutLink] = "snwFlyoutLink", e[e.link = l.link] = "link", e))(o || {});
4
4
  export {
5
5
  o as LinkVariants
6
6
  };
@@ -5,7 +5,7 @@ import { TextVariants as T } from "./types.js";
5
5
  import { determineDefaultTextElement as C, determineTextClassName as u } from "./utils.js";
6
6
  import r from "../../node_modules/classnames/index.js";
7
7
  const $ = x(
8
- ({ children: a, className: n, element: l, variant: e = T.bodyMd, align: m, isSkeletonLoading: p, ...o }, f) => {
8
+ ({ children: a, className: n, element: l, variant: e = T.body2, align: m, isSkeletonLoading: p, ...o }, f) => {
9
9
  const c = l || C(e), { className: t, ...i } = d(o, "Text");
10
10
  return /* @__PURE__ */ s(
11
11
  c,
@@ -3,39 +3,22 @@ export declare enum TextVariants {
3
3
  heading1 = "heading1",
4
4
  heading2 = "heading2",
5
5
  heading3 = "heading3",
6
- heading3Italic = "heading3Italic",
7
6
  heading4 = "heading4",
8
- heading4Italic = "heading4Italic",
9
7
  heading5 = "heading5",
10
- eyebrowLg = "eyebrowLg",
11
- eyebrowSm = "eyebrowSm",
12
8
  title1 = "title1",
13
9
  title2 = "title2",
14
10
  title3 = "title3",
15
11
  title4 = "title4",
16
- bodyLg = "bodyLg",
17
- bodyLgBold = "bodyLgBold",
18
- bodyMd = "bodyMd",
19
- bodyMdBold = "bodyMdBold",
20
- bodySm = "bodySm",
21
- bodySmBold = "bodySmBold",
22
12
  body1 = "body1",
23
13
  body2 = "body2",
24
14
  body3 = "body3",
25
15
  string1 = "string1",
26
16
  string2 = "string2",
27
17
  string3 = "string3",
28
- labelLg = "labelLg",
29
- labelLgBold = "labelLgBold",
30
- labelMd = "labelMd",
31
- labelMdBold = "labelMdBold",
32
- labelSm = "labelSm",
33
- labelSmBold = "labelSmBold",
34
18
  button = "button",
35
19
  email = "email",
36
20
  label = "label",
37
21
  link = "link",
38
- linkBold = "linkBold",
39
22
  badge = "badge",
40
23
  snwFlyoutLink = "snwFlyoutLink",
41
24
  snwHeaderLink = "snwHeaderLink",
@@ -1,5 +1,5 @@
1
- var d = /* @__PURE__ */ ((l) => (l.blockquote = "blockquote", l.heading1 = "heading1", l.heading2 = "heading2", l.heading3 = "heading3", l.heading3Italic = "heading3Italic", l.heading4 = "heading4", l.heading4Italic = "heading4Italic", l.heading5 = "heading5", l.eyebrowLg = "eyebrowLg", l.eyebrowSm = "eyebrowSm", l.title1 = "title1", l.title2 = "title2", l.title3 = "title3", l.title4 = "title4", l.bodyLg = "bodyLg", l.bodyLgBold = "bodyLgBold", l.bodyMd = "bodyMd", l.bodyMdBold = "bodyMdBold", l.bodySm = "bodySm", l.bodySmBold = "bodySmBold", l.body1 = "body1", l.body2 = "body2", l.body3 = "body3", l.string1 = "string1", l.string2 = "string2", l.string3 = "string3", l.labelLg = "labelLg", l.labelLgBold = "labelLgBold", l.labelMd = "labelMd", l.labelMdBold = "labelMdBold", l.labelSm = "labelSm", l.labelSmBold = "labelSmBold", l.button = "button", l.email = "email", l.label = "label", l.link = "link", l.linkBold = "linkBold", l.badge = "badge", l.snwFlyoutLink = "snwFlyoutLink", l.snwHeaderLink = "snwHeaderLink", l.snwHeadingHero1 = "snwHeadingHero1", l.snwHeadingHero2 = "snwHeadingHero2", l))(d || {}), o = /* @__PURE__ */ ((l) => (l.left = "left", l.center = "center", l.right = "right", l))(o || {});
1
+ var g = /* @__PURE__ */ ((d) => (d.blockquote = "blockquote", d.heading1 = "heading1", d.heading2 = "heading2", d.heading3 = "heading3", d.heading4 = "heading4", d.heading5 = "heading5", d.title1 = "title1", d.title2 = "title2", d.title3 = "title3", d.title4 = "title4", d.body1 = "body1", d.body2 = "body2", d.body3 = "body3", d.string1 = "string1", d.string2 = "string2", d.string3 = "string3", d.button = "button", d.email = "email", d.label = "label", d.link = "link", d.badge = "badge", d.snwFlyoutLink = "snwFlyoutLink", d.snwHeaderLink = "snwHeaderLink", d.snwHeadingHero1 = "snwHeadingHero1", d.snwHeadingHero2 = "snwHeadingHero2", d))(g || {}), l = /* @__PURE__ */ ((d) => (d.left = "left", d.center = "center", d.right = "right", d))(l || {});
2
2
  export {
3
- o as TextAlignments,
4
- d as TextVariants
3
+ l as TextAlignments,
4
+ g as TextVariants
5
5
  };
@@ -1,10 +1,10 @@
1
1
  import { px as s } from "../../utils/index.js";
2
- import { TextVariants as r } from "./types.js";
3
- const u = (e = r.bodyLg) => `${s}-text--${e.charAt(0).toLowerCase() + e.slice(1)}`, i = (e = r.bodyLg) => {
4
- const t = e.toLowerCase();
5
- return e === r.blockquote ? "blockquote" : e.includes("body") ? "p" : e.includes("string") || e.includes("title") || e.includes("eyebrow") ? "span" : e === r.label ? "label" : t.includes("heading") ? `h${isNaN(parseInt(e.slice(-1))) ? 3 : parseInt(e.slice(-1))}` : "span";
2
+ import { TextVariants as t } from "./types.js";
3
+ const i = (e = t.body1) => `${s}-text--${e.charAt(0).toLowerCase() + e.slice(1)}`, u = (e = t.body1) => {
4
+ const r = e.toLowerCase();
5
+ return e === t.blockquote ? "blockquote" : e.includes("body") ? "p" : e.includes("string") || e.includes("title") ? "span" : e === t.label ? "label" : r.includes("heading") ? `h${isNaN(parseInt(e.slice(-1))) ? 3 : parseInt(e.slice(-1))}` : "span";
6
6
  };
7
7
  export {
8
- i as determineDefaultTextElement,
9
- u as determineTextClassName
8
+ u as determineDefaultTextElement,
9
+ i as determineTextClassName
10
10
  };
package/dist/index.d.ts CHANGED
@@ -44,6 +44,7 @@ export { default as Video, type VideoProps } from './components/Video/Video';
44
44
  export * from './patterns/DetailList';
45
45
  export * from './patterns/FavoritesCollectionTile';
46
46
  export { default as HeroBanner, type HeroBannerProps } from './patterns/HeroBanner/HeroBanner';
47
+ export { default as TextBanner, type TextBannerProps } from './patterns/TextBanner/TextBanner';
47
48
  export * from './patterns/LanguageSelector';
48
49
  export * from './patterns/SaleHeaderBanner';
49
50
  export { default as Social, type SocialProps } from './patterns/Social/Social';
@@ -96,3 +97,4 @@ export * from './utils/hooks';
96
97
  export * from './patterns/CountryPicker';
97
98
  export * from './components/DescriptiveRadioButton';
98
99
  export * from './components/DescriptiveRadioButtonGroup';
100
+ export * from './patterns/TextBanner';