@pismo/marola 0.0.1-alpha.26 → 0.0.1-alpha.28
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.
- package/dist/Group-B3p31ftp.js +26 -0
- package/dist/Toggle-BnPepwWO.js +143 -0
- package/dist/assets/Advice.css +1 -1
- package/dist/assets/Group.css +1 -1
- package/dist/assets/PageHeader.css +1 -1
- package/dist/assets/Toggle.css +1 -1
- package/dist/components/Advice/Advice.js +36 -36
- package/dist/components/Chip/Chip.d.ts +2 -0
- package/dist/components/Chip/Chip.js +2 -2
- package/dist/components/Chip/Chip.stories.d.ts +2 -0
- package/dist/components/PageHeader/PageHeader.d.ts +32 -6
- package/dist/components/PageHeader/PageHeader.js +80 -63
- package/dist/components/PageHeader/PageHeader.stories.d.ts +2 -31
- package/dist/components/ToggleGroup/Group.js +1 -1
- package/dist/components/ToggleGroup/Toggle.js +2 -2
- package/dist/components/ToggleGroup/ToggleGroup.js +2 -2
- package/dist/main.js +2 -2
- package/package.json +1 -1
- package/dist/Group-CS_qGuuW.js +0 -26
- package/dist/Toggle-9cd68he4.js +0 -141
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import './assets/Group.css';
|
|
2
|
+
import { jsxs as g, jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as i } from "react";
|
|
4
|
+
import { Icon as n } from "./components/Icon/Icon.js";
|
|
5
|
+
const c = "_toggle__input_wlkvp_1", p = "_toggle__label_wlkvp_8", o = {
|
|
6
|
+
toggle__input: c,
|
|
7
|
+
toggle__label: p,
|
|
8
|
+
"toggle__label--selected": "_toggle__label--selected_wlkvp_15",
|
|
9
|
+
"toggle-group__fieldset": "_toggle-group__fieldset_wlkvp_20",
|
|
10
|
+
"toggle-group__options": "_toggle-group__options_wlkvp_25",
|
|
11
|
+
"toggle-group__error": "_toggle-group__error_wlkvp_29"
|
|
12
|
+
}, f = i((e, r) => {
|
|
13
|
+
const { children: s, legend: l, error: _ } = e, d = e["data-testid"] ? `${e["data-testid"]}-legend` : void 0, a = e["data-testid"] ? `${e["data-testid"]}-error` : void 0;
|
|
14
|
+
return /* @__PURE__ */ g("fieldset", { ref: r, "data-testid": e["data-testid"], className: o["toggle-group__fieldset"], children: [
|
|
15
|
+
l && /* @__PURE__ */ t("legend", { "data-testid": d, children: l }),
|
|
16
|
+
/* @__PURE__ */ t("div", { className: o["toggle-group__options"], children: s }),
|
|
17
|
+
_ && /* @__PURE__ */ g("div", { className: o["toggle-group__error"], "data-testid": a, children: [
|
|
18
|
+
/* @__PURE__ */ t(n, { icon: "circle-exclamation", size: 24, color: "var(--alert)" }),
|
|
19
|
+
_
|
|
20
|
+
] })
|
|
21
|
+
] });
|
|
22
|
+
});
|
|
23
|
+
export {
|
|
24
|
+
f as G,
|
|
25
|
+
o as s
|
|
26
|
+
};
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import './assets/Toggle.css';
|
|
2
|
+
import { jsx as r, jsxs as y } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as u, cloneElement as g } from "react";
|
|
4
|
+
import { c as l } from "./clsx-DB4S2d7J.js";
|
|
5
|
+
import "./components/Button/Button.js";
|
|
6
|
+
import { Icon as b } from "./components/Icon/Icon.js";
|
|
7
|
+
import "./components/Dialog/Backdrop.js";
|
|
8
|
+
import { Typography as f } from "./components/Typography/Typography.js";
|
|
9
|
+
import "./components/IconButton/IconButton.js";
|
|
10
|
+
import "./components/Select/Select.js";
|
|
11
|
+
import { Skeleton as k } from "./components/Skeleton/Skeleton.js";
|
|
12
|
+
import "./components/Table/Table.js";
|
|
13
|
+
import "./components/Tabs/Tabs.js";
|
|
14
|
+
import { s as c } from "./Group-B3p31ftp.js";
|
|
15
|
+
import "./contexts/SnackbarProvider/SnackbarProvider.js";
|
|
16
|
+
import { B as x } from "./Button-2b1peDFT.js";
|
|
17
|
+
const C = "_chip_16u49_60", N = "_chip__adornment_16u49_114", v = "_chip__remove_16u49_119", T = "_chip__skeleton_16u49_133", _ = {
|
|
18
|
+
"u-typography-h1": "_u-typography-h1_16u49_1",
|
|
19
|
+
"u-typography-h2": "_u-typography-h2_16u49_8",
|
|
20
|
+
"u-typography-h3": "_u-typography-h3_16u49_15",
|
|
21
|
+
"u-typography-h4": "_u-typography-h4_16u49_22",
|
|
22
|
+
"u-typography-h5": "_u-typography-h5_16u49_29",
|
|
23
|
+
"u-typography-h6": "_u-typography-h6_16u49_36",
|
|
24
|
+
"u-typography-base": "_u-typography-base_16u49_43",
|
|
25
|
+
"u-typography-base--xxl": "_u-typography-base--xxl_16u49_48",
|
|
26
|
+
"u-typography-base--xl": "_u-typography-base--xl_16u49_52",
|
|
27
|
+
"u-typography-base--lg": "_u-typography-base--lg_16u49_56",
|
|
28
|
+
"u-typography-base--sm": "_u-typography-base--sm_16u49_60",
|
|
29
|
+
chip: C,
|
|
30
|
+
"u-typography-base--bold": "_u-typography-base--bold_16u49_64",
|
|
31
|
+
"u-typography-base--strikethrough": "_u-typography-base--strikethrough_16u49_67",
|
|
32
|
+
"u-typography-base--underlined": "_u-typography-base--underlined_16u49_70",
|
|
33
|
+
"u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_16u49_73",
|
|
34
|
+
"chip--button": "_chip--button_16u49_89",
|
|
35
|
+
"chip--outlined": "_chip--outlined_16u49_102",
|
|
36
|
+
"chip--contained": "_chip--contained_16u49_108",
|
|
37
|
+
chip__adornment: N,
|
|
38
|
+
chip__remove: v,
|
|
39
|
+
"chip__remove--disabled": "_chip__remove--disabled_16u49_130",
|
|
40
|
+
chip__skeleton: T
|
|
41
|
+
}, R = u((t, e) => {
|
|
42
|
+
const { children: i, onClickContent: a, disabled: s, className: p, variant: h } = t;
|
|
43
|
+
let o = l(
|
|
44
|
+
_.chip,
|
|
45
|
+
{ [_["chip--outlined"]]: h === "outlined" },
|
|
46
|
+
{ [_["chip--contained"]]: h === "contained" },
|
|
47
|
+
p
|
|
48
|
+
);
|
|
49
|
+
return a ? (o += ` ${_["chip--button"]}`, /* @__PURE__ */ r(
|
|
50
|
+
x,
|
|
51
|
+
{
|
|
52
|
+
onClick: a,
|
|
53
|
+
disabled: s,
|
|
54
|
+
"data-testid": t["data-testid"],
|
|
55
|
+
ref: e,
|
|
56
|
+
className: o,
|
|
57
|
+
children: i
|
|
58
|
+
}
|
|
59
|
+
)) : /* @__PURE__ */ r("span", { "data-testid": t["data-testid"], ref: e, className: o, children: i });
|
|
60
|
+
}), A = (t) => {
|
|
61
|
+
const { icon: e, disabled: i = !1, className: a } = t;
|
|
62
|
+
if (e) {
|
|
63
|
+
const s = l(_.chip__adornment, a), p = i ? g(e, { color: "rgb(var(--gray-95-rgb), 0.4)" }) : e;
|
|
64
|
+
return /* @__PURE__ */ r("span", { className: s, children: p });
|
|
65
|
+
}
|
|
66
|
+
return null;
|
|
67
|
+
}, H = u((t, e) => {
|
|
68
|
+
const {
|
|
69
|
+
label: i,
|
|
70
|
+
className: a,
|
|
71
|
+
onClickContent: s,
|
|
72
|
+
leftAdornment: p,
|
|
73
|
+
loading: h = !1,
|
|
74
|
+
disabled: o = !1,
|
|
75
|
+
variant: m = "default",
|
|
76
|
+
onClickRemove: d
|
|
77
|
+
} = t;
|
|
78
|
+
return h ? /* @__PURE__ */ r(
|
|
79
|
+
k,
|
|
80
|
+
{
|
|
81
|
+
className: t["className-skeleton"],
|
|
82
|
+
style: { width: "6rem", height: "2rem", borderRadius: "4rem", display: "inline-flex" },
|
|
83
|
+
"data-testid": t["data-testid-skeleton"]
|
|
84
|
+
}
|
|
85
|
+
) : /* @__PURE__ */ y(
|
|
86
|
+
R,
|
|
87
|
+
{
|
|
88
|
+
ref: e,
|
|
89
|
+
"data-testid": t["data-testid"],
|
|
90
|
+
onClickContent: s,
|
|
91
|
+
disabled: o,
|
|
92
|
+
className: a,
|
|
93
|
+
variant: m,
|
|
94
|
+
children: [
|
|
95
|
+
p && /* @__PURE__ */ r(A, { ...p, disabled: o }),
|
|
96
|
+
i,
|
|
97
|
+
d && /* @__PURE__ */ r(
|
|
98
|
+
"span",
|
|
99
|
+
{
|
|
100
|
+
className: l(_.chip__remove, { [_["chip__remove--disabled"]]: o }),
|
|
101
|
+
role: "button",
|
|
102
|
+
tabIndex: o ? -1 : 0,
|
|
103
|
+
"aria-label": "remove",
|
|
104
|
+
onClick: (n) => {
|
|
105
|
+
n == null || n.stopPropagation(), n == null || n.nativeEvent.stopImmediatePropagation(), d();
|
|
106
|
+
},
|
|
107
|
+
"aria-disabled": o,
|
|
108
|
+
children: /* @__PURE__ */ r(b, { icon: "circle-xmark", size: "1.125rem", color: "rgba(var(--gray-95-rgb), 0.45)" })
|
|
109
|
+
}
|
|
110
|
+
)
|
|
111
|
+
]
|
|
112
|
+
}
|
|
113
|
+
);
|
|
114
|
+
}), J = u((t, e) => {
|
|
115
|
+
const { text: i, isSelected: a = !1, value: s, onChange: p } = t;
|
|
116
|
+
return /* @__PURE__ */ y(
|
|
117
|
+
"label",
|
|
118
|
+
{
|
|
119
|
+
className: l([c.toggle__label], { [c["toggle__label--selected"]]: a }),
|
|
120
|
+
"data-testid": t["data-testid"],
|
|
121
|
+
children: [
|
|
122
|
+
/* @__PURE__ */ r(
|
|
123
|
+
"input",
|
|
124
|
+
{
|
|
125
|
+
className: l([c.toggle__input]),
|
|
126
|
+
type: "radio",
|
|
127
|
+
ref: e,
|
|
128
|
+
value: s.toString(),
|
|
129
|
+
onChange: () => p(s),
|
|
130
|
+
role: "radio",
|
|
131
|
+
checked: a,
|
|
132
|
+
"aria-checked": a
|
|
133
|
+
}
|
|
134
|
+
),
|
|
135
|
+
/* @__PURE__ */ r(f, { bold: !0, children: i })
|
|
136
|
+
]
|
|
137
|
+
}
|
|
138
|
+
);
|
|
139
|
+
});
|
|
140
|
+
export {
|
|
141
|
+
H as C,
|
|
142
|
+
J as T
|
|
143
|
+
};
|
package/dist/assets/Advice.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._u-typography-
|
|
1
|
+
._u-typography-h1_12o7p_1{font-size:var(--heading-font-size-1);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-1);margin:0}._u-typography-h2_12o7p_8{font-size:var(--heading-font-size-2);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-2);margin:0}._u-typography-h3_12o7p_15{font-size:var(--heading-font-size-3);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-3);margin:0}._u-typography-h4_12o7p_22{font-size:var(--heading-font-size-4);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-4);margin:0}._u-typography-h5_12o7p_29{font-size:var(--heading-font-size-5);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-5);margin:0}._u-typography-h6_12o7p_36{font-size:var(--heading-font-size-6);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-6);margin:0}._u-typography-base_12o7p_43{font-size:var(--base-font-size);font-weight:var(--base-weight);line-height:var(--base-line-height)}._u-typography-base--xxl_12o7p_48{font-size:var(--base-font-size-xxl);line-height:var(--base-line-height-xxl)}._u-typography-base--xl_12o7p_52{font-size:var(--base-font-size-xl);line-height:var(--base-line-height-xl)}._u-typography-base--lg_12o7p_56,._advice_12o7p_56 ._content_12o7p_56,._advice_12o7p_56 p{font-size:var(--base-font-size-lg);line-height:var(--base-line-height-lg)}._u-typography-base--sm_12o7p_61{font-size:var(--base-font-size-sm);line-height:var(--base-line-height-sm)}._u-typography-base--bold_12o7p_65,._advice_12o7p_56 ._content_12o7p_56,._advice_12o7p_56 p{font-weight:var(--base-bold)}._u-typography-base--strikethrough_12o7p_69{text-decoration:line-through}._u-typography-base--underlined_12o7p_72{text-decoration:underline}._u-typography-base--strikethrough-underlined_12o7p_75{text-decoration:underline line-through}._advice_12o7p_56{display:flex;flex-direction:column;align-items:center;padding:2rem}._advice_12o7p_56 ._content_12o7p_56,._advice_12o7p_56 p{margin:0;color:var(--gray-75)}._advice_12o7p_56 ._content-no-items_12o7p_90{display:flex;flex-direction:column;align-items:center;max-width:477px}._advice_12o7p_56 ._content-no-items_12o7p_90 h3{padding:0;margin:1rem 0 0;font-size:1.5rem;font-weight:700;color:#838192}._advice_12o7p_56 ._content-no-items_12o7p_90 p{margin-bottom:1.5rem;font-size:1rem;font-weight:400;color:#838192;text-align:center}
|
package/dist/assets/Group.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._toggle__input_wlkvp_1{position:absolute;width:0;height:0;margin:0;opacity:0}._toggle__label_wlkvp_8{flex-grow:1;padding:.5rem 1rem;text-align:center;border:solid 1px var(--gray-25);border-radius:6px}._toggle__label--selected_wlkvp_15{color:var(--accent);border-color:var(--accent)}._toggle-group__fieldset_wlkvp_20{padding:0;margin:0;border:none}._toggle-group__options_wlkvp_25{display:flex;gap:.5rem}._toggle-group__error_wlkvp_29{display:flex;gap:.5rem;margin-top:.5rem;color:var(--alert)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._u-typography-
|
|
1
|
+
._u-typography-h1_z7ezb_1{font-size:var(--heading-font-size-1);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-1);margin:0}._u-typography-h2_z7ezb_8{font-size:var(--heading-font-size-2);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-2);margin:0}._u-typography-h3_z7ezb_15{font-size:var(--heading-font-size-3);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-3);margin:0}._u-typography-h4_z7ezb_22,._page-header__main-left-content_z7ezb_22 ._title_z7ezb_22{font-size:var(--heading-font-size-4);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-4);margin:0}._u-typography-h5_z7ezb_29{font-size:var(--heading-font-size-5);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-5);margin:0}._u-typography-h6_z7ezb_36{font-size:var(--heading-font-size-6);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-6);margin:0}._u-typography-base_z7ezb_43,._page-header__main-left-content_z7ezb_22 ._subtitle_z7ezb_43{font-size:var(--base-font-size);font-weight:var(--base-weight);line-height:var(--base-line-height)}._u-typography-base--xxl_z7ezb_48{font-size:var(--base-font-size-xxl);line-height:var(--base-line-height-xxl)}._u-typography-base--xl_z7ezb_52{font-size:var(--base-font-size-xl);line-height:var(--base-line-height-xl)}._u-typography-base--lg_z7ezb_56{font-size:var(--base-font-size-lg);line-height:var(--base-line-height-lg)}._u-typography-base--sm_z7ezb_60{font-size:var(--base-font-size-sm);line-height:var(--base-line-height-sm)}._u-typography-base--bold_z7ezb_64,._page-header__main-left-content_z7ezb_22 ._title_z7ezb_22{font-weight:var(--base-bold)}._u-typography-base--strikethrough_z7ezb_67{text-decoration:line-through}._u-typography-base--underlined_z7ezb_70{text-decoration:underline}._u-typography-base--strikethrough-underlined_z7ezb_73{text-decoration:underline line-through}._page-header_z7ezb_22{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:7.375rem;background:var(--cream);-webkit-font-smoothing:antialiased!important}._page-header_z7ezb_22:has(._page-header__top-content_z7ezb_86){justify-content:flex-start}._page-header__top-content_z7ezb_86,._page-header__main-content_z7ezb_89,._page-header__bottom-content_z7ezb_89{width:64rem;max-width:100%;margin:0 auto}._page-header__top-content_z7ezb_86{padding:1rem 0 .5rem}._page-header__top-content_z7ezb_86 button{width:fit-content;height:1.125rem;padding:0;line-height:1.125rem}._page-header__breadcrumb_z7ezb_103{display:flex;gap:.25rem;align-items:center}._page-header__breadcrumb__separator_z7ezb_108{height:1.125rem;padding:0;margin-right:-.25rem;line-height:1.125rem}._page-header__main-content_z7ezb_89{display:flex}._page-header__main-left-content_z7ezb_22{display:flex;flex:1;flex-direction:column;justify-content:center}._page-header__main-left-content_z7ezb_22 ._title_z7ezb_22,._page-header__main-left-content_z7ezb_22 ._subtitle_z7ezb_43{display:block;width:100%;padding:0;margin:0;color:var(--gray-90)}._page-header__main-right-content_z7ezb_131{display:flex;align-items:center;margin-bottom:1.125rem}._page-header__bottom-content_z7ezb_89{margin-top:.8125rem}
|
package/dist/assets/Toggle.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._u-typography-
|
|
1
|
+
._u-typography-h1_16u49_1{font-size:var(--heading-font-size-1);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-1);margin:0}._u-typography-h2_16u49_8{font-size:var(--heading-font-size-2);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-2);margin:0}._u-typography-h3_16u49_15{font-size:var(--heading-font-size-3);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-3);margin:0}._u-typography-h4_16u49_22{font-size:var(--heading-font-size-4);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-4);margin:0}._u-typography-h5_16u49_29{font-size:var(--heading-font-size-5);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-5);margin:0}._u-typography-h6_16u49_36{font-size:var(--heading-font-size-6);font-weight:var(--heading-font-weight);line-height:var(--heading-line-height-6);margin:0}._u-typography-base_16u49_43{font-size:var(--base-font-size);font-weight:var(--base-weight);line-height:var(--base-line-height)}._u-typography-base--xxl_16u49_48{font-size:var(--base-font-size-xxl);line-height:var(--base-line-height-xxl)}._u-typography-base--xl_16u49_52{font-size:var(--base-font-size-xl);line-height:var(--base-line-height-xl)}._u-typography-base--lg_16u49_56{font-size:var(--base-font-size-lg);line-height:var(--base-line-height-lg)}._u-typography-base--sm_16u49_60,._chip_16u49_60{font-size:var(--base-font-size-sm);line-height:var(--base-line-height-sm)}._u-typography-base--bold_16u49_64,._chip_16u49_60{font-weight:var(--base-bold)}._u-typography-base--strikethrough_16u49_67{text-decoration:line-through}._u-typography-base--underlined_16u49_70{text-decoration:underline}._u-typography-base--strikethrough-underlined_16u49_73{text-decoration:underline line-through}._chip_16u49_60{display:flex;align-items:center;width:fit-content;padding:.375rem .5rem;background-color:var(--cream);border-width:1px;border-radius:calc(var(--border-radius-soft) * 4)}._chip_16u49_60:not(:disabled){color:rgb(var(--gray-95-rgb) .65)}._chip--button_16u49_89{cursor:pointer;border-color:transparent}._chip--button_16u49_89:disabled{cursor:initial}._chip--button_16u49_89:focus-visible{outline:none}._chip--button_16u49_89:focus{outline:2px solid var(--black-100)}._chip--outlined_16u49_102{padding:.3125rem .5rem;background-color:var(--white-100);border:1px solid var(--border);border-radius:calc(var(--border-radius-soft) * 4)}._chip--contained_16u49_108{padding:.3125rem .5rem;border:1px solid var(--border);border-color:var(--accent);border-radius:calc(var(--border-radius-soft) * 4)}._chip__adornment_16u49_114{display:flex;align-items:center;margin-right:.5rem}._chip__remove_16u49_119{display:flex;margin-left:.5rem}._chip__remove_16u49_119:focus-visible{outline:none}._chip__remove_16u49_119:focus:not(:disabled){border-radius:calc(var(--border-radius-soft) * 4);outline:2px solid var(--black-100)}._chip__remove--disabled_16u49_130{cursor:default}._chip__skeleton_16u49_133{display:inline-flex;width:6rem;height:2rem;border-radius:4rem}
|
|
@@ -1,48 +1,48 @@
|
|
|
1
1
|
import '../../assets/Advice.css';
|
|
2
|
-
import { jsxs as y, jsx as
|
|
3
|
-
import { c as
|
|
4
|
-
import { Icon as
|
|
5
|
-
const
|
|
6
|
-
"u-typography-h1": "_u-typography-
|
|
7
|
-
"u-typography-h2": "_u-typography-
|
|
8
|
-
"u-typography-h3": "_u-typography-
|
|
9
|
-
"u-typography-h4": "_u-typography-
|
|
10
|
-
"u-typography-h5": "_u-typography-
|
|
11
|
-
"u-typography-h6": "_u-typography-
|
|
12
|
-
"u-typography-base": "_u-typography-
|
|
13
|
-
"u-typography-base--xxl": "_u-typography-base--
|
|
14
|
-
"u-typography-base--xl": "_u-typography-base--
|
|
15
|
-
"u-typography-base--lg": "_u-typography-base--
|
|
16
|
-
advice:
|
|
17
|
-
content:
|
|
18
|
-
"u-typography-base--sm": "_u-typography-base--
|
|
19
|
-
"u-typography-base--bold": "_u-typography-base--
|
|
20
|
-
"u-typography-base--strikethrough": "_u-typography-base--
|
|
21
|
-
"u-typography-base--underlined": "_u-typography-base--
|
|
22
|
-
"u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-
|
|
23
|
-
"content-no-items": "_content-no-
|
|
2
|
+
import { jsxs as y, jsx as r } from "react/jsx-runtime";
|
|
3
|
+
import { c as i } from "../../clsx-DB4S2d7J.js";
|
|
4
|
+
import { Icon as d } from "../Icon/Icon.js";
|
|
5
|
+
const n = "_advice_12o7p_56", m = "_content_12o7p_56", s = {
|
|
6
|
+
"u-typography-h1": "_u-typography-h1_12o7p_1",
|
|
7
|
+
"u-typography-h2": "_u-typography-h2_12o7p_8",
|
|
8
|
+
"u-typography-h3": "_u-typography-h3_12o7p_15",
|
|
9
|
+
"u-typography-h4": "_u-typography-h4_12o7p_22",
|
|
10
|
+
"u-typography-h5": "_u-typography-h5_12o7p_29",
|
|
11
|
+
"u-typography-h6": "_u-typography-h6_12o7p_36",
|
|
12
|
+
"u-typography-base": "_u-typography-base_12o7p_43",
|
|
13
|
+
"u-typography-base--xxl": "_u-typography-base--xxl_12o7p_48",
|
|
14
|
+
"u-typography-base--xl": "_u-typography-base--xl_12o7p_52",
|
|
15
|
+
"u-typography-base--lg": "_u-typography-base--lg_12o7p_56",
|
|
16
|
+
advice: n,
|
|
17
|
+
content: m,
|
|
18
|
+
"u-typography-base--sm": "_u-typography-base--sm_12o7p_61",
|
|
19
|
+
"u-typography-base--bold": "_u-typography-base--bold_12o7p_65",
|
|
20
|
+
"u-typography-base--strikethrough": "_u-typography-base--strikethrough_12o7p_69",
|
|
21
|
+
"u-typography-base--underlined": "_u-typography-base--underlined_12o7p_72",
|
|
22
|
+
"u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_12o7p_75",
|
|
23
|
+
"content-no-items": "_content-no-items_12o7p_90"
|
|
24
24
|
}, h = {
|
|
25
25
|
"no-permission": "eye-slash",
|
|
26
26
|
"no-items": "",
|
|
27
27
|
"error-page": "circle-exclamation",
|
|
28
28
|
"without-results": "folder-magnifying-glass"
|
|
29
|
-
},
|
|
30
|
-
const
|
|
31
|
-
color:
|
|
32
|
-
size: (
|
|
33
|
-
icon: h[
|
|
34
|
-
iconFamily: h[
|
|
29
|
+
}, f = ({ icon: o, type: p, content: e, title: _, description: g, className: u, IconSvg: t, ...l }) => {
|
|
30
|
+
const a = {
|
|
31
|
+
color: o != null && o.color ? o == null ? void 0 : o.color : p !== "error-page" ? "var(--accent)" : "var(--secondary-orange)",
|
|
32
|
+
size: (o == null ? void 0 : o.size) || "3.375rem",
|
|
33
|
+
icon: h[p] || (o == null ? void 0 : o.icon) || "",
|
|
34
|
+
iconFamily: h[p] ? "fa/duotone" : (o == null ? void 0 : o.iconFamily) || "fa/duotone"
|
|
35
35
|
};
|
|
36
|
-
return /* @__PURE__ */ y("div", { className:
|
|
37
|
-
|
|
38
|
-
!
|
|
39
|
-
|
|
40
|
-
/* @__PURE__ */
|
|
41
|
-
/* @__PURE__ */
|
|
42
|
-
|
|
36
|
+
return /* @__PURE__ */ y("div", { className: i(s.advice, u), ...l, children: [
|
|
37
|
+
t && p !== "no-items" && p !== "error-page" && /* @__PURE__ */ r(t, { style: { color: a.color, height: a.size, width: a.size } }),
|
|
38
|
+
!t && p !== "no-items" && /* @__PURE__ */ r(d, { ...a }),
|
|
39
|
+
p !== "error-page" && p !== "no-items" ? typeof e == "string" ? /* @__PURE__ */ r("p", { children: e }) : /* @__PURE__ */ r("div", { className: s.content, children: e }) : /* @__PURE__ */ y("div", { className: s["content-no-items"], children: [
|
|
40
|
+
/* @__PURE__ */ r("h3", { children: _ }),
|
|
41
|
+
/* @__PURE__ */ r("p", { children: g }),
|
|
42
|
+
e
|
|
43
43
|
] })
|
|
44
44
|
] });
|
|
45
45
|
};
|
|
46
46
|
export {
|
|
47
|
-
|
|
47
|
+
f as Advice
|
|
48
48
|
};
|
|
@@ -20,6 +20,8 @@ type ChipProps = {
|
|
|
20
20
|
disabled?: boolean;
|
|
21
21
|
/** Any additional classes to apply to the Chip wrapper */
|
|
22
22
|
className?: string;
|
|
23
|
+
/** Any additional classes to apply to the chip skeleton */
|
|
24
|
+
'className-skeleton'?: string;
|
|
23
25
|
/** Which style of chip to show */
|
|
24
26
|
variant?: Variant;
|
|
25
27
|
/** Dataset test id only used for tests, used to hook onto the loading skeleton component for this chip */
|
|
@@ -3,7 +3,7 @@ import "react";
|
|
|
3
3
|
import "../../clsx-DB4S2d7J.js";
|
|
4
4
|
import "../Icon/Icon.js";
|
|
5
5
|
import "../Button/Button.js";
|
|
6
|
-
import { C as j } from "../../Toggle-
|
|
6
|
+
import { C as j } from "../../Toggle-BnPepwWO.js";
|
|
7
7
|
import "../Dialog/Backdrop.js";
|
|
8
8
|
import "../Typography/Typography.js";
|
|
9
9
|
import "../IconButton/IconButton.js";
|
|
@@ -11,7 +11,7 @@ import "../Select/Select.js";
|
|
|
11
11
|
import "../Skeleton/Skeleton.js";
|
|
12
12
|
import "../Table/Table.js";
|
|
13
13
|
import "../Tabs/Tabs.js";
|
|
14
|
-
import "../../Group-
|
|
14
|
+
import "../../Group-B3p31ftp.js";
|
|
15
15
|
import "../../contexts/SnackbarProvider/SnackbarProvider.js";
|
|
16
16
|
import "../../Button-2b1peDFT.js";
|
|
17
17
|
export {
|
|
@@ -11,6 +11,7 @@ declare const meta: {
|
|
|
11
11
|
onClickRemove?: (() => void) | undefined;
|
|
12
12
|
disabled?: boolean | undefined;
|
|
13
13
|
className?: string | undefined;
|
|
14
|
+
'className-skeleton'?: string | undefined;
|
|
14
15
|
variant?: import('./Chip').Variant | undefined;
|
|
15
16
|
'data-testid-skeleton'?: string | undefined;
|
|
16
17
|
} & import('react').RefAttributes<unknown>>;
|
|
@@ -24,6 +25,7 @@ declare const meta: {
|
|
|
24
25
|
onClickRemove?: (() => void) | undefined;
|
|
25
26
|
disabled?: boolean | undefined;
|
|
26
27
|
className?: string | undefined;
|
|
28
|
+
'className-skeleton'?: string | undefined;
|
|
27
29
|
variant?: import('./Chip').Variant | undefined;
|
|
28
30
|
'data-testid-skeleton'?: string | undefined;
|
|
29
31
|
ref?: import('react').LegacyRef<unknown> | undefined;
|
|
@@ -1,14 +1,29 @@
|
|
|
1
1
|
import { RequireAllOrNone } from '../../types/helpers';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
|
|
4
|
+
type BreadcrumbItem = {
|
|
5
|
+
/** Breadcrumb item label */
|
|
6
|
+
label: string;
|
|
7
|
+
/** Id to be applied as `data-testid` on the breadcrumb item */
|
|
8
|
+
'data-testid'?: string;
|
|
9
|
+
/** CSS classes to be applied on the breadcrumb item */
|
|
10
|
+
className?: string;
|
|
11
|
+
/** Callback called when the breadcrumb item is clicked */
|
|
12
|
+
onClick?: () => void;
|
|
13
|
+
};
|
|
4
14
|
type PageHeaderCommonProps = {
|
|
5
15
|
/** Title text */
|
|
6
16
|
title: string;
|
|
7
17
|
/** Subtitle text */
|
|
8
18
|
subtitle?: string;
|
|
9
|
-
/** Back link text
|
|
19
|
+
/** Back link text
|
|
20
|
+
* @deprecated Use breadcrumb prop instead.
|
|
21
|
+
*/
|
|
10
22
|
backLinkText?: string;
|
|
11
|
-
/**
|
|
23
|
+
/**
|
|
24
|
+
* Callback called when `back link` is clicked
|
|
25
|
+
* @deprecated Use breadcrumb prop instead.
|
|
26
|
+
* */
|
|
12
27
|
onBackLinkClick?: () => void;
|
|
13
28
|
/** Element to be rendered on the right slot of the component */
|
|
14
29
|
rightChildren?: ReactNode;
|
|
@@ -16,7 +31,10 @@ type PageHeaderCommonProps = {
|
|
|
16
31
|
bottomChildren?: ReactNode;
|
|
17
32
|
/** CSS classes to be applied on the container element */
|
|
18
33
|
classNameWrapper?: string;
|
|
19
|
-
/**
|
|
34
|
+
/**
|
|
35
|
+
* CSS classes to be applied on the back link element
|
|
36
|
+
* @deprecated Use breadcrumb prop instead.
|
|
37
|
+
* */
|
|
20
38
|
classNameBackLink?: string;
|
|
21
39
|
/** CSS classes to be applied on the title element */
|
|
22
40
|
classNameTitle?: string;
|
|
@@ -24,13 +42,21 @@ type PageHeaderCommonProps = {
|
|
|
24
42
|
classNameSubtitle?: string;
|
|
25
43
|
/** Id to be applied as `data-testid` on the container element */
|
|
26
44
|
'data-testid-wrapper'?: string;
|
|
27
|
-
/**
|
|
45
|
+
/**
|
|
46
|
+
* Id to be applied as `data-testid` on the back link element
|
|
47
|
+
* @deprecated Use breadcrumb prop instead.
|
|
48
|
+
* */
|
|
28
49
|
'data-testid-backLink'?: string;
|
|
29
50
|
/** Id to be applied as `data-testid` on the title element */
|
|
30
51
|
'data-testid-title'?: string;
|
|
31
52
|
/** Id to be applied as `data-testid` on the subtitle element */
|
|
32
53
|
'data-testid-subtitle'?: string;
|
|
54
|
+
breadcrumb?: never;
|
|
55
|
+
};
|
|
56
|
+
type PageHeaderWithBreadcrumb = Omit<PageHeaderCommonProps, 'backLinkText' | 'onBackLinkClick' | 'classNameBackLink' | 'data-testid-backLink' | 'breadcrumb'> & {
|
|
57
|
+
/** List of breadcrumbs to be rendered at the top of the title */
|
|
58
|
+
breadcrumb?: BreadcrumbItem[];
|
|
33
59
|
};
|
|
34
|
-
type PageHeaderProps = RequireAllOrNone<PageHeaderCommonProps, 'backLinkText' | 'onBackLinkClick'
|
|
35
|
-
export declare const PageHeader: ({ title, subtitle,
|
|
60
|
+
export type PageHeaderProps = RequireAllOrNone<PageHeaderCommonProps, 'backLinkText' | 'onBackLinkClick'> | PageHeaderWithBreadcrumb;
|
|
61
|
+
export declare const PageHeader: ({ title, subtitle, rightChildren, bottomChildren, classNameWrapper, classNameTitle, classNameSubtitle, "data-testid-wrapper": wrapperTestId, "data-testid-title": titleTestId, "data-testid-subtitle": subtitleTestId, ...props }: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
36
62
|
export {};
|
|
@@ -1,68 +1,85 @@
|
|
|
1
1
|
import '../../assets/PageHeader.css';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
"u-typography-
|
|
9
|
-
"u-typography-
|
|
10
|
-
"u-typography-
|
|
11
|
-
"
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
"u-typography-
|
|
15
|
-
"u-typography-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
"u-typography-base--
|
|
19
|
-
"u-typography-base--
|
|
20
|
-
"u-typography-base--
|
|
21
|
-
"u-typography-base--
|
|
22
|
-
"u-typography-base--
|
|
23
|
-
"u-typography-base--
|
|
24
|
-
"u-typography-base--
|
|
25
|
-
"
|
|
26
|
-
"page-
|
|
27
|
-
"page-
|
|
28
|
-
"page-
|
|
29
|
-
"page-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
classNameTitle:
|
|
2
|
+
import { jsx as t, jsxs as p } from "react/jsx-runtime";
|
|
3
|
+
import { useMemo as k } from "react";
|
|
4
|
+
import { c as o } from "../../clsx-DB4S2d7J.js";
|
|
5
|
+
import { Icon as N } from "../Icon/Icon.js";
|
|
6
|
+
import { IconButton as f } from "../IconButton/IconButton.js";
|
|
7
|
+
const x = "_title_z7ezb_22", L = "_subtitle_z7ezb_43", a = {
|
|
8
|
+
"u-typography-h1": "_u-typography-h1_z7ezb_1",
|
|
9
|
+
"u-typography-h2": "_u-typography-h2_z7ezb_8",
|
|
10
|
+
"u-typography-h3": "_u-typography-h3_z7ezb_15",
|
|
11
|
+
"u-typography-h4": "_u-typography-h4_z7ezb_22",
|
|
12
|
+
"page-header__main-left-content": "_page-header__main-left-content_z7ezb_22",
|
|
13
|
+
title: x,
|
|
14
|
+
"u-typography-h5": "_u-typography-h5_z7ezb_29",
|
|
15
|
+
"u-typography-h6": "_u-typography-h6_z7ezb_36",
|
|
16
|
+
"u-typography-base": "_u-typography-base_z7ezb_43",
|
|
17
|
+
subtitle: L,
|
|
18
|
+
"u-typography-base--xxl": "_u-typography-base--xxl_z7ezb_48",
|
|
19
|
+
"u-typography-base--xl": "_u-typography-base--xl_z7ezb_52",
|
|
20
|
+
"u-typography-base--lg": "_u-typography-base--lg_z7ezb_56",
|
|
21
|
+
"u-typography-base--sm": "_u-typography-base--sm_z7ezb_60",
|
|
22
|
+
"u-typography-base--bold": "_u-typography-base--bold_z7ezb_64",
|
|
23
|
+
"u-typography-base--strikethrough": "_u-typography-base--strikethrough_z7ezb_67",
|
|
24
|
+
"u-typography-base--underlined": "_u-typography-base--underlined_z7ezb_70",
|
|
25
|
+
"u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_z7ezb_73",
|
|
26
|
+
"page-header": "_page-header_z7ezb_22",
|
|
27
|
+
"page-header__top-content": "_page-header__top-content_z7ezb_86",
|
|
28
|
+
"page-header__main-content": "_page-header__main-content_z7ezb_89",
|
|
29
|
+
"page-header__bottom-content": "_page-header__bottom-content_z7ezb_89",
|
|
30
|
+
"page-header__breadcrumb": "_page-header__breadcrumb_z7ezb_103",
|
|
31
|
+
"page-header__breadcrumb__separator": "_page-header__breadcrumb__separator_z7ezb_108",
|
|
32
|
+
"page-header__main-right-content": "_page-header__main-right-content_z7ezb_131"
|
|
33
|
+
}, w = ({
|
|
34
|
+
title: c,
|
|
35
|
+
subtitle: b,
|
|
36
|
+
rightChildren: s,
|
|
37
|
+
bottomChildren: n,
|
|
38
|
+
classNameWrapper: i,
|
|
39
|
+
classNameTitle: l,
|
|
40
40
|
classNameSubtitle: g,
|
|
41
|
-
"data-testid-wrapper":
|
|
42
|
-
"data-testid-
|
|
43
|
-
"data-testid-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
41
|
+
"data-testid-wrapper": y,
|
|
42
|
+
"data-testid-title": u,
|
|
43
|
+
"data-testid-subtitle": z,
|
|
44
|
+
...h
|
|
45
|
+
}) => {
|
|
46
|
+
const e = h, m = k(() => {
|
|
47
|
+
const r = [];
|
|
48
|
+
return e.backLinkText && e.onBackLinkClick && r.push({
|
|
49
|
+
label: e.backLinkText,
|
|
50
|
+
className: e.classNameBackLink,
|
|
51
|
+
"data-testid": e["data-testid-backLink"],
|
|
52
|
+
onClick: e.onBackLinkClick
|
|
53
|
+
}), e.breadcrumb && r.push(...e.breadcrumb), /* @__PURE__ */ t("div", { className: a["page-header__top-content"], children: /* @__PURE__ */ t("div", { className: a["page-header__breadcrumb"], children: r.map((_, d) => /* @__PURE__ */ t(
|
|
54
|
+
f,
|
|
55
|
+
{
|
|
56
|
+
icon: d === 0 ? /* @__PURE__ */ t(N, { icon: "arrow-left" }) : /* @__PURE__ */ t("span", { className: a["page-header__breadcrumb__separator"], children: "/" }),
|
|
57
|
+
onClick: () => _.onClick && _.onClick(),
|
|
58
|
+
className: _.className,
|
|
59
|
+
"data-testid": _["data-testid"],
|
|
60
|
+
disabled: r.length === 1 ? !1 : d === r.length - 1,
|
|
61
|
+
children: _.label
|
|
62
|
+
}
|
|
63
|
+
)) }) });
|
|
64
|
+
}, [
|
|
65
|
+
e.breadcrumb,
|
|
66
|
+
e.backLinkText,
|
|
67
|
+
e.classNameBackLink,
|
|
68
|
+
e["data-testid-backLink"],
|
|
69
|
+
e.onBackLinkClick
|
|
70
|
+
]);
|
|
71
|
+
return /* @__PURE__ */ p("div", { className: o([a["page-header"], i]), "data-testid": y, ...h, children: [
|
|
72
|
+
m,
|
|
73
|
+
/* @__PURE__ */ p("div", { className: a["page-header__main-content"], children: [
|
|
74
|
+
/* @__PURE__ */ p("div", { className: a["page-header__main-left-content"], children: [
|
|
75
|
+
/* @__PURE__ */ t("h1", { className: o(a.title, l), "data-testid": u, children: c }),
|
|
76
|
+
/* @__PURE__ */ t("h2", { className: o(a.subtitle, g), "data-testid": z, children: b })
|
|
77
|
+
] }),
|
|
78
|
+
s && /* @__PURE__ */ t("div", { className: a["page-header__main-right-content"], children: s })
|
|
61
79
|
] }),
|
|
62
|
-
|
|
63
|
-
] })
|
|
64
|
-
|
|
65
|
-
] });
|
|
80
|
+
n && /* @__PURE__ */ t("div", { className: a["page-header__bottom-content"], children: n })
|
|
81
|
+
] });
|
|
82
|
+
};
|
|
66
83
|
export {
|
|
67
|
-
|
|
84
|
+
w as PageHeader
|
|
68
85
|
};
|
|
@@ -2,42 +2,13 @@ import { StoryObj } from '@storybook/react';
|
|
|
2
2
|
|
|
3
3
|
declare const meta: {
|
|
4
4
|
title: string;
|
|
5
|
-
component: ({ title, subtitle,
|
|
6
|
-
title: string;
|
|
7
|
-
subtitle?: string | undefined;
|
|
8
|
-
backLinkText?: string | undefined;
|
|
9
|
-
onBackLinkClick?: (() => void) | undefined;
|
|
10
|
-
rightChildren?: import('react').ReactNode;
|
|
11
|
-
bottomChildren?: import('react').ReactNode;
|
|
12
|
-
classNameWrapper?: string | undefined;
|
|
13
|
-
classNameBackLink?: string | undefined;
|
|
14
|
-
classNameTitle?: string | undefined;
|
|
15
|
-
classNameSubtitle?: string | undefined;
|
|
16
|
-
'data-testid-wrapper'?: string | undefined;
|
|
17
|
-
'data-testid-backLink'?: string | undefined;
|
|
18
|
-
'data-testid-title'?: string | undefined;
|
|
19
|
-
'data-testid-subtitle'?: string | undefined;
|
|
20
|
-
}, "backLinkText" | "onBackLinkClick">> | Partial<Record<"backLinkText" | "onBackLinkClick", never>>) & Omit<{
|
|
21
|
-
title: string;
|
|
22
|
-
subtitle?: string | undefined;
|
|
23
|
-
backLinkText?: string | undefined;
|
|
24
|
-
onBackLinkClick?: (() => void) | undefined;
|
|
25
|
-
rightChildren?: import('react').ReactNode;
|
|
26
|
-
bottomChildren?: import('react').ReactNode;
|
|
27
|
-
classNameWrapper?: string | undefined;
|
|
28
|
-
classNameBackLink?: string | undefined;
|
|
29
|
-
classNameTitle?: string | undefined;
|
|
30
|
-
classNameSubtitle?: string | undefined;
|
|
31
|
-
'data-testid-wrapper'?: string | undefined;
|
|
32
|
-
'data-testid-backLink'?: string | undefined;
|
|
33
|
-
'data-testid-title'?: string | undefined;
|
|
34
|
-
'data-testid-subtitle'?: string | undefined;
|
|
35
|
-
}, "backLinkText" | "onBackLinkClick">) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
component: ({ title, subtitle, rightChildren, bottomChildren, classNameWrapper, classNameTitle, classNameSubtitle, "data-testid-wrapper": wrapperTestId, "data-testid-title": titleTestId, "data-testid-subtitle": subtitleTestId, ...props }: import('./PageHeader').PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
36
6
|
tags: string[];
|
|
37
7
|
};
|
|
38
8
|
export default meta;
|
|
39
9
|
type Story = StoryObj<typeof meta>;
|
|
40
10
|
export declare const Simple: Story;
|
|
41
11
|
export declare const WithBackLink: Story;
|
|
12
|
+
export declare const WithBreadcrumb: Story;
|
|
42
13
|
export declare const WithRightChildren: Story;
|
|
43
14
|
export declare const WithBottomChildren: Story;
|
|
@@ -2,14 +2,14 @@ import "react/jsx-runtime";
|
|
|
2
2
|
import "react";
|
|
3
3
|
import "../../clsx-DB4S2d7J.js";
|
|
4
4
|
import "../Button/Button.js";
|
|
5
|
-
import { T } from "../../Toggle-
|
|
5
|
+
import { T } from "../../Toggle-BnPepwWO.js";
|
|
6
6
|
import "../Dialog/Backdrop.js";
|
|
7
7
|
import "../Typography/Typography.js";
|
|
8
8
|
import "../IconButton/IconButton.js";
|
|
9
9
|
import "../Select/Select.js";
|
|
10
10
|
import "../Table/Table.js";
|
|
11
11
|
import "../Tabs/Tabs.js";
|
|
12
|
-
import "../../Group-
|
|
12
|
+
import "../../Group-B3p31ftp.js";
|
|
13
13
|
import "../../contexts/SnackbarProvider/SnackbarProvider.js";
|
|
14
14
|
export {
|
|
15
15
|
T as default
|
package/dist/main.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Advice as e } from "./components/Advice/Advice.js";
|
|
2
2
|
import { Button as p } from "./components/Button/Button.js";
|
|
3
3
|
import { Checkbox as f } from "./components/Checkbox/Checkbox.js";
|
|
4
|
-
import { C as m, T as n } from "./Toggle-
|
|
4
|
+
import { C as m, T as n } from "./Toggle-BnPepwWO.js";
|
|
5
5
|
import { Dialog as i } from "./components/Dialog/Dialog.js";
|
|
6
6
|
import { FamilyAndIcons as s, Icon as c } from "./components/Icon/Icon.js";
|
|
7
7
|
import { IconButton as S } from "./components/IconButton/IconButton.js";
|
|
@@ -19,7 +19,7 @@ import { TBody as N, THead as Q, Table as R, Td as U, Th as V, Tr as W } from ".
|
|
|
19
19
|
import { Tabs as Y } from "./components/Tabs/Tabs.js";
|
|
20
20
|
import { TextDisplay as _ } from "./components/TextDisplay/TextDisplay.js";
|
|
21
21
|
import { Toggle as oo } from "./components/Toggle/Toggle.js";
|
|
22
|
-
import { G as eo } from "./Group-
|
|
22
|
+
import { G as eo } from "./Group-B3p31ftp.js";
|
|
23
23
|
import { Tooltip as po } from "./components/Tooltip/Tooltip.js";
|
|
24
24
|
import { Typography as fo } from "./components/Typography/Typography.js";
|
|
25
25
|
import { SnackbarContext as mo, SnackbarProvider as no, useSnackbar as lo } from "./contexts/SnackbarProvider/SnackbarProvider.js";
|
package/package.json
CHANGED
package/dist/Group-CS_qGuuW.js
DELETED
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import './assets/Group.css';
|
|
2
|
-
import { jsxs as l, jsx as t } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef as a } from "react";
|
|
4
|
-
import { Icon as i } from "./components/Icon/Icon.js";
|
|
5
|
-
const d = "_toggle__input_1hgsq_1", n = "_toggle__label_1hgsq_8", o = {
|
|
6
|
-
toggle__input: d,
|
|
7
|
-
toggle__label: n,
|
|
8
|
-
"toggle__label--selected": "_toggle__label--selected_1hgsq_15",
|
|
9
|
-
"toggle-group__fieldset": "_toggle-group__fieldset_1hgsq_20",
|
|
10
|
-
"toggle-group__options": "_toggle-group__options_1hgsq_23",
|
|
11
|
-
"toggle-group__error": "_toggle-group__error_1hgsq_27"
|
|
12
|
-
}, h = a((e, r) => {
|
|
13
|
-
const { children: s, legend: g, error: _ } = e;
|
|
14
|
-
return /* @__PURE__ */ l("fieldset", { ref: r, "data-testid": e["data-testid"], className: o["toggle-group__fieldset"], children: [
|
|
15
|
-
g && /* @__PURE__ */ t("legend", { "data-testid": `${e["data-testid"]}-legend`, children: g }),
|
|
16
|
-
/* @__PURE__ */ t("div", { className: o["toggle-group__options"], children: s }),
|
|
17
|
-
_ && /* @__PURE__ */ l("div", { className: o["toggle-group__error"], "data-testid": `${e["data-testid"]}-error`, children: [
|
|
18
|
-
/* @__PURE__ */ t(i, { icon: "circle-exclamation", size: 24, color: "var(--alert)" }),
|
|
19
|
-
_
|
|
20
|
-
] })
|
|
21
|
-
] });
|
|
22
|
-
});
|
|
23
|
-
export {
|
|
24
|
-
h as G,
|
|
25
|
-
o as s
|
|
26
|
-
};
|
package/dist/Toggle-9cd68he4.js
DELETED
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
import './assets/Toggle.css';
|
|
2
|
-
import { jsx as r, jsxs as u } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef as c, cloneElement as m } from "react";
|
|
4
|
-
import { c as _ } from "./clsx-DB4S2d7J.js";
|
|
5
|
-
import "./components/Button/Button.js";
|
|
6
|
-
import { Icon as b } from "./components/Icon/Icon.js";
|
|
7
|
-
import "./components/Dialog/Backdrop.js";
|
|
8
|
-
import { Typography as j } from "./components/Typography/Typography.js";
|
|
9
|
-
import "./components/IconButton/IconButton.js";
|
|
10
|
-
import "./components/Select/Select.js";
|
|
11
|
-
import { Skeleton as f } from "./components/Skeleton/Skeleton.js";
|
|
12
|
-
import "./components/Table/Table.js";
|
|
13
|
-
import "./components/Tabs/Tabs.js";
|
|
14
|
-
import { s as d } from "./Group-CS_qGuuW.js";
|
|
15
|
-
import "./contexts/SnackbarProvider/SnackbarProvider.js";
|
|
16
|
-
import { B as k } from "./Button-2b1peDFT.js";
|
|
17
|
-
const x = "_chip_1j9h1_60", C = "_chip__adornment_1j9h1_114", N = "_chip__remove_1j9h1_119", s = {
|
|
18
|
-
"u-typography-h1": "_u-typography-h1_1j9h1_1",
|
|
19
|
-
"u-typography-h2": "_u-typography-h2_1j9h1_8",
|
|
20
|
-
"u-typography-h3": "_u-typography-h3_1j9h1_15",
|
|
21
|
-
"u-typography-h4": "_u-typography-h4_1j9h1_22",
|
|
22
|
-
"u-typography-h5": "_u-typography-h5_1j9h1_29",
|
|
23
|
-
"u-typography-h6": "_u-typography-h6_1j9h1_36",
|
|
24
|
-
"u-typography-base": "_u-typography-base_1j9h1_43",
|
|
25
|
-
"u-typography-base--xxl": "_u-typography-base--xxl_1j9h1_48",
|
|
26
|
-
"u-typography-base--xl": "_u-typography-base--xl_1j9h1_52",
|
|
27
|
-
"u-typography-base--lg": "_u-typography-base--lg_1j9h1_56",
|
|
28
|
-
"u-typography-base--sm": "_u-typography-base--sm_1j9h1_60",
|
|
29
|
-
chip: x,
|
|
30
|
-
"u-typography-base--bold": "_u-typography-base--bold_1j9h1_64",
|
|
31
|
-
"u-typography-base--strikethrough": "_u-typography-base--strikethrough_1j9h1_67",
|
|
32
|
-
"u-typography-base--underlined": "_u-typography-base--underlined_1j9h1_70",
|
|
33
|
-
"u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_1j9h1_73",
|
|
34
|
-
"chip--button": "_chip--button_1j9h1_89",
|
|
35
|
-
"chip--outlined": "_chip--outlined_1j9h1_102",
|
|
36
|
-
"chip--contained": "_chip--contained_1j9h1_108",
|
|
37
|
-
chip__adornment: C,
|
|
38
|
-
chip__remove: N,
|
|
39
|
-
"chip__remove--disabled": "_chip__remove--disabled_1j9h1_130"
|
|
40
|
-
}, v = c((t, a) => {
|
|
41
|
-
const { children: i, onClickContent: e, disabled: h, className: p, variant: l } = t;
|
|
42
|
-
let o = _(
|
|
43
|
-
s.chip,
|
|
44
|
-
{ [s["chip--outlined"]]: l === "outlined" },
|
|
45
|
-
{ [s["chip--contained"]]: l === "contained" },
|
|
46
|
-
p
|
|
47
|
-
);
|
|
48
|
-
return e ? (o += ` ${s["chip--button"]}`, /* @__PURE__ */ r(
|
|
49
|
-
k,
|
|
50
|
-
{
|
|
51
|
-
onClick: e,
|
|
52
|
-
disabled: h,
|
|
53
|
-
"data-testid": t["data-testid"],
|
|
54
|
-
ref: a,
|
|
55
|
-
className: o,
|
|
56
|
-
children: i
|
|
57
|
-
}
|
|
58
|
-
)) : /* @__PURE__ */ r("span", { "data-testid": t["data-testid"], ref: a, className: o, children: i });
|
|
59
|
-
}), T = (t) => {
|
|
60
|
-
const { icon: a, disabled: i = !1, className: e } = t;
|
|
61
|
-
if (a) {
|
|
62
|
-
const h = _(s.chip__adornment, e), p = i ? m(a, { color: "rgb(var(--gray-95-rgb), 0.4)" }) : a;
|
|
63
|
-
return /* @__PURE__ */ r("span", { className: h, children: p });
|
|
64
|
-
}
|
|
65
|
-
return null;
|
|
66
|
-
}, G = c((t, a) => {
|
|
67
|
-
const {
|
|
68
|
-
label: i,
|
|
69
|
-
className: e,
|
|
70
|
-
onClickContent: h,
|
|
71
|
-
leftAdornment: p,
|
|
72
|
-
loading: l = !1,
|
|
73
|
-
disabled: o = !1,
|
|
74
|
-
variant: g = "default",
|
|
75
|
-
onClickRemove: y
|
|
76
|
-
} = t;
|
|
77
|
-
return l ? /* @__PURE__ */ r(
|
|
78
|
-
f,
|
|
79
|
-
{
|
|
80
|
-
style: { width: "6rem", height: "2rem", borderRadius: "4rem", display: "inline-flex" },
|
|
81
|
-
"data-testid": t["data-testid-skeleton"]
|
|
82
|
-
}
|
|
83
|
-
) : /* @__PURE__ */ u(
|
|
84
|
-
v,
|
|
85
|
-
{
|
|
86
|
-
ref: a,
|
|
87
|
-
"data-testid": t["data-testid"],
|
|
88
|
-
onClickContent: h,
|
|
89
|
-
disabled: o,
|
|
90
|
-
className: e,
|
|
91
|
-
variant: g,
|
|
92
|
-
children: [
|
|
93
|
-
p && /* @__PURE__ */ r(T, { ...p, disabled: o }),
|
|
94
|
-
i,
|
|
95
|
-
y && /* @__PURE__ */ r(
|
|
96
|
-
"span",
|
|
97
|
-
{
|
|
98
|
-
className: _(s.chip__remove, { [s["chip__remove--disabled"]]: o }),
|
|
99
|
-
role: "button",
|
|
100
|
-
tabIndex: o ? -1 : 0,
|
|
101
|
-
"aria-label": "remove",
|
|
102
|
-
onClick: (n) => {
|
|
103
|
-
n == null || n.stopPropagation(), n == null || n.nativeEvent.stopImmediatePropagation(), y();
|
|
104
|
-
},
|
|
105
|
-
"aria-disabled": o,
|
|
106
|
-
children: /* @__PURE__ */ r(b, { icon: "circle-xmark", size: "1.125rem", color: "rgba(var(--gray-95-rgb), 0.45)" })
|
|
107
|
-
}
|
|
108
|
-
)
|
|
109
|
-
]
|
|
110
|
-
}
|
|
111
|
-
);
|
|
112
|
-
}), H = c((t, a) => {
|
|
113
|
-
const { text: i, isSelected: e = !1, value: h, onChange: p } = t;
|
|
114
|
-
return /* @__PURE__ */ u(
|
|
115
|
-
"label",
|
|
116
|
-
{
|
|
117
|
-
className: _([d.toggle__label], { [d["toggle__label--selected"]]: e }),
|
|
118
|
-
"data-testid": t["data-testid"],
|
|
119
|
-
children: [
|
|
120
|
-
/* @__PURE__ */ r(
|
|
121
|
-
"input",
|
|
122
|
-
{
|
|
123
|
-
className: _([d.toggle__input]),
|
|
124
|
-
type: "radio",
|
|
125
|
-
ref: a,
|
|
126
|
-
value: h.toString(),
|
|
127
|
-
onChange: () => p(h),
|
|
128
|
-
role: "radio",
|
|
129
|
-
checked: e,
|
|
130
|
-
"aria-checked": e
|
|
131
|
-
}
|
|
132
|
-
),
|
|
133
|
-
/* @__PURE__ */ r(j, { bold: !0, children: i })
|
|
134
|
-
]
|
|
135
|
-
}
|
|
136
|
-
);
|
|
137
|
-
});
|
|
138
|
-
export {
|
|
139
|
-
G as C,
|
|
140
|
-
H as T
|
|
141
|
-
};
|