@devslab/dds-react 0.0.0-stage → 0.21.0

package/dist/index.js

@@ -0,0 +1,614 @@
+import { createContext as e, forwardRef as t, useContext as n, useEffect as r, useId as i, useMemo as a, useRef as o, useState as s } from "react";
+import { Field as c, Field as l } from "@ark-ui/react/field";
+import { Checkbox as u, Checkbox as d } from "@ark-ui/react/checkbox";
+import { Switch as f, Switch as p } from "@ark-ui/react/switch";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { Tabs as _, Tabs as v, useTabsContext as y } from "@ark-ui/react/tabs";
+import { RadioGroup as b, RadioGroup as x, useRadioGroupContext as S } from "@ark-ui/react/radio-group";
+import { Dialog as C, Dialog as w } from "@ark-ui/react/dialog";
+import { Tooltip as ee, Tooltip as T } from "@ark-ui/react/tooltip";
+import { Portal as E } from "@ark-ui/react/portal";
+import { directionPolicy as D, icons as te } from "@devslab/dds-icons";
+import { Toast as O, Toast as ne, Toaster as k, createToaster as A } from "@ark-ui/react/toast";
+import { DatePicker as j, DatePicker as M, parseDate as N } from "@ark-ui/react/date-picker";
+//#region src/controls.tsx
+var P = (...e) => e.filter(Boolean).join(" "), F = t(function({ tone: e = "primary", size: t = "md", loading: n, disabled: r, type: i = "button", className: a, children: o, ...s }, c) {
+	return /* @__PURE__ */ g("button", {
+		...s,
+		ref: c,
+		type: i,
+		disabled: r || n,
+		"aria-busy": n || void 0,
+		className: P("dds-btn", `dds-btn--${e}`, t !== "md" && `dds-btn--${t}`, a),
+		children: [n && /* @__PURE__ */ h("span", {
+			className: "dds-spinner",
+			"aria-hidden": !0
+		}), o]
+	});
+}), I = t(function({ tone: e = "ghost", size: t = "md", loading: n, disabled: r, type: i = "button", className: a, children: o, ...s }, c) {
+	return /* @__PURE__ */ h("button", {
+		...s,
+		ref: c,
+		type: i,
+		disabled: r || n,
+		"aria-busy": n || void 0,
+		className: P("dds-iconbtn", e !== "ghost" && `dds-iconbtn--${e}`, t !== "md" && `dds-iconbtn--${t}`, a),
+		children: n ? /* @__PURE__ */ h("span", {
+			className: "dds-spinner",
+			"aria-hidden": !0
+		}) : o
+	});
+}), L = t(function({ id: e, label: t, helpText: n, error: r, required: a, className: o, children: s, ...c }, u) {
+	let d = i(), f = e ?? `dds-field-${d}`, p = {
+		id: f,
+		"aria-describedby": [n && `${f}-help`, r && `${f}-error`].filter(Boolean).join(" ") || void 0,
+		"aria-invalid": r ? !0 : void 0,
+		"aria-required": a ? !0 : void 0
+	};
+	return /* @__PURE__ */ g(l.Root, {
+		...c,
+		ref: u,
+		invalid: !!r,
+		required: a,
+		id: f,
+		ids: {
+			control: `${f}-root`,
+			helperText: `${f}-help`,
+			errorText: `${f}-error`
+		},
+		className: P("dds-field", !!r && "dds-field--error", o),
+		children: [
+			/* @__PURE__ */ g(l.Label, {
+				htmlFor: f,
+				className: "dds-field__label",
+				children: [t, a && /* @__PURE__ */ h("span", {
+					"aria-hidden": !0,
+					children: " *"
+				})]
+			}),
+			typeof s == "function" ? s(p) : s,
+			n && /* @__PURE__ */ h(l.HelperText, {
+				className: "dds-field__help",
+				children: n
+			}),
+			r && /* @__PURE__ */ h(l.ErrorText, {
+				className: "dds-field__error",
+				role: "alert",
+				children: r
+			})
+		]
+	});
+}), R = t(function({ invalid: e, wrapperClassName: t, className: n, children: r, ...i }, a) {
+	return /* @__PURE__ */ h("span", {
+		className: P("dds-select", t),
+		children: /* @__PURE__ */ h("select", {
+			...i,
+			ref: a,
+			className: P("dds-select__input", n),
+			"aria-invalid": e || i["aria-invalid"],
+			children: r
+		})
+	});
+}), z = t(function({ kind: e, label: t, checked: n, defaultChecked: r, onCheckedChange: i, id: a, name: o, value: s, disabled: c, required: l, readOnly: u, form: f, className: m, inputClassName: _, onChange: v, ...y }, b) {
+	let x = e === "switch" ? p.Root : d.Root, S = e === "switch" ? p.Label : d.Label, C = e === "switch" ? p.Context : d.Context, w = e === "switch" ? "dds-switch" : "dds-check";
+	return /* @__PURE__ */ g(x, {
+		checked: n,
+		defaultChecked: r,
+		onCheckedChange: (e) => i?.(e.checked === !0),
+		ids: a ? { hiddenInput: a } : void 0,
+		name: o,
+		value: String(s ?? "on"),
+		disabled: c,
+		required: l,
+		readOnly: u,
+		form: f,
+		className: P(w, m),
+		children: [/* @__PURE__ */ h(C, { children: (t) => {
+			let { style: n, defaultChecked: r, ...i } = t.getHiddenInputProps();
+			return /* @__PURE__ */ h("input", {
+				...i,
+				...y,
+				ref: b,
+				checked: t.checked,
+				role: e === "switch" ? "switch" : void 0,
+				onChange: v ?? (() => {}),
+				onClick: (e) => {
+					y.onClick?.(e), e.defaultPrevented || i.onClick?.(e);
+				},
+				className: P(`${w}__input`, _)
+			});
+		} }), /* @__PURE__ */ h(S, { children: t })]
+	});
+}), B = t((e, t) => /* @__PURE__ */ h(z, {
+	...e,
+	kind: "checkbox",
+	ref: t
+})), V = t((e, t) => /* @__PURE__ */ h(z, {
+	...e,
+	kind: "switch",
+	ref: t
+})), H = t(function({ label: e, className: t, inputClassName: n, onCheckedChange: r, onChange: i, ...a }, o) {
+	return /* @__PURE__ */ g("label", {
+		className: P("dds-check", t),
+		children: [/* @__PURE__ */ h("input", {
+			...a,
+			ref: o,
+			type: "radio",
+			className: P("dds-check__input", n),
+			onChange: (e) => {
+				i?.(e), e.defaultPrevented || r?.(e.currentTarget.checked);
+			}
+		}), /* @__PURE__ */ h("span", { children: e })]
+	});
+}), U = t(function({ onValueChange: e, unstyled: t, className: n, ...r }, i) {
+	return /* @__PURE__ */ h(v.Root, {
+		...r,
+		ref: i,
+		onValueChange: (t) => e?.(t.value),
+		className: P(!t && "dds-tabs-root", n)
+	});
+}), W = t(function({ unstyled: e, className: t, ...n }, r) {
+	return /* @__PURE__ */ h(v.List, {
+		...n,
+		ref: r,
+		className: P(!e && "dds-tabs", t)
+	});
+}), G = t(function({ unstyled: e, className: t, ...n }, r) {
+	return /* @__PURE__ */ h(v.Trigger, {
+		...n,
+		ref: r,
+		className: P(!e && "dds-tab", t)
+	});
+}), K = t(function({ value: e, style: t, ...n }, r) {
+	let i = y().value !== e;
+	return /* @__PURE__ */ h(v.Content, {
+		...n,
+		value: e,
+		ref: r,
+		hidden: i,
+		style: i ? {
+			...t,
+			display: "none"
+		} : t
+	});
+});
+function q({ option: e }) {
+	let t = S(), { style: n, defaultChecked: r, ...i } = t.getItemHiddenInputProps(e);
+	return /* @__PURE__ */ h("input", {
+		...i,
+		checked: t.value === e.value,
+		onChange: () => {},
+		className: "dds-check__input"
+	});
+}
+var J = t(function({ options: e, label: t, onValueChange: n, className: r, children: i, ...a }, o) {
+	return /* @__PURE__ */ g(x.Root, {
+		...a,
+		ref: o,
+		onValueChange: (e) => {
+			e.value !== null && n?.(e.value);
+		},
+		className: P("dds-radio-group", r),
+		children: [
+			/* @__PURE__ */ h(x.Label, {
+				className: "dds-field__label",
+				children: t
+			}),
+			e.map((e) => /* @__PURE__ */ g(x.Item, {
+				value: e.value,
+				disabled: e.disabled,
+				className: "dds-check",
+				children: [/* @__PURE__ */ h(q, { option: e }), /* @__PURE__ */ h(x.ItemText, { children: e.label })]
+			}, e.value)),
+			i
+		]
+	});
+}), Y = t(function({ title: e, description: t, children: n, actions: r, onOpenChange: i, closeOnOutside: a, portal: o = !0, className: s, overlayClassName: c, contentProps: l, initialFocus: u, finalFocus: d, frame: f, unstyled: p, ..._ }, v) {
+	let y = {
+		title: /* @__PURE__ */ h(w.Title, {
+			className: p ? void 0 : "dds-dialog__title",
+			children: e
+		}),
+		description: t && /* @__PURE__ */ h(w.Description, {
+			className: p ? void 0 : "dds-dialog__body",
+			children: t
+		}),
+		children: n,
+		actions: r && /* @__PURE__ */ h("div", {
+			className: p ? void 0 : "dds-dialog__actions",
+			children: r
+		})
+	}, b = /* @__PURE__ */ h(w.Positioner, {
+		className: P(!p && "dds-dialog-overlay", c),
+		children: /* @__PURE__ */ h(w.Content, {
+			...l,
+			ref: v,
+			"aria-describedby": t ? l?.["aria-describedby"] : void 0,
+			className: P(!p && "dds-dialog", s, l?.className),
+			children: f ? f(y) : /* @__PURE__ */ g(m, { children: [
+				y.title,
+				y.description,
+				n,
+				y.actions
+			] })
+		})
+	});
+	return /* @__PURE__ */ h(w.Root, {
+		..._,
+		onOpenChange: (e) => i?.(e.open),
+		closeOnInteractOutside: a ?? _.closeOnInteractOutside,
+		initialFocusEl: u ? () => u() ?? null : _.initialFocusEl,
+		finalFocusEl: d ? () => d() ?? null : _.finalFocusEl,
+		lazyMount: !0,
+		unmountOnExit: !0,
+		children: o ? /* @__PURE__ */ h(E, { children: b }) : b
+	});
+});
+function X({ content: e, children: t, onOpenChange: n, className: r, contentProps: i, ...a }) {
+	return /* @__PURE__ */ h(T.Root, {
+		openDelay: 0,
+		closeDelay: 0,
+		...a,
+		onOpenChange: (e) => n?.(e.open),
+		children: /* @__PURE__ */ g("span", {
+			className: P("dds-tooltip", r),
+			children: [typeof t == "function" ? /* @__PURE__ */ h(T.Context, { children: (e) => t(e.getTriggerProps()) }) : /* @__PURE__ */ h(T.Trigger, {
+				asChild: !0,
+				children: t
+			}), /* @__PURE__ */ h(E, { children: /* @__PURE__ */ h(T.Positioner, { children: /* @__PURE__ */ h(T.Content, {
+				...i,
+				className: P("dds-tooltip__bubble", i?.className),
+				children: e
+			}) }) })]
+		})
+	});
+}
+//#endregion
+//#region src/icon.tsx
+var re = t(function({ name: e, label: t, size: n = 24, directional: r, className: i, ...a }, o) {
+	let s = te[e];
+	return /* @__PURE__ */ g("svg", {
+		...a,
+		ref: o,
+		viewBox: s.viewBox,
+		width: n,
+		height: n,
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: s.strokeWidth,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		role: t ? "img" : void 0,
+		"aria-label": t,
+		"aria-hidden": !t || void 0,
+		className: P((r ?? D.mirrorInRtl.includes(e)) && D.cssClass, i),
+		children: [t && /* @__PURE__ */ h("title", { children: t }), /* @__PURE__ */ h("g", { dangerouslySetInnerHTML: { __html: s.body } })]
+	});
+}), Z = e(null);
+function ie({ children: e, defaultDuration: t = 5e3, dismissLabel: n, regionLabel: s, className: c }) {
+	let l = i(), u = o(0), d = a(() => A({
+		placement: "bottom-end",
+		overlap: !1,
+		gap: 8,
+		offsets: "var(--dds-space-16)",
+		removeDelay: 0,
+		hotkey: ["DDS_NO_HOTKEY"]
+	}), []), f = a(() => ({
+		show(e) {
+			let n = `dds-toast-${l}-${++u.current}`, r = e.duration ?? t;
+			return d.create({
+				id: n,
+				description: e.message,
+				type: e.tone === "danger" ? "error" : e.tone ?? "info",
+				duration: r > 0 ? r : Infinity,
+				meta: { dds: {
+					...e,
+					id: n
+				} }
+			}), n;
+		},
+		dismiss: (e) => d.remove(e),
+		clear: () => d.remove()
+	}), [
+		d,
+		l,
+		t
+	]);
+	return r(() => () => d.remove(), [d]), /* @__PURE__ */ g(Z.Provider, {
+		value: f,
+		children: [e, /* @__PURE__ */ h(k, {
+			toaster: d,
+			label: s ?? "",
+			"aria-label": s ?? "",
+			role: s ? "region" : "presentation",
+			className: P("dds-toast-region", c),
+			children: (e) => {
+				let t = e.meta?.dds;
+				return /* @__PURE__ */ g(O.Root, {
+					className: P("dds-toast", `dds-toast--${t.tone ?? "info"}`),
+					role: t.tone === "danger" ? "alert" : "status",
+					children: [/* @__PURE__ */ h(O.Description, { children: e.description }), n && /* @__PURE__ */ h(O.CloseTrigger, {
+						className: "dds-iconbtn dds-iconbtn--sm",
+						"aria-label": typeof n == "function" ? n(t) : n,
+						children: "×"
+					})]
+				});
+			}
+		})]
+	});
+}
+function ae() {
+	let e = n(Z);
+	if (!e) throw Error("useToast must be called inside <ToastProvider>");
+	return e;
+}
+//#endregion
+//#region src/console-shell.tsx
+function oe(e, t) {
+	return t.active ?? (t.href.split("/").filter(Boolean).length <= 1 ? e === t.href : e === t.href || e.startsWith(`${t.href}/`));
+}
+var se = t(function({ surface: e, activePath: t, brand: n, context: a, nav: o, labels: c, header: l, foot: u, children: d, className: f, ...p }, m) {
+	let [_, v] = s(!1), [y, b] = s(!1), x = i(), S = `dds-console-rail-${x}`, C = `dds-console-main-${x}`;
+	return r(() => {
+		b(!0);
+		let e = (e) => {
+			e.key === "Escape" && v(!1);
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, []), /* @__PURE__ */ g("div", {
+		...p,
+		ref: m,
+		className: P("dds-console-shell", f),
+		"data-surface": e,
+		"data-hydrated": y ? "true" : void 0,
+		children: [
+			/* @__PURE__ */ h("a", {
+				className: "dds-console-skip dds-visually-hidden",
+				href: `#${C}`,
+				children: c.skip
+			}),
+			/* @__PURE__ */ g("button", {
+				className: "dds-console-rail__toggle",
+				type: "button",
+				"data-action": "toggle-rail",
+				"aria-controls": S,
+				"aria-expanded": _,
+				onClick: () => v(!_),
+				children: [/* @__PURE__ */ h("span", { "aria-hidden": !0 }), /* @__PURE__ */ h("span", {
+					className: "dds-visually-hidden",
+					children: _ ? c.menuClose : c.menuOpen
+				})]
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "dds-console-rail__scrim",
+				"data-open": String(_),
+				onClick: () => v(!1)
+			}),
+			/* @__PURE__ */ g("aside", {
+				id: S,
+				className: "dds-console-rail",
+				"data-open": String(_),
+				children: [
+					/* @__PURE__ */ g("a", {
+						className: "dds-console-rail__brand",
+						href: n.href,
+						children: [/* @__PURE__ */ h("img", {
+							src: n.mark,
+							alt: "",
+							width: 20,
+							height: 20
+						}), /* @__PURE__ */ h("strong", { children: n.name })]
+					}),
+					a && a.length > 0 && /* @__PURE__ */ h("dl", {
+						className: "dds-console-rail__context",
+						children: a.map((e, t) => /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("dt", { children: e.label }), /* @__PURE__ */ h("dd", { children: e.value })] }, t))
+					}),
+					/* @__PURE__ */ h("nav", {
+						className: "dds-console-rail__nav",
+						"aria-label": c.nav,
+						children: o.map((n, r) => /* @__PURE__ */ g("section", {
+							className: "dds-console-rail__group",
+							"aria-labelledby": `${x}-group-${r}`,
+							children: [/* @__PURE__ */ h("h2", {
+								id: `${x}-group-${r}`,
+								className: "dds-console-rail__group-label",
+								children: n.label
+							}), /* @__PURE__ */ h("ul", { children: n.items.map((n) => /* @__PURE__ */ h("li", { children: /* @__PURE__ */ g("a", {
+								className: "dds-console-rail__item",
+								"data-nav": `${e}.${n.id}`,
+								href: n.href,
+								"aria-current": oe(t, n) ? "page" : void 0,
+								onClick: () => v(!1),
+								children: [/* @__PURE__ */ h("span", { children: n.label }), n.badge !== void 0 && n.badge > 0 && /* @__PURE__ */ h("span", {
+									className: "dds-console-rail__badge",
+									"aria-label": c.badge.replace("{count}", () => String(n.badge)),
+									children: n.badge
+								})]
+							}) }, n.id)) })]
+						}, r))
+					}),
+					u && /* @__PURE__ */ h("div", {
+						className: "dds-console-rail__foot",
+						children: u
+					})
+				]
+			}),
+			/* @__PURE__ */ g("main", {
+				id: C,
+				className: "dds-console-main",
+				tabIndex: -1,
+				children: [/* @__PURE__ */ g("header", {
+					className: "dds-console-page-header",
+					children: [/* @__PURE__ */ g("div", {
+						className: "dds-console-page-header__text",
+						children: [l.eyebrow && /* @__PURE__ */ h("p", {
+							className: "dds-console-page-eyebrow",
+							children: l.eyebrow
+						}), /* @__PURE__ */ h("h1", { children: l.title })]
+					}), l.actions && /* @__PURE__ */ h("div", {
+						className: "dds-console-page-header__actions",
+						children: l.actions
+					})]
+				}), d]
+			})
+		]
+	});
+});
+//#endregion
+//#region src/date-picker.tsx
+function Q() {
+	return /* @__PURE__ */ g("svg", {
+		width: "20",
+		height: "20",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.5",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ h("rect", {
+			x: "3.5",
+			y: "5.5",
+			width: "17",
+			height: "15",
+			rx: "2"
+		}), /* @__PURE__ */ h("path", { d: "M7.5 3v5M16.5 3v5M3.5 10.5h17" })]
+	});
+}
+function $({ next: e = !1 }) {
+	return /* @__PURE__ */ h("svg", {
+		width: "18",
+		height: "18",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.5",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ h("path", { d: e ? "m9 5 7 7-7 7" : "m15 5-7 7 7 7" })
+	});
+}
+function ce({ label: e, value: t, onChange: n, locale: r = "ko-KR", timeZone: i = "Asia/Seoul", disabled: a = !1, min: o, max: s }) {
+	return /* @__PURE__ */ h(L, {
+		label: e,
+		children: (c) => /* @__PURE__ */ g(M.Root, {
+			locale: r,
+			timeZone: i,
+			disabled: a,
+			min: o ? N(o) : void 0,
+			max: s ? N(s) : void 0,
+			startOfWeek: 0,
+			minView: "day",
+			maxView: "day",
+			fixedWeeks: !0,
+			translations: {
+				dayCell: (e) => `${e.valueText} 선택`,
+				clearTrigger: "선택 날짜 지우기"
+			},
+			value: t ? [N(t)] : [],
+			format: (e) => e.toString(),
+			onValueChange: (e) => n(e.valueAsString[0] || ""),
+			positioning: {
+				placement: "bottom-start",
+				gutter: 8
+			},
+			children: [/* @__PURE__ */ g(M.Control, {
+				className: "dds-date-picker-control",
+				children: [/* @__PURE__ */ h(M.Input, {
+					...c,
+					placeholder: "YYYY-MM-DD",
+					autoComplete: "off"
+				}), /* @__PURE__ */ h(M.Trigger, {
+					asChild: !0,
+					children: /* @__PURE__ */ h(F, {
+						type: "button",
+						tone: "secondary",
+						"aria-label": `${e} 달력 열기`,
+						children: /* @__PURE__ */ h(Q, {})
+					})
+				})]
+			}), /* @__PURE__ */ h(E, { children: /* @__PURE__ */ h(M.Positioner, {
+				className: "dds-date-picker-positioner",
+				children: /* @__PURE__ */ h(M.Content, {
+					className: "dds-date-picker-content",
+					"aria-label": `${e} 날짜 선택`,
+					children: /* @__PURE__ */ h(M.View, {
+						view: "day",
+						children: /* @__PURE__ */ h(M.Context, { children: (e) => /* @__PURE__ */ g(m, { children: [
+							/* @__PURE__ */ g(M.ViewControl, {
+								className: "dds-date-picker-header",
+								children: [
+									/* @__PURE__ */ h(M.PrevTrigger, {
+										asChild: !0,
+										children: /* @__PURE__ */ h(F, {
+											type: "button",
+											tone: "secondary",
+											"aria-label": "이전 달",
+											children: /* @__PURE__ */ h($, {})
+										})
+									}),
+									/* @__PURE__ */ h(M.RangeText, {}),
+									/* @__PURE__ */ h(M.NextTrigger, {
+										asChild: !0,
+										children: /* @__PURE__ */ h(F, {
+											type: "button",
+											tone: "secondary",
+											"aria-label": "다음 달",
+											children: /* @__PURE__ */ h($, { next: !0 })
+										})
+									})
+								]
+							}),
+							/* @__PURE__ */ g(M.Table, {
+								className: "dds-date-picker-table",
+								children: [/* @__PURE__ */ h(M.TableHead, { children: /* @__PURE__ */ h(M.TableRow, { children: e.weekDays.map((e, t) => /* @__PURE__ */ h(M.TableHeader, { children: e.short }, t)) }) }), /* @__PURE__ */ h(M.TableBody, { children: e.weeks.map((e, t) => /* @__PURE__ */ h(M.TableRow, { children: e.map((e) => /* @__PURE__ */ h(M.TableCell, {
+									value: e,
+									children: /* @__PURE__ */ h(M.TableCellTrigger, { children: e.day })
+								}, e.toString())) }, t)) })]
+							}),
+							/* @__PURE__ */ g("div", {
+								className: "dds-date-picker-footer",
+								children: [/* @__PURE__ */ h(F, {
+									type: "button",
+									tone: "secondary",
+									onClick: () => e.selectToday(),
+									children: "오늘"
+								}), /* @__PURE__ */ h(M.ClearTrigger, {
+									asChild: !0,
+									children: /* @__PURE__ */ h(F, {
+										type: "button",
+										tone: "secondary",
+										children: "지우기"
+									})
+								})]
+							})
+						] }) })
+					})
+				})
+			}) })]
+		})
+	});
+}
+//#endregion
+//#region src/status-pill.tsx
+function le(e) {
+	let t = new Set(e.openDomains ?? []);
+	return function(n) {
+		let r = e.tones[n.domain]?.[n.value], i = e.label(n.domain, n.value, n.locale);
+		if (!r || !i) {
+			if (t.has(n.domain)) return /* @__PURE__ */ h("code", {
+				"data-status": `${n.domain}.${n.value}`,
+				children: n.value
+			});
+			throw Error(r ? `StatusPill: no label for ${n.domain}.${n.value}` : `StatusPill: no tone for ${n.domain}.${n.value}`);
+		}
+		return /* @__PURE__ */ h("span", {
+			className: r === "neutral" ? "dds-badge" : `dds-badge dds-badge--${r}`,
+			"data-status": `${n.domain}.${n.value}`,
+			"data-tone": r,
+			children: i
+		});
+	};
+}
+//#endregion
+export { u as ArkCheckbox, j as ArkDatePicker, C as ArkDialog, c as ArkField, b as ArkRadioGroup, f as ArkSwitch, _ as ArkTabs, ne as ArkToast, ee as ArkTooltip, F as Button, B as Checkbox, se as ConsoleShell, ce as DatePicker, Y as Dialog, L as Field, re as Icon, I as IconButton, H as Radio, J as RadioGroup, R as Select, V as Switch, G as Tab, W as TabList, K as TabPanel, U as Tabs, ie as ToastProvider, X as Tooltip, P as classes, le as createStatusPill, ae as useToast };
+
+//# sourceMappingURL=index.js.map