@sps-woodland/core 8.56.2 → 8.56.3

package/lib/tabs/tab/Tab.ve.js

@@ -1,7 +1,77 @@
+import { createRuntimeFn as e } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
 /* empty css                      */
-import { createRuntimeFn as _ } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.17.4/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
-var o = _({ defaultClassName: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u540", variantClassNames: { context: { container: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u541", navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u542" }, active: { true: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u543", false: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u544" }, disabled: { true: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u545", false: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u546" } }, defaultVariants: {}, compoundVariants: [[{ context: "container", active: !0 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u547"], [{ context: "container", active: !1 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u548"], [{ context: "container", active: !1, disabled: !1 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u549"], [{ context: "navigation", active: !0 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54a"], [{ context: "navigation", active: !1 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54b"], [{ context: "navigation", active: !1, disabled: !1 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54c"], [{ context: "navigation", active: !1, disabled: !0 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54d"]] }), e = _({ defaultClassName: "", variantClassNames: { active: { true: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54e", false: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54f" }, disabled: { true: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54g", false: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54h" }, context: { navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54i", container: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54j" } }, defaultVariants: {}, compoundVariants: [[{ context: "navigation", active: !0 }, "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_p40u54k"]] });
-export {
-  o as tab,
-  e as tabTag
-};
+//#region src/tabs/tab/Tab.css.ts
+var t = e({
+	defaultClassName: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u540",
+	variantClassNames: {
+		context: {
+			container: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u541",
+			navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u542"
+		},
+		active: {
+			true: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u543",
+			false: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u544"
+		},
+		disabled: {
+			true: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u545",
+			false: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u546"
+		}
+	},
+	defaultVariants: {},
+	compoundVariants: [
+		[{
+			context: "container",
+			active: !0
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u547"],
+		[{
+			context: "container",
+			active: !1
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u548"],
+		[{
+			context: "container",
+			active: !1,
+			disabled: !1
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u549"],
+		[{
+			context: "navigation",
+			active: !0
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54a"],
+		[{
+			context: "navigation",
+			active: !1
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54b"],
+		[{
+			context: "navigation",
+			active: !1,
+			disabled: !1
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54c"],
+		[{
+			context: "navigation",
+			active: !1,
+			disabled: !0
+		}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54d"]
+	]
+}), n = e({
+	defaultClassName: "",
+	variantClassNames: {
+		active: {
+			true: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54e",
+			false: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54f"
+		},
+		disabled: {
+			true: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54g",
+			false: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54h"
+		},
+		context: {
+			navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54i",
+			container: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54j"
+		}
+	},
+	defaultVariants: {},
+	compoundVariants: [[{
+		context: "navigation",
+		active: !0
+	}, "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_p40u54k"]]
+});
+//#endregion
+export { t as tab, n as tabTag };

package/lib/tabs/tab-panel/TabPanel.js

@@ -1,26 +1,17 @@
-import { useTabPanel as s } from "@react-aria/tabs";
-import { Metadata as c, Content as i } from "@sps-woodland/core";
-import * as a from "react";
-import { tabPanel as d } from "../tabs/Tabs.ve.js";
-function p({
-  context: n,
-  "data-testid": o,
-  state: e,
-  ...r
-}) {
-  const t = a.useRef(null), { tabPanelProps: l } = s(r, e, t), m = n === "container" ? i : "div";
-  return /* @__PURE__ */ a.createElement(
-    m,
-    {
-      ...l,
-      ref: t,
-      className: d,
-      "data-testid": o
-    },
-    e.selectedItem ? e.selectedItem.props.children : null
-  );
+import { tabPanel as e } from "../tabs/Tabs.ve.js";
+import { Content as t, Metadata as n } from "@sps-woodland/core";
+import * as r from "react";
+import { useTabPanel as i } from "@react-aria/tabs";
+//#region src/tabs/tab-panel/TabPanel.tsx
+function a({ context: n, "data-testid": a, state: o, ...s }) {
+	let c = r.useRef(null), { tabPanelProps: l } = i(s, o, c), u = n === "container" ? t : "div";
+	return /* @__PURE__ */ r.createElement(u, {
+		...l,
+		ref: c,
+		className: e,
+		"data-testid": a
+	}, o.selectedItem ? o.selectedItem.props.children : null);
 }
-c.set(p, { name: "TabPanel" });
-export {
-  p as TabPanel
-};
+n.set(a, { name: "TabPanel" });
+//#endregion
+export { a as TabPanel };

package/lib/tabs/tabs/Tabs.js

@@ -1,113 +1,102 @@
-import * as e from "react";
-import { useTabListState as O } from "@react-stately/tabs";
-import { useTabList as A } from "@react-aria/tabs";
-import { Metadata as F, useChildTestIdAttrBuilder as _, cl as f, Icon as p } from "@sps-woodland/core";
-import { Tab as z } from "../tab/Tab.js";
-import { TabPanel as K } from "../tab-panel/TabPanel.js";
-import { tabsScrollWrapper as q, tabsScrollButton as v, tabsScrollButtonLeft as U, tabs as V, tabsScrollButtonRight as M, SCROLL_BUTTON_VISUAL_FOOTPRINT_PX as X } from "./Tabs.ve.js";
-const $ = 0.75;
-function j({
-  className: L,
-  context: a = "navigation",
-  "data-testid": m,
-  selectedKey: g,
-  defaultSelectedKey: y,
-  ...R
-}) {
-  const b = {
-    ...R,
-    selectedKey: g ?? void 0,
-    defaultSelectedKey: y ?? void 0
-  }, o = O(b), r = e.useRef(null), { tabListProps: B } = A(b, o, r), d = _({ "data-testid": m }), h = a === "container", [C, E] = e.useState(!1), [T, k] = e.useState(!1), n = e.useCallback(() => {
-    const t = r.current;
-    if (!t) return;
-    const l = t.scrollWidth - t.clientWidth;
-    E(t.scrollLeft > 1), k(l - t.scrollLeft > 1);
-  }, []);
-  e.useEffect(() => {
-    const t = r.current;
-    if (!t) return;
-    n(), t.addEventListener("scroll", n, { passive: !0 });
-    const l = new ResizeObserver(n);
-    return l.observe(t), () => {
-      t.removeEventListener("scroll", n), l.disconnect();
-    };
-  }, [n]);
-  const S = (t) => {
-    const l = r.current;
-    if (!l) return;
-    const s = l.clientWidth * $;
-    l.scrollBy({ left: t === "left" ? -s : s, behavior: "smooth" });
-  }, u = e.useCallback(() => {
-    const t = r.current;
-    if (!t) return;
-    const l = t.querySelector('[aria-selected="true"]');
-    if (!l) return;
-    const s = t.getBoundingClientRect(), c = l.getBoundingClientRect(), i = X, I = t.scrollLeft > 1, N = t.scrollWidth - t.clientWidth - t.scrollLeft > 1, P = s.left + (I ? i : 0), W = s.right - (N ? i : 0);
-    c.left < P ? t.scrollBy({
-      left: c.left - (s.left + i),
-      behavior: "smooth"
-    }) : c.right > W && t.scrollBy({
-      left: c.right - (s.right - i),
-      behavior: "smooth"
-    });
-  }, []);
-  e.useEffect(() => {
-    u();
-  }, [o.selectedKey, u]);
-  const w = () => {
-    requestAnimationFrame(() => u());
-  };
-  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: q, "data-testid": m }, h && C && /* @__PURE__ */ e.createElement(
-    "button",
-    {
-      "aria-label": "Show previous tabs",
-      title: "Show previous tabs",
-      className: f(v, U),
-      "data-side": "left",
-      onClick: () => S("left"),
-      type: "button"
-    },
-    /* @__PURE__ */ e.createElement(p, { icon: "chevron-left", size: "sm", "aria-hidden": "true" })
-  ), /* @__PURE__ */ e.createElement(
-    "div",
-    {
-      ...B,
-      ref: r,
-      className: f(V({ context: a }), L),
-      onClickCapture: w
-    },
-    [...o.collection].map((t) => /* @__PURE__ */ e.createElement(
-      z,
-      {
-        key: t.key,
-        item: t,
-        state: o,
-        context: a,
-        ...d(`tab-${String(t.key)}`)
-      }
-    ))
-  ), h && T && /* @__PURE__ */ e.createElement(
-    "button",
-    {
-      "aria-label": "Show more tabs",
-      title: "Show more tabs",
-      className: f(v, M),
-      onClick: () => S("right"),
-      type: "button"
-    },
-    /* @__PURE__ */ e.createElement(p, { icon: "chevron-right", size: "sm", "aria-hidden": "true" })
-  )), /* @__PURE__ */ e.createElement(
-    K,
-    {
-      key: o.selectedItem ? o.selectedItem.key : null,
-      state: o,
-      context: a,
-      ...d("tab-panel")
-    }
-  ));
+import { Tab as e } from "../tab/Tab.js";
+import { tabs as t, tabsScrollWrapper as n } from "./Tabs.ve.js";
+import { TabPanel as r } from "../tab-panel/TabPanel.js";
+import { Icon as i, Metadata as a, cl as o, useChildTestIdAttrBuilder as s } from "@sps-woodland/core";
+import * as c from "react";
+import { useTabListState as l } from "@react-stately/tabs";
+import { useTabList as u } from "@react-aria/tabs";
+//#region src/tabs/tabs/Tabs.tsx
+var d = .75;
+function f({ className: a, context: f = "navigation", "data-testid": p, selectedKey: m, defaultSelectedKey: h, ...g }) {
+	let _ = {
+		...g,
+		selectedKey: m ?? void 0,
+		defaultSelectedKey: h ?? void 0
+	}, v = l(_), y = c.useRef(null), { tabListProps: b } = u(_, v, y), x = s({ "data-testid": p }), S = f === "container", [C, w] = c.useState(!1), [T, E] = c.useState(!1), D = c.useCallback(() => {
+		let e = y.current;
+		if (!e) return;
+		let t = e.scrollWidth - e.clientWidth;
+		w(e.scrollLeft > 1), E(t - e.scrollLeft > 1);
+	}, []);
+	c.useEffect(() => {
+		let e = y.current;
+		if (!e) return;
+		D(), e.addEventListener("scroll", D, { passive: !0 });
+		let t = new ResizeObserver(D);
+		return t.observe(e), () => {
+			e.removeEventListener("scroll", D), t.disconnect();
+		};
+	}, [D]);
+	let O = (e) => {
+		let t = y.current;
+		if (!t) return;
+		let n = t.clientWidth * d;
+		t.scrollBy({
+			left: e === "left" ? -n : n,
+			behavior: "smooth"
+		});
+	}, k = c.useCallback(() => {
+		let e = y.current;
+		if (!e) return;
+		let t = e.querySelector("[aria-selected=\"true\"]");
+		if (!t) return;
+		let n = e.getBoundingClientRect(), r = t.getBoundingClientRect(), i = e.scrollLeft > 1, a = e.scrollWidth - e.clientWidth - e.scrollLeft > 1, o = n.left + (i ? 39 : 0), s = n.right - (a ? 39 : 0);
+		r.left < o ? e.scrollBy({
+			left: r.left - (n.left + 39),
+			behavior: "smooth"
+		}) : r.right > s && e.scrollBy({
+			left: r.right - (n.right - 39),
+			behavior: "smooth"
+		});
+	}, []);
+	c.useEffect(() => {
+		k();
+	}, [v.selectedKey, k]);
+	let A = () => {
+		requestAnimationFrame(() => k());
+	};
+	return /* @__PURE__ */ c.createElement(c.Fragment, null, /* @__PURE__ */ c.createElement("div", {
+		className: n,
+		"data-testid": p
+	}, S && C && /* @__PURE__ */ c.createElement("button", {
+		"aria-label": "Show previous tabs",
+		title: "Show previous tabs",
+		className: o("pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k2", "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k3"),
+		"data-side": "left",
+		onClick: () => O("left"),
+		type: "button"
+	}, /* @__PURE__ */ c.createElement(i, {
+		icon: "chevron-left",
+		size: "sm",
+		"aria-hidden": "true"
+	})), /* @__PURE__ */ c.createElement("div", {
+		...b,
+		ref: y,
+		className: o(t({ context: f }), a),
+		onClickCapture: A
+	}, [...v.collection].map((t) => /* @__PURE__ */ c.createElement(e, {
+		key: t.key,
+		item: t,
+		state: v,
+		context: f,
+		...x(`tab-${String(t.key)}`)
+	}))), S && T && /* @__PURE__ */ c.createElement("button", {
+		"aria-label": "Show more tabs",
+		title: "Show more tabs",
+		className: o("pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k2", "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k4"),
+		onClick: () => O("right"),
+		type: "button"
+	}, /* @__PURE__ */ c.createElement(i, {
+		icon: "chevron-right",
+		size: "sm",
+		"aria-hidden": "true"
+	}))), /* @__PURE__ */ c.createElement(r, {
+		key: v.selectedItem ? v.selectedItem.key : null,
+		state: v,
+		context: f,
+		...x("tab-panel")
+	}));
 }
-F.set(j, { name: "Tabs" });
-export {
-  j as Tabs
-};
+a.set(f, { name: "Tabs" });
+//#endregion
+export { f as Tabs };

package/lib/tabs/tabs/Tabs.ve.js

@@ -1,12 +1,14 @@
+import { createRuntimeFn as e } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
 /* empty css                       */
-import { createRuntimeFn as _ } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.17.4/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
-var o = 39, n = "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k1", r = "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k2", t = "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k3", m = "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k4", e = _({ defaultClassName: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k5 pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k0", variantClassNames: { context: { container: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k6", navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k7" } }, defaultVariants: {}, compoundVariants: [] }), l = "pkg_sps-woodland_core__family_tabs__version_8_56_2__hash_1mdnm0k8";
-export {
-  o as SCROLL_BUTTON_VISUAL_FOOTPRINT_PX,
-  l as tabPanel,
-  e as tabs,
-  r as tabsScrollButton,
-  t as tabsScrollButtonLeft,
-  m as tabsScrollButtonRight,
-  n as tabsScrollWrapper
-};
+//#region src/tabs/tabs/Tabs.css.ts
+var t = "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k1", n = "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k2", r = "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k3", i = "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k4", a = e({
+	defaultClassName: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k5 pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k0",
+	variantClassNames: { context: {
+		container: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k6",
+		navigation: "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k7"
+	} },
+	defaultVariants: {},
+	compoundVariants: []
+}), o = "pkg_sps-woodland_core__family_tabs__version_8_56_3__hash_1mdnm0k8";
+//#endregion
+export { o as tabPanel, a as tabs, n as tabsScrollButton, r as tabsScrollButtonLeft, i as tabsScrollButtonRight, t as tabsScrollWrapper };

package/lib/tags/clickable-tag/ClickableTag.js

@@ -1,92 +1,88 @@
-import * as l from "react";
-import { Metadata as d, cl as s, Icon as N } from "@sps-woodland/core";
-import { clickableTag as v, clickableTagLabel as C, clickableTagLink as I, clickableTagIconWrapper as x, clickableTagIcon as D } from "./ClickableTag.ve.js";
-import { useWoodlandLanguage as _ } from "@spscommerce/i18n";
-function $({
-  children: c,
-  className: m,
-  onClick: i,
-  disabled: t,
-  wrap: p,
-  href: o,
-  target: g,
-  kind: k,
-  onAdd: a,
-  onRemove: r,
-  ...b
-}) {
-  const { t: u } = _(), n = l.Children.toArray(c).filter((e) => typeof e == "string").join("");
-  l.useEffect(() => {
-    if (r && a)
-      throw new Error("Clickable tag should have onRemove or onAdd, not both");
-  }, [a, r]);
-  function y(e) {
-    a ? a() : r && r(), e.stopPropagation();
-  }
-  function T(e) {
-    if (e.stopPropagation(), t) {
-      e.preventDefault();
-      return;
-    }
-    i && i(e);
-  }
-  const E = !!i && !o;
-  function f(e) {
-    t || e.key !== "Enter" && e.key !== " " || (e.preventDefault(), e.currentTarget.click());
-  }
-  return /* @__PURE__ */ l.createElement("div", { className: s(v({ kind: k, disabled: t, wrap: p }), m), ...b }, /* @__PURE__ */ l.createElement(
-    "span",
-    {
-      className: s(
-        C({
-          link: !!o || !!i,
-          disabled: t,
-          wrap: p,
-          addOrRemove: a || r
-        })
-      ),
-      onClick: T,
-      title: n,
-      ...E ? {
-        role: "button",
-        tabIndex: t ? void 0 : 0,
-        "aria-disabled": t || void 0,
-        onKeyDown: f
-      } : {}
-    },
-    o ? /* @__PURE__ */ l.createElement("a", { className: I, href: o, target: g }, c) : c
-  ), (a || r) && !t && /* @__PURE__ */ l.createElement(
-    "div",
-    {
-      className: s(
-        x({
-          wrap: p
-        })
-      ),
-      role: "button",
-      onClick: y,
-      onKeyDown: f,
-      tabIndex: 0,
-      "aria-label": a ? `${u("clickableTag.add", {
-        elementName: n,
-        defaultValue: `Add ${n}`
-      })}` : `${u("clickableTag.remove", { elementName: n, defaultValue: `Remove ${n}` })}`
-    },
-    /* @__PURE__ */ l.createElement(N, { className: D, "aria-hidden": "true", icon: a ? "plus-sign" : "x" })
-  ));
+import { clickableTag as e, clickableTagIconWrapper as t, clickableTagLabel as n, clickableTagLink as r } from "./ClickableTag.ve.js";
+import { Icon as i, Metadata as a, cl as o } from "@sps-woodland/core";
+import * as s from "react";
+import { useWoodlandLanguage as c } from "@spscommerce/i18n";
+//#region src/tags/clickable-tag/ClickableTag.tsx
+function l({ children: a, className: l, onClick: u, disabled: d, wrap: f, href: p, target: m, kind: h, onAdd: g, onRemove: _, ...v }) {
+	let { t: y } = c(), b = s.Children.toArray(a).filter((e) => typeof e == "string").join("");
+	s.useEffect(() => {
+		if (_ && g) throw Error("Clickable tag should have onRemove or onAdd, not both");
+	}, [g, _]);
+	function x(e) {
+		g ? g() : _ && _(), e.stopPropagation();
+	}
+	function S(e) {
+		e.stopPropagation(), d ? e.preventDefault() : u && u(e);
+	}
+	let C = !!u && !p;
+	function w(e) {
+		d || e.key !== "Enter" && e.key !== " " || (e.preventDefault(), e.currentTarget.click());
+	}
+	return /* @__PURE__ */ s.createElement("div", {
+		className: o(e({
+			kind: h,
+			disabled: d,
+			wrap: f
+		}), l),
+		...v
+	}, /* @__PURE__ */ s.createElement("span", {
+		className: o(n({
+			link: !!p || !!u,
+			disabled: d,
+			wrap: f,
+			addOrRemove: g || _
+		})),
+		onClick: S,
+		title: b,
+		...C ? {
+			role: "button",
+			tabIndex: d ? void 0 : 0,
+			"aria-disabled": d || void 0,
+			onKeyDown: w
+		} : {}
+	}, p ? /* @__PURE__ */ s.createElement("a", {
+		className: r,
+		href: p,
+		target: m
+	}, a) : a), (g || _) && !d && /* @__PURE__ */ s.createElement("div", {
+		className: o(t({ wrap: f })),
+		role: "button",
+		onClick: x,
+		onKeyDown: w,
+		tabIndex: 0,
+		"aria-label": g ? `${y("clickableTag.add", {
+			elementName: b,
+			defaultValue: `Add ${b}`
+		})}` : `${y("clickableTag.remove", {
+			elementName: b,
+			defaultValue: `Remove ${b}`
+		})}`
+	}, /* @__PURE__ */ s.createElement(i, {
+		className: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5k",
+		"aria-hidden": "true",
+		icon: g ? "plus-sign" : "x"
+	})));
 }
-d.set($, {
-  name: "Clickable Tag",
-  props: {
-    disabled: { type: "boolean", default: "false" },
-    wrap: { type: "boolean", default: "false" },
-    href: { type: "string" },
-    target: { type: "'_blank' | '_self' | '_parent' | '_top'" },
-    kind: { type: "ClickableTagKind", default: "blue" },
-    onAdd: { type: "() => void" },
-    onRemove: { type: "() => void" }
-  }
+a.set(l, {
+	name: "Clickable Tag",
+	props: {
+		disabled: {
+			type: "boolean",
+			default: "false"
+		},
+		wrap: {
+			type: "boolean",
+			default: "false"
+		},
+		href: { type: "string" },
+		target: { type: "'_blank' | '_self' | '_parent' | '_top'" },
+		kind: {
+			type: "ClickableTagKind",
+			default: "blue"
+		},
+		onAdd: { type: "() => void" },
+		onRemove: { type: "() => void" }
+	}
 });
-export {
-  $ as ClickableTag
-};
+//#endregion
+export { l as ClickableTag };

package/lib/tags/clickable-tag/ClickableTag.ve.js

@@ -1,10 +1,67 @@
+import { createRuntimeFn as e } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
 /* empty css                               */
-import { createRuntimeFn as _ } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.17.4/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
-var l = _({ defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu50", variantClassNames: { kind: { blue: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu51", gray: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu52" }, disabled: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu53", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu54" }, wrap: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu55", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu56" } }, defaultVariants: { kind: "blue", disabled: !1, wrap: !1 }, compoundVariants: [] }), e = _({ defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu57", variantClassNames: { link: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu58", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu59" }, wrap: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5a", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5b" }, disabled: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5c", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5d" }, addOrRemove: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5e", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5f" } }, defaultVariants: { link: !1, wrap: !1, disabled: !1, addOrRemove: !1 }, compoundVariants: [[{ disabled: !1, wrap: !1, addOrRemove: !0 }, "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5g"]] }), o = _({ defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5h", variantClassNames: { wrap: { true: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5i", false: "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5j" } }, defaultVariants: { wrap: !1 }, compoundVariants: [] }), r = "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5k", d = "pkg_sps-woodland_core__family_tags__version_8_56_2__hash_1avalu5l";
-export {
-  l as clickableTag,
-  r as clickableTagIcon,
-  o as clickableTagIconWrapper,
-  e as clickableTagLabel,
-  d as clickableTagLink
-};
+//#region src/tags/clickable-tag/ClickableTag.css.ts
+var t = e({
+	defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu50",
+	variantClassNames: {
+		kind: {
+			blue: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu51",
+			gray: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu52"
+		},
+		disabled: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu53",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu54"
+		},
+		wrap: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu55",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu56"
+		}
+	},
+	defaultVariants: {
+		kind: "blue",
+		disabled: !1,
+		wrap: !1
+	},
+	compoundVariants: []
+}), n = e({
+	defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu57",
+	variantClassNames: {
+		link: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu58",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu59"
+		},
+		wrap: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5a",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5b"
+		},
+		disabled: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5c",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5d"
+		},
+		addOrRemove: {
+			true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5e",
+			false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5f"
+		}
+	},
+	defaultVariants: {
+		link: !1,
+		wrap: !1,
+		disabled: !1,
+		addOrRemove: !1
+	},
+	compoundVariants: [[{
+		disabled: !1,
+		wrap: !1,
+		addOrRemove: !0
+	}, "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5g"]]
+}), r = e({
+	defaultClassName: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5h",
+	variantClassNames: { wrap: {
+		true: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5i",
+		false: "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5j"
+	} },
+	defaultVariants: { wrap: !1 },
+	compoundVariants: []
+}), i = "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5k", a = "pkg_sps-woodland_core__family_tags__version_8_56_3__hash_1avalu5l";
+//#endregion
+export { t as clickableTag, i as clickableTagIcon, r as clickableTagIconWrapper, n as clickableTagLabel, a as clickableTagLink };