@slotted/react 0.1.0-beta.7 → 0.1.0-beta.9

package/dist/stat-card.js

@@ -1,2 +1,2 @@
-import { _ as e, a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g, v as _ } from "./stat-card-BG7uLytP.js";
+import { _ as e, a as t, c as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, o as d, p as f, r as p, s as m, t as h, u as g, v as _ } from "./stat-card-B26PbBTG.js";
 export { f as StatCard, u as StatCardAction, p as StatCardComparison, l as StatCardDefaultsProvider, i as StatCardDelta, s as StatCardFigure, t as StatCardHeader, d as StatCardLabel, m as StatCardMessage, n as StatCardPeriod, c as StatCardStatus, g as StatCardTrend, r as StatCardUnit, h as StatCardValue, a as toneOf, e as trendOf, _ as useStatCard, o as useStatCardDefaults };

package/dist/status-indicator-BcRmvlQi.js

@@ -0,0 +1,78 @@
+import { n as e, t } from "./icon-DMdotKfc.js";
+import { r as n } from "./i18n-DpW8lqJ1.js";
+/* empty css                         */
+import { keyedProps as r } from "@slotted/core/selector-key";
+import { createContext as i, useContext as a, useMemo as o } from "react";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { statusIndicatorMessages as u } from "@slotted/core/i18n";
+//#region src/status-indicator/status-indicator-defaults.tsx
+var d = i({});
+function f() {
+	return a(d);
+}
+function p({ children: e, live: t, mark: n, size: r }) {
+	let i = f(), a = o(() => ({
+		live: t ?? i.live,
+		mark: n ?? i.mark,
+		size: r ?? i.size
+	}), [
+		t,
+		n,
+		r,
+		i
+	]);
+	return /* @__PURE__ */ c(d.Provider, {
+		value: a,
+		children: e
+	});
+}
+//#endregion
+//#region src/status-indicator/status-indicator.constants.ts
+var m = "neutral", h = {
+	neutral: "circle",
+	info: "circle-info",
+	success: "circle-check",
+	warning: "circle-alert",
+	danger: "circle-x",
+	unknown: "circle-question"
+}, g = {
+	off: void 0,
+	polite: "status",
+	assertive: "alert"
+};
+function _({ children: i, label: a, live: o, mark: d, messages: p, pulse: _ = !1, render: v, role: y, size: b, status: x = m, ...S }) {
+	let C = f(), w = n(u, p), T = {
+		live: o ?? C.live ?? "off",
+		mark: d ?? C.mark ?? "dot",
+		size: b ?? C.size ?? "md"
+	}, E = a ?? w(x), D = r({
+		...S,
+		children: /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c("span", {
+			"aria-hidden": "true",
+			"data-part": "mark",
+			"data-part-mark": "",
+			children: T.mark === "icon" ? /* @__PURE__ */ c(t, { children: /* @__PURE__ */ c(e, { name: h[x] }) }) : null
+		}), /* @__PURE__ */ c("span", {
+			"data-part": "label",
+			"data-part-label": "",
+			children: i ?? /* @__PURE__ */ c("span", {
+				"data-part": "announcement",
+				"data-part-announcement": "",
+				"data-ui": "visually-hidden",
+				"data-ui-visually-hidden": "",
+				children: E
+			})
+		})] }),
+		"data-mark": T.mark,
+		"data-part": "root",
+		"data-pulse": _ || void 0,
+		"data-size": T.size,
+		"data-status": x,
+		"data-ui": "status-indicator",
+		...y === void 0 ? {} : { role: y },
+		...y === void 0 && g[T.live] !== void 0 ? { role: g[T.live] } : {}
+	});
+	return v === void 0 ? /* @__PURE__ */ c("span", { ...D }) : v(D);
+}
+//#endregion
+export { f as i, m as n, p as r, _ as t };

package/dist/status-indicator.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, r as n, t as r } from "./status-indicator-BOjpXkU5.js";
+import { i as e, n as t, r as n, t as r } from "./status-indicator-BcRmvlQi.js";
 export { t as STATUS_INDICATOR_DEFAULT_STATUS, r as StatusIndicator, n as StatusIndicatorDefaultsProvider, e as useStatusIndicatorDefaults };

package/dist/stepper-DJiyt8_a.js

@@ -0,0 +1,261 @@
+import { n as e, t } from "./icon-DMdotKfc.js";
+import { n, r } from "./i18n-DpW8lqJ1.js";
+/* empty css                         */
+import { keyedProps as i, selectorKeyProps as a } from "@slotted/core/selector-key";
+import { createControllable as o } from "@slotted/core/state";
+import { Children as s, createContext as c, isValidElement as l, useContext as u, useEffect as d, useId as f, useRef as p, useState as m } from "react";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { stepperMessages as v } from "@slotted/core/i18n";
+import { stepFocusIndex as y, stepPercent as b, stepReachable as x, stepStatus as S } from "@slotted/core/steps";
+//#region src/stepper/stepper-defaults.tsx
+var C = c({});
+function w() {
+	return u(C);
+}
+function T({ children: e, ...t }) {
+	let n = w();
+	return /* @__PURE__ */ g(C.Provider, {
+		value: {
+			labelPlacement: t.labelPlacement ?? n.labelPlacement,
+			linear: t.linear ?? n.linear,
+			navigation: t.navigation ?? n.navigation,
+			orientation: t.orientation ?? n.orientation
+		},
+		children: e
+	});
+}
+//#endregion
+//#region src/stepper/stepper.tsx
+var E = c(void 0), D = c(void 0);
+function O() {
+	let e = u(E);
+	if (e === void 0) throw Error("Stepper parts must be rendered inside a Stepper.");
+	return e;
+}
+function k() {
+	return u(D);
+}
+var A = D.Provider;
+function j({ autoComplete: e, children: t, defaultStep: a, labelPlacement: s, linear: c, messages: l, navigation: u, onStepChange: d, orientation: p, render: h, step: _, ...y }) {
+	let C = w(), T = r(v, l), D = n(), O = f(), [k, A] = m(a ?? 0), [j, N] = m([]), P = _ ?? k, F = j.length, I = c ?? C.linear ?? !1, L = (t) => S({
+		autoComplete: e ?? !1,
+		complete: j[t]?.complete,
+		index: t,
+		step: P
+	}), R = (t) => x({
+		autoComplete: e ?? !1,
+		complete: j[t]?.complete,
+		count: F,
+		disabled: j[t]?.disabled,
+		index: t,
+		isComplete: (e) => L(e) === "complete",
+		linear: I,
+		step: P
+	}), z = (e, t = "pointer", n) => {
+		e < 0 || F > 0 && e >= F || o({
+			controlled: _,
+			initial: P,
+			onRequest: (e) => d?.(e.value, e)
+		}).request(e, t, n) && A(e);
+	}, B = {
+		canGoNext: F > 0 && P < F - 1 && R(P + 1),
+		canGoPrevious: P > 0,
+		count: F,
+		goToStep: z,
+		ids: {
+			panel: (e) => `slotted-stepper-${O}-panel-${e}`,
+			trigger: (e) => `slotted-stepper-${O}-trigger-${e}`
+		},
+		labelPlacement: s ?? C.labelPlacement ?? "end",
+		linear: I,
+		locale: D,
+		navigation: u ?? C.navigation ?? "button",
+		next: (e, t) => z(P + 1, e, t),
+		orientation: p ?? C.orientation ?? "horizontal",
+		percent: b({
+			count: F,
+			step: P
+		}),
+		previous: (e, t) => z(P - 1, e, t),
+		reachable: R,
+		reset: (e) => z(a ?? 0, "programmatic", e),
+		statusOf: L,
+		step: P,
+		t: T
+	}, V = i({
+		...y,
+		children: /* @__PURE__ */ g(M.Provider, {
+			value: N,
+			children: t
+		}),
+		"data-label-placement": B.labelPlacement,
+		"data-navigation": B.navigation,
+		"data-orientation": B.orientation,
+		"data-part": "root",
+		"data-ui": "stepper"
+	});
+	return /* @__PURE__ */ g(E.Provider, {
+		value: B,
+		children: h === void 0 ? /* @__PURE__ */ g("div", { ...V }) : h(V)
+	});
+}
+var M = c(void 0);
+//#endregion
+//#region src/stepper/stepper-parts.tsx
+function N(e) {
+	let t = typeof e == "object" && e ? Reflect.get(e, "props") : void 0, n = (e) => typeof t == "object" && t ? Reflect.get(t, e) : void 0;
+	return {
+		complete: n("complete"),
+		disabled: n("disabled")
+	};
+}
+function P({ children: e, ref: t, render: n, onKeyDown: r, ...a }) {
+	let o = O(), c = u(M), f = s.toArray(e).filter((e) => l(e)), m = f.map(N), h = JSON.stringify(m), _ = p(void 0);
+	d(() => {
+		_.current !== h && (_.current = h, c?.(m));
+	}, [h, c]);
+	let v = i({
+		"aria-label": o.t("label"),
+		...a,
+		children: f.map((e, t) => /* @__PURE__ */ g(A, {
+			value: {
+				index: t,
+				last: t === f.length - 1,
+				travelled: t < o.step
+			},
+			children: e
+		}, e.key ?? t)),
+		"data-part": "list",
+		onKeyDown: (e) => {
+			if (r?.(e), e.defaultPrevented) return;
+			let t = e.target?.closest?.("[data-part=\"trigger\"]"), n = Number(t?.getAttribute("data-index") ?? -1);
+			if (!Number.isInteger(n) || n < 0) return;
+			let i = e.currentTarget.ownerDocument.defaultView?.getComputedStyle(e.currentTarget).direction === "rtl" ? "rtl" : "ltr", a = y({
+				count: o.count,
+				direction: i,
+				from: n,
+				key: e.key,
+				orientation: o.orientation
+			});
+			a !== -1 && (e.preventDefault(), e.currentTarget.ownerDocument.getElementById(o.ids.trigger(a))?.focus());
+		}
+	});
+	return n === void 0 ? /* @__PURE__ */ g("ol", {
+		...v,
+		ref: t
+	}) : n(v);
+}
+function F({ children: n, complete: r, description: o, disabled: s, href: c, invalid: l, label: u, loading: d, marker: f, ref: p, render: m, ...v }) {
+	let y = O(), b = k(), x = b?.index ?? 0, S = y.statusOf(x), C = x === y.step, w = s === !0 || !y.reachable(x), T = l === !0 ? "x" : S === "complete" && !C ? "check" : void 0, E = new Intl.ListFormat(y.locale, { type: "unit" }).format([
+		y.t("position", {
+			index: x + 1,
+			count: y.count
+		}),
+		l === !0 ? y.t("invalid") : C ? y.t("current") : S === "complete" ? y.t("complete") : void 0,
+		d === !0 ? y.t("loading") : void 0,
+		w && !C ? y.t("unavailable") : void 0
+	].filter((e) => e !== void 0)), D = {
+		"aria-controls": v["aria-controls"],
+		"aria-current": C ? "step" : void 0,
+		"data-index": x,
+		"data-part": "trigger",
+		...a("part", "trigger"),
+		id: y.ids.trigger(x),
+		children: /* @__PURE__ */ _(h, { children: [
+			/* @__PURE__ */ _("span", {
+				"aria-hidden": "true",
+				"data-part": "marker",
+				"data-part-marker": "",
+				children: [f ?? x + 1, T === void 0 ? null : /* @__PURE__ */ g(t, { children: /* @__PURE__ */ g(e, { name: T }) })]
+			}),
+			/* @__PURE__ */ _("span", {
+				"data-part": "label",
+				"data-part-label": "",
+				children: [u, o === void 0 ? null : /* @__PURE__ */ g("span", {
+					"data-part": "description",
+					"data-part-description": "",
+					children: o
+				})]
+			}),
+			/* @__PURE__ */ g("span", {
+				"data-part": "status",
+				"data-part-status": "",
+				"data-ui": "visually-hidden",
+				"data-ui-visually-hidden": "",
+				children: `, ${E}`
+			})
+		] })
+	}, A = (e) => {
+		e.defaultPrevented || w || d === !0 || y.goToStep(x, "pointer", e);
+	}, j = y.navigation === "none" ? /* @__PURE__ */ g("span", { ...D }) : y.navigation === "link" ? /* @__PURE__ */ g("a", {
+		...D,
+		"aria-disabled": w ? !0 : void 0,
+		...w || c === void 0 ? {} : { href: c },
+		onClick: A
+	}) : /* @__PURE__ */ g("button", {
+		...D,
+		"aria-disabled": w ? !0 : void 0,
+		onClick: A,
+		type: "button"
+	}), M = i({
+		...v,
+		children: /* @__PURE__ */ _(h, { children: [
+			j,
+			n,
+			b?.last === !0 ? null : /* @__PURE__ */ g("span", {
+				"aria-hidden": "true",
+				"data-complete": b?.travelled === !0 ? "" : void 0,
+				"data-part": "separator",
+				"data-part-separator": ""
+			})
+		] }),
+		"data-complete": S === "complete" ? "" : void 0,
+		"data-current": C ? "" : void 0,
+		"data-disabled": w ? "" : void 0,
+		"data-invalid": l === !0 ? "" : void 0,
+		"data-loading": d === !0 ? "" : void 0,
+		"data-part": "item"
+	});
+	return m === void 0 ? /* @__PURE__ */ g("li", {
+		...M,
+		ref: p
+	}) : m(M);
+}
+function I({ children: e, ref: t, render: n, ...r }) {
+	let a = O(), o = k()?.index ?? 0;
+	if (o !== a.step) return null;
+	let s = i({
+		"aria-labelledby": a.ids.trigger(o),
+		...r,
+		children: e,
+		"data-part": "panel",
+		id: r.id ?? a.ids.panel(o),
+		role: "group",
+		tabIndex: r.tabIndex ?? -1
+	});
+	return n === void 0 ? /* @__PURE__ */ g("div", {
+		...s,
+		ref: t
+	}) : n(s);
+}
+function L(e, t) {
+	return (n) => {
+		t?.(n), n.defaultPrevented !== !0 && e();
+	};
+}
+function R({ disabled: e, onClick: t, render: n }) {
+	let r = O();
+	return n({
+		disabled: e ?? !r.canGoNext,
+		onClick: L(() => r.next("pointer"), t)
+	});
+}
+function z({ disabled: e, onClick: t, render: n }) {
+	let r = O();
+	return n({
+		disabled: e ?? !r.canGoPrevious,
+		onClick: L(() => r.previous("pointer"), t)
+	});
+}
+//#endregion
+export { F as a, T as c, z as i, w as l, R as n, j as o, I as r, O as s, P as t };

package/dist/stepper.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c } from "./stepper-DQJuRWqR.js";
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c } from "./stepper-DJiyt8_a.js";
 export { a as Stepper, t as StepperDefaultsProvider, c as StepperList, i as StepperNext, o as StepperPanel, n as StepperPrevious, e as StepperStep, s as useStepper, r as useStepperDefaults };