@slotted/react 0.1.0-beta.1 → 0.1.0-beta.10

package/dist/tabs-DQ36APY-.js

@@ -1,343 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { createRemovalFocus as n, createRovingTabindex as r } from "@slotted/core/focus";
-import { createControllable as i } from "@slotted/core/state";
-import { createContext as a, useCallback as o, useContext as s, useEffect as c, useId as l, useRef as u, useState as d } from "react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { NOT_OVERFLOWING as h, createScrollAffordance as g } from "@slotted/core/overflow";
-//#region src/tabs/tabs-defaults.tsx
-var _ = a({
-	activation: "automatic",
-	fit: "auto",
-	loop: !0,
-	mount: "active",
-	orientation: "horizontal",
-	size: "md",
-	track: "line",
-	variant: "line"
-});
-function v() {
-	return s(_);
-}
-function y({ children: e, ...t }) {
-	let n = v();
-	return /* @__PURE__ */ p(_.Provider, {
-		value: {
-			activation: t.activation ?? n.activation,
-			fit: t.fit ?? n.fit,
-			loop: t.loop ?? n.loop,
-			mount: t.mount ?? n.mount,
-			orientation: t.orientation ?? n.orientation,
-			size: t.size ?? n.size,
-			track: t.track ?? n.track,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/tabs/tabs.tsx
-var b = "[data-part=\"tab\"]", x = a(void 0);
-function S() {
-	let e = s(x);
-	if (e === void 0) throw Error("Tab, TabPanel and TabActions must be rendered inside Tabs.");
-	return e;
-}
-function C(e) {
-	return e.replace(/[^\w-]/g, (e) => `-${e.charCodeAt(0).toString(16)}-`);
-}
-function w(e, t) {
-	let n = !1;
-	return {
-		reason: e,
-		source: t,
-		get cancelled() {
-			return n;
-		},
-		cancel() {
-			n = !0;
-		}
-	};
-}
-function T({ activation: a, children: o, className: s, defaultValue: _, disabled: y, fit: S, loop: T, mount: E, onTabDismiss: D, onValueChange: O, orientation: k, ref: A, render: j, size: M, style: N, track: ee, value: P, variant: te, ...ne }) {
-	let F = v(), I = l(), [re, ie] = d(_), L = P ?? re, [R, ae] = d(null), [z, B] = d(h), [oe, se] = d("none"), V = a ?? F.activation, ce = S ?? F.fit, H = T ?? F.loop, le = E ?? F.mount, U = k ?? F.orientation, ue = M ?? F.size, de = ee ?? F.track, fe = te ?? F.variant, W = y === !0, G = u(new Set(L === void 0 ? [] : [L]));
-	L !== void 0 && G.current.add(L);
-	let K = u(null), q = u(null);
-	function J() {
-		return R === null ? [] : [...R.querySelectorAll(b)];
-	}
-	function Y(e) {
-		return e === void 0 ? -1 : J().findIndex((t) => t.getAttribute("data-value") === e);
-	}
-	function X(e, t, n) {
-		if (e === L) return;
-		let r = !1, a = i({
-			controlled: P,
-			initial: L,
-			onRequest: (e) => {
-				r = e.cancelled, e.value !== void 0 && O?.(e.value, e);
-			}
-		}).request(e, t, n);
-		if (r) return;
-		let o = Y(L), s = Y(e);
-		o !== -1 && s !== -1 && se(s > o ? "forward" : "backward"), G.current.add(e), a && ie(e);
-	}
-	function pe(e) {
-		let t = J().map((e) => e.getAttribute("data-value")).filter((e) => e !== null), n = t.indexOf(e);
-		if (n !== -1) return t[n + 1] ?? t[n - 1];
-	}
-	function me(e, t, n) {
-		let r = w(t, n);
-		if (D?.(e, r), r.cancelled || e !== L) return;
-		let i = pe(e);
-		i !== void 0 && X(i, "remove", n);
-	}
-	let Z = u({
-		activation: V,
-		select: X,
-		value: L
-	});
-	c(() => {
-		Z.current = {
-			activation: V,
-			select: X,
-			value: L
-		};
-	}), c(() => {
-		if (R === null) return;
-		let e = r(R, {
-			crossAxis: !1,
-			itemSelector: b,
-			loop: H,
-			onMove: (e, t) => {
-				if (q.current?.reveal(t), Z.current.activation !== "automatic") return;
-				let n = t.getAttribute("data-value");
-				n !== null && Z.current.select(n, "keyboard", void 0);
-			},
-			orientation: () => U
-		});
-		K.current = e;
-		let t = n(R, { itemSelector: b }), i = new MutationObserver(() => {
-			e.refresh(), q.current?.refresh();
-		});
-		return i.observe(R, {
-			childList: !0,
-			subtree: !0
-		}), () => {
-			i.disconnect(), t.destroy(), e.destroy(), K.current = null;
-		};
-	}, [
-		R,
-		H,
-		U
-	]), c(() => {
-		if (R === null || U === "vertical") {
-			B(h);
-			return;
-		}
-		let e = g(R, { onChange: B });
-		return q.current = e, B(e.state()), () => {
-			e.destroy(), q.current = null;
-		};
-	}, [R, U]), c(() => {
-		let e = Y(L);
-		if (e === -1) return;
-		K.current?.setActive(e);
-		let t = J()[e];
-		t !== void 0 && q.current?.reveal(t);
-	}, [L, R]);
-	let Q = z.overflowing && U === "horizontal";
-	c(() => {
-		if (!Q) return;
-		let e = J()[Y(Z.current.value)];
-		e !== void 0 && q.current?.reveal(e);
-	}, [Q]);
-	let he = {
-		activation: V,
-		attachList: ae,
-		disabled: W,
-		dismiss: me,
-		identify: (e) => ({
-			panelId: `${I}panel-${C(e)}`,
-			tabId: `${I}tab-${C(e)}`
-		}),
-		mount: le,
-		orientation: U,
-		seen: (e) => G.current.has(e),
-		select: X,
-		value: L
-	}, $ = {
-		...ne,
-		children: /* @__PURE__ */ m(f, { children: [o, Q ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
-			"aria-hidden": "true",
-			"data-direction": "start",
-			"data-part": "scroll",
-			disabled: z.atStart,
-			onClick: () => q.current?.page(-1),
-			tabIndex: -1,
-			type: "button",
-			children: /* @__PURE__ */ p(t, {
-				directional: !0,
-				children: /* @__PURE__ */ p(e, { name: "chevron-right" })
-			})
-		}), /* @__PURE__ */ p("button", {
-			"aria-hidden": "true",
-			"data-direction": "end",
-			"data-part": "scroll",
-			disabled: z.atEnd,
-			onClick: () => q.current?.page(1),
-			tabIndex: -1,
-			type: "button",
-			children: /* @__PURE__ */ p(t, {
-				directional: !0,
-				children: /* @__PURE__ */ p(e, { name: "chevron-right" })
-			})
-		})] }) : null] }),
-		className: s,
-		"data-activation-direction": oe,
-		...W ? { "data-disabled": "" } : {},
-		"data-fit": ce,
-		"data-orientation": U,
-		...z.overflowing ? { "data-overflowing": "" } : {},
-		"data-part": "root",
-		"data-size": ue,
-		"data-track": de,
-		"data-ui": "tabs",
-		"data-variant": fe,
-		style: N
-	};
-	return /* @__PURE__ */ p(x.Provider, {
-		value: he,
-		children: j === void 0 ? /* @__PURE__ */ p("div", {
-			...$,
-			ref: A
-		}) : j($)
-	});
-}
-//#endregion
-//#region src/tabs/tabs-parts.tsx
-function E(e) {
-	return e.detail === 0 ? "keyboard" : "pointer";
-}
-function D({ children: e, ref: t, render: n, ...r }) {
-	let i = S(), a = o((e) => {
-		if (i.attachList(e), typeof t == "function") return t(e);
-		t && (t.current = e);
-	}, [t, i.attachList]), s = {
-		tabIndex: -1,
-		...r,
-		...i.orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
-		children: e,
-		"data-part": "list",
-		role: "tablist"
-	};
-	return n === void 0 ? /* @__PURE__ */ p("div", {
-		...s,
-		ref: a
-	}) : n({
-		...s,
-		ref: a
-	});
-}
-function O({ children: n, className: r, controls: i, disabled: a, dismissLabel: o, dismissible: s = !1, end: c, href: l, onClick: u, onKeyDown: d, ref: h, render: g, start: _, style: v, value: y, ...b }) {
-	let x = S(), { panelId: C, tabId: w } = x.identify(y), T = i ?? C, D = x.value === y, O = x.disabled === !0 || a === !0;
-	function k(e) {
-		u?.(e), !e.defaultPrevented && (O || l !== void 0 && (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) || (l !== void 0 && e.preventDefault(), x.select(y, E(e), e)));
-	}
-	function A(e) {
-		d?.(e), !(e.defaultPrevented || e.repeat) && s && !O && e.key === "Delete" && (e.preventDefault(), x.dismiss(y, "keyboard", e));
-	}
-	let j = /* @__PURE__ */ m(f, { children: [
-		_ === void 0 ? null : /* @__PURE__ */ p("span", {
-			"data-part": "start",
-			children: _
-		}),
-		/* @__PURE__ */ p("span", {
-			"data-part": "label",
-			children: n
-		}),
-		c === void 0 ? null : /* @__PURE__ */ p("span", {
-			"data-part": "end",
-			children: c
-		})
-	] }), M = l === void 0 ? /* @__PURE__ */ p("button", {
-		...b,
-		"aria-controls": T,
-		"aria-keyshortcuts": s ? "Delete" : void 0,
-		"aria-selected": D,
-		"data-part": "tab",
-		"data-value": y,
-		disabled: O,
-		id: w,
-		onClick: k,
-		onKeyDown: A,
-		ref: h,
-		role: "tab",
-		tabIndex: D ? 0 : -1,
-		type: "button",
-		children: j
-	}) : /* @__PURE__ */ p("a", {
-		...b,
-		"aria-controls": T,
-		"aria-disabled": O === !0 || void 0,
-		"aria-keyshortcuts": s ? "Delete" : void 0,
-		"aria-selected": D,
-		"data-part": "tab",
-		"data-value": y,
-		href: l,
-		id: w,
-		onClick: k,
-		onKeyDown: A,
-		ref: h,
-		role: "tab",
-		tabIndex: D ? 0 : -1,
-		children: j
-	}), N = {
-		children: /* @__PURE__ */ m(f, { children: [M, s ? /* @__PURE__ */ p("button", {
-			"aria-label": o,
-			"data-part": "dismiss",
-			disabled: O,
-			onClick: (e) => {
-				e.stopPropagation(), x.dismiss(y, "pointer", e);
-			},
-			tabIndex: -1,
-			type: "button",
-			children: /* @__PURE__ */ p(t, { children: /* @__PURE__ */ p(e, { name: "x" }) })
-		}) : null] }),
-		className: r,
-		"data-part": "item",
-		...D ? { "data-selected": "" } : {},
-		role: "presentation",
-		style: v
-	};
-	return g === void 0 ? /* @__PURE__ */ p("div", { ...N }) : g(N);
-}
-function k({ children: e, ref: t, render: n, value: r, ...i }) {
-	let a = S(), { panelId: o, tabId: s } = a.identify(r), c = a.value === r, l = c || a.mount === "eager" || a.mount === "lazy" && a.seen(r), u = {
-		...i,
-		"aria-labelledby": s,
-		children: l ? e : null,
-		"data-part": "panel",
-		hidden: !c,
-		id: o,
-		role: "tabpanel",
-		tabIndex: 0
-	};
-	return n === void 0 ? /* @__PURE__ */ p("div", {
-		...u,
-		ref: t
-	}) : n(u);
-}
-function A({ children: e, ref: t, render: n, ...r }) {
-	S();
-	let i = {
-		...r,
-		children: e,
-		"data-part": "actions"
-	};
-	return n === void 0 ? /* @__PURE__ */ p("div", {
-		...i,
-		ref: t
-	}) : n(i);
-}
-//#endregion
-export { T as a, v as c, k as i, A as n, S as o, D as r, y as s, O as t };

package/dist/tag-DjtW53xN.js

@@ -1,365 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { r as n } from "./i18n-DpW8lqJ1.js";
-/* empty css             */
-import { createRemovalFocus as r, createRovingTabindex as i } from "@slotted/core/focus";
-import { createControllable as a } from "@slotted/core/state";
-import { createContext as o, useCallback as s, useContext as c, useEffect as l, useId as u, useRef as d, useState as f } from "react";
-import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
-import { tagMessages as g } from "@slotted/core/i18n";
-//#region src/tag/tag-defaults.tsx
-var _ = o({
-	shape: "pill",
-	size: "md",
-	tone: "secondary",
-	variant: "soft"
-});
-function v() {
-	return c(_);
-}
-function y({ children: e, ...t }) {
-	let n = v();
-	return /* @__PURE__ */ m(_.Provider, {
-		value: {
-			shape: t.shape ?? n.shape,
-			size: t.size ?? n.size,
-			tone: t.tone ?? n.tone,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/tag/tag-chip.tsx
-var b = "[data-part=\"body\"]:is(a, button), [data-part=\"remove\"]", x = o(void 0);
-function S({ children: e, role: t }) {
-	return /* @__PURE__ */ m(x.Provider, {
-		value: t,
-		children: e
-	});
-}
-function C() {
-	return c(x);
-}
-function w(e) {
-	let t = v();
-	return {
-		tone: e.tone ?? t.tone,
-		variant: e.variant ?? t.variant,
-		size: e.size ?? t.size,
-		shape: e.shape ?? t.shape
-	};
-}
-function T(e, t) {
-	return {
-		"data-ui": "tag",
-		"data-part": "root",
-		"data-tone": e.tone,
-		"data-variant": e.variant,
-		"data-size": e.size,
-		"data-shape": e.shape,
-		"data-disabled": t.disabled ? "" : void 0,
-		"data-selected": t.selected ? "" : void 0
-	};
-}
-function E(e, t) {
-	let n = !1;
-	return {
-		reason: e,
-		source: t,
-		get cancelled() {
-			return n;
-		},
-		cancel() {
-			n = !0;
-		}
-	};
-}
-function D(e) {
-	let t = n(g, e.messages), r = e.disabled === !0 || e.removeDisabled === !0;
-	return {
-		removable: e.onRemove !== void 0,
-		removeDisabled: r,
-		removeLabel: t("remove"),
-		request(t, n) {
-			r || e.onRemove?.(E(t, n));
-		}
-	};
-}
-function O(e) {
-	return (t) => {
-		e.removable && !e.removeDisabled && (t.repeat || t.defaultPrevented || (t.key === "Backspace" || t.key === "Delete") && (t.preventDefault(), e.request("keyboard", t)));
-	};
-}
-function k({ children: e, end: t, indicator: n, labelId: r, start: i }) {
-	return /* @__PURE__ */ h(p, { children: [
-		n,
-		i === void 0 ? null : /* @__PURE__ */ m("span", {
-			"data-part": "start",
-			children: i
-		}),
-		/* @__PURE__ */ m("span", {
-			"data-part": "label",
-			id: r,
-			children: e
-		}),
-		t === void 0 ? null : /* @__PURE__ */ m("span", {
-			"data-part": "end",
-			children: t
-		})
-	] });
-}
-function A({ labelId: n, removal: r, wordId: i }) {
-	return /* @__PURE__ */ h("button", {
-		"aria-labelledby": `${i} ${n}`,
-		"data-part": "remove",
-		disabled: r.removeDisabled,
-		onClick: (e) => {
-			e.stopPropagation(), r.request("remove", e);
-		},
-		type: "button",
-		children: [/* @__PURE__ */ m(t, { children: /* @__PURE__ */ m(e, { name: "x" }) }), /* @__PURE__ */ m("span", {
-			hidden: !0,
-			id: i,
-			children: r.removeLabel
-		})]
-	});
-}
-function j({ appearance: e, children: t, disabled: n, removal: r, render: i, rootProps: a, selected: o }) {
-	let s = C(), c = {
-		...a,
-		...T(e, {
-			disabled: n === !0,
-			selected: o
-		}),
-		children: t,
-		...a?.role === void 0 && s !== void 0 ? { role: s } : {},
-		onKeyDown: (e) => {
-			a?.onKeyDown?.(e), O(r)(e);
-		}
-	};
-	return i === void 0 ? /* @__PURE__ */ m("span", { ...c }) : i(c);
-}
-//#endregion
-//#region src/tag/tag.tsx
-function M({ children: e, disabled: t = !1, end: n, onRemove: r, removeDisabled: i = !1, messages: a, render: o, shape: s, size: c, start: l, tone: d, variant: f, ...p }) {
-	let g = w({
-		shape: s,
-		size: c,
-		tone: d,
-		variant: f
-	}), _ = D({
-		disabled: t,
-		onRemove: r,
-		removeDisabled: i,
-		messages: a
-	}), v = u(), y = `${v}label`, b = `${v}remove`;
-	return /* @__PURE__ */ h(j, {
-		appearance: g,
-		disabled: t,
-		removal: _,
-		render: o,
-		rootProps: p,
-		children: [/* @__PURE__ */ m("span", {
-			"data-part": "body",
-			children: /* @__PURE__ */ m(k, {
-				end: n,
-				labelId: y,
-				start: l,
-				children: e
-			})
-		}), _.removable ? /* @__PURE__ */ m(A, {
-			labelId: y,
-			removal: _,
-			wordId: b
-		}) : null]
-	});
-}
-//#endregion
-//#region src/tag/tag-button.tsx
-function N({ children: e, disabled: t = !1, end: n, onRemove: r, removeDisabled: i = !1, messages: a, render: o, rootProps: s, shape: c, size: l, start: d, tone: f, type: p = "button", variant: g, ..._ }) {
-	let v = w({
-		shape: c,
-		size: l,
-		tone: f,
-		variant: g
-	}), y = D({
-		disabled: t,
-		onRemove: r,
-		removeDisabled: i,
-		messages: a
-	}), b = u(), x = `${b}label`, S = `${b}remove`, C = {
-		..._,
-		children: /* @__PURE__ */ m(k, {
-			end: n,
-			labelId: x,
-			start: d,
-			children: e
-		}),
-		"data-part": "body",
-		disabled: t,
-		type: p
-	};
-	return /* @__PURE__ */ h(j, {
-		appearance: v,
-		disabled: t,
-		removal: y,
-		rootProps: s,
-		children: [o === void 0 ? /* @__PURE__ */ m("button", { ...C }) : o(C), y.removable ? /* @__PURE__ */ m(A, {
-			labelId: x,
-			removal: y,
-			wordId: S
-		}) : null]
-	});
-}
-//#endregion
-//#region src/tag/tag-group.tsx
-function P({ children: e, loop: t = !0, orientation: n = "horizontal", ref: a, render: o, role: c = "toolbar", ...u }) {
-	let f = d(null), p = c === "toolbar", h = s((e) => {
-		if (f.current = e, typeof a == "function") return a(e);
-		a && (a.current = e);
-	}, [a]);
-	l(() => {
-		let e = f.current;
-		if (e === null || !p) return;
-		let a = i(e, {
-			itemSelector: b,
-			loop: t,
-			orientation: () => n
-		}), o = r(e, { itemSelector: b }), s = new MutationObserver(() => a.refresh());
-		return s.observe(e, {
-			childList: !0,
-			subtree: !0
-		}), () => {
-			s.disconnect(), o.destroy(), a.destroy();
-		};
-	}, [
-		t,
-		n,
-		p
-	]);
-	let g = {
-		tabIndex: -1,
-		...u,
-		children: /* @__PURE__ */ m(S, {
-			role: c === "list" ? "listitem" : void 0,
-			children: e
-		}),
-		"data-orientation": n,
-		"data-part": "group",
-		"data-ui": "tag",
-		ref: h,
-		role: c,
-		...p && n === "vertical" ? { "aria-orientation": n } : {}
-	};
-	return o === void 0 ? /* @__PURE__ */ m("div", { ...g }) : o(g);
-}
-//#endregion
-//#region src/tag/tag-link.tsx
-function F({ children: e, disabled: t = !1, end: n, href: r, onAuxClickCapture: i, onClickCapture: a, onKeyDownCapture: o, onRemove: s, removeDisabled: c = !1, messages: l, render: d, rootProps: f, shape: p, size: g, start: _, tabIndex: v, tone: y, variant: b, ...x }) {
-	let S = w({
-		shape: p,
-		size: g,
-		tone: y,
-		variant: b
-	}), C = D({
-		disabled: t,
-		onRemove: s,
-		removeDisabled: c,
-		messages: l
-	}), T = u(), E = `${T}label`, O = `${T}remove`, M = (e) => t ? (e.preventDefault(), e.stopPropagation(), e.nativeEvent.stopImmediatePropagation?.(), !0) : !1, N = {
-		...x,
-		children: /* @__PURE__ */ m(k, {
-			end: n,
-			labelId: E,
-			start: _,
-			children: e
-		}),
-		"data-part": "body",
-		onAuxClickCapture: (e) => {
-			M(e) || i?.(e);
-		},
-		onClickCapture: (e) => {
-			M(e) || a?.(e);
-		},
-		onKeyDownCapture: (e) => {
-			e.key === "Enter" && M(e) || o?.(e);
-		},
-		...t ? {
-			"aria-disabled": !0,
-			role: x.role ?? "link",
-			tabIndex: v ?? 0
-		} : {
-			href: r,
-			...v === void 0 ? {} : { tabIndex: v }
-		}
-	};
-	return /* @__PURE__ */ h(j, {
-		appearance: S,
-		disabled: t,
-		removal: C,
-		rootProps: f,
-		children: [d === void 0 ? /* @__PURE__ */ m("a", { ...N }) : d(N), C.removable ? /* @__PURE__ */ m(A, {
-			labelId: E,
-			removal: C,
-			wordId: O
-		}) : null]
-	});
-}
-//#endregion
-//#region src/tag/tag-toggle.tsx
-function I(e) {
-	return e.detail === 0 ? "keyboard" : "pointer";
-}
-function L({ children: n, defaultSelected: r, disabled: i = !1, end: o, onClick: s, onRemove: c, onSelectedChange: l, removeDisabled: d = !1, messages: p, render: g, rootProps: _, selected: v, shape: y, size: b, start: x, tone: S, type: C = "button", variant: T, ...E }) {
-	let O = w({
-		shape: y,
-		size: b,
-		tone: S,
-		variant: T
-	}), M = D({
-		disabled: i,
-		onRemove: c,
-		removeDisabled: d,
-		messages: p
-	}), [N, P] = f(r ?? !1), F = u(), L = `${F}label`, R = `${F}remove`, z = a({
-		controlled: v,
-		initial: N,
-		onRequest: (e) => l?.(e.value, e)
-	}), B = {
-		...E,
-		"aria-pressed": z.value,
-		children: /* @__PURE__ */ m(k, {
-			end: o,
-			indicator: /* @__PURE__ */ m("span", {
-				"aria-hidden": "true",
-				"data-part": "indicator",
-				children: /* @__PURE__ */ m(t, { children: /* @__PURE__ */ m(e, { name: "check" }) })
-			}),
-			labelId: L,
-			start: x,
-			children: n
-		}),
-		"data-part": "body",
-		disabled: i,
-		onClick: (e) => {
-			if (s?.(e), e.defaultPrevented) return;
-			let t = !z.value;
-			z.request(t, I(e), e) && P(t);
-		},
-		type: C
-	};
-	return /* @__PURE__ */ h(j, {
-		appearance: O,
-		disabled: i,
-		removal: M,
-		rootProps: _,
-		selected: z.value,
-		children: [g === void 0 ? /* @__PURE__ */ m("button", { ...B }) : g(B), M.removable ? /* @__PURE__ */ m(A, {
-			labelId: L,
-			removal: M,
-			wordId: R
-		}) : null]
-	});
-}
-//#endregion
-export { M as a, N as i, F as n, y as o, P as r, v as s, L as t };