@forte-ui/react 1.0.0-alpha.1

package/dist/Select-BP-zvdXm.js

@@ -0,0 +1,237 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Select as i } from "@base-ui/react/select";
+import './styles/Select.css';var a = {
+	label: "_label_10jh1_54",
+	trigger: "_trigger_10jh1_81",
+	value: "_value_10jh1_229",
+	icon: "_icon_10jh1_246",
+	caret: "_caret_10jh1_268",
+	backdrop: "_backdrop_10jh1_284",
+	positioner: "_positioner_10jh1_309",
+	popup: "_popup_10jh1_324",
+	list: "_list_10jh1_44",
+	counterFold: "_counterFold_10jh1_1",
+	scrollArrow: "_scrollArrow_10jh1_602",
+	item: "_item_10jh1_676",
+	itemIndicator: "_itemIndicator_10jh1_728",
+	itemText: "_itemText_10jh1_746",
+	group: "_group_10jh1_756",
+	groupLabel: "_groupLabel_10jh1_760",
+	separator: "_separator_10jh1_793"
+}, o = typeof process < "u" && process.env.NODE_ENV !== "production";
+function s(e) {
+	return /* @__PURE__ */ r("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor",
+		"aria-hidden": "true",
+		focusable: "false",
+		...e,
+		style: {
+			display: "block",
+			...e.style
+		},
+		children: [/* @__PURE__ */ n("path", {
+			className: a.caret,
+			"data-direction": "up",
+			d: "M11 6H5l3-3.5z"
+		}), /* @__PURE__ */ n("path", {
+			className: a.caret,
+			"data-direction": "down",
+			d: "M11 10H5l3 3.5z"
+		})]
+	});
+}
+function c(e) {
+	return /* @__PURE__ */ n("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "1.5",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		focusable: "false",
+		...e,
+		style: {
+			display: "block",
+			...e.style
+		},
+		children: /* @__PURE__ */ n("path", { d: "m2.5 8.5 4 4 7-9" })
+	});
+}
+function l(e) {
+	return /* @__PURE__ */ n("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor",
+		"aria-hidden": "true",
+		focusable: "false",
+		...e,
+		style: {
+			display: "block",
+			...e.style
+		},
+		children: /* @__PURE__ */ n("path", { d: "M12 10H4l4-4.5z" })
+	});
+}
+function u(e) {
+	return /* @__PURE__ */ n("svg", {
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor",
+		"aria-hidden": "true",
+		focusable: "false",
+		...e,
+		style: {
+			display: "block",
+			...e.style
+		},
+		children: /* @__PURE__ */ n("path", { d: "M12 6H4l4 4.5z" })
+	});
+}
+function d(e) {
+	return /* @__PURE__ */ n(i.Root, { ...e });
+}
+var f = t.forwardRef(function({ className: t, ...r }, o) {
+	return /* @__PURE__ */ n(i.Label, {
+		ref: o,
+		className: e(a.label, t),
+		"data-forte": "select-label",
+		...r
+	});
+}), p = t.forwardRef(function({ variant: r = "outline", size: s = "md", fullWidth: c = !1, className: l, ...u }, d) {
+	let f = t.useRef(null), p = t.useCallback((e) => {
+		f.current = e, typeof d == "function" ? d(e) : d && (d.current = e);
+	}, [d]), m = t.useRef(!1);
+	return t.useEffect(() => {
+		if (!o) return;
+		let e = setTimeout(() => {
+			let e = f.current;
+			!e || m.current || !e.getAttribute("aria-label") && !e.getAttribute("aria-labelledby") && (m.current = !0, console.warn("[forte-ui] <Select.Trigger> has no accessible name. Render a <Select.Label> inside the same <Select.Root>, a <Field.Label nativeLabel={false}> in the same <Field.Root>, or pass aria-label to the trigger."));
+		}, 0);
+		return () => clearTimeout(e);
+	}), /* @__PURE__ */ n(i.Trigger, {
+		ref: p,
+		className: e(a.trigger, "forte-focus-ring", l),
+		"data-forte": "select-trigger",
+		"data-variant": r,
+		"data-size": s,
+		"data-full-width": c || void 0,
+		...u
+	});
+}), m = t.forwardRef(function({ className: t, ...r }, o) {
+	return /* @__PURE__ */ n(i.Value, {
+		ref: o,
+		className: e(a.value, t),
+		"data-forte": "select-value",
+		...r
+	});
+}), h = t.forwardRef(function({ className: t, children: r, ...o }, c) {
+	return /* @__PURE__ */ n(i.Icon, {
+		ref: c,
+		className: e(a.icon, t),
+		"data-forte": "select-icon",
+		...o,
+		children: r ?? /* @__PURE__ */ n(s, {})
+	});
+}), g = t.forwardRef(function({ children: t, alignItemWithTrigger: o = !0, side: s, align: c, sideOffset: d = 4, alignOffset: f, collisionPadding: p, container: m, backdrop: h = !1, scrollArrows: g = !0, className: _, positionerClassName: v, ...y }, b) {
+	return /* @__PURE__ */ r(i.Portal, {
+		container: m,
+		children: [h ? /* @__PURE__ */ n(i.Backdrop, {
+			className: e(a.backdrop, "forte-scrim"),
+			"data-forte": "select-backdrop"
+		}) : null, /* @__PURE__ */ n(i.Positioner, {
+			className: e(a.positioner, v),
+			"data-forte": "select-positioner",
+			alignItemWithTrigger: o,
+			side: s,
+			align: c,
+			sideOffset: d,
+			alignOffset: f,
+			collisionPadding: p,
+			children: /* @__PURE__ */ r(i.Popup, {
+				ref: b,
+				className: e(a.popup, "forte-hc-surface", _),
+				"data-forte": "select-popup",
+				...y,
+				children: [
+					g ? /* @__PURE__ */ n(i.ScrollUpArrow, {
+						className: a.scrollArrow,
+						"data-forte": "select-scroll-arrow",
+						children: /* @__PURE__ */ n(l, {})
+					}) : null,
+					/* @__PURE__ */ n(i.List, {
+						className: a.list,
+						"data-forte": "select-list",
+						children: t
+					}),
+					g ? /* @__PURE__ */ n(i.ScrollDownArrow, {
+						className: a.scrollArrow,
+						"data-forte": "select-scroll-arrow",
+						children: /* @__PURE__ */ n(u, {})
+					}) : null
+				]
+			})
+		})]
+	});
+}), _ = t.forwardRef(function({ children: t, indicator: o, className: s, ...l }, u) {
+	return /* @__PURE__ */ r(i.Item, {
+		ref: u,
+		className: e(a.item, "forte-focus-ring", s),
+		"data-forte": "select-item",
+		"data-focus-inset": "",
+		...l,
+		children: [/* @__PURE__ */ n(i.ItemIndicator, {
+			className: a.itemIndicator,
+			"data-forte": "select-item-indicator",
+			children: o ?? /* @__PURE__ */ n(c, {})
+		}), /* @__PURE__ */ n(i.ItemText, {
+			className: a.itemText,
+			"data-forte": "select-item-text",
+			children: t
+		})]
+	});
+}), v = t.forwardRef(function({ className: t, ...r }, o) {
+	return /* @__PURE__ */ n(i.Group, {
+		ref: o,
+		className: e(a.group, t),
+		"data-forte": "select-group",
+		...r
+	});
+}), y = t.forwardRef(function({ className: t, ...r }, o) {
+	return /* @__PURE__ */ n(i.GroupLabel, {
+		ref: o,
+		className: e(a.groupLabel, t),
+		"data-forte": "select-group-label",
+		...r
+	});
+}), b = t.forwardRef(function({ className: t, ...r }, o) {
+	return /* @__PURE__ */ n(i.Separator, {
+		ref: o,
+		className: e(a.separator, t),
+		"data-forte": "select-separator",
+		...r
+	});
+}), x = {
+	Root: d,
+	Label: f,
+	Trigger: p,
+	Value: m,
+	Icon: h,
+	Popup: g,
+	Item: _,
+	Group: v,
+	GroupLabel: y,
+	Separator: b
+};
+//#endregion
+export { _ as a, d as c, m as d, h as i, b as l, v as n, f as o, y as r, g as s, x as t, p as u };

package/dist/Separator-DewJBzaJ.js

@@ -0,0 +1,21 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Separator as r } from "@base-ui/react/separator";
+import './styles/Separator.css';var i = { root: "_root_1460e_33" }, a = {
+	role: "none",
+	"aria-orientation": void 0
+}, o = t.forwardRef(function({ orientation: t = "horizontal", variant: o = "solid", decorative: s = !1, className: c, ...l }, u) {
+	return /* @__PURE__ */ n(r, {
+		ref: u,
+		orientation: t,
+		className: e(i.root, c),
+		"data-forte": "separator",
+		"data-variant": o,
+		...s ? a : null,
+		...l
+	});
+});
+//#endregion
+export { o as t };

package/dist/Skeleton-zr6ObCCq.js

@@ -0,0 +1,79 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import './styles/Skeleton.css';var a = {
+	root: "_root_1bsip_52",
+	content: "_content_1bsip_170",
+	"forte-skeleton-pulse": "_forte-skeleton-pulse_1bsip_1",
+	"forte-skeleton-breathe": "_forte-skeleton-breathe_1bsip_1",
+	"forte-skeleton-sweep": "_forte-skeleton-sweep_1bsip_1",
+	text: "_text_1bsip_230",
+	group: "_group_1bsip_254"
+}, o = t.createContext(null);
+function s(e) {
+	if (e !== void 0) return typeof e == "number" ? `${e}px` : e;
+}
+var c = t.forwardRef(function({ variant: i = "rect", animation: c, loading: l, width: u, height: d, className: f, style: p, children: m, ...h }, g) {
+	let _ = t.useContext(o), v = c ?? _?.animation ?? "pulse";
+	return l ?? _?.loading ?? !0 ? /* @__PURE__ */ r("span", {
+		ref: g,
+		className: e(a.root, f),
+		"data-forte": "skeleton",
+		"data-variant": i,
+		"data-animation": v,
+		"aria-hidden": "true",
+		style: {
+			"--forte-skeleton-width": s(u),
+			"--forte-skeleton-height": s(d),
+			...p
+		},
+		...h,
+		children: m === void 0 ? null : /* @__PURE__ */ r("span", {
+			className: a.content,
+			"data-forte": "skeleton-content",
+			children: m
+		})
+	}) : /* @__PURE__ */ r(n, { children: m });
+}), l = {
+	Root: c,
+	Text: t.forwardRef(function({ lines: n = 3, lastLineWidth: i = "60%", animation: s, loading: l, className: u, ...d }, f) {
+		let p = t.useContext(o);
+		return l ?? p?.loading ?? !0 ? /* @__PURE__ */ r("span", {
+			ref: f,
+			className: e(a.text, u),
+			"data-forte": "skeleton-text",
+			...d,
+			children: Array.from({ length: Math.max(0, n) }, (e, t) => /* @__PURE__ */ r(c, {
+				variant: "text",
+				animation: s,
+				loading: l,
+				width: t === n - 1 && n > 1 ? i : void 0
+			}, t))
+		}) : null;
+	}),
+	Group: t.forwardRef(function({ loading: n = !0, label: s = "Loading", doneLabel: c, animation: l = "pulse", className: u, children: d, ...f }, p) {
+		let m = t.useMemo(() => ({
+			animation: l,
+			loading: n
+		}), [l, n]);
+		return /* @__PURE__ */ r(o.Provider, {
+			value: m,
+			children: /* @__PURE__ */ i("div", {
+				ref: p,
+				className: e(a.group, u),
+				"data-forte": "skeleton-group",
+				"data-loading": n || void 0,
+				"aria-busy": n,
+				...f,
+				children: [/* @__PURE__ */ r("span", {
+					className: "forte-visually-hidden",
+					role: "status",
+					children: n ? s : c
+				}), d]
+			})
+		});
+	})
+};
+//#endregion
+export { l as t };

package/dist/Slider-Bh8_cti1.js

@@ -0,0 +1,104 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Slider as r } from "@base-ui/react/slider";
+import './styles/Slider.css';var i = {
+	root: "_root_o49p8_63",
+	label: "_label_o49p8_240",
+	value: "_value_o49p8_251",
+	control: "_control_o49p8_27",
+	track: "_track_o49p8_311",
+	indicator: "_indicator_o49p8_330",
+	thumb: "_thumb_o49p8_341"
+}, a = t.createContext({
+	size: "md",
+	tone: "primary"
+});
+function o({ size: o = "md", tone: s = "primary", className: c, ...l }) {
+	let u = t.useMemo(() => ({
+		size: o,
+		tone: s
+	}), [o, s]);
+	return /* @__PURE__ */ n(a.Provider, {
+		value: u,
+		children: /* @__PURE__ */ n(r.Root, {
+			className: e(i.root, c),
+			"data-forte": "slider",
+			"data-size": o,
+			"data-tone": s,
+			...l
+		})
+	});
+}
+var s = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Label, {
+		ref: c,
+		className: e(i.label, o),
+		"data-forte": "slider-label",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), c = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Value, {
+		ref: c,
+		className: e(i.value, o),
+		"data-forte": "slider-value",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), l = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Control, {
+		ref: c,
+		className: e(i.control, o),
+		"data-forte": "slider-control",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), u = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Track, {
+		ref: c,
+		className: e(i.track, o),
+		"data-forte": "slider-track",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), d = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Indicator, {
+		ref: c,
+		className: e(i.indicator, o),
+		"data-forte": "slider-indicator",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), f = t.forwardRef(function({ className: o, ...s }, c) {
+	let { size: l, tone: u } = t.useContext(a);
+	return /* @__PURE__ */ n(r.Thumb, {
+		ref: c,
+		className: e(i.thumb, "forte-focus-ring-within", "forte-target", o),
+		"data-forte": "slider-thumb",
+		"data-size": l,
+		"data-tone": u,
+		...s
+	});
+}), p = {
+	Root: o,
+	Label: s,
+	Value: c,
+	Control: l,
+	Track: u,
+	Indicator: d,
+	Thumb: f
+};
+//#endregion
+export { o as a, c, s as i, l as n, f as o, d as r, u as s, p as t };

package/dist/Spinner-BF0uD4hR.js

@@ -0,0 +1,53 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import './styles/Spinner.css';var i = {
+	root: "_root_7sirh_32",
+	indicator: "_indicator_7sirh_117",
+	label: "_label_7sirh_132",
+	"forte-spinner-spin": "_forte-spinner-spin_7sirh_1",
+	"forte-spinner-breathe": "_forte-spinner-breathe_7sirh_1",
+	part: "_part_7sirh_227",
+	"forte-spinner-hop": "_forte-spinner-hop_7sirh_1",
+	"forte-spinner-sweep": "_forte-spinner-sweep_7sirh_1",
+	"forte-spinner-ripple": "_forte-spinner-ripple_7sirh_1"
+}, a = {
+	ring: 0,
+	dots: 3,
+	bars: 8,
+	pulse: 2
+}, o = t.forwardRef(function({ variant: t = "ring", size: o = "md", tone: s = "primary", label: c = "Loading", labelPlacement: l = "hidden", decorative: u = !1, className: d, style: f, ...p }, m) {
+	let h = a[t];
+	return /* @__PURE__ */ r("span", {
+		ref: m,
+		className: e(i.root, d),
+		"data-forte": "spinner",
+		"data-variant": t,
+		"data-size": o,
+		"data-tone": s,
+		"data-label-placement": l,
+		role: u ? void 0 : "status",
+		style: {
+			"--forte-spinner-count": h,
+			...f
+		},
+		...p,
+		children: [/* @__PURE__ */ n("span", {
+			className: i.indicator,
+			"data-forte": "spinner-indicator",
+			"aria-hidden": "true",
+			children: Array.from({ length: h }, (e, t) => /* @__PURE__ */ n("span", {
+				className: i.part,
+				"data-forte": "spinner-part",
+				style: { "--forte-spinner-i": t }
+			}, t))
+		}), u && l === "hidden" ? null : /* @__PURE__ */ n("span", {
+			className: e(l === "hidden" ? "forte-visually-hidden" : i.label),
+			"data-forte": "spinner-label",
+			children: c
+		})]
+	});
+});
+//#endregion
+export { o as t };

package/dist/Switch-OBewMMvM.js

@@ -0,0 +1,39 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Switch as r } from "@base-ui/react/switch";
+import './styles/Switch.css';var i = {
+	root: "_root_1jatm_32",
+	thumb: "_thumb_1jatm_135",
+	icon: "_icon_1jatm_213"
+}, a = t.forwardRef(function({ size: t = "md", stateIcon: a = !0, className: o, thumbClassName: s, ...c }, l) {
+	return /* @__PURE__ */ n(r.Root, {
+		ref: l,
+		className: e(i.root, "forte-focus-ring", "forte-target", o),
+		"data-forte": "switch",
+		"data-size": t,
+		...c,
+		children: /* @__PURE__ */ n(r.Thumb, {
+			className: e(i.thumb, s),
+			"data-forte": "switch-thumb",
+			children: a ? /* @__PURE__ */ n("svg", {
+				className: e(i.icon, "forte-icon"),
+				"data-forte": "switch-icon",
+				viewBox: "0 0 12 12",
+				"aria-hidden": "true",
+				focusable: "false",
+				children: /* @__PURE__ */ n("path", {
+					d: "M2.6 6.3 4.9 8.6 9.4 3.7",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "1.75",
+					strokeLinecap: "round",
+					strokeLinejoin: "round"
+				})
+			}) : null
+		})
+	});
+});
+//#endregion
+export { a as t };

package/dist/Tabs-LgkSbPSF.js

@@ -0,0 +1,132 @@
+"use client";
+import { t as e } from "./clsx-By2n9mTe.js";
+import { t } from "./ScrollArea-CBMGJ6hh.js";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Tabs as i } from "@base-ui/react/tabs";
+import './styles/Tabs.css';var a = {
+	root: "_root_dql63_26",
+	list: "_list_dql63_172",
+	scroller: "_scroller_dql63_172",
+	panel: "_panel_dql63_181",
+	content: "_content_dql63_255",
+	tab: "_tab_dql63_295",
+	indicator: "_indicator_dql63_405"
+}, o = typeof document < "u" ? n.useLayoutEffect : n.useEffect, s = n.createContext({
+	variant: "line",
+	overflow: "scroll"
+}), c = n.forwardRef(function({ variant: t = "line", overflow: o = "scroll", className: c, children: l, ...u }, d) {
+	let f = n.useMemo(() => ({
+		variant: t,
+		overflow: o
+	}), [t, o]);
+	return /* @__PURE__ */ r(s.Provider, {
+		value: f,
+		children: /* @__PURE__ */ r(i.Root, {
+			ref: d,
+			className: e(a.root, c),
+			"data-forte": "tabs",
+			"data-variant": t,
+			"data-overflow": o,
+			...u,
+			children: l
+		})
+	});
+}), l = (e) => parseFloat(e) || 0;
+function u(e, t, n) {
+	let r = e.getBoundingClientRect(), i = t.getBoundingClientRect(), a = getComputedStyle(e), o = getComputedStyle(t), s = i.left - l(o.scrollMarginLeft) - (r.left + l(a.scrollPaddingLeft)), c = i.right + l(o.scrollMarginRight) - (r.right - l(a.scrollPaddingRight)), u = i.top - l(o.scrollMarginTop) - (r.top + l(a.scrollPaddingTop)), d = i.bottom + l(o.scrollMarginBottom) - (r.bottom - l(a.scrollPaddingBottom)), f = s < 0 ? s : Math.max(c, 0), p = u < 0 ? u : Math.max(d, 0);
+	(f !== 0 || p !== 0) && e.scrollBy({
+		left: f,
+		top: p,
+		behavior: n
+	});
+}
+function d(e) {
+	return getComputedStyle(e).getPropertyValue("--forte-motion-ok").trim() === "0" ? "auto" : "smooth";
+}
+var f = {
+	Root: c,
+	List: n.forwardRef(function({ activateOnFocus: c = !1, loopFocus: l = !0, className: f, children: p, ...m }, h) {
+		let { variant: g, overflow: _ } = n.useContext(s), v = n.useRef(null), y = n.useRef(null), b = n.useCallback((e) => {
+			y.current = e, typeof h == "function" ? h(e) : h && (h.current = e);
+		}, [h]), x = n.useCallback((e) => {
+			let t = v.current, n = y.current;
+			if (!t || !n) return;
+			let r = n.querySelector("[data-forte=\"tabs-tab\"][data-active]");
+			r && u(t, r, e);
+		}, []);
+		o(() => {
+			x("auto");
+		}, [x]), n.useEffect(() => {
+			let e = v.current, t = y.current;
+			if (!e || !t) return;
+			let n = new MutationObserver(() => x(d(e)));
+			n.observe(t, {
+				subtree: !0,
+				attributes: !0,
+				attributeFilter: ["data-active"]
+			});
+			let r = new ResizeObserver(() => x("auto"));
+			return r.observe(e), () => {
+				n.disconnect(), r.disconnect();
+			};
+		}, [x]);
+		let S = /* @__PURE__ */ r(i.List, {
+			ref: b,
+			className: e(a.list, f),
+			"data-forte": "tabs-list",
+			activateOnFocus: c,
+			loopFocus: l,
+			"data-variant": g,
+			...m,
+			children: p
+		});
+		return _ === "scroll" ? /* @__PURE__ */ r(t.Root, {
+			className: a.scroller,
+			children: /* @__PURE__ */ r(t.Viewport, {
+				ref: v,
+				children: /* @__PURE__ */ r(t.Content, {
+					className: a.content,
+					children: S
+				})
+			})
+		}) : S;
+	}),
+	Tab: n.forwardRef(function({ className: t, children: o, ...c }, l) {
+		let { variant: u } = n.useContext(s);
+		return /* @__PURE__ */ r(i.Tab, {
+			ref: l,
+			className: e(a.tab, "forte-focus-ring", t),
+			"data-forte": "tabs-tab",
+			"data-focus-inset": "",
+			"data-variant": u,
+			...c,
+			children: o
+		});
+	}),
+	Indicator: n.forwardRef(function({ renderBeforeHydration: t = !0, className: o, ...c }, l) {
+		let { variant: u } = n.useContext(s);
+		return /* @__PURE__ */ r(i.Indicator, {
+			ref: l,
+			className: e(a.indicator, o),
+			"data-forte": "tabs-indicator",
+			renderBeforeHydration: t,
+			"data-variant": u,
+			...c
+		});
+	}),
+	Panel: n.forwardRef(function({ keepMounted: t = !1, className: o, children: c, ...l }, u) {
+		let { variant: d } = n.useContext(s);
+		return /* @__PURE__ */ r(i.Panel, {
+			ref: u,
+			className: e(a.panel, "forte-focus-ring", o),
+			"data-forte": "tabs-panel",
+			keepMounted: t,
+			"data-variant": d,
+			...l,
+			children: c
+		});
+	})
+};
+//#endregion
+export { f as t };