@gnome-ui/react 1.36.2 → 1.36.3

package/dist/components/SwitchRow/SwitchRow.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchRow.module.css.cjs","names":[],"sources":["../../../src/components/SwitchRow/SwitchRow.module.css"],"sourcesContent":["/* ─── Row button ────────────────────────────────────────────────────────────── */\n\n.row {\n  display: flex;\n  align-items: center;\n  gap: var(--gnome-space-2, 12px);\n  padding: var(--gnome-space-2, 12px) var(--gnome-space-4, 24px);\n  min-height: 52px;\n  width: 100%;\n\n  appearance: none;\n  -webkit-appearance: none;\n  background: transparent;\n  border: none;\n  font: inherit;\n  outline: none;\n  cursor: pointer;\n  text-align: start;\n  color: var(--gnome-card-fg-color, rgba(0, 0, 0, 0.8));\n\n  transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.row:hover {\n  background-color: var(--gnome-hover-overlay);\n}\n\n.row:active {\n  background-color: var(--gnome-active-overlay);\n}\n\n.row:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Disabled ──────────────────────────────────────────────────────────────── */\n\n.disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n/* ─── Leading icon/avatar ───────────────────────────────────────────────────── */\n\n.leading {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n}\n\n/* ─── Text content ──────────────────────────────────────────────────────────── */\n\n.content {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-width: 0;\n  gap: 2px;\n}\n\n.title {\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-body, 1rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  line-height: var(--gnome-line-height-body, 1.5);\n  color: var(--gnome-card-fg-color, rgba(0, 0, 0, 0.8));\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.subtitle {\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-caption, 0.75rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  line-height: var(--gnome-line-height-body, 1.5);\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.55));\n  opacity: var(--gnome-opacity-dim, 0.55);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* ─── Switch track ──────────────────────────────────────────────────────────── */\n\n.switchTrack {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n  width: 56px;\n  height: 28px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: var(--gnome-light-4, #c0bfbc);\n  border: 1px solid var(--gnome-border-subtle, rgba(0, 0, 0, 0.12));\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    border-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n/* When checked, colour the track */\n.row[aria-checked=\"true\"] .switchTrack {\n  background-color: var(--gnome-accent-bg-color, #3584e4);\n  border-color: var(--gnome-accent-bg-color, #3584e4);\n}\n\n/* ─── Switch thumb ──────────────────────────────────────────────────────────── */\n\n.switchThumb {\n  position: absolute;\n  top: 3px;\n  left: 3px;\n  width: 20px;\n  height: 20px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: #ffffff;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);\n  transition: transform var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.switchThumbOn {\n  transform: translateX(28px);\n}\n\n/* ─── Dark mode ─────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switchTrack {\n    background-color: var(--gnome-dark-2, #5e5c64);\n  }\n\n  .switchThumb {\n    background-color: var(--gnome-light-3, #deddda);\n  }\n\n  .row[aria-checked=\"true\"] .switchThumb {\n    background-color: #ffffff;\n  }\n}\n\n/* ─── High contrast ─────────────────────────────────────────────────────────── */\n\n@media (prefers-contrast: more) {\n  .row:focus-visible {\n    box-shadow:\n      inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n      inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n        var(--gnome-focus-ring-color, #3584e4),\n      inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px) + 1px)\n        var(--gnome-window-bg-color, #fafafa);\n  }\n\n  .switchTrack {\n    border-width: 2px;\n  }\n\n  .switchThumb {\n    box-shadow: none;\n  }\n}\n\n/* ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .switchTrack,\n  .switchThumb {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/dist/components/SwitchRow/SwitchRow.module.css.js

@@ -0,0 +1,15 @@
+var e = {
+	row: "_row_jl3bc_3",
+	disabled: "_disabled_jl3bc_41",
+	leading: "_leading_jl3bc_49",
+	content: "_content_jl3bc_58",
+	title: "_title_jl3bc_66",
+	subtitle: "_subtitle_jl3bc_77",
+	switchTrack: "_switchTrack_jl3bc_91",
+	switchThumb: "_switchThumb_jl3bc_114",
+	switchThumbOn: "_switchThumbOn_jl3bc_126"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=SwitchRow.module.css.js.map

package/dist/components/SwitchRow/SwitchRow.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchRow.module.css.js","names":[],"sources":["../../../src/components/SwitchRow/SwitchRow.module.css"],"sourcesContent":["/* ─── Row button ────────────────────────────────────────────────────────────── */\n\n.row {\n  display: flex;\n  align-items: center;\n  gap: var(--gnome-space-2, 12px);\n  padding: var(--gnome-space-2, 12px) var(--gnome-space-4, 24px);\n  min-height: 52px;\n  width: 100%;\n\n  appearance: none;\n  -webkit-appearance: none;\n  background: transparent;\n  border: none;\n  font: inherit;\n  outline: none;\n  cursor: pointer;\n  text-align: start;\n  color: var(--gnome-card-fg-color, rgba(0, 0, 0, 0.8));\n\n  transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.row:hover {\n  background-color: var(--gnome-hover-overlay);\n}\n\n.row:active {\n  background-color: var(--gnome-active-overlay);\n}\n\n.row:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Disabled ──────────────────────────────────────────────────────────────── */\n\n.disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n/* ─── Leading icon/avatar ───────────────────────────────────────────────────── */\n\n.leading {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n}\n\n/* ─── Text content ──────────────────────────────────────────────────────────── */\n\n.content {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-width: 0;\n  gap: 2px;\n}\n\n.title {\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-body, 1rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  line-height: var(--gnome-line-height-body, 1.5);\n  color: var(--gnome-card-fg-color, rgba(0, 0, 0, 0.8));\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.subtitle {\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-caption, 0.75rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  line-height: var(--gnome-line-height-body, 1.5);\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.55));\n  opacity: var(--gnome-opacity-dim, 0.55);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* ─── Switch track ──────────────────────────────────────────────────────────── */\n\n.switchTrack {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n  width: 56px;\n  height: 28px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: var(--gnome-light-4, #c0bfbc);\n  border: 1px solid var(--gnome-border-subtle, rgba(0, 0, 0, 0.12));\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    border-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n/* When checked, colour the track */\n.row[aria-checked=\"true\"] .switchTrack {\n  background-color: var(--gnome-accent-bg-color, #3584e4);\n  border-color: var(--gnome-accent-bg-color, #3584e4);\n}\n\n/* ─── Switch thumb ──────────────────────────────────────────────────────────── */\n\n.switchThumb {\n  position: absolute;\n  top: 3px;\n  left: 3px;\n  width: 20px;\n  height: 20px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: #ffffff;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);\n  transition: transform var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.switchThumbOn {\n  transform: translateX(28px);\n}\n\n/* ─── Dark mode ─────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switchTrack {\n    background-color: var(--gnome-dark-2, #5e5c64);\n  }\n\n  .switchThumb {\n    background-color: var(--gnome-light-3, #deddda);\n  }\n\n  .row[aria-checked=\"true\"] .switchThumb {\n    background-color: #ffffff;\n  }\n}\n\n/* ─── High contrast ─────────────────────────────────────────────────────────── */\n\n@media (prefers-contrast: more) {\n  .row:focus-visible {\n    box-shadow:\n      inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n      inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n        var(--gnome-focus-ring-color, #3584e4),\n      inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px) + 1px)\n        var(--gnome-window-bg-color, #fafafa);\n  }\n\n  .switchTrack {\n    border-width: 2px;\n  }\n\n  .switchThumb {\n    box-shadow: none;\n  }\n}\n\n/* ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .switchTrack,\n  .switchThumb {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/dist/components/SwitchRow.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./SwitchRow/SwitchRow.cjs`);exports.SwitchRow=e.SwitchRow;

package/dist/components/SwitchRow.d.ts

@@ -0,0 +1,2 @@
+export * from './SwitchRow/index'
+export {}

package/dist/components/SwitchRow.js

@@ -0,0 +1,2 @@
+import { SwitchRow as e } from "./SwitchRow/SwitchRow.js";
+export { e as SwitchRow };

package/dist/components/Tabs/TabBar.cjs

@@ -0,0 +1,2 @@
+const e=require(`./Tabs.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({children:r,className:i,inline:a=!1,"aria-label":o=`Tabs`,...s}){let c=(0,t.useRef)(null);function l(e){let t=Array.from(c.current?.querySelectorAll(`[role=tab]:not(:disabled)`)??[]),n=t.findIndex(e=>e===document.activeElement);if(n===-1)return;let r=n;if(e.key===`ArrowRight`)r=(n+1)%t.length;else if(e.key===`ArrowLeft`)r=(n-1+t.length)%t.length;else if(e.key===`Home`)r=0;else if(e.key===`End`)r=t.length-1;else return;e.preventDefault(),t[r].focus()}return(0,n.jsx)(`div`,{className:[e.default.bar,a?e.default.inline:null,i].filter(Boolean).join(` `),...s,children:(0,n.jsx)(`div`,{ref:c,role:`tablist`,"aria-label":o,className:e.default.list,onKeyDown:l,children:r})})}exports.TabBar=r;
+//# sourceMappingURL=TabBar.cjs.map

package/dist/components/Tabs/TabBar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabBar.cjs","names":[],"sources":["../../../src/components/Tabs/TabBar.tsx"],"sourcesContent":["import {\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabBarProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the tab list. */\n  \"aria-label\"?: string;\n  /**\n   * Removes the header-bar background so the tab bar blends into any surface.\n   * Use when placing the bar inside a card, content area, or custom container.\n   * Mirrors the `.inline` style class.\n   */\n  inline?: boolean;\n}\n\n/**\n * Horizontal tab bar that holds `TabItem` elements.\n *\n * Manages roving-tabindex keyboard navigation (← → Home End).\n *\n * @see https://developer.gnome.org/hig/patterns/nav/tabs.html\n */\nexport function TabBar({\n  children,\n  className,\n  inline = false,\n  \"aria-label\": ariaLabel = \"Tabs\",\n  ...props\n}: TabBarProps) {\n  const listRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const tabs = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=tab]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = tabs.findIndex((t) => t === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowRight\") next = (idx + 1) % tabs.length;\n    else if (e.key === \"ArrowLeft\") next = (idx - 1 + tabs.length) % tabs.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = tabs.length - 1;\n    else return;\n\n    e.preventDefault();\n    tabs[next].focus();\n  }\n\n  return (\n    <div\n      className={[styles.bar, inline ? styles.inline : null, className]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      <div\n        ref={listRef}\n        role=\"tablist\"\n        aria-label={ariaLabel}\n        className={styles.list}\n        onKeyDown={handleKeyDown}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"+FA2BA,SAAgB,EAAO,CACrB,WACA,YACA,SAAS,GACT,aAAc,EAAY,OAC1B,GAAG,GACW,CACd,IAAM,GAAA,EAAA,EAAA,QAAiC,KAAK,CAE5C,SAAS,EAAc,EAAkC,CACvD,IAAM,EAAO,MAAM,KACjB,EAAQ,SAAS,iBACf,4BACD,EAAI,EAAE,CACR,CACK,EAAM,EAAK,UAAW,GAAM,IAAM,SAAS,cAAc,CAC/D,GAAI,IAAQ,GAAI,OAEhB,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,aAAc,GAAQ,EAAM,GAAK,EAAK,eAC3C,EAAE,MAAQ,YAAa,GAAQ,EAAM,EAAI,EAAK,QAAU,EAAK,eAC7D,EAAE,MAAQ,OAAQ,EAAO,UACzB,EAAE,MAAQ,MAAO,EAAO,EAAK,OAAS,OAC1C,OAEL,EAAE,gBAAgB,CAClB,EAAK,GAAM,OAAO,CAGpB,OACE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,IAAK,EAAS,EAAA,QAAO,OAAS,KAAM,EAAU,CAC9D,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,YAEJ,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,KAAK,UACL,aAAY,EACZ,UAAW,EAAA,QAAO,KAClB,UAAW,EAEV,WACG,CAAA,CACF,CAAA"}

package/dist/components/Tabs/TabBar.js

@@ -0,0 +1,38 @@
+import e from "./Tabs.module.css.js";
+import { useRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/Tabs/TabBar.tsx
+function r({ children: r, className: i, inline: a = !1, "aria-label": o = "Tabs", ...s }) {
+	let c = t(null);
+	function l(e) {
+		let t = Array.from(c.current?.querySelectorAll("[role=tab]:not(:disabled)") ?? []), n = t.findIndex((e) => e === document.activeElement);
+		if (n === -1) return;
+		let r = n;
+		if (e.key === "ArrowRight") r = (n + 1) % t.length;
+		else if (e.key === "ArrowLeft") r = (n - 1 + t.length) % t.length;
+		else if (e.key === "Home") r = 0;
+		else if (e.key === "End") r = t.length - 1;
+		else return;
+		e.preventDefault(), t[r].focus();
+	}
+	return /* @__PURE__ */ n("div", {
+		className: [
+			e.bar,
+			a ? e.inline : null,
+			i
+		].filter(Boolean).join(" "),
+		...s,
+		children: /* @__PURE__ */ n("div", {
+			ref: c,
+			role: "tablist",
+			"aria-label": o,
+			className: e.list,
+			onKeyDown: l,
+			children: r
+		})
+	});
+}
+//#endregion
+export { r as TabBar };
+
+//# sourceMappingURL=TabBar.js.map

package/dist/components/Tabs/TabBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabBar.js","names":[],"sources":["../../../src/components/Tabs/TabBar.tsx"],"sourcesContent":["import {\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabBarProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the tab list. */\n  \"aria-label\"?: string;\n  /**\n   * Removes the header-bar background so the tab bar blends into any surface.\n   * Use when placing the bar inside a card, content area, or custom container.\n   * Mirrors the `.inline` style class.\n   */\n  inline?: boolean;\n}\n\n/**\n * Horizontal tab bar that holds `TabItem` elements.\n *\n * Manages roving-tabindex keyboard navigation (← → Home End).\n *\n * @see https://developer.gnome.org/hig/patterns/nav/tabs.html\n */\nexport function TabBar({\n  children,\n  className,\n  inline = false,\n  \"aria-label\": ariaLabel = \"Tabs\",\n  ...props\n}: TabBarProps) {\n  const listRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const tabs = Array.from(\n      listRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=tab]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = tabs.findIndex((t) => t === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowRight\") next = (idx + 1) % tabs.length;\n    else if (e.key === \"ArrowLeft\") next = (idx - 1 + tabs.length) % tabs.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = tabs.length - 1;\n    else return;\n\n    e.preventDefault();\n    tabs[next].focus();\n  }\n\n  return (\n    <div\n      className={[styles.bar, inline ? styles.inline : null, className]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      <div\n        ref={listRef}\n        role=\"tablist\"\n        aria-label={ariaLabel}\n        className={styles.list}\n        onKeyDown={handleKeyDown}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;AA2BA,SAAgB,EAAO,EACrB,aACA,cACA,YAAS,IACT,cAAc,IAAY,QAC1B,GAAG,KACW;CACd,IAAM,IAAU,EAAuB,KAAK;CAE5C,SAAS,EAAc,GAAkC;EACvD,IAAM,IAAO,MAAM,KACjB,EAAQ,SAAS,iBACf,4BACD,IAAI,EAAE,CACR,EACK,IAAM,EAAK,WAAW,MAAM,MAAM,SAAS,cAAc;AAC/D,MAAI,MAAQ,GAAI;EAEhB,IAAI,IAAO;AACX,MAAI,EAAE,QAAQ,aAAc,MAAQ,IAAM,KAAK,EAAK;WAC3C,EAAE,QAAQ,YAAa,MAAQ,IAAM,IAAI,EAAK,UAAU,EAAK;WAC7D,EAAE,QAAQ,OAAQ,KAAO;WACzB,EAAE,QAAQ,MAAO,KAAO,EAAK,SAAS;MAC1C;AAGL,EADA,EAAE,gBAAgB,EAClB,EAAK,GAAM,OAAO;;AAGpB,QACE,kBAAC,OAAD;EACE,WAAW;GAAC,EAAO;GAAK,IAAS,EAAO,SAAS;GAAM;GAAU,CAC9D,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;YAEJ,kBAAC,OAAD;GACE,KAAK;GACL,MAAK;GACL,cAAY;GACZ,WAAW,EAAO;GAClB,WAAW;GAEV;GACG,CAAA;EACF,CAAA"}

package/dist/components/Tabs/TabItem.cjs

@@ -0,0 +1,2 @@
+const e=require(`../Icon/Icon.cjs`),t=require(`./Tabs.module.css.cjs`);let n=require(`react/jsx-runtime`);function r({label:r,icon:i,active:a=!1,panelId:o,onClose:s,closeLabel:c=`Close tab`,className:l,disabled:u,...d}){return(0,n.jsxs)(`button`,{role:`tab`,type:`button`,"aria-selected":a,"aria-controls":o,tabIndex:a?0:-1,disabled:u,className:[t.default.tab,a?t.default.active:null,s?t.default.closeable:null,l].filter(Boolean).join(` `),...d,children:[i&&(0,n.jsx)(`span`,{className:t.default.tabIcon,children:(0,n.jsx)(e.Icon,{icon:i,size:`sm`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.tabLabel,children:r}),s&&(0,n.jsx)(`span`,{role:`button`,tabIndex:0,"aria-label":c,className:t.default.closeBtn,onClick:e=>{e.stopPropagation(),s()},onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),e.stopPropagation(),s())},children:`×`})]})}exports.TabItem=r;
+//# sourceMappingURL=TabItem.cjs.map

package/dist/components/Tabs/TabItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabItem.cjs","names":[],"sources":["../../../src/components/Tabs/TabItem.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport type { IconDefinition } from \"@gnome-ui/icons\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tab label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this tab as the currently selected one. */\n  active?: boolean;\n  /**\n   * id of the `TabPanel` this tab controls.\n   * Sets `aria-controls` automatically.\n   */\n  panelId?: string;\n  /**\n   * When provided, a close (×) button is rendered at the trailing edge.\n   * Called when the user clicks the close button.\n   */\n  onClose?: () => void;\n  /** Accessible label for the close button. Defaults to `\"Close tab\"`. */\n  closeLabel?: string;\n  children?: ReactNode;\n}\n\n/**\n * Individual tab button inside a `TabBar`.\n */\nexport function TabItem({\n  label,\n  icon,\n  active = false,\n  panelId,\n  onClose,\n  closeLabel = \"Close tab\",\n  className,\n  disabled,\n  ...props\n}: TabItemProps) {\n  return (\n    <button\n      role=\"tab\"\n      type=\"button\"\n      aria-selected={active}\n      aria-controls={panelId}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[\n        styles.tab,\n        active ? styles.active : null,\n        onClose ? styles.closeable : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.tabIcon}>\n          <Icon icon={icon} size=\"sm\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.tabLabel}>{label}</span>\n\n      {onClose && (\n        <span\n          role=\"button\"\n          tabIndex={0}\n          aria-label={closeLabel}\n          className={styles.closeBtn}\n          onClick={(e) => { e.stopPropagation(); onClose(); }}\n          onKeyDown={(e) => {\n            if (e.key === \"Enter\" || e.key === \" \") {\n              e.preventDefault();\n              e.stopPropagation();\n              onClose();\n            }\n          }}\n        >\n          ×\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":"0GA8BA,SAAgB,EAAQ,CACtB,QACA,OACA,SAAS,GACT,UACA,UACA,aAAa,YACb,YACA,WACA,GAAG,GACY,CACf,OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,MACL,KAAK,SACL,gBAAe,EACf,gBAAe,EACf,SAAU,EAAS,EAAI,GACb,WACV,UAAW,CACT,EAAA,QAAO,IACP,EAAS,EAAA,QAAO,OAAS,KACzB,EAAU,EAAA,QAAO,UAAY,KAC7B,EACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,WAfN,CAiBG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,GAAc,CAAA,CACrC,CAAA,EAET,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,EAAa,CAAA,CAE/C,IACC,EAAA,EAAA,KAAC,OAAD,CACE,KAAK,SACL,SAAU,EACV,aAAY,EACZ,UAAW,EAAA,QAAO,SAClB,QAAU,GAAM,CAAE,EAAE,iBAAiB,CAAE,GAAS,EAChD,UAAY,GAAM,EACZ,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,gBAAgB,CAClB,EAAE,iBAAiB,CACnB,GAAS,YAGd,IAEM,CAAA,CAEF"}

package/dist/components/Tabs/TabItem.js

@@ -0,0 +1,52 @@
+import { Icon as e } from "../Icon/Icon.js";
+import t from "./Tabs.module.css.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/Tabs/TabItem.tsx
+function i({ label: i, icon: a, active: o = !1, panelId: s, onClose: c, closeLabel: l = "Close tab", className: u, disabled: d, ...f }) {
+	return /* @__PURE__ */ r("button", {
+		role: "tab",
+		type: "button",
+		"aria-selected": o,
+		"aria-controls": s,
+		tabIndex: o ? 0 : -1,
+		disabled: d,
+		className: [
+			t.tab,
+			o ? t.active : null,
+			c ? t.closeable : null,
+			u
+		].filter(Boolean).join(" "),
+		...f,
+		children: [
+			a && /* @__PURE__ */ n("span", {
+				className: t.tabIcon,
+				children: /* @__PURE__ */ n(e, {
+					icon: a,
+					size: "sm",
+					"aria-hidden": !0
+				})
+			}),
+			/* @__PURE__ */ n("span", {
+				className: t.tabLabel,
+				children: i
+			}),
+			c && /* @__PURE__ */ n("span", {
+				role: "button",
+				tabIndex: 0,
+				"aria-label": l,
+				className: t.closeBtn,
+				onClick: (e) => {
+					e.stopPropagation(), c();
+				},
+				onKeyDown: (e) => {
+					(e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), c());
+				},
+				children: "×"
+			})
+		]
+	});
+}
+//#endregion
+export { i as TabItem };
+
+//# sourceMappingURL=TabItem.js.map

package/dist/components/Tabs/TabItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabItem.js","names":[],"sources":["../../../src/components/Tabs/TabItem.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport type { IconDefinition } from \"@gnome-ui/icons\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Tab label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this tab as the currently selected one. */\n  active?: boolean;\n  /**\n   * id of the `TabPanel` this tab controls.\n   * Sets `aria-controls` automatically.\n   */\n  panelId?: string;\n  /**\n   * When provided, a close (×) button is rendered at the trailing edge.\n   * Called when the user clicks the close button.\n   */\n  onClose?: () => void;\n  /** Accessible label for the close button. Defaults to `\"Close tab\"`. */\n  closeLabel?: string;\n  children?: ReactNode;\n}\n\n/**\n * Individual tab button inside a `TabBar`.\n */\nexport function TabItem({\n  label,\n  icon,\n  active = false,\n  panelId,\n  onClose,\n  closeLabel = \"Close tab\",\n  className,\n  disabled,\n  ...props\n}: TabItemProps) {\n  return (\n    <button\n      role=\"tab\"\n      type=\"button\"\n      aria-selected={active}\n      aria-controls={panelId}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[\n        styles.tab,\n        active ? styles.active : null,\n        onClose ? styles.closeable : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.tabIcon}>\n          <Icon icon={icon} size=\"sm\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.tabLabel}>{label}</span>\n\n      {onClose && (\n        <span\n          role=\"button\"\n          tabIndex={0}\n          aria-label={closeLabel}\n          className={styles.closeBtn}\n          onClick={(e) => { e.stopPropagation(); onClose(); }}\n          onKeyDown={(e) => {\n            if (e.key === \"Enter\" || e.key === \" \") {\n              e.preventDefault();\n              e.stopPropagation();\n              onClose();\n            }\n          }}\n        >\n          ×\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":";;;;AA8BA,SAAgB,EAAQ,EACtB,UACA,SACA,YAAS,IACT,YACA,YACA,gBAAa,aACb,cACA,aACA,GAAG,KACY;AACf,QACE,kBAAC,UAAD;EACE,MAAK;EACL,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,UAAU,IAAS,IAAI;EACb;EACV,WAAW;GACT,EAAO;GACP,IAAS,EAAO,SAAS;GACzB,IAAU,EAAO,YAAY;GAC7B;GACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;YAfN;GAiBG,KACC,kBAAC,QAAD;IAAM,WAAW,EAAO;cACtB,kBAAC,GAAD;KAAY;KAAM,MAAK;KAAK,eAAA;KAAc,CAAA;IACrC,CAAA;GAET,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAW;IAAa,CAAA;GAE/C,KACC,kBAAC,QAAD;IACE,MAAK;IACL,UAAU;IACV,cAAY;IACZ,WAAW,EAAO;IAClB,UAAU,MAAM;AAAuB,KAArB,EAAE,iBAAiB,EAAE,GAAS;;IAChD,YAAY,MAAM;AAChB,MAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,gBAAgB,EAClB,EAAE,iBAAiB,EACnB,GAAS;;cAGd;IAEM,CAAA;GAEF"}

package/dist/components/Tabs/TabPanel.cjs

@@ -0,0 +1,2 @@
+const e=require(`./Tabs.module.css.cjs`);let t=require(`react/jsx-runtime`);function n({id:n,active:r=!1,className:i,children:a,...o}){return(0,t.jsx)(`div`,{id:n,role:`tabpanel`,hidden:!r,tabIndex:0,className:[e.default.panel,i].filter(Boolean).join(` `),...o,children:a})}exports.TabPanel=n;
+//# sourceMappingURL=TabPanel.cjs.map

package/dist/components/Tabs/TabPanel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.cjs","names":[],"sources":["../../../src/components/Tabs/TabPanel.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {\n  /** Must match the `panelId` passed to the corresponding `TabItem`. */\n  id: string;\n  /** Controls whether this panel is rendered. */\n  active?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Content panel associated with a `TabItem`.\n * Hidden panels are kept in the DOM but visually hidden.\n */\nexport function TabPanel({\n  id,\n  active = false,\n  className,\n  children,\n  ...props\n}: TabPanelProps) {\n  return (\n    <div\n      id={id}\n      role=\"tabpanel\"\n      hidden={!active}\n      tabIndex={0}\n      className={[styles.panel, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":"4EAeA,SAAgB,EAAS,CACvB,KACA,SAAS,GACT,YACA,WACA,GAAG,GACa,CAChB,OACE,EAAA,EAAA,KAAC,MAAD,CACM,KACJ,KAAK,WACL,OAAQ,CAAC,EACT,SAAU,EACV,UAAW,CAAC,EAAA,QAAO,MAAO,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,CAC9D,GAAI,EAEH,WACG,CAAA"}

package/dist/components/Tabs/TabPanel.js

@@ -0,0 +1,18 @@
+import e from "./Tabs.module.css.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/Tabs/TabPanel.tsx
+function n({ id: n, active: r = !1, className: i, children: a, ...o }) {
+	return /* @__PURE__ */ t("div", {
+		id: n,
+		role: "tabpanel",
+		hidden: !r,
+		tabIndex: 0,
+		className: [e.panel, i].filter(Boolean).join(" "),
+		...o,
+		children: a
+	});
+}
+//#endregion
+export { n as TabPanel };
+
+//# sourceMappingURL=TabPanel.js.map

package/dist/components/Tabs/TabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.js","names":[],"sources":["../../../src/components/Tabs/TabPanel.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {\n  /** Must match the `panelId` passed to the corresponding `TabItem`. */\n  id: string;\n  /** Controls whether this panel is rendered. */\n  active?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Content panel associated with a `TabItem`.\n * Hidden panels are kept in the DOM but visually hidden.\n */\nexport function TabPanel({\n  id,\n  active = false,\n  className,\n  children,\n  ...props\n}: TabPanelProps) {\n  return (\n    <div\n      id={id}\n      role=\"tabpanel\"\n      hidden={!active}\n      tabIndex={0}\n      className={[styles.panel, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;AAeA,SAAgB,EAAS,EACvB,OACA,YAAS,IACT,cACA,aACA,GAAG,KACa;AAChB,QACE,kBAAC,OAAD;EACM;EACJ,MAAK;EACL,QAAQ,CAAC;EACT,UAAU;EACV,WAAW,CAAC,EAAO,OAAO,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAC9D,GAAI;EAEH;EACG,CAAA"}

package/dist/components/Tabs/Tabs.module.css.cjs

@@ -0,0 +1,2 @@
+var e={bar:`_bar_12ars_3`,list:`_list_12ars_10`,tab:`_tab_12ars_26`,active:`_active_12ars_81`,tabIcon:`_tabIcon_12ars_102`,tabLabel:`_tabLabel_12ars_110`,closeBtn:`_closeBtn_12ars_119`,panel:`_panel_12ars_148`,inline:`_inline_12ars_158`};exports.default=e;
+//# sourceMappingURL=Tabs.module.css.cjs.map

package/dist/components/Tabs/Tabs.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.module.css.cjs","names":[],"sources":["../../../src/components/Tabs/Tabs.module.css"],"sourcesContent":["/* ─── Bar (outer wrapper) ──────────────────────────────────────────────────── */\n\n.bar {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-bottom: 1px solid var(--gnome-headerbar-border-color, rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Tab list ─────────────────────────────────────────────────────────────── */\n\n.list {\n  display: flex;\n  align-items: stretch;\n  overflow-x: auto;\n  scrollbar-width: none;\n  padding: 0 var(--gnome-space-1, 6px);\n  gap: 2px;\n  min-height: 40px;\n}\n\n.list::-webkit-scrollbar {\n  display: none;\n}\n\n/* ─── Tab button ───────────────────────────────────────────────────────────── */\n\n.tab {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 0 var(--gnome-space-2, 12px);\n  min-width: 80px;\n  max-width: 200px;\n  white-space: nowrap;\n\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-body, 1rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  color: var(--gnome-headerbar-fg-color, rgba(0, 0, 0, 0.8));\n  opacity: 0.7;\n\n  border-radius: var(--gnome-radius-md, 8px) var(--gnome-radius-md, 8px) 0 0;\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.tab::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: var(--gnome-space-2, 12px);\n  right: var(--gnome-space-2, 12px);\n  height: 2px;\n  border-radius: 1px 1px 0 0;\n  background-color: var(--gnome-accent-bg-color, #3584e4);\n  opacity: 0;\n  transition: opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.tab:hover {\n  opacity: 1;\n  background-color: var(--gnome-hover-overlay);\n}\n\n.tab:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n/* ─── Active tab ───────────────────────────────────────────────────────────── */\n\n.active {\n  opacity: 1;\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  background-color: var(--gnome-active-overlay);\n}\n\n.active::after {\n  opacity: 1;\n}\n\n/* ─── Focus ────────────────────────────────────────────────────────────────── */\n\n.tab:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-headerbar-bg-color, #ebebeb),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Icon inside tab ──────────────────────────────────────────────────────── */\n\n.tabIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label inside tab ─────────────────────────────────────────────────────── */\n\n.tabLabel {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* ─── Close button ─────────────────────────────────────────────────────────── */\n\n.closeBtn {\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n  height: 18px;\n  border-radius: var(--gnome-radius-sm, 4px);\n  font-size: 1rem;\n  line-height: 1;\n  opacity: 0.5;\n  margin-left: 2px;\n  transition: opacity var(--gnome-duration-fast) var(--gnome-easing-default),\n              background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.closeBtn:hover {\n  opacity: 1;\n  background-color: var(--gnome-active-overlay);\n}\n\n.closeBtn:focus-visible {\n  outline: 2px solid var(--gnome-focus-ring-color, #3584e4);\n  outline-offset: 1px;\n  opacity: 1;\n}\n\n/* ─── Panel ────────────────────────────────────────────────────────────────── */\n\n.panel {\n  outline: none;\n}\n\n.panel:focus-visible {\n  box-shadow: inset 0 0 0 2px var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Inline variant ───────────────────────────────────────────────────────── */\n\n.inline {\n  background-color: transparent;\n  border-bottom-color: transparent;\n}\n\n.inline .tab:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── High contrast ────────────────────────────────────────────────────────── */\n\n@media (prefers-contrast: more) {\n  .bar {\n    border-bottom-width: 2px;\n  }\n\n  .tab::after {\n    height: 3px;\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .tab,\n  .tab::after,\n  .closeBtn {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/dist/components/Tabs/Tabs.module.css.js

@@ -0,0 +1,15 @@
+var e = {
+	bar: "_bar_12ars_3",
+	list: "_list_12ars_10",
+	tab: "_tab_12ars_26",
+	active: "_active_12ars_81",
+	tabIcon: "_tabIcon_12ars_102",
+	tabLabel: "_tabLabel_12ars_110",
+	closeBtn: "_closeBtn_12ars_119",
+	panel: "_panel_12ars_148",
+	inline: "_inline_12ars_158"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Tabs.module.css.js.map

package/dist/components/Tabs/Tabs.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.module.css.js","names":[],"sources":["../../../src/components/Tabs/Tabs.module.css"],"sourcesContent":["/* ─── Bar (outer wrapper) ──────────────────────────────────────────────────── */\n\n.bar {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-bottom: 1px solid var(--gnome-headerbar-border-color, rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Tab list ─────────────────────────────────────────────────────────────── */\n\n.list {\n  display: flex;\n  align-items: stretch;\n  overflow-x: auto;\n  scrollbar-width: none;\n  padding: 0 var(--gnome-space-1, 6px);\n  gap: 2px;\n  min-height: 40px;\n}\n\n.list::-webkit-scrollbar {\n  display: none;\n}\n\n/* ─── Tab button ───────────────────────────────────────────────────────────── */\n\n.tab {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 0 var(--gnome-space-2, 12px);\n  min-width: 80px;\n  max-width: 200px;\n  white-space: nowrap;\n\n  font-family: var(--gnome-font-family);\n  font-size: var(--gnome-font-size-body, 1rem);\n  font-weight: var(--gnome-font-weight-normal, 400);\n  color: var(--gnome-headerbar-fg-color, rgba(0, 0, 0, 0.8));\n  opacity: 0.7;\n\n  border-radius: var(--gnome-radius-md, 8px) var(--gnome-radius-md, 8px) 0 0;\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.tab::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: var(--gnome-space-2, 12px);\n  right: var(--gnome-space-2, 12px);\n  height: 2px;\n  border-radius: 1px 1px 0 0;\n  background-color: var(--gnome-accent-bg-color, #3584e4);\n  opacity: 0;\n  transition: opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.tab:hover {\n  opacity: 1;\n  background-color: var(--gnome-hover-overlay);\n}\n\n.tab:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n/* ─── Active tab ───────────────────────────────────────────────────────────── */\n\n.active {\n  opacity: 1;\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  background-color: var(--gnome-active-overlay);\n}\n\n.active::after {\n  opacity: 1;\n}\n\n/* ─── Focus ────────────────────────────────────────────────────────────────── */\n\n.tab:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-headerbar-bg-color, #ebebeb),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Icon inside tab ──────────────────────────────────────────────────────── */\n\n.tabIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label inside tab ─────────────────────────────────────────────────────── */\n\n.tabLabel {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* ─── Close button ─────────────────────────────────────────────────────────── */\n\n.closeBtn {\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n  height: 18px;\n  border-radius: var(--gnome-radius-sm, 4px);\n  font-size: 1rem;\n  line-height: 1;\n  opacity: 0.5;\n  margin-left: 2px;\n  transition: opacity var(--gnome-duration-fast) var(--gnome-easing-default),\n              background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.closeBtn:hover {\n  opacity: 1;\n  background-color: var(--gnome-active-overlay);\n}\n\n.closeBtn:focus-visible {\n  outline: 2px solid var(--gnome-focus-ring-color, #3584e4);\n  outline-offset: 1px;\n  opacity: 1;\n}\n\n/* ─── Panel ────────────────────────────────────────────────────────────────── */\n\n.panel {\n  outline: none;\n}\n\n.panel:focus-visible {\n  box-shadow: inset 0 0 0 2px var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── Inline variant ───────────────────────────────────────────────────────── */\n\n.inline {\n  background-color: transparent;\n  border-bottom-color: transparent;\n}\n\n.inline .tab:focus-visible {\n  box-shadow:\n    inset 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n    inset 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 3px))\n      var(--gnome-focus-ring-color, #3584e4);\n}\n\n/* ─── High contrast ────────────────────────────────────────────────────────── */\n\n@media (prefers-contrast: more) {\n  .bar {\n    border-bottom-width: 2px;\n  }\n\n  .tab::after {\n    height: 3px;\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .tab,\n  .tab::after,\n  .closeBtn {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/dist/components/Tabs.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./Tabs/TabBar.cjs`),t=require(`./Tabs/TabItem.cjs`),n=require(`./Tabs/TabPanel.cjs`);exports.TabBar=e.TabBar,exports.TabItem=t.TabItem,exports.TabPanel=n.TabPanel;

package/dist/components/Tabs.d.ts

@@ -0,0 +1,2 @@
+export * from './Tabs/index'
+export {}

package/dist/components/Tabs.js

@@ -0,0 +1,4 @@
+import { TabBar as e } from "./Tabs/TabBar.js";
+import { TabItem as t } from "./Tabs/TabItem.js";
+import { TabPanel as n } from "./Tabs/TabPanel.js";
+export { e as TabBar, t as TabItem, n as TabPanel };

package/dist/components/TerminalView/TerminalView.cjs

@@ -0,0 +1,2 @@
+const e=require(`./TerminalView.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({lines:r,variant:i=`default`,maxLines:a=500,autoScroll:o=!0,className:s,...c}){let l=(0,t.useRef)(null),u=r.slice(-a);return(0,t.useEffect)(()=>{o&&l.current?.scrollIntoView({block:`nearest`})},[u.length,o]),(0,n.jsx)(`div`,{className:[e.default.terminal,e.default[i],s].filter(Boolean).join(` `),...c,children:(0,n.jsxs)(`pre`,{className:e.default.pre,children:[u.map((t,r)=>(0,n.jsx)(`div`,{className:e.default.line,children:t},r)),(0,n.jsx)(`div`,{ref:l})]})})}exports.TerminalView=r;
+//# sourceMappingURL=TerminalView.cjs.map

package/dist/components/TerminalView/TerminalView.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerminalView.cjs","names":[],"sources":["../../../src/components/TerminalView/TerminalView.tsx"],"sourcesContent":["import {\n  useEffect,\n  useRef,\n  type HTMLAttributes,\n} from \"react\";\nimport styles from \"./TerminalView.module.css\";\n\nexport type TerminalVariant = \"default\" | \"success\" | \"warning\" | \"destructive\";\n\nexport interface TerminalViewProps extends HTMLAttributes<HTMLDivElement> {\n  /** Lines of text to display. */\n  lines: string[];\n  /** Colorize text based on semantic meaning. Defaults to `\"default\"`. */\n  variant?: TerminalVariant;\n  /** Maximum number of lines to keep in the buffer. Defaults to `500`. */\n  maxLines?: number;\n  /** Automatically scroll to the latest line when content changes. Defaults to `true`. */\n  autoScroll?: boolean;\n}\n\nexport function TerminalView({\n  lines,\n  variant = \"default\",\n  maxLines = 500,\n  autoScroll = true,\n  className,\n  ...props\n}: TerminalViewProps) {\n  const bottomRef = useRef<HTMLDivElement>(null);\n  const visibleLines = lines.slice(-maxLines);\n\n  useEffect(() => {\n    if (autoScroll) {\n      bottomRef.current?.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [visibleLines.length, autoScroll]);\n\n  return (\n    <div\n      className={[styles.terminal, styles[variant], className]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      <pre className={styles.pre}>\n        {visibleLines.map((line, i) => (\n          <div key={i} className={styles.line}>\n            {line}\n          </div>\n        ))}\n        <div ref={bottomRef} />\n      </pre>\n    </div>\n  );\n}\n"],"mappings":"uGAoBA,SAAgB,EAAa,CAC3B,QACA,UAAU,UACV,WAAW,IACX,aAAa,GACb,YACA,GAAG,GACiB,CACpB,IAAM,GAAA,EAAA,EAAA,QAAmC,KAAK,CACxC,EAAe,EAAM,MAAM,CAAC,EAAS,CAQ3C,OANA,EAAA,EAAA,eAAgB,CACV,GACF,EAAU,SAAS,eAAe,CAAE,MAAO,UAAW,CAAC,EAExD,CAAC,EAAa,OAAQ,EAAW,CAAC,EAGnC,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,SAAU,EAAA,QAAO,GAAU,EAAU,CACrD,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,YAEJ,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,EAAA,QAAO,aAAvB,CACG,EAAa,KAAK,EAAM,KACvB,EAAA,EAAA,KAAC,MAAD,CAAa,UAAW,EAAA,QAAO,cAC5B,EACG,CAFI,EAEJ,CACN,EACF,EAAA,EAAA,KAAC,MAAD,CAAK,IAAK,EAAa,CAAA,CACnB,GACF,CAAA"}

package/dist/components/TerminalView/TerminalView.js

@@ -0,0 +1,28 @@
+import e from "./TerminalView.module.css.js";
+import { useEffect as t, useRef as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/TerminalView/TerminalView.tsx
+function a({ lines: a, variant: o = "default", maxLines: s = 500, autoScroll: c = !0, className: l, ...u }) {
+	let d = n(null), f = a.slice(-s);
+	return t(() => {
+		c && d.current?.scrollIntoView({ block: "nearest" });
+	}, [f.length, c]), /* @__PURE__ */ r("div", {
+		className: [
+			e.terminal,
+			e[o],
+			l
+		].filter(Boolean).join(" "),
+		...u,
+		children: /* @__PURE__ */ i("pre", {
+			className: e.pre,
+			children: [f.map((t, n) => /* @__PURE__ */ r("div", {
+				className: e.line,
+				children: t
+			}, n)), /* @__PURE__ */ r("div", { ref: d })]
+		})
+	});
+}
+//#endregion
+export { a as TerminalView };
+
+//# sourceMappingURL=TerminalView.js.map

package/dist/components/TerminalView/TerminalView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerminalView.js","names":[],"sources":["../../../src/components/TerminalView/TerminalView.tsx"],"sourcesContent":["import {\n  useEffect,\n  useRef,\n  type HTMLAttributes,\n} from \"react\";\nimport styles from \"./TerminalView.module.css\";\n\nexport type TerminalVariant = \"default\" | \"success\" | \"warning\" | \"destructive\";\n\nexport interface TerminalViewProps extends HTMLAttributes<HTMLDivElement> {\n  /** Lines of text to display. */\n  lines: string[];\n  /** Colorize text based on semantic meaning. Defaults to `\"default\"`. */\n  variant?: TerminalVariant;\n  /** Maximum number of lines to keep in the buffer. Defaults to `500`. */\n  maxLines?: number;\n  /** Automatically scroll to the latest line when content changes. Defaults to `true`. */\n  autoScroll?: boolean;\n}\n\nexport function TerminalView({\n  lines,\n  variant = \"default\",\n  maxLines = 500,\n  autoScroll = true,\n  className,\n  ...props\n}: TerminalViewProps) {\n  const bottomRef = useRef<HTMLDivElement>(null);\n  const visibleLines = lines.slice(-maxLines);\n\n  useEffect(() => {\n    if (autoScroll) {\n      bottomRef.current?.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [visibleLines.length, autoScroll]);\n\n  return (\n    <div\n      className={[styles.terminal, styles[variant], className]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      <pre className={styles.pre}>\n        {visibleLines.map((line, i) => (\n          <div key={i} className={styles.line}>\n            {line}\n          </div>\n        ))}\n        <div ref={bottomRef} />\n      </pre>\n    </div>\n  );\n}\n"],"mappings":";;;;AAoBA,SAAgB,EAAa,EAC3B,UACA,aAAU,WACV,cAAW,KACX,gBAAa,IACb,cACA,GAAG,KACiB;CACpB,IAAM,IAAY,EAAuB,KAAK,EACxC,IAAe,EAAM,MAAM,CAAC,EAAS;AAQ3C,QANA,QAAgB;AACd,EAAI,KACF,EAAU,SAAS,eAAe,EAAE,OAAO,WAAW,CAAC;IAExD,CAAC,EAAa,QAAQ,EAAW,CAAC,EAGnC,kBAAC,OAAD;EACE,WAAW;GAAC,EAAO;GAAU,EAAO;GAAU;GAAU,CACrD,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;YAEJ,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB,CACG,EAAa,KAAK,GAAM,MACvB,kBAAC,OAAD;IAAa,WAAW,EAAO;cAC5B;IACG,EAFI,EAEJ,CACN,EACF,kBAAC,OAAD,EAAK,KAAK,GAAa,CAAA,CACnB;;EACF,CAAA"}

package/dist/components/TerminalView/TerminalView.module.css.cjs

@@ -0,0 +1,2 @@
+var e={terminal:`_terminal_1gr0s_3`,pre:`_pre_1gr0s_18`,line:`_line_1gr0s_25`,success:`_success_1gr0s_41`,warning:`_warning_1gr0s_45`,destructive:`_destructive_1gr0s_49`};exports.default=e;
+//# sourceMappingURL=TerminalView.module.css.cjs.map

package/dist/components/TerminalView/TerminalView.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerminalView.module.css.cjs","names":[],"sources":["../../../src/components/TerminalView/TerminalView.module.css"],"sourcesContent":["/* ─── Container ──────────────────────────────────────────────────────────────── */\n\n.terminal {\n  background-color: var(--gnome-dark-4, #241f31);\n  color: var(--gnome-view-fg-color, rgba(255, 255, 255, 0.87));\n  border-radius: var(--gnome-radius-default, 6px);\n  overflow-y: auto;\n  max-height: 400px;\n  padding: 12px 16px;\n  font-size: 0.875rem;\n  line-height: 1.6;\n\n  /* Adwaita-style thin scrollbar */\n  scrollbar-width: thin;\n  scrollbar-color: rgba(255, 255, 255, 0.2) transparent;\n}\n\n.pre {\n  margin: 0;\n  font-family: var(--gnome-font-family-mono, \"Adwaita Mono\", \"Source Code Pro\", monospace);\n  white-space: pre-wrap;\n  word-break: break-all;\n}\n\n.line {\n  min-height: 1em;\n}\n\n/* ─── Light theme ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: light) {\n  .terminal {\n    background-color: var(--gnome-light-2, #f6f5f4);\n    color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n  }\n}\n\n/* ─── Variants ───────────────────────────────────────────────────────────────── */\n\n.success .line {\n  color: var(--gnome-success-color, #33d17a);\n}\n\n.warning .line {\n  color: var(--gnome-warning-color, #f6d32d);\n}\n\n.destructive .line {\n  color: var(--gnome-destructive-color, #f66151);\n}\n"],"mappings":""}

package/dist/components/TerminalView/TerminalView.module.css.js

@@ -0,0 +1,12 @@
+var e = {
+	terminal: "_terminal_1gr0s_3",
+	pre: "_pre_1gr0s_18",
+	line: "_line_1gr0s_25",
+	success: "_success_1gr0s_41",
+	warning: "_warning_1gr0s_45",
+	destructive: "_destructive_1gr0s_49"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=TerminalView.module.css.js.map

package/dist/components/TerminalView/TerminalView.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TerminalView.module.css.js","names":[],"sources":["../../../src/components/TerminalView/TerminalView.module.css"],"sourcesContent":["/* ─── Container ──────────────────────────────────────────────────────────────── */\n\n.terminal {\n  background-color: var(--gnome-dark-4, #241f31);\n  color: var(--gnome-view-fg-color, rgba(255, 255, 255, 0.87));\n  border-radius: var(--gnome-radius-default, 6px);\n  overflow-y: auto;\n  max-height: 400px;\n  padding: 12px 16px;\n  font-size: 0.875rem;\n  line-height: 1.6;\n\n  /* Adwaita-style thin scrollbar */\n  scrollbar-width: thin;\n  scrollbar-color: rgba(255, 255, 255, 0.2) transparent;\n}\n\n.pre {\n  margin: 0;\n  font-family: var(--gnome-font-family-mono, \"Adwaita Mono\", \"Source Code Pro\", monospace);\n  white-space: pre-wrap;\n  word-break: break-all;\n}\n\n.line {\n  min-height: 1em;\n}\n\n/* ─── Light theme ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: light) {\n  .terminal {\n    background-color: var(--gnome-light-2, #f6f5f4);\n    color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n    scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n  }\n}\n\n/* ─── Variants ───────────────────────────────────────────────────────────────── */\n\n.success .line {\n  color: var(--gnome-success-color, #33d17a);\n}\n\n.warning .line {\n  color: var(--gnome-warning-color, #f6d32d);\n}\n\n.destructive .line {\n  color: var(--gnome-destructive-color, #f66151);\n}\n"],"mappings":""}

package/dist/components/TerminalView.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./TerminalView/TerminalView.cjs`);exports.TerminalView=e.TerminalView;

package/dist/components/TerminalView.d.ts

@@ -0,0 +1,2 @@
+export * from './TerminalView/index'
+export {}

package/dist/components/TerminalView.js

@@ -0,0 +1,2 @@
+import { TerminalView as e } from "./TerminalView/TerminalView.js";
+export { e as TerminalView };

package/dist/components/Text/Text.cjs

@@ -0,0 +1,2 @@
+const e=require(`./Text.module.css.cjs`);let t=require(`react/jsx-runtime`);var n={"large-title":`h1`,"title-1":`h1`,"title-2":`h2`,"title-3":`h3`,"title-4":`h4`,heading:`h3`,body:`p`,document:`p`,caption:`span`,"caption-heading":`span`,monospace:`code`,numeric:`span`};function r({variant:r=`body`,color:i=`default`,as:a,className:o,children:s,...c}){return(0,t.jsx)(a??n[r],{className:[e.default.text,e.default[r],e.default[`color-${i}`],o].filter(Boolean).join(` `),...c,children:s})}exports.Text=r;
+//# sourceMappingURL=Text.cjs.map

package/dist/components/Text/Text.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.cjs","names":[],"sources":["../../../src/components/Text/Text.tsx"],"sourcesContent":["import type { ElementType, HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./Text.module.css\";\n\nexport type TextVariant =\n  | \"large-title\"\n  | \"title-1\"\n  | \"title-2\"\n  | \"title-3\"\n  | \"title-4\"\n  | \"heading\"\n  | \"body\"\n  | \"document\"\n  | \"caption\"\n  | \"caption-heading\"\n  | \"monospace\"\n  | \"numeric\";\n\nexport type TextColor =\n  | \"default\"\n  | \"dim\"\n  | \"accent\"\n  | \"destructive\"\n  | \"success\"\n  | \"warning\"\n  | \"error\";\n\n/** Default HTML element rendered for each variant */\nconst defaultElement: Record<TextVariant, ElementType> = {\n  \"large-title\": \"h1\",\n  \"title-1\": \"h1\",\n  \"title-2\": \"h2\",\n  \"title-3\": \"h3\",\n  \"title-4\": \"h4\",\n  heading: \"h3\",\n  body: \"p\",\n  document: \"p\",\n  caption: \"span\",\n  \"caption-heading\": \"span\",\n  monospace: \"code\",\n  numeric: \"span\",\n};\n\nexport interface TextProps extends HTMLAttributes<HTMLElement> {\n  /** Typography style. Mirrors Adwaita / GNOME HIG text styles. */\n  variant?: TextVariant;\n  /** Semantic color. */\n  color?: TextColor;\n  /** Override the rendered HTML element. */\n  as?: ElementType;\n  children?: ReactNode;\n}\n\n/**\n * Text component following GNOME Human Interface Guidelines typography styles.\n *\n * Variants map directly to Adwaita style classes:\n * `large-title`, `title-1`–`title-4`, `heading`, `body`, `document`,\n * `caption`, `caption-heading`, `monospace`, `numeric`.\n *\n * @see https://developer.gnome.org/hig/guidelines/typography.html\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/style-classes.html\n */\nexport function Text({\n  variant = \"body\",\n  color = \"default\",\n  as,\n  className,\n  children,\n  ...props\n}: TextProps) {\n  const Tag = as ?? defaultElement[variant];\n\n  const classes = [\n    styles.text,\n    styles[variant],\n    styles[`color-${color}`],\n    className,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  return (\n    <Tag className={classes} {...props}>\n      {children}\n    </Tag>\n  );\n}\n"],"mappings":"4EA2BA,IAAM,EAAmD,CACvD,cAAe,KACf,UAAW,KACX,UAAW,KACX,UAAW,KACX,UAAW,KACX,QAAS,KACT,KAAM,IACN,SAAU,IACV,QAAS,OACT,kBAAmB,OACnB,UAAW,OACX,QAAS,OACV,CAsBD,SAAgB,EAAK,CACnB,UAAU,OACV,QAAQ,UACR,KACA,YACA,WACA,GAAG,GACS,CAYZ,OACE,EAAA,EAAA,KAZU,GAAM,EAAe,GAY/B,CAAK,UAVS,CACd,EAAA,QAAO,KACP,EAAA,QAAO,GACP,EAAA,QAAO,SAAS,KAChB,EACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI,CAGe,GAAI,EAC1B,WACG,CAAA"}

package/dist/components/Text/Text.js

@@ -0,0 +1,33 @@
+import e from "./Text.module.css.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/Text/Text.tsx
+var n = {
+	"large-title": "h1",
+	"title-1": "h1",
+	"title-2": "h2",
+	"title-3": "h3",
+	"title-4": "h4",
+	heading: "h3",
+	body: "p",
+	document: "p",
+	caption: "span",
+	"caption-heading": "span",
+	monospace: "code",
+	numeric: "span"
+};
+function r({ variant: r = "body", color: i = "default", as: a, className: o, children: s, ...c }) {
+	return /* @__PURE__ */ t(a ?? n[r], {
+		className: [
+			e.text,
+			e[r],
+			e[`color-${i}`],
+			o
+		].filter(Boolean).join(" "),
+		...c,
+		children: s
+	});
+}
+//#endregion
+export { r as Text };
+
+//# sourceMappingURL=Text.js.map

package/dist/components/Text/Text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.js","names":[],"sources":["../../../src/components/Text/Text.tsx"],"sourcesContent":["import type { ElementType, HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./Text.module.css\";\n\nexport type TextVariant =\n  | \"large-title\"\n  | \"title-1\"\n  | \"title-2\"\n  | \"title-3\"\n  | \"title-4\"\n  | \"heading\"\n  | \"body\"\n  | \"document\"\n  | \"caption\"\n  | \"caption-heading\"\n  | \"monospace\"\n  | \"numeric\";\n\nexport type TextColor =\n  | \"default\"\n  | \"dim\"\n  | \"accent\"\n  | \"destructive\"\n  | \"success\"\n  | \"warning\"\n  | \"error\";\n\n/** Default HTML element rendered for each variant */\nconst defaultElement: Record<TextVariant, ElementType> = {\n  \"large-title\": \"h1\",\n  \"title-1\": \"h1\",\n  \"title-2\": \"h2\",\n  \"title-3\": \"h3\",\n  \"title-4\": \"h4\",\n  heading: \"h3\",\n  body: \"p\",\n  document: \"p\",\n  caption: \"span\",\n  \"caption-heading\": \"span\",\n  monospace: \"code\",\n  numeric: \"span\",\n};\n\nexport interface TextProps extends HTMLAttributes<HTMLElement> {\n  /** Typography style. Mirrors Adwaita / GNOME HIG text styles. */\n  variant?: TextVariant;\n  /** Semantic color. */\n  color?: TextColor;\n  /** Override the rendered HTML element. */\n  as?: ElementType;\n  children?: ReactNode;\n}\n\n/**\n * Text component following GNOME Human Interface Guidelines typography styles.\n *\n * Variants map directly to Adwaita style classes:\n * `large-title`, `title-1`–`title-4`, `heading`, `body`, `document`,\n * `caption`, `caption-heading`, `monospace`, `numeric`.\n *\n * @see https://developer.gnome.org/hig/guidelines/typography.html\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/style-classes.html\n */\nexport function Text({\n  variant = \"body\",\n  color = \"default\",\n  as,\n  className,\n  children,\n  ...props\n}: TextProps) {\n  const Tag = as ?? defaultElement[variant];\n\n  const classes = [\n    styles.text,\n    styles[variant],\n    styles[`color-${color}`],\n    className,\n  ]\n    .filter(Boolean)\n    .join(\" \");\n\n  return (\n    <Tag className={classes} {...props}>\n      {children}\n    </Tag>\n  );\n}\n"],"mappings":";;;AA2BA,IAAM,IAAmD;CACvD,eAAe;CACf,WAAW;CACX,WAAW;CACX,WAAW;CACX,WAAW;CACX,SAAS;CACT,MAAM;CACN,UAAU;CACV,SAAS;CACT,mBAAmB;CACnB,WAAW;CACX,SAAS;CACV;AAsBD,SAAgB,EAAK,EACnB,aAAU,QACV,WAAQ,WACR,OACA,cACA,aACA,GAAG,KACS;AAYZ,QACE,kBAZU,KAAM,EAAe,IAY/B;EAAK,WAVS;GACd,EAAO;GACP,EAAO;GACP,EAAO,SAAS;GAChB;GACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EAGe,GAAI;EAC1B;EACG,CAAA"}

package/dist/components/Text/Text.module.css.cjs

@@ -0,0 +1,2 @@
+var e=`_text_102e3_1`,t=`_heading_102e3_41`,n=`_body_102e3_48`,r=`_document_102e3_55`,i=`_caption_102e3_62`,a=`_monospace_102e3_78`,o=`_numeric_102e3_85`,s={text:e,"large-title":`_large-title_102e3_9`,"title-1":`_title-1_102e3_16`,"title-2":`_title-2_102e3_22`,"title-3":`_title-3_102e3_28`,"title-4":`_title-4_102e3_34`,heading:t,body:n,document:r,caption:i,"caption-heading":`_caption-heading_102e3_69`,monospace:a,numeric:o,"color-default":`_color-default_102e3_95`,"color-dim":`_color-dim_102e3_99`,"color-accent":`_color-accent_102e3_103`,"color-destructive":`_color-destructive_102e3_107`,"color-success":`_color-success_102e3_111`,"color-warning":`_color-warning_102e3_115`,"color-error":`_color-error_102e3_119`};exports.default=s;
+//# sourceMappingURL=Text.module.css.cjs.map

package/dist/components/Text/Text.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.module.css.cjs","names":[],"sources":["../../../src/components/Text/Text.module.css"],"sourcesContent":[".text {\n  font-family: var(--gnome-font-family);\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n  margin: 0;\n}\n\n/* ─── Variants ────────────────────────────────────────────────── */\n\n.large-title {\n  font-size: var(--gnome-font-size-large-title); /* 2.25rem */\n  font-weight: 300;\n  line-height: var(--gnome-line-height-heading);\n  letter-spacing: -0.02em;\n}\n\n.title-1 {\n  font-size: var(--gnome-font-size-title-1); /* 1.875rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-2 {\n  font-size: var(--gnome-font-size-title-2); /* 1.5rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-3 {\n  font-size: var(--gnome-font-size-title-3); /* 1.25rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-4 {\n  font-size: var(--gnome-font-size-title-4); /* 1.125rem */\n  font-weight: var(--gnome-font-weight-semibold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n/* Heading — same size as body but bold. Used for section labels, boxed list headers */\n.heading {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n/* Body — default UI text for labels and descriptions */\n.body {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Document — main reading content (chat messages, articles) */\n.document {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: 1.65;\n}\n\n/* Caption — sub-text accompanying body text */\n.caption {\n  font-size: var(--gnome-font-size-caption); /* 0.75rem */\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Caption Heading — small label, often used above groups */\n.caption-heading {\n  font-size: var(--gnome-font-size-caption);\n  font-weight: var(--gnome-font-weight-semibold);\n  line-height: var(--gnome-line-height-heading);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n}\n\n/* Monospace — code, logs, shell commands */\n.monospace {\n  font-family: var(--gnome-font-family-mono);\n  font-size: 0.875rem;\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Numeric — tabular figures for aligned numbers */\n.numeric {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  font-variant-numeric: tabular-nums;\n  font-feature-settings: \"tnum\";\n  line-height: var(--gnome-line-height-body);\n}\n\n/* ─── Colors ──────────────────────────────────────────────────── */\n\n.color-default {\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n}\n\n.color-dim {\n  opacity: var(--gnome-opacity-dim, 0.55);\n}\n\n.color-accent {\n  color: var(--gnome-accent-color, #3584e4);\n}\n\n.color-destructive {\n  color: var(--gnome-destructive-color, #e01b24);\n}\n\n.color-success {\n  color: var(--gnome-success-color, #2ec27e);\n}\n\n.color-warning {\n  color: var(--gnome-warning-color, #e5a50a);\n}\n\n.color-error {\n  color: var(--gnome-error-color, #e01b24);\n}\n"],"mappings":""}

package/dist/components/Text/Text.module.css.js

@@ -0,0 +1,27 @@
+//#region src/components/Text/Text.module.css
+var e = "_text_102e3_1", t = "_heading_102e3_41", n = "_body_102e3_48", r = "_document_102e3_55", i = "_caption_102e3_62", a = "_monospace_102e3_78", o = "_numeric_102e3_85", s = {
+	text: e,
+	"large-title": "_large-title_102e3_9",
+	"title-1": "_title-1_102e3_16",
+	"title-2": "_title-2_102e3_22",
+	"title-3": "_title-3_102e3_28",
+	"title-4": "_title-4_102e3_34",
+	heading: t,
+	body: n,
+	document: r,
+	caption: i,
+	"caption-heading": "_caption-heading_102e3_69",
+	monospace: a,
+	numeric: o,
+	"color-default": "_color-default_102e3_95",
+	"color-dim": "_color-dim_102e3_99",
+	"color-accent": "_color-accent_102e3_103",
+	"color-destructive": "_color-destructive_102e3_107",
+	"color-success": "_color-success_102e3_111",
+	"color-warning": "_color-warning_102e3_115",
+	"color-error": "_color-error_102e3_119"
+};
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=Text.module.css.js.map

package/dist/components/Text/Text.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.module.css.js","names":[],"sources":["../../../src/components/Text/Text.module.css"],"sourcesContent":[".text {\n  font-family: var(--gnome-font-family);\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n  margin: 0;\n}\n\n/* ─── Variants ────────────────────────────────────────────────── */\n\n.large-title {\n  font-size: var(--gnome-font-size-large-title); /* 2.25rem */\n  font-weight: 300;\n  line-height: var(--gnome-line-height-heading);\n  letter-spacing: -0.02em;\n}\n\n.title-1 {\n  font-size: var(--gnome-font-size-title-1); /* 1.875rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-2 {\n  font-size: var(--gnome-font-size-title-2); /* 1.5rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-3 {\n  font-size: var(--gnome-font-size-title-3); /* 1.25rem */\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n.title-4 {\n  font-size: var(--gnome-font-size-title-4); /* 1.125rem */\n  font-weight: var(--gnome-font-weight-semibold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n/* Heading — same size as body but bold. Used for section labels, boxed list headers */\n.heading {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-bold);\n  line-height: var(--gnome-line-height-heading);\n}\n\n/* Body — default UI text for labels and descriptions */\n.body {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Document — main reading content (chat messages, articles) */\n.document {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: 1.65;\n}\n\n/* Caption — sub-text accompanying body text */\n.caption {\n  font-size: var(--gnome-font-size-caption); /* 0.75rem */\n  font-weight: var(--gnome-font-weight-normal);\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Caption Heading — small label, often used above groups */\n.caption-heading {\n  font-size: var(--gnome-font-size-caption);\n  font-weight: var(--gnome-font-weight-semibold);\n  line-height: var(--gnome-line-height-heading);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n}\n\n/* Monospace — code, logs, shell commands */\n.monospace {\n  font-family: var(--gnome-font-family-mono);\n  font-size: 0.875rem;\n  line-height: var(--gnome-line-height-body);\n}\n\n/* Numeric — tabular figures for aligned numbers */\n.numeric {\n  font-size: var(--gnome-font-size-body);\n  font-weight: var(--gnome-font-weight-normal);\n  font-variant-numeric: tabular-nums;\n  font-feature-settings: \"tnum\";\n  line-height: var(--gnome-line-height-body);\n}\n\n/* ─── Colors ──────────────────────────────────────────────────── */\n\n.color-default {\n  color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n}\n\n.color-dim {\n  opacity: var(--gnome-opacity-dim, 0.55);\n}\n\n.color-accent {\n  color: var(--gnome-accent-color, #3584e4);\n}\n\n.color-destructive {\n  color: var(--gnome-destructive-color, #e01b24);\n}\n\n.color-success {\n  color: var(--gnome-success-color, #2ec27e);\n}\n\n.color-warning {\n  color: var(--gnome-warning-color, #e5a50a);\n}\n\n.color-error {\n  color: var(--gnome-error-color, #e01b24);\n}\n"],"mappings":""}

package/dist/components/Text.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./Text/Text.cjs`);exports.Text=e.Text;

package/dist/components/Text.d.ts

@@ -0,0 +1,2 @@
+export * from './Text/index'
+export {}

package/dist/components/Text.js

@@ -0,0 +1,2 @@
+import { Text as e } from "./Text/Text.js";
+export { e as Text };

package/dist/components/TextField/TextField.cjs

@@ -0,0 +1,2 @@
+const e=require(`./TextField.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({label:r,helperText:i,error:a,id:o,className:s,disabled:c,...l}){let u=(0,t.useId)(),d=o??u,f=`${d}-help`;return(0,n.jsxs)(`div`,{className:[e.default.wrapper,c?e.default.disabled:null].filter(Boolean).join(` `),children:[r&&(0,n.jsx)(`label`,{htmlFor:d,className:e.default.label,children:r}),(0,n.jsx)(`input`,{id:d,disabled:c,"aria-describedby":a||i?f:void 0,"aria-invalid":a?!0:void 0,className:[e.default.input,a?e.default.errorInput:null,s].filter(Boolean).join(` `),...l}),(a||i)&&(0,n.jsx)(`span`,{id:f,className:[e.default.hint,a?e.default.errorHint:null].filter(Boolean).join(` `),children:a??i})]})}exports.TextField=r;
+//# sourceMappingURL=TextField.cjs.map

package/dist/components/TextField/TextField.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.cjs","names":[],"sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import { useId, type InputHTMLAttributes } from \"react\";\nimport styles from \"./TextField.module.css\";\n\nexport interface TextFieldProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"id\"> {\n  /** Visible label rendered above the input. */\n  label?: string;\n  /** Helper text rendered below the input. Hidden when `error` is set. */\n  helperText?: string;\n  /**\n   * Error message rendered below the input in place of `helperText`.\n   * Also applies the error visual state to the input border.\n   */\n  error?: string;\n  /** Explicit id. Auto-generated when omitted. */\n  id?: string;\n}\n\n/**\n * Single-line text input with label, helper text, and error state.\n *\n * Follows the Adwaita `GtkEntry` / `.entry` style class.\n *\n * @see https://developer.gnome.org/hig/patterns/controls/text-fields.html\n */\nexport function TextField({\n  label,\n  helperText,\n  error,\n  id: idProp,\n  className,\n  disabled,\n  ...props\n}: TextFieldProps) {\n  const autoId = useId();\n  const id = idProp ?? autoId;\n  const helpId = `${id}-help`;\n\n  return (\n    <div className={[styles.wrapper, disabled ? styles.disabled : null].filter(Boolean).join(\" \")}>\n      {label && (\n        <label htmlFor={id} className={styles.label}>\n          {label}\n        </label>\n      )}\n\n      <input\n        id={id}\n        disabled={disabled}\n        aria-describedby={error || helperText ? helpId : undefined}\n        aria-invalid={error ? true : undefined}\n        className={[\n          styles.input,\n          error ? styles.errorInput : null,\n          className,\n        ]\n          .filter(Boolean)\n          .join(\" \")}\n        {...props}\n      />\n\n      {(error || helperText) && (\n        <span\n          id={helpId}\n          className={[styles.hint, error ? styles.errorHint : null]\n            .filter(Boolean)\n            .join(\" \")}\n        >\n          {error ?? helperText}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"mappings":"oGAyBA,SAAgB,EAAU,CACxB,QACA,aACA,QACA,GAAI,EACJ,YACA,WACA,GAAG,GACc,CACjB,IAAM,GAAA,EAAA,EAAA,QAAgB,CAChB,EAAK,GAAU,EACf,EAAS,GAAG,EAAG,OAErB,OACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,CAAC,EAAA,QAAO,QAAS,EAAW,EAAA,QAAO,SAAW,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,UAA7F,CACG,IACC,EAAA,EAAA,KAAC,QAAD,CAAO,QAAS,EAAI,UAAW,EAAA,QAAO,eACnC,EACK,CAAA,EAGV,EAAA,EAAA,KAAC,QAAD,CACM,KACM,WACV,mBAAkB,GAAS,EAAa,EAAS,IAAA,GACjD,eAAc,EAAQ,GAAO,IAAA,GAC7B,UAAW,CACT,EAAA,QAAO,MACP,EAAQ,EAAA,QAAO,WAAa,KAC5B,EACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,EACJ,CAAA,EAEA,GAAS,KACT,EAAA,EAAA,KAAC,OAAD,CACE,GAAI,EACJ,UAAW,CAAC,EAAA,QAAO,KAAM,EAAQ,EAAA,QAAO,UAAY,KAAK,CACtD,OAAO,QAAQ,CACf,KAAK,IAAI,UAEX,GAAS,EACL,CAAA,CAEL"}

package/dist/components/TextField/TextField.js

@@ -0,0 +1,38 @@
+import e from "./TextField.module.css.js";
+import { useId as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/TextField/TextField.tsx
+function i({ label: i, helperText: a, error: o, id: s, className: c, disabled: l, ...u }) {
+	let d = t(), f = s ?? d, p = `${f}-help`;
+	return /* @__PURE__ */ r("div", {
+		className: [e.wrapper, l ? e.disabled : null].filter(Boolean).join(" "),
+		children: [
+			i && /* @__PURE__ */ n("label", {
+				htmlFor: f,
+				className: e.label,
+				children: i
+			}),
+			/* @__PURE__ */ n("input", {
+				id: f,
+				disabled: l,
+				"aria-describedby": o || a ? p : void 0,
+				"aria-invalid": o ? !0 : void 0,
+				className: [
+					e.input,
+					o ? e.errorInput : null,
+					c
+				].filter(Boolean).join(" "),
+				...u
+			}),
+			(o || a) && /* @__PURE__ */ n("span", {
+				id: p,
+				className: [e.hint, o ? e.errorHint : null].filter(Boolean).join(" "),
+				children: o ?? a
+			})
+		]
+	});
+}
+//#endregion
+export { i as TextField };
+
+//# sourceMappingURL=TextField.js.map

package/dist/components/TextField/TextField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.js","names":[],"sources":["../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import { useId, type InputHTMLAttributes } from \"react\";\nimport styles from \"./TextField.module.css\";\n\nexport interface TextFieldProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"id\"> {\n  /** Visible label rendered above the input. */\n  label?: string;\n  /** Helper text rendered below the input. Hidden when `error` is set. */\n  helperText?: string;\n  /**\n   * Error message rendered below the input in place of `helperText`.\n   * Also applies the error visual state to the input border.\n   */\n  error?: string;\n  /** Explicit id. Auto-generated when omitted. */\n  id?: string;\n}\n\n/**\n * Single-line text input with label, helper text, and error state.\n *\n * Follows the Adwaita `GtkEntry` / `.entry` style class.\n *\n * @see https://developer.gnome.org/hig/patterns/controls/text-fields.html\n */\nexport function TextField({\n  label,\n  helperText,\n  error,\n  id: idProp,\n  className,\n  disabled,\n  ...props\n}: TextFieldProps) {\n  const autoId = useId();\n  const id = idProp ?? autoId;\n  const helpId = `${id}-help`;\n\n  return (\n    <div className={[styles.wrapper, disabled ? styles.disabled : null].filter(Boolean).join(\" \")}>\n      {label && (\n        <label htmlFor={id} className={styles.label}>\n          {label}\n        </label>\n      )}\n\n      <input\n        id={id}\n        disabled={disabled}\n        aria-describedby={error || helperText ? helpId : undefined}\n        aria-invalid={error ? true : undefined}\n        className={[\n          styles.input,\n          error ? styles.errorInput : null,\n          className,\n        ]\n          .filter(Boolean)\n          .join(\" \")}\n        {...props}\n      />\n\n      {(error || helperText) && (\n        <span\n          id={helpId}\n          className={[styles.hint, error ? styles.errorHint : null]\n            .filter(Boolean)\n            .join(\" \")}\n        >\n          {error ?? helperText}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;AAyBA,SAAgB,EAAU,EACxB,UACA,eACA,UACA,IAAI,GACJ,cACA,aACA,GAAG,KACc;CACjB,IAAM,IAAS,GAAO,EAChB,IAAK,KAAU,GACf,IAAS,GAAG,EAAG;AAErB,QACE,kBAAC,OAAD;EAAK,WAAW,CAAC,EAAO,SAAS,IAAW,EAAO,WAAW,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;YAA7F;GACG,KACC,kBAAC,SAAD;IAAO,SAAS;IAAI,WAAW,EAAO;cACnC;IACK,CAAA;GAGV,kBAAC,SAAD;IACM;IACM;IACV,oBAAkB,KAAS,IAAa,IAAS,KAAA;IACjD,gBAAc,IAAQ,KAAO,KAAA;IAC7B,WAAW;KACT,EAAO;KACP,IAAQ,EAAO,aAAa;KAC5B;KACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;IACZ,GAAI;IACJ,CAAA;IAEA,KAAS,MACT,kBAAC,QAAD;IACE,IAAI;IACJ,WAAW,CAAC,EAAO,MAAM,IAAQ,EAAO,YAAY,KAAK,CACtD,OAAO,QAAQ,CACf,KAAK,IAAI;cAEX,KAAS;IACL,CAAA;GAEL"}

package/dist/components/TextField/TextField.module.css.cjs

@@ -0,0 +1,2 @@
+var e={wrapper:`_wrapper_q91d8_3`,disabled:`_disabled_q91d8_9`,label:`_label_q91d8_15`,input:`_input_q91d8_25`,errorInput:`_errorInput_q91d8_74`,hint:`_hint_q91d8_89`,errorHint:`_errorHint_q91d8_97`};exports.default=e;
+//# sourceMappingURL=TextField.module.css.cjs.map