@dmsi/wedgekit-react 0.0.104 → 0.0.106

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 (54) hide show
  1. package/dist/{chunk-X62XGQY7.js → chunk-2XOQII4G.js} +1 -1
  2. package/dist/{chunk-6UI5GABI.js → chunk-3JRVV6QY.js} +1 -1
  3. package/dist/{chunk-QNQ5K7NW.js → chunk-3NWBR3V3.js} +1 -1
  4. package/dist/{chunk-VPEVXTBJ.js → chunk-66CBCMDU.js} +1 -1
  5. package/dist/{chunk-CG2NIXZE.js → chunk-6CS5ZBXO.js} +1 -1
  6. package/dist/{chunk-E5VEDZYV.js → chunk-E5ZL2ZYX.js} +1 -2
  7. package/dist/{chunk-P242H6OU.js → chunk-IMN6I5NV.js} +1 -1
  8. package/dist/{chunk-H6LXXGX6.js → chunk-L364HTYC.js} +7 -5
  9. package/dist/{chunk-D2YP2BTN.js → chunk-QIHDPSOM.js} +2 -2
  10. package/dist/{chunk-WVLT6XM7.js → chunk-RVQEW4A4.js} +2 -2
  11. package/dist/components/Button.cjs +7 -5
  12. package/dist/components/Button.js +1 -1
  13. package/dist/components/ContentTab.cjs +7 -5
  14. package/dist/components/ContentTab.js +2 -2
  15. package/dist/components/ContentTabs.cjs +7 -5
  16. package/dist/components/ContentTabs.js +2 -2
  17. package/dist/components/DataGridCell.cjs +1 -2
  18. package/dist/components/DataGridCell.js +1 -1
  19. package/dist/components/FilterGroup.cjs +7 -5
  20. package/dist/components/FilterGroup.js +2 -2
  21. package/dist/components/MobileDataGrid.cjs +7 -5
  22. package/dist/components/MobileDataGrid.js +1 -1
  23. package/dist/components/Modal.cjs +7 -5
  24. package/dist/components/Modal.js +4 -4
  25. package/dist/components/ModalButtons.cjs +7 -5
  26. package/dist/components/ModalButtons.js +2 -2
  27. package/dist/components/ModalHeader.cjs +7 -5
  28. package/dist/components/ModalHeader.js +2 -2
  29. package/dist/components/NavigationTab.cjs +7 -5
  30. package/dist/components/NavigationTab.js +2 -2
  31. package/dist/components/NavigationTabs.cjs +7 -5
  32. package/dist/components/NavigationTabs.js +2 -2
  33. package/dist/components/Notification.cjs +7 -5
  34. package/dist/components/Notification.js +1 -1
  35. package/dist/components/OptionPill.cjs +7 -5
  36. package/dist/components/OptionPill.js +2 -2
  37. package/dist/components/PDFViewer.cjs +7 -5
  38. package/dist/components/PDFViewer.js +4 -4
  39. package/dist/components/PaymentOnAccountModal.cjs +7 -5
  40. package/dist/components/PaymentOnAccountModal.js +6 -6
  41. package/dist/components/SelectPaymentMethod.cjs +7 -5
  42. package/dist/components/SelectPaymentMethod.js +2 -2
  43. package/dist/components/Stepper.cjs +7 -5
  44. package/dist/components/Stepper.js +1 -1
  45. package/dist/components/Toast.cjs +7 -5
  46. package/dist/components/Toast.js +1 -1
  47. package/dist/components/Upload.cjs +7 -5
  48. package/dist/components/Upload.js +1 -1
  49. package/dist/components/index.cjs +8 -7
  50. package/dist/components/index.js +7 -7
  51. package/dist/index.css +34 -0
  52. package/package.json +1 -1
  53. package/src/components/Button.tsx +7 -5
  54. package/src/components/DataGridCell.tsx +1 -2
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  Button
3
- } from "./chunk-H6LXXGX6.js";
3
+ } from "./chunk-L364HTYC.js";
4
4
  import {
5
5
  __objRest,
6
6
  __spreadProps,
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-J6LETUNM.js";
4
4
  import {
5
5
  Button
6
- } from "./chunk-H6LXXGX6.js";
6
+ } from "./chunk-L364HTYC.js";
7
7
  import {
8
8
  Icon
9
9
  } from "./chunk-IGQVA7SC.js";
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-S5K22XTH.js";
4
4
  import {
5
5
  Button
6
- } from "./chunk-H6LXXGX6.js";
6
+ } from "./chunk-L364HTYC.js";
7
7
  import {
8
8
  Icon
9
9
  } from "./chunk-IGQVA7SC.js";
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk-VG4EPHJA.js";
28
28
  import {
29
29
  Button
30
- } from "./chunk-H6LXXGX6.js";
30
+ } from "./chunk-L364HTYC.js";
31
31
  import {
32
32
  Icon
33
33
  } from "./chunk-IGQVA7SC.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  Button
3
- } from "./chunk-H6LXXGX6.js";
3
+ } from "./chunk-L364HTYC.js";
4
4
  import {
5
5
  Icon
6
6
  } from "./chunk-IGQVA7SC.js";
@@ -122,7 +122,7 @@ var DataGridCell = memo(
122
122
  lockedHeaderBgStyles,
123
123
  iconComponentStyles,
124
124
  className,
125
- "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-action-primary-normal",
125
+ "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-primary-normal",
126
126
  "focus-within:!z-10",
127
127
  "overflow-x-hidden",
128
128
  component === "input" && "border",
@@ -142,7 +142,6 @@ var DataGridCell = memo(
142
142
  className: clsx("flex h-10", !width && "flex-1"),
143
143
  style: { width }
144
144
  }, props), {
145
- "data-theme": type === "header" ? "brand" : void 0,
146
145
  children: /* @__PURE__ */ jsx(
147
146
  "div",
148
147
  {
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  Button
3
- } from "./chunk-H6LXXGX6.js";
3
+ } from "./chunk-L364HTYC.js";
4
4
  import {
5
5
  Icon
6
6
  } from "./chunk-IGQVA7SC.js";
@@ -95,11 +95,14 @@ var Button = (_a) => {
95
95
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
96
96
  );
97
97
  const navigationVarianStyles = variant === "navigation" && clsx(
98
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
98
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
99
99
  "bg-transparent",
100
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
101
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
102
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
100
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
101
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
102
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
103
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
104
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
105
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
103
106
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
104
107
  "flex-col",
105
108
  paddingUsingComponentGap
@@ -137,7 +140,6 @@ var Button = (_a) => {
137
140
  onClick: props.onClick,
138
141
  disabled,
139
142
  href,
140
- "data-theme": variant === "navigation" ? "brand" : void 0,
141
143
  children: [
142
144
  leftIcon && leftIcon,
143
145
  !iconOnly && children && /* @__PURE__ */ jsx("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -3,13 +3,13 @@ import {
3
3
  } from "./chunk-4RJKB7LC.js";
4
4
  import {
5
5
  ModalButtons
6
- } from "./chunk-CG2NIXZE.js";
6
+ } from "./chunk-6CS5ZBXO.js";
7
7
  import {
8
8
  ModalContent
9
9
  } from "./chunk-FWPJ73IK.js";
10
10
  import {
11
11
  ModalHeader
12
- } from "./chunk-6UI5GABI.js";
12
+ } from "./chunk-3JRVV6QY.js";
13
13
  import {
14
14
  ModalScrim
15
15
  } from "./chunk-4JLU7TAC.js";
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  SelectPaymentMethod
3
- } from "./chunk-VPEVXTBJ.js";
3
+ } from "./chunk-66CBCMDU.js";
4
4
  import {
5
5
  Modal
6
- } from "./chunk-D2YP2BTN.js";
6
+ } from "./chunk-QIHDPSOM.js";
7
7
  import {
8
8
  Input
9
9
  } from "./chunk-R5TLUWDD.js";
@@ -272,11 +272,14 @@ var Button = (_a) => {
272
272
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
273
273
  );
274
274
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
275
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
275
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
276
276
  "bg-transparent",
277
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
278
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
279
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
277
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
278
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
279
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
280
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
281
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
282
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
280
283
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
281
284
  "flex-col",
282
285
  paddingUsingComponentGap
@@ -314,7 +317,6 @@ var Button = (_a) => {
314
317
  onClick: props.onClick,
315
318
  disabled,
316
319
  href,
317
- "data-theme": variant === "navigation" ? "brand" : void 0,
318
320
  children: [
319
321
  leftIcon && leftIcon,
320
322
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  Button
3
- } from "../chunk-H6LXXGX6.js";
3
+ } from "../chunk-L364HTYC.js";
4
4
  import "../chunk-RDLEIAQU.js";
5
5
  import "../chunk-ORMEWXMH.js";
6
6
  export {
@@ -277,11 +277,14 @@ var Button = (_a) => {
277
277
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
278
278
  );
279
279
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
280
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
280
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
281
281
  "bg-transparent",
282
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
283
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
284
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
282
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
283
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
284
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
285
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
286
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
287
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
285
288
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
286
289
  "flex-col",
287
290
  paddingUsingComponentGap
@@ -319,7 +322,6 @@ var Button = (_a) => {
319
322
  onClick: props.onClick,
320
323
  disabled,
321
324
  href,
322
- "data-theme": variant === "navigation" ? "brand" : void 0,
323
325
  children: [
324
326
  leftIcon && leftIcon,
325
327
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import {
3
3
  ContentTab
4
- } from "../chunk-X62XGQY7.js";
5
- import "../chunk-H6LXXGX6.js";
4
+ } from "../chunk-2XOQII4G.js";
5
+ import "../chunk-L364HTYC.js";
6
6
  import "../chunk-RDLEIAQU.js";
7
7
  import "../chunk-ORMEWXMH.js";
8
8
  export {
@@ -281,11 +281,14 @@ var Button = (_a) => {
281
281
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
282
282
  );
283
283
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
284
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
284
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
285
285
  "bg-transparent",
286
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
287
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
288
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
286
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
287
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
288
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
289
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
290
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
291
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
289
292
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
290
293
  "flex-col",
291
294
  paddingUsingComponentGap
@@ -323,7 +326,6 @@ var Button = (_a) => {
323
326
  onClick: props.onClick,
324
327
  disabled,
325
328
  href,
326
- "data-theme": variant === "navigation" ? "brand" : void 0,
327
329
  children: [
328
330
  leftIcon && leftIcon,
329
331
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import {
3
3
  ContentTab
4
- } from "../chunk-X62XGQY7.js";
5
- import "../chunk-H6LXXGX6.js";
4
+ } from "../chunk-2XOQII4G.js";
5
+ import "../chunk-L364HTYC.js";
6
6
  import "../chunk-RDLEIAQU.js";
7
7
  import "../chunk-ORMEWXMH.js";
8
8
 
@@ -1739,7 +1739,7 @@ var DataGridCell = (0, import_react10.memo)(
1739
1739
  lockedHeaderBgStyles,
1740
1740
  iconComponentStyles,
1741
1741
  className,
1742
- "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-action-primary-normal",
1742
+ "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-primary-normal",
1743
1743
  "focus-within:!z-10",
1744
1744
  "overflow-x-hidden",
1745
1745
  component === "input" && "border",
@@ -1759,7 +1759,6 @@ var DataGridCell = (0, import_react10.memo)(
1759
1759
  className: (0, import_clsx8.default)("flex h-10", !width && "flex-1"),
1760
1760
  style: { width }
1761
1761
  }, props), {
1762
- "data-theme": type === "header" ? "brand" : void 0,
1763
1762
  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1764
1763
  "div",
1765
1764
  {
@@ -4,7 +4,7 @@ import {
4
4
  DataGridCell,
5
5
  DragAlongCell,
6
6
  DraggableCellHeader
7
- } from "../chunk-E5VEDZYV.js";
7
+ } from "../chunk-E5ZL2ZYX.js";
8
8
  import "../chunk-37TJJQL3.js";
9
9
  import "../chunk-5GUW4DUY.js";
10
10
  import "../chunk-VH3EJNVE.js";
@@ -524,11 +524,14 @@ var Button = (_a) => {
524
524
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
525
525
  );
526
526
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx6.default)(
527
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
527
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
528
528
  "bg-transparent",
529
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
530
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
531
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
529
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
530
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
531
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
532
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
533
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
534
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
532
535
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
533
536
  "flex-col",
534
537
  paddingUsingComponentGap
@@ -566,7 +569,6 @@ var Button = (_a) => {
566
569
  onClick: props.onClick,
567
570
  disabled,
568
571
  href,
569
- "data-theme": variant === "navigation" ? "brand" : void 0,
570
572
  children: [
571
573
  leftIcon && leftIcon,
572
574
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  OptionPill
4
- } from "../chunk-QNQ5K7NW.js";
4
+ } from "../chunk-3NWBR3V3.js";
5
5
  import {
6
6
  Checkbox
7
7
  } from "../chunk-WT5XXW6G.js";
@@ -17,7 +17,7 @@ import "../chunk-VG4EPHJA.js";
17
17
  import {
18
18
  Link
19
19
  } from "../chunk-AOELEEUS.js";
20
- import "../chunk-H6LXXGX6.js";
20
+ import "../chunk-L364HTYC.js";
21
21
  import {
22
22
  Icon
23
23
  } from "../chunk-IGQVA7SC.js";
@@ -474,11 +474,14 @@ var Button = (_a) => {
474
474
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
475
475
  );
476
476
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx4.default)(
477
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
477
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
478
478
  "bg-transparent",
479
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
480
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
481
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
479
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
480
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
481
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
482
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
483
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
484
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
482
485
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
483
486
  "flex-col",
484
487
  paddingUsingComponentGap
@@ -516,7 +519,6 @@ var Button = (_a) => {
516
519
  onClick: props.onClick,
517
520
  disabled,
518
521
  href,
519
- "data-theme": variant === "navigation" ? "brand" : void 0,
520
522
  children: [
521
523
  leftIcon && leftIcon,
522
524
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -12,7 +12,7 @@ import {
12
12
  } from "../chunk-VG4EPHJA.js";
13
13
  import {
14
14
  Button
15
- } from "../chunk-H6LXXGX6.js";
15
+ } from "../chunk-L364HTYC.js";
16
16
  import {
17
17
  Icon
18
18
  } from "../chunk-IGQVA7SC.js";
@@ -327,11 +327,14 @@ var Button = (_a) => {
327
327
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
328
328
  );
329
329
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx3.default)(
330
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
330
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
331
331
  "bg-transparent",
332
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
333
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
334
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
332
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
333
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
334
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
335
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
336
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
337
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
335
338
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
336
339
  "flex-col",
337
340
  paddingUsingComponentGap
@@ -369,7 +372,6 @@ var Button = (_a) => {
369
372
  onClick: props.onClick,
370
373
  disabled,
371
374
  href,
372
- "data-theme": variant === "navigation" ? "brand" : void 0,
373
375
  children: [
374
376
  leftIcon && leftIcon,
375
377
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,16 +1,16 @@
1
1
  "use client";
2
2
  import {
3
3
  Modal
4
- } from "../chunk-D2YP2BTN.js";
4
+ } from "../chunk-QIHDPSOM.js";
5
5
  import "../chunk-4RJKB7LC.js";
6
- import "../chunk-CG2NIXZE.js";
6
+ import "../chunk-6CS5ZBXO.js";
7
7
  import "../chunk-FWPJ73IK.js";
8
- import "../chunk-6UI5GABI.js";
8
+ import "../chunk-3JRVV6QY.js";
9
9
  import "../chunk-4JLU7TAC.js";
10
10
  import "../chunk-J6LETUNM.js";
11
11
  import "../chunk-WNQ53SVY.js";
12
12
  import "../chunk-4T7F5BZZ.js";
13
- import "../chunk-H6LXXGX6.js";
13
+ import "../chunk-L364HTYC.js";
14
14
  import "../chunk-IGQVA7SC.js";
15
15
  import "../chunk-RDLEIAQU.js";
16
16
  import "../chunk-ORMEWXMH.js";
@@ -275,11 +275,14 @@ var Button = (_a) => {
275
275
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
276
276
  );
277
277
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
278
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
278
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
279
279
  "bg-transparent",
280
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
281
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
282
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
280
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
281
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
282
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
283
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
284
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
285
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
283
286
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
284
287
  "flex-col",
285
288
  paddingUsingComponentGap
@@ -317,7 +320,6 @@ var Button = (_a) => {
317
320
  onClick: props.onClick,
318
321
  disabled,
319
322
  href,
320
- "data-theme": variant === "navigation" ? "brand" : void 0,
321
323
  children: [
322
324
  leftIcon && leftIcon,
323
325
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  ModalButtons
3
- } from "../chunk-CG2NIXZE.js";
4
- import "../chunk-H6LXXGX6.js";
3
+ } from "../chunk-6CS5ZBXO.js";
4
+ import "../chunk-L364HTYC.js";
5
5
  import "../chunk-IGQVA7SC.js";
6
6
  import "../chunk-RDLEIAQU.js";
7
7
  import "../chunk-ORMEWXMH.js";
@@ -324,11 +324,14 @@ var Button = (_a) => {
324
324
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
325
325
  );
326
326
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx3.default)(
327
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
327
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
328
328
  "bg-transparent",
329
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
330
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
331
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
329
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
330
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
331
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
332
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
333
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
334
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
332
335
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
333
336
  "flex-col",
334
337
  paddingUsingComponentGap
@@ -366,7 +369,6 @@ var Button = (_a) => {
366
369
  onClick: props.onClick,
367
370
  disabled,
368
371
  href,
369
- "data-theme": variant === "navigation" ? "brand" : void 0,
370
372
  children: [
371
373
  leftIcon && leftIcon,
372
374
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  ModalHeader
3
- } from "../chunk-6UI5GABI.js";
3
+ } from "../chunk-3JRVV6QY.js";
4
4
  import "../chunk-J6LETUNM.js";
5
- import "../chunk-H6LXXGX6.js";
5
+ import "../chunk-L364HTYC.js";
6
6
  import "../chunk-IGQVA7SC.js";
7
7
  import "../chunk-RDLEIAQU.js";
8
8
  import "../chunk-ORMEWXMH.js";
@@ -275,11 +275,14 @@ var Button = (_a) => {
275
275
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
276
276
  );
277
277
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
278
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
278
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
279
279
  "bg-transparent",
280
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
281
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
282
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
280
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
281
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
282
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
283
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
284
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
285
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
283
286
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
284
287
  "flex-col",
285
288
  paddingUsingComponentGap
@@ -317,7 +320,6 @@ var Button = (_a) => {
317
320
  onClick: props.onClick,
318
321
  disabled,
319
322
  href,
320
- "data-theme": variant === "navigation" ? "brand" : void 0,
321
323
  children: [
322
324
  leftIcon && leftIcon,
323
325
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  NavigationTab
3
- } from "../chunk-P242H6OU.js";
4
- import "../chunk-H6LXXGX6.js";
3
+ } from "../chunk-IMN6I5NV.js";
4
+ import "../chunk-L364HTYC.js";
5
5
  import "../chunk-IGQVA7SC.js";
6
6
  import "../chunk-RDLEIAQU.js";
7
7
  import "../chunk-ORMEWXMH.js";
@@ -280,11 +280,14 @@ var Button = (_a) => {
280
280
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
281
281
  );
282
282
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
283
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
283
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
284
284
  "bg-transparent",
285
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
286
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
287
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
285
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
286
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
287
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
288
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
289
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
290
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
288
291
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
289
292
  "flex-col",
290
293
  paddingUsingComponentGap
@@ -322,7 +325,6 @@ var Button = (_a) => {
322
325
  onClick: props.onClick,
323
326
  disabled,
324
327
  href,
325
- "data-theme": variant === "navigation" ? "brand" : void 0,
326
328
  children: [
327
329
  leftIcon && leftIcon,
328
330
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import {
3
3
  NavigationTab
4
- } from "../chunk-P242H6OU.js";
5
- import "../chunk-H6LXXGX6.js";
4
+ } from "../chunk-IMN6I5NV.js";
5
+ import "../chunk-L364HTYC.js";
6
6
  import "../chunk-IGQVA7SC.js";
7
7
  import {
8
8
  componentGap
@@ -277,11 +277,14 @@ var Button = (_a) => {
277
277
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
278
278
  );
279
279
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
280
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
280
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
281
281
  "bg-transparent",
282
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
283
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
284
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
282
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
283
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
284
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
285
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
286
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
287
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
285
288
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
286
289
  "flex-col",
287
290
  paddingUsingComponentGap
@@ -319,7 +322,6 @@ var Button = (_a) => {
319
322
  onClick: props.onClick,
320
323
  disabled,
321
324
  href,
322
- "data-theme": variant === "navigation" ? "brand" : void 0,
323
325
  children: [
324
326
  leftIcon && leftIcon,
325
327
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -10,7 +10,7 @@ import {
10
10
  } from "../chunk-VG4EPHJA.js";
11
11
  import {
12
12
  Button
13
- } from "../chunk-H6LXXGX6.js";
13
+ } from "../chunk-L364HTYC.js";
14
14
  import {
15
15
  Icon
16
16
  } from "../chunk-IGQVA7SC.js";
@@ -273,11 +273,14 @@ var Button = (_a) => {
273
273
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
274
274
  );
275
275
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
276
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
276
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
277
277
  "bg-transparent",
278
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
279
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
280
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
278
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
279
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
280
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
281
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
282
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
283
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
281
284
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
282
285
  "flex-col",
283
286
  paddingUsingComponentGap
@@ -315,7 +318,6 @@ var Button = (_a) => {
315
318
  onClick: props.onClick,
316
319
  disabled,
317
320
  href,
318
- "data-theme": variant === "navigation" ? "brand" : void 0,
319
321
  children: [
320
322
  leftIcon && leftIcon,
321
323
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  OptionPill
3
- } from "../chunk-QNQ5K7NW.js";
3
+ } from "../chunk-3NWBR3V3.js";
4
4
  import "../chunk-S5K22XTH.js";
5
- import "../chunk-H6LXXGX6.js";
5
+ import "../chunk-L364HTYC.js";
6
6
  import "../chunk-IGQVA7SC.js";
7
7
  import "../chunk-RDLEIAQU.js";
8
8
  import "../chunk-ORMEWXMH.js";
@@ -331,11 +331,14 @@ var Button = (_a) => {
331
331
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
332
332
  );
333
333
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx3.default)(
334
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
334
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
335
335
  "bg-transparent",
336
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
337
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
338
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
336
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
337
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
338
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
339
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
340
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
341
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
339
342
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
340
343
  "flex-col",
341
344
  paddingUsingComponentGap
@@ -373,7 +376,6 @@ var Button = (_a) => {
373
376
  onClick: props.onClick,
374
377
  disabled,
375
378
  href,
376
- "data-theme": variant === "navigation" ? "brand" : void 0,
377
379
  children: [
378
380
  leftIcon && leftIcon,
379
381
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,11 +1,11 @@
1
1
  "use client";
2
2
  import {
3
3
  Modal
4
- } from "../chunk-D2YP2BTN.js";
4
+ } from "../chunk-QIHDPSOM.js";
5
5
  import "../chunk-4RJKB7LC.js";
6
- import "../chunk-CG2NIXZE.js";
6
+ import "../chunk-6CS5ZBXO.js";
7
7
  import "../chunk-FWPJ73IK.js";
8
- import "../chunk-6UI5GABI.js";
8
+ import "../chunk-3JRVV6QY.js";
9
9
  import "../chunk-4JLU7TAC.js";
10
10
  import "../chunk-J6LETUNM.js";
11
11
  import {
@@ -18,7 +18,7 @@ import {
18
18
  } from "../chunk-EO3JJWFW.js";
19
19
  import {
20
20
  Button
21
- } from "../chunk-H6LXXGX6.js";
21
+ } from "../chunk-L364HTYC.js";
22
22
  import {
23
23
  Icon
24
24
  } from "../chunk-IGQVA7SC.js";
@@ -329,11 +329,14 @@ var Button = (_a) => {
329
329
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
330
330
  );
331
331
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx3.default)(
332
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
332
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
333
333
  "bg-transparent",
334
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
335
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
336
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
334
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
335
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
336
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
337
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
338
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
339
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
337
340
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
338
341
  "flex-col",
339
342
  paddingUsingComponentGap
@@ -371,7 +374,6 @@ var Button = (_a) => {
371
374
  onClick: props.onClick,
372
375
  disabled,
373
376
  href,
374
- "data-theme": variant === "navigation" ? "brand" : void 0,
375
377
  children: [
376
378
  leftIcon && leftIcon,
377
379
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,14 +1,14 @@
1
1
  import {
2
2
  PaymentOnAccountModal,
3
3
  calculateSurcharge
4
- } from "../chunk-WVLT6XM7.js";
5
- import "../chunk-VPEVXTBJ.js";
4
+ } from "../chunk-RVQEW4A4.js";
5
+ import "../chunk-66CBCMDU.js";
6
6
  import "../chunk-TTO4PL7Y.js";
7
- import "../chunk-D2YP2BTN.js";
7
+ import "../chunk-QIHDPSOM.js";
8
8
  import "../chunk-4RJKB7LC.js";
9
- import "../chunk-CG2NIXZE.js";
9
+ import "../chunk-6CS5ZBXO.js";
10
10
  import "../chunk-FWPJ73IK.js";
11
- import "../chunk-6UI5GABI.js";
11
+ import "../chunk-3JRVV6QY.js";
12
12
  import "../chunk-4JLU7TAC.js";
13
13
  import "../chunk-J6LETUNM.js";
14
14
  import "../chunk-3ZUSYRI7.js";
@@ -23,7 +23,7 @@ import "../chunk-QDFQ3B4N.js";
23
23
  import "../chunk-EO3JJWFW.js";
24
24
  import "../chunk-JOMM4KBH.js";
25
25
  import "../chunk-VG4EPHJA.js";
26
- import "../chunk-H6LXXGX6.js";
26
+ import "../chunk-L364HTYC.js";
27
27
  import "../chunk-IGQVA7SC.js";
28
28
  import "../chunk-RDLEIAQU.js";
29
29
  import "../chunk-ORMEWXMH.js";
@@ -610,11 +610,14 @@ var Button = (_a) => {
610
610
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
611
611
  );
612
612
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx7.default)(
613
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
613
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
614
614
  "bg-transparent",
615
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
616
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
617
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
615
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
616
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
617
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
618
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
619
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
620
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
618
621
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
619
622
  "flex-col",
620
623
  paddingUsingComponentGap
@@ -652,7 +655,6 @@ var Button = (_a) => {
652
655
  onClick: props.onClick,
653
656
  disabled,
654
657
  href,
655
- "data-theme": variant === "navigation" ? "brand" : void 0,
656
658
  children: [
657
659
  leftIcon && leftIcon,
658
660
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import {
3
3
  SelectPaymentMethod
4
- } from "../chunk-VPEVXTBJ.js";
4
+ } from "../chunk-66CBCMDU.js";
5
5
  import "../chunk-TTO4PL7Y.js";
6
6
  import "../chunk-3ZUSYRI7.js";
7
7
  import "../chunk-WT5XXW6G.js";
@@ -11,7 +11,7 @@ import "../chunk-QDFQ3B4N.js";
11
11
  import "../chunk-EO3JJWFW.js";
12
12
  import "../chunk-JOMM4KBH.js";
13
13
  import "../chunk-VG4EPHJA.js";
14
- import "../chunk-H6LXXGX6.js";
14
+ import "../chunk-L364HTYC.js";
15
15
  import "../chunk-IGQVA7SC.js";
16
16
  import "../chunk-RDLEIAQU.js";
17
17
  import "../chunk-ORMEWXMH.js";
@@ -275,11 +275,14 @@ var Button = (_a) => {
275
275
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
276
276
  );
277
277
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx2.default)(
278
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
278
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
279
279
  "bg-transparent",
280
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
281
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
282
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
280
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
281
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
282
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
283
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
284
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
285
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
283
286
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
284
287
  "flex-col",
285
288
  paddingUsingComponentGap
@@ -317,7 +320,6 @@ var Button = (_a) => {
317
320
  onClick: props.onClick,
318
321
  disabled,
319
322
  href,
320
- "data-theme": variant === "navigation" ? "brand" : void 0,
321
323
  children: [
322
324
  leftIcon && leftIcon,
323
325
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -6,7 +6,7 @@ import "../chunk-5UH6QUFB.js";
6
6
  import "../chunk-S5K22XTH.js";
7
7
  import {
8
8
  Button
9
- } from "../chunk-H6LXXGX6.js";
9
+ } from "../chunk-L364HTYC.js";
10
10
  import {
11
11
  Icon
12
12
  } from "../chunk-IGQVA7SC.js";
@@ -410,11 +410,14 @@ var Button = (_a) => {
410
410
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
411
411
  );
412
412
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx5.default)(
413
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
413
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
414
414
  "bg-transparent",
415
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
416
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
417
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
415
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
416
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
417
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
418
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
419
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
420
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
418
421
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
419
422
  "flex-col",
420
423
  paddingUsingComponentGap
@@ -452,7 +455,6 @@ var Button = (_a) => {
452
455
  onClick: props.onClick,
453
456
  disabled,
454
457
  href,
455
- "data-theme": variant === "navigation" ? "brand" : void 0,
456
458
  children: [
457
459
  leftIcon && leftIcon,
458
460
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -7,7 +7,7 @@ import {
7
7
  } from "../chunk-VG4EPHJA.js";
8
8
  import {
9
9
  Button
10
- } from "../chunk-H6LXXGX6.js";
10
+ } from "../chunk-L364HTYC.js";
11
11
  import {
12
12
  Icon
13
13
  } from "../chunk-IGQVA7SC.js";
@@ -355,11 +355,14 @@ var Button = (_a) => {
355
355
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
356
356
  );
357
357
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx4.default)(
358
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
358
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
359
359
  "bg-transparent",
360
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
361
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
362
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
360
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
361
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
362
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
363
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
364
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
365
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
363
366
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
364
367
  "flex-col",
365
368
  paddingUsingComponentGap
@@ -397,7 +400,6 @@ var Button = (_a) => {
397
400
  onClick: props.onClick,
398
401
  disabled,
399
402
  href,
400
- "data-theme": variant === "navigation" ? "brand" : void 0,
401
403
  children: [
402
404
  leftIcon && leftIcon,
403
405
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -3,7 +3,7 @@ import {
3
3
  } from "../chunk-VG4EPHJA.js";
4
4
  import {
5
5
  Button
6
- } from "../chunk-H6LXXGX6.js";
6
+ } from "../chunk-L364HTYC.js";
7
7
  import {
8
8
  Icon
9
9
  } from "../chunk-IGQVA7SC.js";
@@ -1782,7 +1782,7 @@ var DataGridCell = (0, import_react10.memo)(
1782
1782
  lockedHeaderBgStyles,
1783
1783
  iconComponentStyles,
1784
1784
  className,
1785
- "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-action-primary-normal",
1785
+ "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-primary-normal",
1786
1786
  "focus-within:!z-10",
1787
1787
  "overflow-x-hidden",
1788
1788
  component === "input" && "border",
@@ -1802,7 +1802,6 @@ var DataGridCell = (0, import_react10.memo)(
1802
1802
  className: (0, import_clsx8.default)("flex h-10", !width && "flex-1"),
1803
1803
  style: { width }
1804
1804
  }, props), {
1805
- "data-theme": type === "header" ? "brand" : void 0,
1806
1805
  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1807
1806
  "div",
1808
1807
  {
@@ -3430,11 +3429,14 @@ var Button = (_a) => {
3430
3429
  "disabled:bg-transparent disabled:border-transparent disabled:text-text-action-critical-disabled"
3431
3430
  );
3432
3431
  const navigationVarianStyles = variant === "navigation" && (0, import_clsx17.default)(
3433
- (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-action-primary-normal",
3432
+ (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
3434
3433
  "bg-transparent",
3435
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
3436
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
3437
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
3434
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
3435
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
3436
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
3437
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
3438
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
3439
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
3438
3440
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
3439
3441
  "flex-col",
3440
3442
  paddingUsingComponentGap
@@ -3472,7 +3474,6 @@ var Button = (_a) => {
3472
3474
  onClick: props.onClick,
3473
3475
  disabled,
3474
3476
  href,
3475
- "data-theme": variant === "navigation" ? "brand" : void 0,
3476
3477
  children: [
3477
3478
  leftIcon && leftIcon,
3478
3479
  !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { id: id ? `${id}-label` : void 0, className: labelClasses, children }),
@@ -6,14 +6,14 @@ import {
6
6
  } from "../chunk-Y4HUYAI5.js";
7
7
  import {
8
8
  PaymentOnAccountModal
9
- } from "../chunk-WVLT6XM7.js";
10
- import "../chunk-VPEVXTBJ.js";
9
+ } from "../chunk-RVQEW4A4.js";
10
+ import "../chunk-66CBCMDU.js";
11
11
  import "../chunk-TTO4PL7Y.js";
12
- import "../chunk-D2YP2BTN.js";
12
+ import "../chunk-QIHDPSOM.js";
13
13
  import "../chunk-4RJKB7LC.js";
14
- import "../chunk-CG2NIXZE.js";
14
+ import "../chunk-6CS5ZBXO.js";
15
15
  import "../chunk-FWPJ73IK.js";
16
- import "../chunk-6UI5GABI.js";
16
+ import "../chunk-3JRVV6QY.js";
17
17
  import "../chunk-4JLU7TAC.js";
18
18
  import "../chunk-J6LETUNM.js";
19
19
  import "../chunk-3ZUSYRI7.js";
@@ -25,7 +25,7 @@ import {
25
25
  DataGridCell,
26
26
  DragAlongCell,
27
27
  DraggableCellHeader
28
- } from "../chunk-E5VEDZYV.js";
28
+ } from "../chunk-E5ZL2ZYX.js";
29
29
  import {
30
30
  Menu
31
31
  } from "../chunk-37TJJQL3.js";
@@ -63,7 +63,7 @@ import {
63
63
  } from "../chunk-VG4EPHJA.js";
64
64
  import {
65
65
  Button
66
- } from "../chunk-H6LXXGX6.js";
66
+ } from "../chunk-L364HTYC.js";
67
67
  import {
68
68
  Icon
69
69
  } from "../chunk-IGQVA7SC.js";
package/dist/index.css CHANGED
@@ -2866,6 +2866,13 @@
2866
2866
  }
2867
2867
  }
2868
2868
  }
2869
+ .hover\:bg-background-on-action-secondary-hover {
2870
+ &:hover {
2871
+ @media (hover: hover) {
2872
+ background-color: var(--color-background-on-action-secondary-hover);
2873
+ }
2874
+ }
2875
+ }
2869
2876
  .hover\:bg-background-secondary-normal\/30 {
2870
2877
  &:hover {
2871
2878
  @media (hover: hover) {
@@ -2904,6 +2911,13 @@
2904
2911
  }
2905
2912
  }
2906
2913
  }
2914
+ .hover\:text-brand-text-action-primary-hover {
2915
+ &:hover {
2916
+ @media (hover: hover) {
2917
+ color: var(--color-brand-text-action-primary-hover);
2918
+ }
2919
+ }
2920
+ }
2907
2921
  .hover\:text-icon-action-critical-secondary-hover {
2908
2922
  &:hover {
2909
2923
  @media (hover: hover) {
@@ -3031,6 +3045,16 @@
3031
3045
  background-color: var(--color-background-action-secondary-hover);
3032
3046
  }
3033
3047
  }
3048
+ .focus\:bg-background-on-action-secondary-hover {
3049
+ &:focus {
3050
+ background-color: var(--color-background-on-action-secondary-hover);
3051
+ }
3052
+ }
3053
+ .focus\:text-brand-text-action-primary-hover {
3054
+ &:focus {
3055
+ color: var(--color-brand-text-action-primary-hover);
3056
+ }
3057
+ }
3034
3058
  .focus\:text-text-action-critical-hover {
3035
3059
  &:focus {
3036
3060
  color: var(--color-text-action-critical-hover);
@@ -3171,6 +3195,11 @@
3171
3195
  background-color: var(--color-background-action-secondary-active);
3172
3196
  }
3173
3197
  }
3198
+ .active\:bg-background-on-action-secondary-active {
3199
+ &:active {
3200
+ background-color: var(--color-background-on-action-secondary-active);
3201
+ }
3202
+ }
3174
3203
  .active\:\!text-brand-text-on-action-primary-active {
3175
3204
  &:active {
3176
3205
  color: var(--color-brand-text-on-action-primary-active) !important;
@@ -3186,6 +3215,11 @@
3186
3215
  color: var(--color-action-300);
3187
3216
  }
3188
3217
  }
3218
+ .active\:text-brand-text-action-primary-active {
3219
+ &:active {
3220
+ color: var(--color-brand-text-action-primary-active);
3221
+ }
3222
+ }
3189
3223
  .active\:text-icon-action-critical-secondary-active {
3190
3224
  &:active {
3191
3225
  color: var(--color-icon-action-critical-secondary-active);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dmsi/wedgekit-react",
3
3
  "private": false,
4
- "version": "0.0.104",
4
+ "version": "0.0.106",
5
5
  "type": "module",
6
6
  "scripts": {
7
7
  "build": "tsup",
@@ -146,11 +146,14 @@ export const Button = ({
146
146
  clsx(
147
147
  colorClassName?.trim()
148
148
  ? colorClassName
149
- : "text-text-action-primary-normal",
149
+ : "text-text-on-action-primary-normal",
150
150
  "bg-transparent",
151
- "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover",
152
- "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover focus:outline-0",
153
- "active:bg-background-action-secondary-active active:text-text-action-primary-active",
151
+ "hover:bg-background-on-action-secondary-hover hover:text-brand-text-action-primary-hover",
152
+ // "hover:bg-background-action-secondary-hover hover:text-text-action-primary-hover", // Will use this once colors are finalized
153
+ "focus:bg-background-on-action-secondary-hover focus:text-brand-text-action-primary-hover focus:outline-0",
154
+ // "focus:bg-background-action-secondary-hover focus:text-text-action-primary-hover", // Will use this once colors are finalized
155
+ "active:bg-background-on-action-secondary-active active:text-brand-text-action-primary-active",
156
+ // "active:bg-background-action-secondary-active active:text-text-action-primary-active", // Will use this once colors are finalized
154
157
  "disabled:bg-transparent disabled:text-text-on-action-primary-disabled",
155
158
  "flex-col",
156
159
  paddingUsingComponentGap,
@@ -195,7 +198,6 @@ export const Button = ({
195
198
  onClick={props.onClick}
196
199
  disabled={disabled}
197
200
  href={href}
198
- data-theme={variant === "navigation" ? "brand" : undefined}
199
201
  >
200
202
  {leftIcon && leftIcon}
201
203
 
@@ -146,7 +146,7 @@ export const DataGridCell = memo(
146
146
  lockedHeaderBgStyles,
147
147
  iconComponentStyles,
148
148
  className,
149
- "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-action-primary-normal",
149
+ "flex flex-1 items-center gap-1 whitespace-nowrap h-10 relative text-text-primary-normal",
150
150
  "focus-within:!z-10",
151
151
  "overflow-x-hidden",
152
152
  component === "input" && "border",
@@ -169,7 +169,6 @@ export const DataGridCell = memo(
169
169
  className={clsx("flex h-10", !width && "flex-1")}
170
170
  style={{ width }}
171
171
  {...props}
172
- data-theme={type === "header" ? "brand" : undefined}
173
172
  >
174
173
  <div
175
174
  className={cellClasses}