@pismo/marola 1.0.0-beta.3 → 1.0.0-beta.30

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 (127) hide show
  1. package/dist/{Button-2b1peDFT.js → Button-BAljjMv3.js} +2 -2
  2. package/dist/{ClickAwayListener-BSW-Nd-y.js → ClickAwayListener-DbEYZpyh.js} +4 -3
  3. package/dist/Dialog.module-D9e4RsKo.js +30 -0
  4. package/dist/{Popup-B6ZSGIEI.js → Popup-Ck3XlWMq.js} +3 -3
  5. package/dist/{Portal-DIeBsWdL.js → Portal-oY3enyAm.js} +2 -2
  6. package/dist/SelectButton-BlVl6pJn.js +70 -0
  7. package/dist/{Tabs.module-jkH1Qjn7.js → Tabs.module-BGGTkDc5.js} +7 -7
  8. package/dist/Toggle-Buew6bzm.js +182 -0
  9. package/dist/assets/Adornment.css +1 -0
  10. package/dist/assets/Advice.css +1 -1
  11. package/dist/assets/Autocomplete.css +1 -0
  12. package/dist/assets/Button.css +1 -1
  13. package/dist/assets/Checkbox.css +1 -1
  14. package/dist/assets/Dialog.css +1 -1
  15. package/dist/assets/IconButton.css +1 -1
  16. package/dist/assets/Input.css +1 -1
  17. package/dist/assets/PageHeader.css +1 -1
  18. package/dist/assets/Pagination.css +1 -1
  19. package/dist/assets/ResultWithChips.css +1 -0
  20. package/dist/assets/SelectButton.css +1 -1
  21. package/dist/assets/Snackbar.css +1 -1
  22. package/dist/assets/SortTooltip.css +1 -1
  23. package/dist/assets/Stepper.css +1 -1
  24. package/dist/assets/StepperNavigator.css +1 -0
  25. package/dist/assets/Table.css +1 -1
  26. package/dist/assets/Tabs.css +1 -1
  27. package/dist/assets/TextDisplay.css +1 -1
  28. package/dist/assets/Toggle.css +1 -1
  29. package/dist/assets/Toggle2.css +1 -1
  30. package/dist/assets/Typography.css +1 -1
  31. package/dist/{combineHooksSlotProps-DVjg9PRh.js → combineHooksSlotProps-C-zYvfnF.js} +1 -1
  32. package/dist/components/Adornment/Adornment.d.ts +20 -0
  33. package/dist/components/Adornment/Adornment.js +13 -0
  34. package/dist/components/Adornment/Adornment.stories.d.ts +14 -0
  35. package/dist/components/Adornment/adornment.test.d.ts +1 -0
  36. package/dist/components/Advice/Advice.d.ts +32 -17
  37. package/dist/components/Advice/Advice.js +39 -40
  38. package/dist/components/Advice/Advice.stories.d.ts +4 -3
  39. package/dist/components/Autocomplete/Autocomplete.d.ts +20 -0
  40. package/dist/components/Autocomplete/Autocomplete.js +679 -0
  41. package/dist/components/Autocomplete/Autocomplete.stories.d.ts +23 -0
  42. package/dist/components/Button/Button.d.ts +2 -0
  43. package/dist/components/Button/Button.js +51 -49
  44. package/dist/components/Checkbox/Checkbox.js +52 -52
  45. package/dist/components/Chip/Chip.d.ts +6 -12
  46. package/dist/components/Chip/Chip.js +7 -5
  47. package/dist/components/Chip/Chip.stories.d.ts +5 -14
  48. package/dist/components/Dialog/Actions.js +1 -1
  49. package/dist/components/Dialog/Backdrop.d.ts +3 -3
  50. package/dist/components/Dialog/Backdrop.js +8 -7
  51. package/dist/components/Dialog/CloseIconButton.d.ts +1 -2
  52. package/dist/components/Dialog/CloseIconButton.js +15 -18
  53. package/dist/components/Dialog/Dialog.d.ts +9 -6
  54. package/dist/components/Dialog/Dialog.js +139 -139
  55. package/dist/components/Dialog/Dialog.stories.d.ts +50 -46
  56. package/dist/components/Dialog/DialogTitle.js +1 -1
  57. package/dist/components/EllipsisTooltip/EllipsisTooltip.js +30 -17
  58. package/dist/components/EllipsisTooltip/EllipsisTooltip.stories.d.ts +2 -1
  59. package/dist/components/Icon/Icon.js +93 -47
  60. package/dist/components/Icon/types.d.ts +1 -1
  61. package/dist/components/IconButton/IconButton.js +42 -42
  62. package/dist/components/Input/Input.d.ts +24 -5
  63. package/dist/components/Input/Input.js +297 -284
  64. package/dist/components/Input/Input.stories.d.ts +2 -21
  65. package/dist/components/InputSearch/InputSearch.stories.d.ts +1 -21
  66. package/dist/components/PageHeader/PageHeader.js +57 -57
  67. package/dist/components/Pagination/Pagination.d.ts +5 -1
  68. package/dist/components/Pagination/Pagination.js +87 -185
  69. package/dist/components/Pagination/Pagination.stories.d.ts +1 -1
  70. package/dist/components/Pagination/usePagination.d.ts +90 -0
  71. package/dist/components/Pagination/usePagination.js +79 -0
  72. package/dist/components/ResultWithChips/ResultWithChips.d.ts +12 -0
  73. package/dist/components/ResultWithChips/ResultWithChips.js +33 -0
  74. package/dist/components/RowItem/RowItem.d.ts +25 -0
  75. package/dist/components/RowItem/RowItem.js +20 -0
  76. package/dist/components/RowItem/RowItem.stories.d.ts +17 -0
  77. package/dist/components/RowItem/rowItem.test.d.ts +1 -0
  78. package/dist/components/Select/Select.d.ts +7 -0
  79. package/dist/components/Select/Select.js +409 -365
  80. package/dist/components/Select/SelectButton.d.ts +1 -0
  81. package/dist/components/Select/SelectButton.js +1 -1
  82. package/dist/components/Skeleton/Skeleton.d.ts +3 -1
  83. package/dist/components/Skeleton/Skeleton.js +18 -12
  84. package/dist/components/Skeleton/SkeletonTable.stories.d.ts +1 -1
  85. package/dist/components/Snackbar/Snackbar.js +94 -94
  86. package/dist/components/Snackbar/Snackbar.stories.d.ts +3 -3
  87. package/dist/components/SortTooltip/SortTooltip.js +46 -46
  88. package/dist/components/Stepper/Stepper.js +35 -35
  89. package/dist/components/StepperNavigator/StepperNavigator.d.ts +43 -0
  90. package/dist/components/StepperNavigator/StepperNavigator.js +56 -0
  91. package/dist/components/StepperNavigator/StepperNavigator.stories.d.ts +16 -0
  92. package/dist/components/StepperNavigator/StepperNavigator.test.d.ts +1 -0
  93. package/dist/components/Table/Table.d.ts +3 -1
  94. package/dist/components/Table/Table.js +88 -85
  95. package/dist/components/Table/Table.stories.d.ts +1 -1
  96. package/dist/components/Tabs/Tab.d.ts +5 -3
  97. package/dist/components/Tabs/Tab.js +38 -36
  98. package/dist/components/Tabs/TabPanel.d.ts +4 -2
  99. package/dist/components/Tabs/TabPanel.js +51 -40
  100. package/dist/components/Tabs/Tabs.d.ts +6 -4
  101. package/dist/components/Tabs/Tabs.js +131 -128
  102. package/dist/components/TextDisplay/TextDisplay.d.ts +9 -3
  103. package/dist/components/TextDisplay/TextDisplay.js +45 -31
  104. package/dist/components/TextDisplay/TextDisplay.stories.d.ts +2 -1
  105. package/dist/components/Toggle/Toggle.js +56 -56
  106. package/dist/components/ToggleGroup/Toggle.js +5 -4
  107. package/dist/components/ToggleGroup/ToggleGroup.js +1 -1
  108. package/dist/components/Tooltip/Tooltip.d.ts +3 -1
  109. package/dist/components/Tooltip/Tooltip.js +4 -4
  110. package/dist/components/Tooltip/Tooltip.stories.d.ts +1 -0
  111. package/dist/components/Typography/Typography.js +47 -47
  112. package/dist/{index-CjW42-M-.js → index-bQFToy-I.js} +1 -1
  113. package/dist/main.d.ts +5 -0
  114. package/dist/main.js +85 -76
  115. package/dist/ownerDocument-YGhwAnr1.js +33 -0
  116. package/dist/{useButton-DNk3wrQp.js → useButton-DcihopJG.js} +1 -1
  117. package/dist/useCompoundItem-B7Eo_qZk.js +68 -0
  118. package/dist/useEventCallback-BAQJJ3ye.js +14 -0
  119. package/dist/useId-BW-oWmul.js +19 -0
  120. package/dist/{useList-B0hog_3-.js → useList-B9C55YB7.js} +2 -2
  121. package/dist/{index-CH45lKw7.js → useSlotProps-C_I1kEHr.js} +99 -99
  122. package/package.json +9 -3
  123. package/dist/Dialog.module-DFEmFdYT.js +0 -30
  124. package/dist/SelectButton-C8JQKaf4.js +0 -61
  125. package/dist/Toggle-BCgIItCc.js +0 -142
  126. package/dist/useCompoundItem-D1iRfg8D.js +0 -84
  127. package/dist/useEventCallback-xTG9piMa.js +0 -45
@@ -16,6 +16,8 @@ type ButtonCoreProps = {
16
16
  variant?: Variant;
17
17
  /** mui base button props */
18
18
  muiButtonBaseProps?: MUIButtonBaseProps;
19
+ /** Id to be applied as `data-testid` on the container element */
20
+ 'data-testid'?: string;
19
21
  };
20
22
  interface ButtonPropsWithLink extends ButtonCoreProps {
21
23
  /** link for component to navigate to, if provide component will be an anchor */
@@ -1,65 +1,67 @@
1
1
  import '../../assets/Button.css';
2
- import { jsx as n, jsxs as l } from "react/jsx-runtime";
3
- import { forwardRef as f, useMemo as d } from "react";
4
- import { c } from "../../clsx-DB4S2d7J.js";
2
+ import { jsx as p, jsxs as l } from "react/jsx-runtime";
3
+ import { forwardRef as x, useMemo as c } from "react";
4
+ import { c as v } from "../../clsx-DB4S2d7J.js";
5
5
  import { LoadingSpinner as m } from "../LoadingSpinner/LoadingSpinner.js";
6
- import { B as x } from "../../Button-2b1peDFT.js";
7
- const k = "_button_1ynf4_56", o = {
8
- "u-typography-h1": "_u-typography-h1_1ynf4_1",
9
- "u-typography-h2": "_u-typography-h2_1ynf4_8",
10
- "u-typography-h3": "_u-typography-h3_1ynf4_15",
11
- "u-typography-h4": "_u-typography-h4_1ynf4_22",
12
- "u-typography-h5": "_u-typography-h5_1ynf4_29",
13
- "u-typography-h6": "_u-typography-h6_1ynf4_36",
14
- "u-typography-base": "_u-typography-base_1ynf4_43",
15
- "u-typography-base--xxl": "_u-typography-base--xxl_1ynf4_48",
16
- "u-typography-base--xl": "_u-typography-base--xl_1ynf4_52",
17
- "u-typography-base--lg": "_u-typography-base--lg_1ynf4_56",
6
+ import { B as f } from "../../Button-BAljjMv3.js";
7
+ const k = "_button_dxo5v_57", t = {
8
+ "u-typography-h1": "_u-typography-h1_dxo5v_1",
9
+ "u-typography-h2": "_u-typography-h2_dxo5v_8",
10
+ "u-typography-h3": "_u-typography-h3_dxo5v_15",
11
+ "u-typography-h4": "_u-typography-h4_dxo5v_22",
12
+ "u-typography-h5": "_u-typography-h5_dxo5v_29",
13
+ "u-typography-h6": "_u-typography-h6_dxo5v_36",
14
+ "u-typography-base": "_u-typography-base_dxo5v_43",
15
+ "u-typography-base--xxl": "_u-typography-base--xxl_dxo5v_49",
16
+ "u-typography-base--xl": "_u-typography-base--xl_dxo5v_53",
17
+ "u-typography-base--lg": "_u-typography-base--lg_dxo5v_57",
18
18
  button: k,
19
- "u-typography-base--sm": "_u-typography-base--sm_1ynf4_60",
20
- "u-typography-base--bold": "_u-typography-base--bold_1ynf4_64",
21
- "u-typography-base--strikethrough": "_u-typography-base--strikethrough_1ynf4_67",
22
- "u-typography-base--underlined": "_u-typography-base--underlined_1ynf4_70",
23
- "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_1ynf4_73",
24
- "button--primary": "_button--primary_1ynf4_85",
25
- "button--secondary": "_button--secondary_1ynf4_100",
26
- "button--quick": "_button--quick_1ynf4_117",
27
- "button__loading-container": "_button__loading-container_1ynf4_137"
28
- }, P = f((r, p) => {
19
+ "u-typography-base--sm": "_u-typography-base--sm_dxo5v_61",
20
+ "u-typography-base--bold": "_u-typography-base--bold_dxo5v_65",
21
+ "u-typography-base--strikethrough": "_u-typography-base--strikethrough_dxo5v_68",
22
+ "u-typography-base--underlined": "_u-typography-base--underlined_dxo5v_71",
23
+ "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_dxo5v_74",
24
+ "button--primary": "_button--primary_dxo5v_86",
25
+ "button--secondary": "_button--secondary_dxo5v_101",
26
+ "button--quick": "_button--quick_dxo5v_118",
27
+ "button__loading-container": "_button__loading-container_dxo5v_138"
28
+ }, S = x((y, _) => {
29
29
  const {
30
- onClick: _,
31
- link: u,
32
- loading: e,
33
- children: y,
30
+ onClick: u,
31
+ link: e,
32
+ loading: n,
33
+ children: a,
34
34
  type: s = "button",
35
35
  disabled: h,
36
- className: a,
37
- variant: t = "primary",
38
- muiButtonBaseProps: g
39
- } = r, i = {
40
- invert: t === "secondary" || t === "quick"
41
- }, b = d(
42
- () => c([o.button, o[`button--${t}`], a]),
43
- [a, t]
36
+ className: r,
37
+ variant: o = "primary",
38
+ muiButtonBaseProps: d,
39
+ "data-testid": g
40
+ } = y, i = {
41
+ invert: o === "secondary" || o === "quick"
42
+ }, b = c(
43
+ () => v([t.button, t[`button--${o}`], r]),
44
+ [r, o]
44
45
  );
45
- return /* @__PURE__ */ n(
46
- x,
46
+ return /* @__PURE__ */ p(
47
+ f,
47
48
  {
48
49
  type: s,
49
- href: u,
50
- onClick: _,
50
+ href: e,
51
+ onClick: u,
51
52
  disabled: h,
52
53
  className: b,
53
- ref: p,
54
- ...g ?? {},
55
- children: e ? /* @__PURE__ */ l("div", { className: o["button__loading-container"], children: [
56
- /* @__PURE__ */ n(m, { ...i }),
57
- y
58
- ] }) : y
54
+ ref: _,
55
+ "data-testid": g,
56
+ ...d ?? {},
57
+ children: n ? /* @__PURE__ */ l("div", { className: t["button__loading-container"], children: [
58
+ /* @__PURE__ */ p(m, { ...i }),
59
+ a
60
+ ] }) : a
59
61
  }
60
62
  );
61
63
  });
62
64
  export {
63
- P as Button,
64
- P as default
65
+ S as Button,
66
+ S as default
65
67
  };
@@ -1,71 +1,71 @@
1
1
  import '../../assets/Checkbox.css';
2
- import { jsxs as v, jsx as c } from "react/jsx-runtime";
3
- import * as o from "react";
2
+ import { jsxs as w, jsx as c } from "react/jsx-runtime";
3
+ import * as l from "react";
4
4
  import { useState as k, useEffect as i } from "react";
5
- import { c as s } from "../../clsx-DB4S2d7J.js";
6
- const N = (a) => /* @__PURE__ */ o.createElement("svg", { width: 14, height: 10, viewBox: "0 0 14 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...a }, /* @__PURE__ */ o.createElement("path", { d: "M13.7063 0.293438C14.0969 0.684062 14.0969 1.31531 13.7063 1.70594L5.70625 9.70594C5.31563 10.0966 4.68437 10.0966 4.29375 9.70594L0.292875 5.70594C-0.097625 5.31531 -0.097625 4.68406 0.292875 4.29344C0.683437 3.90281 1.31656 3.90281 1.70719 4.29344L4.97188 7.58406L12.2937 0.293438C12.6844 -0.0978125 13.3156 -0.0978125 13.7063 0.293438Z", fill: "#F7F7FC" })), z = "_label_18hen_64", E = "_checkmark_18hen_93", e = {
7
- "u-typography-h1": "_u-typography-h1_18hen_1",
8
- "u-typography-h2": "_u-typography-h2_18hen_8",
9
- "u-typography-h3": "_u-typography-h3_18hen_15",
10
- "u-typography-h4": "_u-typography-h4_18hen_22",
11
- "u-typography-h5": "_u-typography-h5_18hen_29",
12
- "u-typography-h6": "_u-typography-h6_18hen_36",
13
- "u-typography-base": "_u-typography-base_18hen_43",
14
- "u-typography-base--xxl": "_u-typography-base--xxl_18hen_48",
15
- "u-typography-base--xl": "_u-typography-base--xl_18hen_52",
16
- "u-typography-base--lg": "_u-typography-base--lg_18hen_56",
17
- "u-typography-base--sm": "_u-typography-base--sm_18hen_60",
18
- "u-typography-base--bold": "_u-typography-base--bold_18hen_64",
19
- "checkbox-wrapper": "_checkbox-wrapper_18hen_64",
20
- "label--highlighted": "_label--highlighted_18hen_64",
21
- "u-typography-base--strikethrough": "_u-typography-base--strikethrough_18hen_67",
22
- "u-typography-base--underlined": "_u-typography-base--underlined_18hen_70",
23
- "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_18hen_73",
24
- label: z,
25
- "label--highlighted-checked": "_label--highlighted-checked_18hen_90",
26
- checkmark: E,
27
- "checkmark--checked": "_checkmark--checked_18hen_105",
28
- "checkmark--light-theme": "_checkmark--light-theme_18hen_108",
29
- "checkmark--accent-theme": "_checkmark--accent-theme_18hen_115",
30
- "checkmark--small-size": "_checkmark--small-size_18hen_122",
31
- "checkmark--normal-size": "_checkmark--normal-size_18hen_129"
32
- }, F = (a) => /* @__PURE__ */ o.createElement("svg", { width: 10, height: 3, viewBox: "0 0 10 3", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...a }, /* @__PURE__ */ o.createElement("rect", { y: 0.5, width: 10, height: 2, rx: 1, fill: "#1897F3" })), M = ({
5
+ import { c as _ } from "../../clsx-DB4S2d7J.js";
6
+ const v = (a) => /* @__PURE__ */ l.createElement("svg", { width: 14, height: 10, viewBox: "0 0 14 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...a }, /* @__PURE__ */ l.createElement("path", { d: "M13.7063 0.293438C14.0969 0.684062 14.0969 1.31531 13.7063 1.70594L5.70625 9.70594C5.31563 10.0966 4.68437 10.0966 4.29375 9.70594L0.292875 5.70594C-0.097625 5.31531 -0.097625 4.68406 0.292875 4.29344C0.683437 3.90281 1.31656 3.90281 1.70719 4.29344L4.97188 7.58406L12.2937 0.293438C12.6844 -0.0978125 13.3156 -0.0978125 13.7063 0.293438Z", fill: "#F7F7FC" })), N = "_label_xqg5n_65", z = "_checkmark_xqg5n_94", e = {
7
+ "u-typography-h1": "_u-typography-h1_xqg5n_1",
8
+ "u-typography-h2": "_u-typography-h2_xqg5n_8",
9
+ "u-typography-h3": "_u-typography-h3_xqg5n_15",
10
+ "u-typography-h4": "_u-typography-h4_xqg5n_22",
11
+ "u-typography-h5": "_u-typography-h5_xqg5n_29",
12
+ "u-typography-h6": "_u-typography-h6_xqg5n_36",
13
+ "u-typography-base": "_u-typography-base_xqg5n_43",
14
+ "u-typography-base--xxl": "_u-typography-base--xxl_xqg5n_49",
15
+ "u-typography-base--xl": "_u-typography-base--xl_xqg5n_53",
16
+ "u-typography-base--lg": "_u-typography-base--lg_xqg5n_57",
17
+ "u-typography-base--sm": "_u-typography-base--sm_xqg5n_61",
18
+ "u-typography-base--bold": "_u-typography-base--bold_xqg5n_65",
19
+ "checkbox-wrapper": "_checkbox-wrapper_xqg5n_65",
20
+ "label--highlighted": "_label--highlighted_xqg5n_65",
21
+ "u-typography-base--strikethrough": "_u-typography-base--strikethrough_xqg5n_68",
22
+ "u-typography-base--underlined": "_u-typography-base--underlined_xqg5n_71",
23
+ "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_xqg5n_74",
24
+ label: N,
25
+ "label--highlighted-checked": "_label--highlighted-checked_xqg5n_91",
26
+ checkmark: z,
27
+ "checkmark--checked": "_checkmark--checked_xqg5n_106",
28
+ "checkmark--light-theme": "_checkmark--light-theme_xqg5n_109",
29
+ "checkmark--accent-theme": "_checkmark--accent-theme_xqg5n_116",
30
+ "checkmark--small-size": "_checkmark--small-size_xqg5n_123",
31
+ "checkmark--normal-size": "_checkmark--normal-size_xqg5n_130"
32
+ }, E = (a) => /* @__PURE__ */ l.createElement("svg", { width: 10, height: 3, viewBox: "0 0 10 3", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...a }, /* @__PURE__ */ l.createElement("rect", { y: 0.5, width: 10, height: 2, rx: 1, fill: "#1897F3" })), B = ({
33
33
  className: a,
34
- label: n,
34
+ label: s,
35
35
  name: m,
36
- theme: u = "accent",
37
- size: b = "normal",
36
+ theme: x = "accent",
37
+ size: u = "normal",
38
38
  checked: r,
39
- onChange: d,
40
- isIndeterminate: l,
41
- highlightLabel: x = !1,
42
- ...p
39
+ onChange: b,
40
+ isIndeterminate: g,
41
+ highlightLabel: d = !1,
42
+ ...o
43
43
  }) => {
44
- const [h, g] = k(r), [t, y] = k(l);
44
+ const [h, n] = k(r), [t, y] = k(g);
45
45
  i(() => {
46
- r !== h && g(r);
46
+ r !== h && n(r);
47
47
  }, [r]), i(() => {
48
- typeof l == "boolean" && y(l);
49
- }, [l]);
50
- const C = s(e["checkbox-wrapper"], a), f = s(
48
+ typeof g == "boolean" && y(g);
49
+ }, [g]);
50
+ const q = _(e["checkbox-wrapper"], a), C = _(
51
51
  e.checkmark,
52
- e[`checkmark--${u}-theme`],
53
- e[`checkmark--${b}-size`],
52
+ e[`checkmark--${x}-theme`],
53
+ e[`checkmark--${u}-size`],
54
54
  (h || t) && e["checkmark--checked"]
55
- ), w = x && (p.children || n) ? s(
55
+ ), f = d && (o.children || s) ? _(
56
56
  e.label,
57
57
  e["label--highlighted"],
58
58
  (h || t) && e["label--highlighted-checked"]
59
59
  ) : e.label;
60
- return /* @__PURE__ */ v("div", { className: C, onClick: () => {
61
- let _ = !h;
62
- t && (y(!1), _ = !0), d(_), g(_);
63
- }, ...p, children: [
60
+ return /* @__PURE__ */ w("div", { className: q, onClick: () => {
61
+ let p = !h;
62
+ t && (y(!1), p = !0), b(p), n(p);
63
+ }, ...o, children: [
64
64
  /* @__PURE__ */ c("input", { name: m, type: "checkbox", checked: !t && h, readOnly: !0 }),
65
- /* @__PURE__ */ c("span", { className: f, children: t ? /* @__PURE__ */ c(F, {}) : h && /* @__PURE__ */ c(N, {}) }),
66
- /* @__PURE__ */ c("label", { className: w, children: p.children || n })
65
+ /* @__PURE__ */ c("span", { className: C, children: t ? /* @__PURE__ */ c(E, {}) : h && /* @__PURE__ */ c(v, {}) }),
66
+ /* @__PURE__ */ c("label", { className: f, children: o.children || s })
67
67
  ] });
68
68
  };
69
69
  export {
70
- M as Checkbox
70
+ B as Checkbox
71
71
  };
@@ -1,14 +1,14 @@
1
- import { IconProps } from '../../main';
2
- import { ReactElement, ReactNode } from 'react';
1
+ import { AdornmentProps } from '../../main';
2
+ import { ReactNode } from 'react';
3
3
 
4
4
  export type Variant = 'default' | 'contained' | 'outlined';
5
- type ChipProps = {
5
+ export type ChipProps = {
6
6
  /** Main content to display, typically just some text */
7
7
  label: ReactNode;
8
8
  /** Whether to show loading state (skeleton) */
9
9
  loading?: boolean;
10
10
  /** Left icon to display */
11
- leftAdornment?: ChipAdornmentSlotProps;
11
+ leftAdornment?: AdornmentProps;
12
12
  /** Dataset test id only used for tests to reach in and grab the rendered DOM node of the chip wrapper */
13
13
  'data-testid'?: string;
14
14
  /** Functionality to perform when the main body of the chip is clicked */
@@ -27,13 +27,7 @@ type ChipProps = {
27
27
  /** Dataset test id only used for tests, used to hook onto the loading skeleton component for this chip */
28
28
  'data-testid-skeleton'?: string;
29
29
  };
30
- export type ChipAdornmentSlotProps = {
31
- /** The Marola Icon to display */
32
- icon: ReactElement<IconProps>;
33
- /** Any additional classes to apply to icon */
34
- className?: string;
35
- /** Dataset test id only used for tests to reach in and grab the rendered DOM node of the icon */
36
- 'data-testid'?: string;
30
+ export type ChipWrapperProps = Pick<ChipProps, 'data-testid' | 'onClickContent' | 'disabled' | 'className' | 'variant'> & {
31
+ children?: ReactNode;
37
32
  };
38
33
  export declare const Chip: import('react').ForwardRefExoticComponent<ChipProps & import('react').RefAttributes<unknown>>;
39
- export {};
@@ -1,11 +1,13 @@
1
1
  import "react/jsx-runtime";
2
2
  import "react";
3
3
  import "../../clsx-DB4S2d7J.js";
4
+ import "../Adornment/Adornment.js";
4
5
  import "../Icon/Icon.js";
5
- import "../Button/Button.js";
6
- import { C as j } from "../../Toggle-BCgIItCc.js";
7
- import "../Dialog/Backdrop.js";
8
6
  import "../Typography/Typography.js";
7
+ import "../Input/Input.js";
8
+ import "../Button/Button.js";
9
+ import { C as l } from "../../Toggle-Buew6bzm.js";
10
+ import "../Dialog/Dialog.js";
9
11
  import "../IconButton/IconButton.js";
10
12
  import "../Select/Select.js";
11
13
  import "../Skeleton/Skeleton.js";
@@ -13,7 +15,7 @@ import "../Table/Table.js";
13
15
  import "../Tabs/Tabs.js";
14
16
  import "../../Group-B3p31ftp.js";
15
17
  import "../../contexts/SnackbarProvider/SnackbarProvider.js";
16
- import "../../Button-2b1peDFT.js";
18
+ import "../../Button-BAljjMv3.js";
17
19
  export {
18
- j as Chip
20
+ l as Chip
19
21
  };
@@ -2,24 +2,12 @@ import { StoryObj } from '@storybook/react';
2
2
 
3
3
  declare const meta: {
4
4
  title: string;
5
- component: import('react').ForwardRefExoticComponent<{
6
- label: import('react').ReactNode;
7
- loading?: boolean | undefined;
8
- leftAdornment?: import('./Chip').ChipAdornmentSlotProps | undefined;
9
- 'data-testid'?: string | undefined;
10
- onClickContent?: (() => void) | undefined;
11
- onClickRemove?: (() => void) | undefined;
12
- disabled?: boolean | undefined;
13
- className?: string | undefined;
14
- 'className-skeleton'?: string | undefined;
15
- variant?: import('./Chip').Variant | undefined;
16
- 'data-testid-skeleton'?: string | undefined;
17
- } & import('react').RefAttributes<unknown>>;
5
+ component: import('react').ForwardRefExoticComponent<import('./Chip').ChipProps & import('react').RefAttributes<unknown>>;
18
6
  tags: string[];
19
7
  decorators: ((Story: import('@storybook/types').PartialStoryFn<import('@storybook/react').ReactRenderer, {
20
8
  label: import('react').ReactNode;
21
9
  loading?: boolean | undefined;
22
- leftAdornment?: import('./Chip').ChipAdornmentSlotProps | undefined;
10
+ leftAdornment?: import('../Adornment/Adornment').AdornmentProps | undefined;
23
11
  'data-testid'?: string | undefined;
24
12
  onClickContent?: (() => void) | undefined;
25
13
  onClickRemove?: (() => void) | undefined;
@@ -36,7 +24,10 @@ export default meta;
36
24
  type Story = StoryObj<typeof meta>;
37
25
  export declare const Simple: Story;
38
26
  export declare const Clickable: Story;
27
+ export declare const Disabled: Story;
39
28
  export declare const ClickableWithRemove: Story;
29
+ export declare const ClickableOnlyRemove: Story;
40
30
  export declare const FullDefault: Story;
41
31
  export declare const FullOutlined: Story;
42
32
  export declare const FullContained: Story;
33
+ export declare const FullContainedCustomIcon: Story;
@@ -1,5 +1,5 @@
1
1
  import { jsx as o } from "react/jsx-runtime";
2
- import { s as t } from "../../Dialog.module-DFEmFdYT.js";
2
+ import { s as t } from "../../Dialog.module-D9e4RsKo.js";
3
3
  const i = ({ children: s }) => /* @__PURE__ */ o("div", { className: t.dialog__actions, children: s });
4
4
  export {
5
5
  i as default
@@ -1,6 +1,6 @@
1
- /// <reference types="react" />
2
- declare const Backdrop: import('react').ForwardRefExoticComponent<{
3
- open?: boolean | undefined;
1
+ import { ModalBackdropSlotProps } from '@mui/base';
2
+
3
+ declare const Backdrop: import('react').ForwardRefExoticComponent<ModalBackdropSlotProps & {
4
4
  className: string;
5
5
  } & import('react').RefAttributes<HTMLDivElement>>;
6
6
  export default Backdrop;
@@ -1,10 +1,11 @@
1
1
  import { jsx as a } from "react/jsx-runtime";
2
- import { forwardRef as t } from "react";
3
- import { s as e } from "../../Dialog.module-DFEmFdYT.js";
4
- const i = t((o, r) => {
5
- const { open: m, className: p, ...s } = o;
6
- return /* @__PURE__ */ a("div", { className: e.dialog__backdrop, ref: r, ...s });
7
- });
2
+ import { forwardRef as s } from "react";
3
+ import { c as t } from "../../clsx-DB4S2d7J.js";
4
+ import { s as m } from "../../Dialog.module-D9e4RsKo.js";
5
+ const l = s(
6
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
7
+ ({ ownerState: e, ...r }, o) => /* @__PURE__ */ a("div", { ...r, className: t(m.dialog__backdrop, r.className), ref: o })
8
+ );
8
9
  export {
9
- i as default
10
+ l as default
10
11
  };
@@ -1,6 +1,5 @@
1
1
  export interface CloseIconButtonProps {
2
2
  handleOnClose: () => void;
3
- className: string;
4
3
  }
5
- declare const CloseIconButton: ({ handleOnClose, className }: CloseIconButtonProps) => import("react/jsx-runtime").JSX.Element;
4
+ declare const CloseIconButton: ({ handleOnClose }: CloseIconButtonProps) => import("react/jsx-runtime").JSX.Element;
6
5
  export default CloseIconButton;
@@ -1,20 +1,17 @@
1
- import { jsx as s } from "react/jsx-runtime";
2
- import { Icon as r } from "../Icon/Icon.js";
3
- import { s as t } from "../../Dialog.module-DFEmFdYT.js";
4
- import { B as a } from "../../Button-2b1peDFT.js";
5
- const d = ({ handleOnClose: i, className: o }) => {
6
- const l = o != null ? t["dialog__close-icon "] + o : t["dialog__close-icon"];
7
- return /* @__PURE__ */ s(
8
- a,
9
- {
10
- className: l,
11
- "aria-description": "Close dialog",
12
- onClick: i,
13
- "data-testid": "dialog-close-button",
14
- children: /* @__PURE__ */ s(r, { icon: "circle-xmark", size: 32, color: "var(--gray-75)" })
15
- }
16
- );
17
- };
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import { Icon as t } from "../Icon/Icon.js";
3
+ import { s as i } from "../../Dialog.module-D9e4RsKo.js";
4
+ import { B as s } from "../../Button-BAljjMv3.js";
5
+ const n = ({ handleOnClose: r }) => /* @__PURE__ */ o(
6
+ s,
7
+ {
8
+ className: i["dialog__close-icon"],
9
+ "aria-description": "Close dialog",
10
+ onClick: r,
11
+ "data-testid": "dialog-close-button",
12
+ children: /* @__PURE__ */ o(t, { icon: "circle-xmark", size: 32, color: "var(--gray-75)" })
13
+ }
14
+ );
18
15
  export {
19
- d as default
16
+ n as default
20
17
  };
@@ -1,6 +1,6 @@
1
- import { default as DialogTitle } from './DialogTitle';
2
- import { default as Content } from './Content';
3
- import { default as Actions } from './Actions';
1
+ import { default as DialogTitle, DialogTitleProps } from './DialogTitle';
2
+ import { default as Content, DialogContentProps } from './Content';
3
+ import { default as Actions, DialogActionProps } from './Actions';
4
4
  import { ModalProps } from '@mui/base';
5
5
  import { JSXElementConstructor, ReactElement, ReactNode } from 'react';
6
6
 
@@ -12,11 +12,14 @@ export interface DialogProps extends ModalProps {
12
12
  dialogTitle: ReactNode;
13
13
  /** display subtitle */
14
14
  dialogSubtitle?: ReactNode;
15
- /** if true, show skeleton */
16
- isLoading?: boolean;
17
15
  /** callback for when close is clicked */
18
16
  onClose?: () => void;
19
17
  }
20
- declare const Dialog: ({ children, dialogTitle, dialogSubtitle, isLoading, onClose, ...props }: DialogProps) => import("react/jsx-runtime").JSX.Element;
18
+ declare const Dialog: {
19
+ ({ children, dialogTitle, dialogSubtitle, onClose, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
20
+ Title: import('react').FunctionComponent<DialogTitleProps>;
21
+ Content: import('react').FunctionComponent<DialogContentProps>;
22
+ Actions: import('react').FunctionComponent<DialogActionProps>;
23
+ };
21
24
  export { Dialog, DialogTitle, Content, Actions };
22
25
  export default Dialog;