@gnome-ui/react 1.45.0 → 1.45.2

package/dist/components/Tooltip.cjs

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

package/dist/components/ViewSwitcher/ViewSwitcher.cjs

@@ -1,2 +1,2 @@
-const e=require(`./ViewSwitcher.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({children:r,className:i,"aria-label":a=`View switcher`,...o}){let s=(0,t.useRef)(null);function c(e){let t=Array.from(s.current?.querySelectorAll(`[role=radio]:not(:disabled)`)??[]),n=t.findIndex(e=>e===document.activeElement);if(n===-1)return;let r=n;if(e.key===`ArrowRight`||e.key===`ArrowDown`)r=(n+1)%t.length;else if(e.key===`ArrowLeft`||e.key===`ArrowUp`)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(),t[r].click()}return(0,n.jsx)(`div`,{ref:s,role:`radiogroup`,"aria-label":a,onKeyDown:c,className:[e.default.switcher,i].filter(Boolean).join(` `),...o,children:r})}exports.ViewSwitcher=r;
+const e=require("./ViewSwitcher.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({children:r,className:i,"aria-label":a=`View switcher`,...o})=>{let s=(0,t.useRef)(null);function c(e){let t=Array.from(s.current?.querySelectorAll(`[role=radio]:not(:disabled)`)??[]),n=document.activeElement,r=n instanceof HTMLButtonElement?t.indexOf(n):-1;if(r===-1)return;let i=r;if(e.key===`ArrowRight`||e.key===`ArrowDown`)i=(r+1)%t.length;else if(e.key===`ArrowLeft`||e.key===`ArrowUp`)i=(r-1+t.length)%t.length;else if(e.key===`Home`)i=0;else if(e.key===`End`)i=t.length-1;else return;e.preventDefault(),t[i].focus(),t[i].click()}return(0,n.jsx)(`div`,{ref:s,role:`radiogroup`,"aria-label":a,onKeyDown:c,className:[e.default.switcher,i].filter(Boolean).join(` `),...o,children:r})};exports.ViewSwitcher=r;
 //# sourceMappingURL=ViewSwitcher.cjs.map

package/dist/components/ViewSwitcher/ViewSwitcher.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcher.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import {\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./ViewSwitcher.module.css\";\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the group. */\n  \"aria-label\"?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport function ViewSwitcher({\n  children,\n  className,\n  \"aria-label\": ariaLabel = \"View switcher\",\n  ...props\n}: ViewSwitcherProps) {\n  const groupRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=radio]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = items.findIndex((el) => el === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\")\n      next = (idx + 1) % items.length;\n    else if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\")\n      next = (idx - 1 + items.length) % items.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = items.length - 1;\n    else return;\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <div\n      ref={groupRef}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      onKeyDown={handleKeyDown}\n      className={[styles.switcher, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":"uGA0BA,SAAgB,EAAa,CAC3B,WACA,YACA,aAAc,EAAY,gBAC1B,GAAG,GACiB,CACpB,IAAM,GAAA,EAAA,EAAA,QAAkC,KAAK,CAE7C,SAAS,EAAc,EAAkC,CACvD,IAAM,EAAQ,MAAM,KAClB,EAAS,SAAS,iBAChB,8BACD,EAAI,EAAE,CACR,CACK,EAAM,EAAM,UAAW,GAAO,IAAO,SAAS,cAAc,CAClE,GAAI,IAAQ,GAAI,OAEhB,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,cAAgB,EAAE,MAAQ,YACtC,GAAQ,EAAM,GAAK,EAAM,eAClB,EAAE,MAAQ,aAAe,EAAE,MAAQ,UAC1C,GAAQ,EAAM,EAAI,EAAM,QAAU,EAAM,eACjC,EAAE,MAAQ,OAAQ,EAAO,UACzB,EAAE,MAAQ,MAAO,EAAO,EAAM,OAAS,OAC3C,OAEL,EAAE,gBAAgB,CAClB,EAAM,GAAM,OAAO,CACnB,EAAM,GAAM,OAAO,CAGrB,OACE,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,KAAK,aACL,aAAY,EACZ,UAAW,EACX,UAAW,CAAC,EAAA,QAAO,SAAU,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,CACjE,GAAI,EAEH,WACG,CAAA"}
+{"version":3,"file":"ViewSwitcher.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the group. */\n  'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport const ViewSwitcher = ({\n  children,\n  className,\n  'aria-label': ariaLabel = 'View switcher',\n  ...props\n}: ViewSwitcherProps) => {\n  const groupRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n    );\n    const activeElement = document.activeElement;\n    const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n    if (idx === -1) {\n      return;\n    }\n\n    let next = idx;\n    if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n      next = (idx + 1) % items.length;\n    } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n      next = (idx - 1 + items.length) % items.length;\n    } else if (e.key === 'Home') {\n      next = 0;\n    } else if (e.key === 'End') {\n      next = items.length - 1;\n    } else {\n      return;\n    }\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <div\n      ref={groupRef}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      onKeyDown={handleKeyDown}\n      className={[styles.switcher, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":"uGAsBA,IAAa,GAAgB,CAC3B,WACA,YACA,aAAc,EAAY,gBAC1B,GAAG,KACoB,CACvB,IAAM,GAAA,EAAA,EAAA,QAAkC,IAAI,EAE5C,SAAS,EAAc,EAAkC,CACvD,IAAM,EAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,GAAK,CAAC,CAC3F,EACM,EAAgB,SAAS,cACzB,EAAM,aAAyB,kBAAoB,EAAM,QAAQ,CAAa,EAAI,GAExF,GAAI,IAAQ,GACV,OAGF,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,cAAgB,EAAE,MAAQ,YACtC,GAAQ,EAAM,GAAK,EAAM,YACpB,GAAI,EAAE,MAAQ,aAAe,EAAE,MAAQ,UAC5C,GAAQ,EAAM,EAAI,EAAM,QAAU,EAAM,YACnC,GAAI,EAAE,MAAQ,OACnB,EAAO,OACF,GAAI,EAAE,MAAQ,MACnB,EAAO,EAAM,OAAS,OAEtB,OAGF,EAAE,eAAe,EACjB,EAAM,GAAM,MAAM,EAClB,EAAM,GAAM,MAAM,CACpB,CAEA,OACE,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,KAAK,aACL,aAAY,EACZ,UAAW,EACX,UAAW,CAAC,EAAA,QAAO,SAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAChE,GAAI,EAEH,UACE,CAAA,CAET"}

package/dist/components/ViewSwitcher/ViewSwitcher.d.ts

@@ -2,7 +2,7 @@ import { HTMLAttributes, ReactNode } from 'react';
 export interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {
     children?: ReactNode;
     /** Accessible label for the group. */
-    "aria-label"?: string;
+    'aria-label'?: string;
 }
 /**
  * Segmented control for switching between major views.
@@ -16,4 +16,4 @@ export interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html
  * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html
  */
-export declare function ViewSwitcher({ children, className, "aria-label": ariaLabel, ...props }: ViewSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export declare const ViewSwitcher: ({ children, className, "aria-label": ariaLabel, ...props }: ViewSwitcherProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ViewSwitcher/ViewSwitcher.js

@@ -2,18 +2,18 @@ import e from "./ViewSwitcher.module.css.js";
 import { useRef as t } from "react";
 import { jsx as n } from "react/jsx-runtime";
 //#region src/components/ViewSwitcher/ViewSwitcher.tsx
-function r({ children: r, className: i, "aria-label": a = "View switcher", ...o }) {
+var r = ({ children: r, className: i, "aria-label": a = "View switcher", ...o }) => {
 	let s = t(null);
 	function c(e) {
-		let t = Array.from(s.current?.querySelectorAll("[role=radio]:not(:disabled)") ?? []), n = t.findIndex((e) => e === document.activeElement);
-		if (n === -1) return;
-		let r = n;
-		if (e.key === "ArrowRight" || e.key === "ArrowDown") r = (n + 1) % t.length;
-		else if (e.key === "ArrowLeft" || e.key === "ArrowUp") r = (n - 1 + t.length) % t.length;
-		else if (e.key === "Home") r = 0;
-		else if (e.key === "End") r = t.length - 1;
+		let t = Array.from(s.current?.querySelectorAll("[role=radio]:not(:disabled)") ?? []), n = document.activeElement, r = n instanceof HTMLButtonElement ? t.indexOf(n) : -1;
+		if (r === -1) return;
+		let i = r;
+		if (e.key === "ArrowRight" || e.key === "ArrowDown") i = (r + 1) % t.length;
+		else if (e.key === "ArrowLeft" || e.key === "ArrowUp") i = (r - 1 + t.length) % t.length;
+		else if (e.key === "Home") i = 0;
+		else if (e.key === "End") i = t.length - 1;
 		else return;
-		e.preventDefault(), t[r].focus(), t[r].click();
+		e.preventDefault(), t[i].focus(), t[i].click();
 	}
 	return /* @__PURE__ */ n("div", {
 		ref: s,
@@ -24,7 +24,7 @@ function r({ children: r, className: i, "aria-label": a = "View switcher", ...o
 		...o,
 		children: r
 	});
-}
+};
 //#endregion
 export { r as ViewSwitcher };
 

package/dist/components/ViewSwitcher/ViewSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcher.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import {\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./ViewSwitcher.module.css\";\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the group. */\n  \"aria-label\"?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport function ViewSwitcher({\n  children,\n  className,\n  \"aria-label\": ariaLabel = \"View switcher\",\n  ...props\n}: ViewSwitcherProps) {\n  const groupRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=radio]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = items.findIndex((el) => el === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\")\n      next = (idx + 1) % items.length;\n    else if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\")\n      next = (idx - 1 + items.length) % items.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = items.length - 1;\n    else return;\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <div\n      ref={groupRef}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      onKeyDown={handleKeyDown}\n      className={[styles.switcher, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;AA0BA,SAAgB,EAAa,EAC3B,aACA,cACA,cAAc,IAAY,iBAC1B,GAAG,KACiB;CACpB,IAAM,IAAW,EAAuB,KAAK;CAE7C,SAAS,EAAc,GAAkC;EACvD,IAAM,IAAQ,MAAM,KAClB,EAAS,SAAS,iBAChB,8BACD,IAAI,EAAE,CACR,EACK,IAAM,EAAM,WAAW,MAAO,MAAO,SAAS,cAAc;AAClE,MAAI,MAAQ,GAAI;EAEhB,IAAI,IAAO;AACX,MAAI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,YACtC,MAAQ,IAAM,KAAK,EAAM;WAClB,EAAE,QAAQ,eAAe,EAAE,QAAQ,UAC1C,MAAQ,IAAM,IAAI,EAAM,UAAU,EAAM;WACjC,EAAE,QAAQ,OAAQ,KAAO;WACzB,EAAE,QAAQ,MAAO,KAAO,EAAM,SAAS;MAC3C;AAIL,EAFA,EAAE,gBAAgB,EAClB,EAAM,GAAM,OAAO,EACnB,EAAM,GAAM,OAAO;;AAGrB,QACE,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAY;EACZ,WAAW;EACX,WAAW,CAAC,EAAO,UAAU,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACjE,GAAI;EAEH;EACG,CAAA"}
+{"version":3,"file":"ViewSwitcher.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n  children?: ReactNode;\n  /** Accessible label for the group. */\n  'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport const ViewSwitcher = ({\n  children,\n  className,\n  'aria-label': ariaLabel = 'View switcher',\n  ...props\n}: ViewSwitcherProps) => {\n  const groupRef = useRef<HTMLDivElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n    );\n    const activeElement = document.activeElement;\n    const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n    if (idx === -1) {\n      return;\n    }\n\n    let next = idx;\n    if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n      next = (idx + 1) % items.length;\n    } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n      next = (idx - 1 + items.length) % items.length;\n    } else if (e.key === 'Home') {\n      next = 0;\n    } else if (e.key === 'End') {\n      next = items.length - 1;\n    } else {\n      return;\n    }\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <div\n      ref={groupRef}\n      role=\"radiogroup\"\n      aria-label={ariaLabel}\n      onKeyDown={handleKeyDown}\n      className={[styles.switcher, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;;AAsBA,IAAa,KAAgB,EAC3B,aACA,cACA,cAAc,IAAY,iBAC1B,GAAG,QACoB;CACvB,IAAM,IAAW,EAAuB,IAAI;CAE5C,SAAS,EAAc,GAAkC;EACvD,IAAM,IAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,KAAK,CAAC,CAC3F,GACM,IAAgB,SAAS,eACzB,IAAM,aAAyB,oBAAoB,EAAM,QAAQ,CAAa,IAAI;EAExF,IAAI,MAAQ,IACV;EAGF,IAAI,IAAO;EACX,IAAI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,aACtC,KAAQ,IAAM,KAAK,EAAM;OACpB,IAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAC5C,KAAQ,IAAM,IAAI,EAAM,UAAU,EAAM;OACnC,IAAI,EAAE,QAAQ,QACnB,IAAO;OACF,IAAI,EAAE,QAAQ,OACnB,IAAO,EAAM,SAAS;OAEtB;EAKF,AAFA,EAAE,eAAe,GACjB,EAAM,GAAM,MAAM,GAClB,EAAM,GAAM,MAAM;CACpB;CAEA,OACE,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAY;EACZ,WAAW;EACX,WAAW,CAAC,EAAO,UAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;EAChE,GAAI;EAEH;CACE,CAAA;AAET"}

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

@@ -1,2 +1,2 @@
-var e={switcher:`_switcher_1uh9r_3`,item:`_item_1uh9r_18`,active:`_active_1uh9r_45`,itemIcon:`_itemIcon_1uh9r_76`,itemLabel:`_itemLabel_1uh9r_84`};exports.default=e;
+var e={switcher:`_switcher_xusgc_3`,item:`_item_xusgc_14`,active:`_active_xusgc_41`,itemIcon:`_itemIcon_xusgc_72`,itemLabel:`_itemLabel_xusgc_80`};exports.default=e;
 //# sourceMappingURL=ViewSwitcher.module.css.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcher.module.css.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.module.css"],"sourcesContent":["/* ─── Container ────────────────────────────────────────────────────────────── */\n\n.switcher {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  padding: 3px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: color-mix(\n    in srgb,\n    var(--gnome-headerbar-bg-color, #ebebeb) 75%,\n    black 25%\n  );\n}\n\n/* ─── Item ─────────────────────────────────────────────────────────────────── */\n\n.item {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 5px var(--gnome-space-2, 12px);\n  border-radius: calc(var(--gnome-radius-pill) - 3px);\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  white-space: nowrap;\n\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    color            var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.item:hover:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.06);\n}\n\n.item:active:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n\n.item:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n.item:focus-visible {\n  box-shadow:\n    0 0 0 var(--gnome-focus-ring-offset, 2px)\n      color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%),\n    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/* ─── Active item ──────────────────────────────────────────────────────────── */\n\n.active {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Icon ─────────────────────────────────────────────────────────────────── */\n\n.itemIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label ────────────────────────────────────────────────────────────────── */\n\n.itemLabel {\n  line-height: var(--gnome-line-height-body, 1.5);\n}\n\n/* ─── Dark mode ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switcher {\n    background-color: color-mix(\n      in srgb,\n      var(--gnome-headerbar-bg-color, #303030) 70%,\n      black 30%\n    );\n  }\n\n  .item:hover:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  .item:active:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.14);\n  }\n\n  .active {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .item {\n    transition: none;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ViewSwitcher.module.css.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.module.css"],"sourcesContent":["/* ─── Container ────────────────────────────────────────────────────────────── */\n\n.switcher {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  padding: 3px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%);\n}\n\n/* ─── Item ─────────────────────────────────────────────────────────────────── */\n\n.item {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 5px var(--gnome-space-2, 12px);\n  border-radius: calc(var(--gnome-radius-pill) - 3px);\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  white-space: nowrap;\n\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.item:hover:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.06);\n}\n\n.item:active:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n\n.item:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n.item:focus-visible {\n  box-shadow:\n    0 0 0 var(--gnome-focus-ring-offset, 2px)\n    color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%),\n    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/* ─── Active item ──────────────────────────────────────────────────────────── */\n\n.active {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Icon ─────────────────────────────────────────────────────────────────── */\n\n.itemIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label ────────────────────────────────────────────────────────────────── */\n\n.itemLabel {\n  line-height: var(--gnome-line-height-body, 1.5);\n}\n\n/* ─── Dark mode ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switcher {\n    background-color: color-mix(in srgb, var(--gnome-headerbar-bg-color, #303030) 70%, black 30%);\n  }\n\n  .item:hover:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  .item:active:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.14);\n  }\n\n  .active {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .item {\n    transition: none;\n  }\n}\n"],"mappings":""}

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

@@ -1,9 +1,9 @@
 var e = {
-	switcher: "_switcher_1uh9r_3",
-	item: "_item_1uh9r_18",
-	active: "_active_1uh9r_45",
-	itemIcon: "_itemIcon_1uh9r_76",
-	itemLabel: "_itemLabel_1uh9r_84"
+	switcher: "_switcher_xusgc_3",
+	item: "_item_xusgc_14",
+	active: "_active_xusgc_41",
+	itemIcon: "_itemIcon_xusgc_72",
+	itemLabel: "_itemLabel_xusgc_80"
 };
 //#endregion
 export { e as default };

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

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcher.module.css.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.module.css"],"sourcesContent":["/* ─── Container ────────────────────────────────────────────────────────────── */\n\n.switcher {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  padding: 3px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: color-mix(\n    in srgb,\n    var(--gnome-headerbar-bg-color, #ebebeb) 75%,\n    black 25%\n  );\n}\n\n/* ─── Item ─────────────────────────────────────────────────────────────────── */\n\n.item {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 5px var(--gnome-space-2, 12px);\n  border-radius: calc(var(--gnome-radius-pill) - 3px);\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  white-space: nowrap;\n\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    color            var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.item:hover:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.06);\n}\n\n.item:active:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n\n.item:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n.item:focus-visible {\n  box-shadow:\n    0 0 0 var(--gnome-focus-ring-offset, 2px)\n      color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%),\n    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/* ─── Active item ──────────────────────────────────────────────────────────── */\n\n.active {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Icon ─────────────────────────────────────────────────────────────────── */\n\n.itemIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label ────────────────────────────────────────────────────────────────── */\n\n.itemLabel {\n  line-height: var(--gnome-line-height-body, 1.5);\n}\n\n/* ─── Dark mode ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switcher {\n    background-color: color-mix(\n      in srgb,\n      var(--gnome-headerbar-bg-color, #303030) 70%,\n      black 30%\n    );\n  }\n\n  .item:hover:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  .item:active:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.14);\n  }\n\n  .active {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .item {\n    transition: none;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ViewSwitcher.module.css.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.module.css"],"sourcesContent":["/* ─── Container ────────────────────────────────────────────────────────────── */\n\n.switcher {\n  display: inline-flex;\n  align-items: center;\n  gap: 2px;\n  padding: 3px;\n  border-radius: var(--gnome-radius-pill);\n  background-color: color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%);\n}\n\n/* ─── Item ─────────────────────────────────────────────────────────────────── */\n\n.item {\n  appearance: none;\n  -webkit-appearance: none;\n  border: none;\n  background: transparent;\n  font: inherit;\n  cursor: pointer;\n  outline: none;\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--gnome-space-1, 6px);\n  padding: 5px var(--gnome-space-2, 12px);\n  border-radius: calc(var(--gnome-radius-pill) - 3px);\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  white-space: nowrap;\n\n  transition:\n    background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n    color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.item:hover:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.06);\n}\n\n.item:active:not(:disabled):not(.active) {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n\n.item:disabled {\n  opacity: var(--gnome-opacity-disabled, 0.5);\n  cursor: not-allowed;\n}\n\n.item:focus-visible {\n  box-shadow:\n    0 0 0 var(--gnome-focus-ring-offset, 2px)\n    color-mix(in srgb, var(--gnome-headerbar-bg-color, #ebebeb) 75%, black 25%),\n    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/* ─── Active item ──────────────────────────────────────────────────────────── */\n\n.active {\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  font-weight: var(--gnome-font-weight-semibold, 600);\n  box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n}\n\n/* ─── Icon ─────────────────────────────────────────────────────────────────── */\n\n.itemIcon {\n  display: flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n/* ─── Label ────────────────────────────────────────────────────────────────── */\n\n.itemLabel {\n  line-height: var(--gnome-line-height-body, 1.5);\n}\n\n/* ─── Dark mode ────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .switcher {\n    background-color: color-mix(in srgb, var(--gnome-headerbar-bg-color, #303030) 70%, black 30%);\n  }\n\n  .item:hover:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n\n  .item:active:not(:disabled):not(.active) {\n    background-color: rgba(255, 255, 255, 0.14);\n  }\n\n  .active {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n  }\n}\n\n/* ─── Reduced motion ───────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .item {\n    transition: none;\n  }\n}\n"],"mappings":""}

package/dist/components/ViewSwitcher/ViewSwitcherItem.cjs

@@ -1,2 +1,2 @@
-const e=require(`../Icon/Icon.cjs`),t=require(`./ViewSwitcher.module.css.cjs`);let n=require(`react/jsx-runtime`);function r({label:r,icon:i,active:a=!1,className:o,disabled:s,...c}){return(0,n.jsxs)(`button`,{type:`button`,role:`radio`,"aria-checked":a,tabIndex:a?0:-1,disabled:s,className:[t.default.item,a?t.default.active:null,o].filter(Boolean).join(` `),...c,children:[i&&(0,n.jsx)(`span`,{className:t.default.itemIcon,children:(0,n.jsx)(e.Icon,{icon:i,size:`md`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.itemLabel,children:r})]})}exports.ViewSwitcherItem=r;
+const e=require("../Icon/Icon.cjs"),t=require("./ViewSwitcher.module.css.cjs");let n=require("react/jsx-runtime");var r=({label:r,icon:i,active:a=!1,className:o,disabled:s,...c})=>(0,n.jsxs)(`button`,{type:`button`,role:`radio`,"aria-checked":a,tabIndex:a?0:-1,disabled:s,className:[t.default.item,a?t.default.active:null,o].filter(Boolean).join(` `),...c,children:[i&&(0,n.jsx)(`span`,{className:t.default.itemIcon,children:(0,n.jsx)(e.Icon,{icon:i,size:`md`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.itemLabel,children:r})]});exports.ViewSwitcherItem=r;
 //# sourceMappingURL=ViewSwitcherItem.cjs.map

package/dist/components/ViewSwitcher/ViewSwitcherItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherItem.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\nimport type { IconDefinition } from \"@gnome-ui/icons\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./ViewSwitcher.module.css\";\n\nexport interface ViewSwitcherItemProps\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Display label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this item as the currently active view. */\n  active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport function ViewSwitcherItem({\n  label,\n  icon,\n  active = false,\n  className,\n  disabled,\n  ...props\n}: ViewSwitcherItemProps) {\n  return (\n    <button\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={active}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[\n        styles.item,\n        active ? styles.active : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.itemIcon}>\n          <Icon icon={icon} size=\"md\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.itemLabel}>{label}</span>\n    </button>\n  );\n}\n"],"mappings":"kHAoBA,SAAgB,EAAiB,CAC/B,QACA,OACA,SAAS,GACT,YACA,WACA,GAAG,GACqB,CACxB,OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,KAAK,QACL,eAAc,EACd,SAAU,EAAS,EAAI,GACb,WACV,UAAW,CACT,EAAA,QAAO,KACP,EAAS,EAAA,QAAO,OAAS,KACzB,EACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,WAbN,CAeG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,GAAc,CAAA,CACrC,CAAA,EAET,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBAAY,EAAa,CAAA,CAC1C"}
+{"version":3,"file":"ViewSwitcherItem.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Display label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this item as the currently active view. */\n  active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport const ViewSwitcherItem = ({\n  label,\n  icon,\n  active = false,\n  className,\n  disabled,\n  ...props\n}: ViewSwitcherItemProps) => {\n  return (\n    <button\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={active}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[styles.item, active ? styles.active : null, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.itemIcon}>\n          <Icon icon={icon} size=\"md\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.itemLabel}>{label}</span>\n    </button>\n  );\n};\n"],"mappings":"kHAqBA,IAAa,GAAoB,CAC/B,QACA,OACA,SAAS,GACT,YACA,WACA,GAAG,MAGD,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,KAAK,QACL,eAAc,EACd,SAAU,EAAS,EAAI,GACb,WACV,UAAW,CAAC,EAAA,QAAO,KAAM,EAAS,EAAA,QAAO,OAAS,KAAM,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC3F,GAAI,WAPN,CASG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,EAAa,CAAA,CACrC,CAAA,GAER,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBAAY,CAAY,CAAA,CAC1C"}

package/dist/components/ViewSwitcher/ViewSwitcherItem.d.ts

@@ -1,5 +1,5 @@
-import { ButtonHTMLAttributes } from 'react';
 import { IconDefinition } from '@gnome-ui/icons';
+import { ButtonHTMLAttributes } from 'react';
 export interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     /** Display label. */
     label: string;
@@ -13,4 +13,4 @@ export interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonEl
  *
  * Renders as `role="radio"` so the group has proper radiogroup semantics.
  */
-export declare function ViewSwitcherItem({ label, icon, active, className, disabled, ...props }: ViewSwitcherItemProps): import("react/jsx-runtime").JSX.Element;
+export declare const ViewSwitcherItem: ({ label, icon, active, className, disabled, ...props }: ViewSwitcherItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ViewSwitcher/ViewSwitcherItem.js

@@ -2,32 +2,30 @@ import { Icon as e } from "../Icon/Icon.js";
 import t from "./ViewSwitcher.module.css.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/ViewSwitcher/ViewSwitcherItem.tsx
-function i({ label: i, icon: a, active: o = !1, className: s, disabled: c, ...l }) {
-	return /* @__PURE__ */ r("button", {
-		type: "button",
-		role: "radio",
-		"aria-checked": o,
-		tabIndex: o ? 0 : -1,
-		disabled: c,
-		className: [
-			t.item,
-			o ? t.active : null,
-			s
-		].filter(Boolean).join(" "),
-		...l,
-		children: [a && /* @__PURE__ */ n("span", {
-			className: t.itemIcon,
-			children: /* @__PURE__ */ n(e, {
-				icon: a,
-				size: "md",
-				"aria-hidden": !0
-			})
-		}), /* @__PURE__ */ n("span", {
-			className: t.itemLabel,
-			children: i
-		})]
-	});
-}
+var i = ({ label: i, icon: a, active: o = !1, className: s, disabled: c, ...l }) => /* @__PURE__ */ r("button", {
+	type: "button",
+	role: "radio",
+	"aria-checked": o,
+	tabIndex: o ? 0 : -1,
+	disabled: c,
+	className: [
+		t.item,
+		o ? t.active : null,
+		s
+	].filter(Boolean).join(" "),
+	...l,
+	children: [a && /* @__PURE__ */ n("span", {
+		className: t.itemIcon,
+		children: /* @__PURE__ */ n(e, {
+			icon: a,
+			size: "md",
+			"aria-hidden": !0
+		})
+	}), /* @__PURE__ */ n("span", {
+		className: t.itemLabel,
+		children: i
+	})]
+});
 //#endregion
 export { i as ViewSwitcherItem };
 

package/dist/components/ViewSwitcher/ViewSwitcherItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherItem.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from \"react\";\nimport type { IconDefinition } from \"@gnome-ui/icons\";\nimport { Icon } from \"../Icon\";\nimport styles from \"./ViewSwitcher.module.css\";\n\nexport interface ViewSwitcherItemProps\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Display label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this item as the currently active view. */\n  active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport function ViewSwitcherItem({\n  label,\n  icon,\n  active = false,\n  className,\n  disabled,\n  ...props\n}: ViewSwitcherItemProps) {\n  return (\n    <button\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={active}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[\n        styles.item,\n        active ? styles.active : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(\" \")}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.itemIcon}>\n          <Icon icon={icon} size=\"md\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.itemLabel}>{label}</span>\n    </button>\n  );\n}\n"],"mappings":";;;;AAoBA,SAAgB,EAAiB,EAC/B,UACA,SACA,YAAS,IACT,cACA,aACA,GAAG,KACqB;AACxB,QACE,kBAAC,UAAD;EACE,MAAK;EACL,MAAK;EACL,gBAAc;EACd,UAAU,IAAS,IAAI;EACb;EACV,WAAW;GACT,EAAO;GACP,IAAS,EAAO,SAAS;GACzB;GACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;YAbN,CAeG,KACC,kBAAC,QAAD;GAAM,WAAW,EAAO;aACtB,kBAAC,GAAD;IAAY;IAAM,MAAK;IAAK,eAAA;IAAc,CAAA;GACrC,CAAA,EAET,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAY;GAAa,CAAA,CAC1C"}
+{"version":3,"file":"ViewSwitcherItem.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Display label. */\n  label: string;\n  /** Optional icon from `@gnome-ui/icons`. */\n  icon?: IconDefinition;\n  /** Marks this item as the currently active view. */\n  active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport const ViewSwitcherItem = ({\n  label,\n  icon,\n  active = false,\n  className,\n  disabled,\n  ...props\n}: ViewSwitcherItemProps) => {\n  return (\n    <button\n      type=\"button\"\n      role=\"radio\"\n      aria-checked={active}\n      tabIndex={active ? 0 : -1}\n      disabled={disabled}\n      className={[styles.item, active ? styles.active : null, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {icon && (\n        <span className={styles.itemIcon}>\n          <Icon icon={icon} size=\"md\" aria-hidden />\n        </span>\n      )}\n      <span className={styles.itemLabel}>{label}</span>\n    </button>\n  );\n};\n"],"mappings":";;;;AAqBA,IAAa,KAAoB,EAC/B,UACA,SACA,YAAS,IACT,cACA,aACA,GAAG,QAGD,kBAAC,UAAD;CACE,MAAK;CACL,MAAK;CACL,gBAAc;CACd,UAAU,IAAS,IAAI;CACb;CACV,WAAW;EAAC,EAAO;EAAM,IAAS,EAAO,SAAS;EAAM;CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAC3F,GAAI;WAPN,CASG,KACC,kBAAC,QAAD;EAAM,WAAW,EAAO;YACtB,kBAAC,GAAD;GAAY;GAAM,MAAK;GAAK,eAAA;EAAa,CAAA;CACrC,CAAA,GAER,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAY;CAAY,CAAA,CAC1C"}

package/dist/components/ViewSwitcher/index.d.ts

@@ -1,4 +1,4 @@
-export { ViewSwitcher } from './ViewSwitcher';
 export type { ViewSwitcherProps } from './ViewSwitcher';
-export { ViewSwitcherItem } from './ViewSwitcherItem';
+export { ViewSwitcher } from './ViewSwitcher';
 export type { ViewSwitcherItemProps } from './ViewSwitcherItem';
+export { ViewSwitcherItem } from './ViewSwitcherItem';

package/dist/components/ViewSwitcher.cjs

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

package/dist/components/ViewSwitcherBar/ViewSwitcherBar.cjs

@@ -1,2 +1,2 @@
-const e=require(`./ViewSwitcherBar.module.css.cjs`);let t=require(`react/jsx-runtime`);function n({children:n,reveal:r=!0,className:i,...a}){return r?(0,t.jsx)(`div`,{role:`navigation`,"aria-label":`Bottom navigation`,className:[e.default.bar,i].filter(Boolean).join(` `),...a,children:n}):null}exports.ViewSwitcherBar=n;
+const e=require("./ViewSwitcherBar.module.css.cjs");let t=require("react/jsx-runtime");var n=({children:n,reveal:r=!0,className:i,...a})=>r?(0,t.jsx)(`div`,{role:`navigation`,"aria-label":`Bottom navigation`,className:[e.default.bar,i].filter(Boolean).join(` `),...a,children:n}):null;exports.ViewSwitcherBar=n;
 //# sourceMappingURL=ViewSwitcherBar.cjs.map

package/dist/components/ViewSwitcherBar/ViewSwitcherBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherBar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./ViewSwitcherBar.module.css\";\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * `ViewSwitcherItem` elements to render in the bottom bar.\n   * Use the same items you pass to the header-bar `ViewSwitcher`.\n   */\n  children: ReactNode;\n  /**\n   * Whether the bar is visible.\n   * Typically tied to `useBreakpoint().isMedium` so it appears\n   * automatically when the window is ≤ 550 px wide.\n   */\n  reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n *   <HeaderBar\n *     title={\n *       !isMedium && (\n *         <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n *       )\n *     }\n *   />\n *   <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport function ViewSwitcherBar({\n  children,\n  reveal = true,\n  className,\n  ...props\n}: ViewSwitcherBarProps) {\n  if (!reveal) return null;\n\n  return (\n    <div\n      role=\"navigation\"\n      aria-label=\"Bottom navigation\"\n      className={[styles.bar, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":"uFAwCA,SAAgB,EAAgB,CAC9B,WACA,SAAS,GACT,YACA,GAAG,GACoB,CAGvB,OAFK,GAGH,EAAA,EAAA,KAAC,MAAD,CACE,KAAK,aACL,aAAW,oBACX,UAAW,CAAC,EAAA,QAAO,IAAK,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,CAC5D,GAAI,EAEH,WACG,CAAA,CAVY"}
+{"version":3,"file":"ViewSwitcherBar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ViewSwitcherBar.module.css';\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * `ViewSwitcherItem` elements to render in the bottom bar.\n   * Use the same items you pass to the header-bar `ViewSwitcher`.\n   */\n  children: ReactNode;\n  /**\n   * Whether the bar is visible.\n   * Typically tied to `useBreakpoint().isMedium` so it appears\n   * automatically when the window is ≤ 550 px wide.\n   */\n  reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n *   <HeaderBar\n *     title={\n *       !isMedium && (\n *         <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n *       )\n *     }\n *   />\n *   <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport const ViewSwitcherBar = ({\n  children,\n  reveal = true,\n  className,\n  ...props\n}: ViewSwitcherBarProps) => {\n  if (!reveal) {\n    return null;\n  }\n\n  return (\n    <div\n      role=\"navigation\"\n      aria-label=\"Bottom navigation\"\n      className={[styles.bar, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":"uFAyCA,IAAa,GAAmB,CAC9B,WACA,SAAS,GACT,YACA,GAAG,KAEE,GAKH,EAAA,EAAA,KAAC,MAAD,CACE,KAAK,aACL,aAAW,oBACX,UAAW,CAAC,EAAA,QAAO,IAAK,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC3D,GAAI,EAEH,UACE,CAAA,EAXE"}

package/dist/components/ViewSwitcherBar/ViewSwitcherBar.d.ts

@@ -35,4 +35,4 @@ export interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {
  *
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html
  */
-export declare function ViewSwitcherBar({ children, reveal, className, ...props }: ViewSwitcherBarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const ViewSwitcherBar: ({ children, reveal, className, ...props }: ViewSwitcherBarProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ViewSwitcherBar/ViewSwitcherBar.js

@@ -1,15 +1,13 @@
 import e from "./ViewSwitcherBar.module.css.js";
 import { jsx as t } from "react/jsx-runtime";
 //#region src/components/ViewSwitcherBar/ViewSwitcherBar.tsx
-function n({ children: n, reveal: r = !0, className: i, ...a }) {
-	return r ? /* @__PURE__ */ t("div", {
-		role: "navigation",
-		"aria-label": "Bottom navigation",
-		className: [e.bar, i].filter(Boolean).join(" "),
-		...a,
-		children: n
-	}) : null;
-}
+var n = ({ children: n, reveal: r = !0, className: i, ...a }) => r ? /* @__PURE__ */ t("div", {
+	role: "navigation",
+	"aria-label": "Bottom navigation",
+	className: [e.bar, i].filter(Boolean).join(" "),
+	...a,
+	children: n
+}) : null;
 //#endregion
 export { n as ViewSwitcherBar };
 

package/dist/components/ViewSwitcherBar/ViewSwitcherBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherBar.js","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport styles from \"./ViewSwitcherBar.module.css\";\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * `ViewSwitcherItem` elements to render in the bottom bar.\n   * Use the same items you pass to the header-bar `ViewSwitcher`.\n   */\n  children: ReactNode;\n  /**\n   * Whether the bar is visible.\n   * Typically tied to `useBreakpoint().isMedium` so it appears\n   * automatically when the window is ≤ 550 px wide.\n   */\n  reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n *   <HeaderBar\n *     title={\n *       !isMedium && (\n *         <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n *       )\n *     }\n *   />\n *   <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport function ViewSwitcherBar({\n  children,\n  reveal = true,\n  className,\n  ...props\n}: ViewSwitcherBarProps) {\n  if (!reveal) return null;\n\n  return (\n    <div\n      role=\"navigation\"\n      aria-label=\"Bottom navigation\"\n      className={[styles.bar, className].filter(Boolean).join(\" \")}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;AAwCA,SAAgB,EAAgB,EAC9B,aACA,YAAS,IACT,cACA,GAAG,KACoB;AAGvB,QAFK,IAGH,kBAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,WAAW,CAAC,EAAO,KAAK,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAC5D,GAAI;EAEH;EACG,CAAA,GAVY"}
+{"version":3,"file":"ViewSwitcherBar.js","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ViewSwitcherBar.module.css';\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * `ViewSwitcherItem` elements to render in the bottom bar.\n   * Use the same items you pass to the header-bar `ViewSwitcher`.\n   */\n  children: ReactNode;\n  /**\n   * Whether the bar is visible.\n   * Typically tied to `useBreakpoint().isMedium` so it appears\n   * automatically when the window is ≤ 550 px wide.\n   */\n  reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n *   <HeaderBar\n *     title={\n *       !isMedium && (\n *         <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n *       )\n *     }\n *   />\n *   <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport const ViewSwitcherBar = ({\n  children,\n  reveal = true,\n  className,\n  ...props\n}: ViewSwitcherBarProps) => {\n  if (!reveal) {\n    return null;\n  }\n\n  return (\n    <div\n      role=\"navigation\"\n      aria-label=\"Bottom navigation\"\n      className={[styles.bar, className].filter(Boolean).join(' ')}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;AAyCA,IAAa,KAAmB,EAC9B,aACA,YAAS,IACT,cACA,GAAG,QAEE,IAKH,kBAAC,OAAD;CACE,MAAK;CACL,cAAW;CACX,WAAW,CAAC,EAAO,KAAK,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAC3D,GAAI;CAEH;AACE,CAAA,IAXE"}

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

@@ -1,2 +1,2 @@
-var e={bar:`_bar_njcvu_3`};exports.default=e;
+var e={bar:`_bar_kfy6h_3`};exports.default=e;
 //# sourceMappingURL=ViewSwitcherBar.module.css.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherBar.module.css.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.module.css"],"sourcesContent":["/* ─── Bottom bar ─────────────────────────────────────────────────────────────── */\n\n.bar {\n  display: flex;\n  align-items: stretch;\n\n  width: 100%;\n  min-height: 52px;\n\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-top: 1px solid var(--gnome-headerbar-shade-color, rgba(0, 0, 0, 0.12));\n\n  /* Safe-area inset for mobile browsers */\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n/* Each child (ViewSwitcherItem) fills equal width */\n.bar > * {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n\n  /* Override the horizontal pill style from ViewSwitcherItem */\n  border-radius: 0 !important;\n  padding: 6px 4px !important;\n  font-size: var(--gnome-font-size-caption, 0.8125rem) !important;\n  min-height: 52px;\n}\n\n/* ─── Dark mode ──────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .bar {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    border-top-color: rgba(0, 0, 0, 0.3);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ViewSwitcherBar.module.css.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.module.css"],"sourcesContent":["/* ─── Bottom bar ─────────────────────────────────────────────────────────────── */\n\n.bar {\n  display: flex;\n  align-items: stretch;\n\n  width: 100%;\n  min-height: 52px;\n\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-top: 1px solid var(--gnome-headerbar-shade-color, rgba(0, 0, 0, 0.12));\n\n  /* Safe-area inset for mobile browsers */\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n/* Each child (ViewSwitcherItem) fills equal width */\n.bar > * {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n\n  /* Override the horizontal pill style from ViewSwitcherItem */\n  border-radius: 0;\n  padding: 6px 4px;\n  font-size: var(--gnome-font-size-caption, 0.8125rem);\n  min-height: 52px;\n}\n\n/* ─── Dark mode ──────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .bar {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    border-top-color: rgba(0, 0, 0, 0.3);\n  }\n}\n"],"mappings":""}

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

@@ -1,4 +1,4 @@
-var e = { bar: "_bar_njcvu_3" };
+var e = { bar: "_bar_kfy6h_3" };
 //#endregion
 export { e as default };
 

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

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherBar.module.css.js","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.module.css"],"sourcesContent":["/* ─── Bottom bar ─────────────────────────────────────────────────────────────── */\n\n.bar {\n  display: flex;\n  align-items: stretch;\n\n  width: 100%;\n  min-height: 52px;\n\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-top: 1px solid var(--gnome-headerbar-shade-color, rgba(0, 0, 0, 0.12));\n\n  /* Safe-area inset for mobile browsers */\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n/* Each child (ViewSwitcherItem) fills equal width */\n.bar > * {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n\n  /* Override the horizontal pill style from ViewSwitcherItem */\n  border-radius: 0 !important;\n  padding: 6px 4px !important;\n  font-size: var(--gnome-font-size-caption, 0.8125rem) !important;\n  min-height: 52px;\n}\n\n/* ─── Dark mode ──────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .bar {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    border-top-color: rgba(0, 0, 0, 0.3);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"ViewSwitcherBar.module.css.js","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.module.css"],"sourcesContent":["/* ─── Bottom bar ─────────────────────────────────────────────────────────────── */\n\n.bar {\n  display: flex;\n  align-items: stretch;\n\n  width: 100%;\n  min-height: 52px;\n\n  background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n  border-top: 1px solid var(--gnome-headerbar-shade-color, rgba(0, 0, 0, 0.12));\n\n  /* Safe-area inset for mobile browsers */\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n}\n\n/* Each child (ViewSwitcherItem) fills equal width */\n.bar > * {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n\n  /* Override the horizontal pill style from ViewSwitcherItem */\n  border-radius: 0;\n  padding: 6px 4px;\n  font-size: var(--gnome-font-size-caption, 0.8125rem);\n  min-height: 52px;\n}\n\n/* ─── Dark mode ──────────────────────────────────────────────────────────────── */\n\n@media (prefers-color-scheme: dark) {\n  .bar {\n    background-color: var(--gnome-headerbar-bg-color, #303030);\n    border-top-color: rgba(0, 0, 0, 0.3);\n  }\n}\n"],"mappings":""}

package/dist/components/ViewSwitcherBar/index.d.ts

@@ -1,2 +1,2 @@
-export { ViewSwitcherBar } from './ViewSwitcherBar';
 export type { ViewSwitcherBarProps } from './ViewSwitcherBar';
+export { ViewSwitcherBar } from './ViewSwitcherBar';

package/dist/components/ViewSwitcherBar.cjs

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

package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.cjs

@@ -1,2 +1,2 @@
-const e=require(`./ViewSwitcherSidebar.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);var r=(0,t.createContext)(null);function i(){let e=(0,t.useContext)(r);if(!e)throw Error(`ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar`);return e}function a({value:i,onValueChange:a,"aria-label":o=`Views`,collapsed:s=!1,header:c,footer:l,showHeaderSeparator:u=!0,showFooterSeparator:d=!0,children:f,className:p,...m}){let h=(0,t.useRef)(null);function g(e){let t=Array.from(h.current?.querySelectorAll(`[role=radio]:not(:disabled)`)??[]),n=t.findIndex(e=>e===document.activeElement);if(n===-1)return;let r=n;if(e.key===`ArrowDown`||e.key===`ArrowRight`)r=(n+1)%t.length;else if(e.key===`ArrowUp`||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(),t[r].click()}return(0,n.jsx)(r.Provider,{value:{value:i,onValueChange:a,collapsed:s},children:(0,n.jsxs)(`nav`,{className:[e.default.sidebar,s?e.default.sidebarCollapsed:null,u?null:e.default.noHeaderSeparator,d?null:e.default.noFooterSeparator,p].filter(Boolean).join(` `),onKeyDown:g,...m,children:[c&&(0,n.jsx)(`div`,{className:e.default.header,children:c}),(0,n.jsx)(`ul`,{ref:h,role:`radiogroup`,"aria-label":o,className:e.default.list,children:f}),l&&(0,n.jsx)(`div`,{className:e.default.footer,children:l})]})})}exports.ViewSwitcherSidebar=a,exports.useViewSwitcherSidebar=i;
+const e=require("./ViewSwitcherSidebar.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=(0,t.createContext)(null);function i(){let e=(0,t.useContext)(r);if(!e)throw Error(`ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar`);return e}var a=({value:i,onValueChange:a,"aria-label":o=`Views`,collapsed:s=!1,header:c,footer:l,showHeaderSeparator:u=!0,showFooterSeparator:d=!0,children:f,className:p,...m})=>{let h=(0,t.useRef)(null);function g(e){let t=Array.from(h.current?.querySelectorAll(`[role=radio]:not(:disabled)`)??[]),n=document.activeElement,r=n instanceof HTMLButtonElement?t.indexOf(n):-1;if(r===-1)return;let i=r;if(e.key===`ArrowDown`||e.key===`ArrowRight`)i=(r+1)%t.length;else if(e.key===`ArrowUp`||e.key===`ArrowLeft`)i=(r-1+t.length)%t.length;else if(e.key===`Home`)i=0;else if(e.key===`End`)i=t.length-1;else return;e.preventDefault(),t[i].focus(),t[i].click()}return(0,n.jsx)(r.Provider,{value:{value:i,onValueChange:a,collapsed:s},children:(0,n.jsxs)(`nav`,{className:[e.default.sidebar,s?e.default.sidebarCollapsed:null,u?null:e.default.noHeaderSeparator,d?null:e.default.noFooterSeparator,p].filter(Boolean).join(` `),onKeyDown:g,...m,children:[c&&(0,n.jsx)(`div`,{className:e.default.header,children:c}),(0,n.jsx)(`ul`,{ref:h,role:`radiogroup`,"aria-label":o,className:e.default.list,children:f}),l&&(0,n.jsx)(`div`,{className:e.default.footer,children:l})]})})};exports.ViewSwitcherSidebar=a,exports.useViewSwitcherSidebar=i;
 //# sourceMappingURL=ViewSwitcherSidebar.cjs.map

package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherSidebar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherSidebar/ViewSwitcherSidebar.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./ViewSwitcherSidebar.module.css\";\n\n// ─── Context ──────────────────────────────────────────────────────────────────\n\ninterface ViewSwitcherSidebarContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n  collapsed: boolean;\n}\n\nconst ViewSwitcherSidebarContext =\n  createContext<ViewSwitcherSidebarContextValue | null>(null);\n\nexport function useViewSwitcherSidebar() {\n  const ctx = useContext(ViewSwitcherSidebarContext);\n  if (!ctx)\n    throw new Error(\n      \"ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar\",\n    );\n  return ctx;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {\n  /** Name of the currently active view. */\n  value: string;\n  /** Called with the new view name when the user selects an item. */\n  onValueChange: (value: string) => void;\n  /** Accessible label for the group. Defaults to `\"Views\"`. */\n  \"aria-label\"?: string;\n  /**\n   * When `true`, items render icon-only (labels hidden) and the sidebar\n   * shrinks to its compact width. Used by `AdaptiveLayout` on tablet viewports.\n   */\n  collapsed?: boolean;\n  /** Rendered above the scrollable item list (e.g. user card). */\n  header?: ReactNode;\n  /** Rendered below the scrollable item list (e.g. collapse toggle). */\n  footer?: ReactNode;\n  /** Show the separator line below the header slot. Defaults to `true`. */\n  showHeaderSeparator?: boolean;\n  /** Show the separator line above the footer slot. Defaults to `true`. */\n  showFooterSeparator?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Sidebar-style view switcher for apps with more than 4 top-level views,\n * or when the sidebar layout fits better than a header-bar `ViewSwitcher`.\n *\n * Mirrors `AdwViewSwitcherSidebar` (libadwaita 1.9 / GNOME 50), the modern\n * replacement for `GtkStackSidebar`.\n *\n * Compose with `ViewSwitcherSidebarItem` for each view. The active item is\n * highlighted with the accent colour; keyboard ↑ / ↓ cycles through items.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherSidebar.html\n *\n * @example\n * ```tsx\n * <ViewSwitcherSidebar value={view} onValueChange={setView}>\n *   <ViewSwitcherSidebarItem name=\"photos\" label=\"Photos\" icon={MediaPlay} />\n *   <ViewSwitcherSidebarItem name=\"albums\" label=\"Albums\" icon={Star} count={12} />\n * </ViewSwitcherSidebar>\n * ```\n */\nexport function ViewSwitcherSidebar({\n  value,\n  onValueChange,\n  \"aria-label\": ariaLabel = \"Views\",\n  collapsed = false,\n  header,\n  footer,\n  showHeaderSeparator = true,\n  showFooterSeparator = true,\n  children,\n  className,\n  ...props\n}: ViewSwitcherSidebarProps) {\n  const groupRef = useRef<HTMLUListElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=radio]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = items.findIndex((el) => el === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\")\n      next = (idx + 1) % items.length;\n    else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\")\n      next = (idx - 1 + items.length) % items.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = items.length - 1;\n    else return;\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <ViewSwitcherSidebarContext.Provider value={{ value, onValueChange, collapsed }}>\n      <nav\n        className={[\n          styles.sidebar,\n          collapsed ? styles.sidebarCollapsed : null,\n          !showHeaderSeparator ? styles.noHeaderSeparator : null,\n          !showFooterSeparator ? styles.noFooterSeparator : null,\n          className,\n        ].filter(Boolean).join(\" \")}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {header && <div className={styles.header}>{header}</div>}\n        <ul\n          ref={groupRef}\n          role=\"radiogroup\"\n          aria-label={ariaLabel}\n          className={styles.list}\n        >\n          {children}\n        </ul>\n        {footer && <div className={styles.footer}>{footer}</div>}\n      </nav>\n    </ViewSwitcherSidebarContext.Provider>\n  );\n}\n"],"mappings":"8GAkBA,IAAM,GAAA,EAAA,EAAA,eACkD,KAAK,CAE7D,SAAgB,GAAyB,CACvC,IAAM,GAAA,EAAA,EAAA,YAAiB,EAA2B,CAClD,GAAI,CAAC,EACH,MAAU,MACR,kEACD,CACH,OAAO,EAgDT,SAAgB,EAAoB,CAClC,QACA,gBACA,aAAc,EAAY,QAC1B,YAAY,GACZ,SACA,SACA,sBAAsB,GACtB,sBAAsB,GACtB,WACA,YACA,GAAG,GACwB,CAC3B,IAAM,GAAA,EAAA,EAAA,QAAoC,KAAK,CAE/C,SAAS,EAAc,EAA+B,CACpD,IAAM,EAAQ,MAAM,KAClB,EAAS,SAAS,iBAChB,8BACD,EAAI,EAAE,CACR,CACK,EAAM,EAAM,UAAW,GAAO,IAAO,SAAS,cAAc,CAClE,GAAI,IAAQ,GAAI,OAEhB,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,aAAe,EAAE,MAAQ,aACrC,GAAQ,EAAM,GAAK,EAAM,eAClB,EAAE,MAAQ,WAAa,EAAE,MAAQ,YACxC,GAAQ,EAAM,EAAI,EAAM,QAAU,EAAM,eACjC,EAAE,MAAQ,OAAQ,EAAO,UACzB,EAAE,MAAQ,MAAO,EAAO,EAAM,OAAS,OAC3C,OAEL,EAAE,gBAAgB,CAClB,EAAM,GAAM,OAAO,CACnB,EAAM,GAAM,OAAO,CAGrB,OACE,EAAA,EAAA,KAAC,EAA2B,SAA5B,CAAqC,MAAO,CAAE,QAAO,gBAAe,YAAW,WAC7E,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CACT,EAAA,QAAO,QACP,EAAY,EAAA,QAAO,iBAAmB,KACrC,EAAiD,KAA3B,EAAA,QAAO,kBAC7B,EAAiD,KAA3B,EAAA,QAAO,kBAC9B,EACD,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,CAC3B,UAAW,EACX,GAAI,WATN,CAWG,IAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,EAAa,CAAA,EACxD,EAAA,EAAA,KAAC,KAAD,CACE,IAAK,EACL,KAAK,aACL,aAAY,EACZ,UAAW,EAAA,QAAO,KAEjB,WACE,CAAA,CACJ,IAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,EAAa,CAAA,CACpD,GAC8B,CAAA"}
+{"version":3,"file":"ViewSwitcherSidebar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherSidebar/ViewSwitcherSidebar.tsx"],"sourcesContent":["import {\n  createContext,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n  useContext,\n  useRef,\n} from 'react';\n\nimport styles from './ViewSwitcherSidebar.module.css';\n\n// ─── Context ──────────────────────────────────────────────────────────────────\n\ninterface ViewSwitcherSidebarContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n  collapsed: boolean;\n}\n\nconst ViewSwitcherSidebarContext = createContext<ViewSwitcherSidebarContextValue | null>(null);\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useViewSwitcherSidebar() {\n  const ctx = useContext(ViewSwitcherSidebarContext);\n\n  if (!ctx) {\n    throw new Error('ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar');\n  }\n\n  return ctx;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {\n  /** Name of the currently active view. */\n  value: string;\n  /** Called with the new view name when the user selects an item. */\n  onValueChange: (value: string) => void;\n  /** Accessible label for the group. Defaults to `\"Views\"`. */\n  'aria-label'?: string;\n  /**\n   * When `true`, items render icon-only (labels hidden) and the sidebar\n   * shrinks to its compact width. Used by `AdaptiveLayout` on tablet viewports.\n   */\n  collapsed?: boolean;\n  /** Rendered above the scrollable item list (e.g. user card). */\n  header?: ReactNode;\n  /** Rendered below the scrollable item list (e.g. collapse toggle). */\n  footer?: ReactNode;\n  /** Show the separator line below the header slot. Defaults to `true`. */\n  showHeaderSeparator?: boolean;\n  /** Show the separator line above the footer slot. Defaults to `true`. */\n  showFooterSeparator?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Sidebar-style view switcher for apps with more than 4 top-level views,\n * or when the sidebar layout fits better than a header-bar `ViewSwitcher`.\n *\n * Mirrors `AdwViewSwitcherSidebar` (libadwaita 1.9 / GNOME 50), the modern\n * replacement for `GtkStackSidebar`.\n *\n * Compose with `ViewSwitcherSidebarItem` for each view. The active item is\n * highlighted with the accent colour; keyboard ↑ / ↓ cycles through items.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherSidebar.html\n *\n * @example\n * ```tsx\n * <ViewSwitcherSidebar value={view} onValueChange={setView}>\n *   <ViewSwitcherSidebarItem name=\"photos\" label=\"Photos\" icon={MediaPlay} />\n *   <ViewSwitcherSidebarItem name=\"albums\" label=\"Albums\" icon={Star} count={12} />\n * </ViewSwitcherSidebar>\n * ```\n */\nexport const ViewSwitcherSidebar = ({\n  value,\n  onValueChange,\n  'aria-label': ariaLabel = 'Views',\n  collapsed = false,\n  header,\n  footer,\n  showHeaderSeparator = true,\n  showFooterSeparator = true,\n  children,\n  className,\n  ...props\n}: ViewSwitcherSidebarProps) => {\n  const groupRef = useRef<HTMLUListElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n    );\n    const activeElement = document.activeElement;\n    const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n    if (idx === -1) {\n      return;\n    }\n\n    let next = idx;\n    if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\n      next = (idx + 1) % items.length;\n    } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {\n      next = (idx - 1 + items.length) % items.length;\n    } else if (e.key === 'Home') {\n      next = 0;\n    } else if (e.key === 'End') {\n      next = items.length - 1;\n    } else {\n      return;\n    }\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <ViewSwitcherSidebarContext.Provider value={{ value, onValueChange, collapsed }}>\n      <nav\n        className={[\n          styles.sidebar,\n          collapsed ? styles.sidebarCollapsed : null,\n          !showHeaderSeparator ? styles.noHeaderSeparator : null,\n          !showFooterSeparator ? styles.noFooterSeparator : null,\n          className,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {header && <div className={styles.header}>{header}</div>}\n        <ul ref={groupRef} role=\"radiogroup\" aria-label={ariaLabel} className={styles.list}>\n          {children}\n        </ul>\n        {footer && <div className={styles.footer}>{footer}</div>}\n      </nav>\n    </ViewSwitcherSidebarContext.Provider>\n  );\n};\n"],"mappings":"8GAmBA,IAAM,GAAA,EAAA,EAAA,eAAmF,IAAI,EAG7F,SAAgB,GAAyB,CACvC,IAAM,GAAA,EAAA,EAAA,YAAiB,CAA0B,EAEjD,GAAI,CAAC,EACH,MAAU,MAAM,iEAAiE,EAGnF,OAAO,CACT,CA+CA,IAAa,GAAuB,CAClC,QACA,gBACA,aAAc,EAAY,QAC1B,YAAY,GACZ,SACA,SACA,sBAAsB,GACtB,sBAAsB,GACtB,WACA,YACA,GAAG,KAC2B,CAC9B,IAAM,GAAA,EAAA,EAAA,QAAoC,IAAI,EAE9C,SAAS,EAAc,EAA+B,CACpD,IAAM,EAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,GAAK,CAAC,CAC3F,EACM,EAAgB,SAAS,cACzB,EAAM,aAAyB,kBAAoB,EAAM,QAAQ,CAAa,EAAI,GAExF,GAAI,IAAQ,GACV,OAGF,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,aAAe,EAAE,MAAQ,aACrC,GAAQ,EAAM,GAAK,EAAM,YACpB,GAAI,EAAE,MAAQ,WAAa,EAAE,MAAQ,YAC1C,GAAQ,EAAM,EAAI,EAAM,QAAU,EAAM,YACnC,GAAI,EAAE,MAAQ,OACnB,EAAO,OACF,GAAI,EAAE,MAAQ,MACnB,EAAO,EAAM,OAAS,OAEtB,OAGF,EAAE,eAAe,EACjB,EAAM,GAAM,MAAM,EAClB,EAAM,GAAM,MAAM,CACpB,CAEA,OACE,EAAA,EAAA,KAAC,EAA2B,SAA5B,CAAqC,MAAO,CAAE,QAAO,gBAAe,WAAU,YAC5E,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CACT,EAAA,QAAO,QACP,EAAY,EAAA,QAAO,iBAAmB,KACrC,EAAiD,KAA3B,EAAA,QAAO,kBAC7B,EAAiD,KAA3B,EAAA,QAAO,kBAC9B,CACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG,EACX,UAAW,EACX,GAAI,WAXN,CAaG,IAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,CAAY,CAAA,GACvD,EAAA,EAAA,KAAC,KAAD,CAAI,IAAK,EAAU,KAAK,aAAa,aAAY,EAAW,UAAW,EAAA,QAAO,KAC3E,UACC,CAAA,EACH,IAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,CAAY,CAAA,CACpD,GAC8B,CAAA,CAEzC"}

package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.d.ts

@@ -11,7 +11,7 @@ export interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {
     /** Called with the new view name when the user selects an item. */
     onValueChange: (value: string) => void;
     /** Accessible label for the group. Defaults to `"Views"`. */
-    "aria-label"?: string;
+    'aria-label'?: string;
     /**
      * When `true`, items render icon-only (labels hidden) and the sidebar
      * shrinks to its compact width. Used by `AdaptiveLayout` on tablet viewports.
@@ -47,5 +47,5 @@ export interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {
  * </ViewSwitcherSidebar>
  * ```
  */
-export declare function ViewSwitcherSidebar({ value, onValueChange, "aria-label": ariaLabel, collapsed, header, footer, showHeaderSeparator, showFooterSeparator, children, className, ...props }: ViewSwitcherSidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare const ViewSwitcherSidebar: ({ value, onValueChange, "aria-label": ariaLabel, collapsed, header, footer, showHeaderSeparator, showFooterSeparator, children, className, ...props }: ViewSwitcherSidebarProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.js

@@ -8,18 +8,18 @@ function s() {
 	if (!e) throw Error("ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar");
 	return e;
 }
-function c({ value: t, onValueChange: n, "aria-label": s = "Views", collapsed: c = !1, header: l, footer: u, showHeaderSeparator: d = !0, showFooterSeparator: f = !0, children: p, className: m, ...h }) {
+var c = ({ value: t, onValueChange: n, "aria-label": s = "Views", collapsed: c = !1, header: l, footer: u, showHeaderSeparator: d = !0, showFooterSeparator: f = !0, children: p, className: m, ...h }) => {
 	let g = r(null);
 	function _(e) {
-		let t = Array.from(g.current?.querySelectorAll("[role=radio]:not(:disabled)") ?? []), n = t.findIndex((e) => e === document.activeElement);
-		if (n === -1) return;
-		let r = n;
-		if (e.key === "ArrowDown" || e.key === "ArrowRight") r = (n + 1) % t.length;
-		else if (e.key === "ArrowUp" || 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;
+		let t = Array.from(g.current?.querySelectorAll("[role=radio]:not(:disabled)") ?? []), n = document.activeElement, r = n instanceof HTMLButtonElement ? t.indexOf(n) : -1;
+		if (r === -1) return;
+		let i = r;
+		if (e.key === "ArrowDown" || e.key === "ArrowRight") i = (r + 1) % t.length;
+		else if (e.key === "ArrowUp" || e.key === "ArrowLeft") i = (r - 1 + t.length) % t.length;
+		else if (e.key === "Home") i = 0;
+		else if (e.key === "End") i = t.length - 1;
 		else return;
-		e.preventDefault(), t[r].focus(), t[r].click();
+		e.preventDefault(), t[i].focus(), t[i].click();
 	}
 	return /* @__PURE__ */ i(o.Provider, {
 		value: {
@@ -56,7 +56,7 @@ function c({ value: t, onValueChange: n, "aria-label": s = "Views", collapsed: c
 			]
 		})
 	});
-}
+};
 //#endregion
 export { c as ViewSwitcherSidebar, s as useViewSwitcherSidebar };
 

package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewSwitcherSidebar.js","names":[],"sources":["../../../src/components/ViewSwitcherSidebar/ViewSwitcherSidebar.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useRef,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport styles from \"./ViewSwitcherSidebar.module.css\";\n\n// ─── Context ──────────────────────────────────────────────────────────────────\n\ninterface ViewSwitcherSidebarContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n  collapsed: boolean;\n}\n\nconst ViewSwitcherSidebarContext =\n  createContext<ViewSwitcherSidebarContextValue | null>(null);\n\nexport function useViewSwitcherSidebar() {\n  const ctx = useContext(ViewSwitcherSidebarContext);\n  if (!ctx)\n    throw new Error(\n      \"ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar\",\n    );\n  return ctx;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {\n  /** Name of the currently active view. */\n  value: string;\n  /** Called with the new view name when the user selects an item. */\n  onValueChange: (value: string) => void;\n  /** Accessible label for the group. Defaults to `\"Views\"`. */\n  \"aria-label\"?: string;\n  /**\n   * When `true`, items render icon-only (labels hidden) and the sidebar\n   * shrinks to its compact width. Used by `AdaptiveLayout` on tablet viewports.\n   */\n  collapsed?: boolean;\n  /** Rendered above the scrollable item list (e.g. user card). */\n  header?: ReactNode;\n  /** Rendered below the scrollable item list (e.g. collapse toggle). */\n  footer?: ReactNode;\n  /** Show the separator line below the header slot. Defaults to `true`. */\n  showHeaderSeparator?: boolean;\n  /** Show the separator line above the footer slot. Defaults to `true`. */\n  showFooterSeparator?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Sidebar-style view switcher for apps with more than 4 top-level views,\n * or when the sidebar layout fits better than a header-bar `ViewSwitcher`.\n *\n * Mirrors `AdwViewSwitcherSidebar` (libadwaita 1.9 / GNOME 50), the modern\n * replacement for `GtkStackSidebar`.\n *\n * Compose with `ViewSwitcherSidebarItem` for each view. The active item is\n * highlighted with the accent colour; keyboard ↑ / ↓ cycles through items.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherSidebar.html\n *\n * @example\n * ```tsx\n * <ViewSwitcherSidebar value={view} onValueChange={setView}>\n *   <ViewSwitcherSidebarItem name=\"photos\" label=\"Photos\" icon={MediaPlay} />\n *   <ViewSwitcherSidebarItem name=\"albums\" label=\"Albums\" icon={Star} count={12} />\n * </ViewSwitcherSidebar>\n * ```\n */\nexport function ViewSwitcherSidebar({\n  value,\n  onValueChange,\n  \"aria-label\": ariaLabel = \"Views\",\n  collapsed = false,\n  header,\n  footer,\n  showHeaderSeparator = true,\n  showFooterSeparator = true,\n  children,\n  className,\n  ...props\n}: ViewSwitcherSidebarProps) {\n  const groupRef = useRef<HTMLUListElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>(\n        \"[role=radio]:not(:disabled)\",\n      ) ?? [],\n    );\n    const idx = items.findIndex((el) => el === document.activeElement);\n    if (idx === -1) return;\n\n    let next = idx;\n    if (e.key === \"ArrowDown\" || e.key === \"ArrowRight\")\n      next = (idx + 1) % items.length;\n    else if (e.key === \"ArrowUp\" || e.key === \"ArrowLeft\")\n      next = (idx - 1 + items.length) % items.length;\n    else if (e.key === \"Home\") next = 0;\n    else if (e.key === \"End\") next = items.length - 1;\n    else return;\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <ViewSwitcherSidebarContext.Provider value={{ value, onValueChange, collapsed }}>\n      <nav\n        className={[\n          styles.sidebar,\n          collapsed ? styles.sidebarCollapsed : null,\n          !showHeaderSeparator ? styles.noHeaderSeparator : null,\n          !showFooterSeparator ? styles.noFooterSeparator : null,\n          className,\n        ].filter(Boolean).join(\" \")}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {header && <div className={styles.header}>{header}</div>}\n        <ul\n          ref={groupRef}\n          role=\"radiogroup\"\n          aria-label={ariaLabel}\n          className={styles.list}\n        >\n          {children}\n        </ul>\n        {footer && <div className={styles.footer}>{footer}</div>}\n      </nav>\n    </ViewSwitcherSidebarContext.Provider>\n  );\n}\n"],"mappings":";;;;AAkBA,IAAM,IACJ,EAAsD,KAAK;AAE7D,SAAgB,IAAyB;CACvC,IAAM,IAAM,EAAW,EAA2B;AAClD,KAAI,CAAC,EACH,OAAU,MACR,kEACD;AACH,QAAO;;AAgDT,SAAgB,EAAoB,EAClC,UACA,kBACA,cAAc,IAAY,SAC1B,eAAY,IACZ,WACA,WACA,yBAAsB,IACtB,yBAAsB,IACtB,aACA,cACA,GAAG,KACwB;CAC3B,IAAM,IAAW,EAAyB,KAAK;CAE/C,SAAS,EAAc,GAA+B;EACpD,IAAM,IAAQ,MAAM,KAClB,EAAS,SAAS,iBAChB,8BACD,IAAI,EAAE,CACR,EACK,IAAM,EAAM,WAAW,MAAO,MAAO,SAAS,cAAc;AAClE,MAAI,MAAQ,GAAI;EAEhB,IAAI,IAAO;AACX,MAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,aACrC,MAAQ,IAAM,KAAK,EAAM;WAClB,EAAE,QAAQ,aAAa,EAAE,QAAQ,YACxC,MAAQ,IAAM,IAAI,EAAM,UAAU,EAAM;WACjC,EAAE,QAAQ,OAAQ,KAAO;WACzB,EAAE,QAAQ,MAAO,KAAO,EAAM,SAAS;MAC3C;AAIL,EAFA,EAAE,gBAAgB,EAClB,EAAM,GAAM,OAAO,EACnB,EAAM,GAAM,OAAO;;AAGrB,QACE,kBAAC,EAA2B,UAA5B;EAAqC,OAAO;GAAE;GAAO;GAAe;GAAW;YAC7E,kBAAC,OAAD;GACE,WAAW;IACT,EAAO;IACP,IAAY,EAAO,mBAAmB;IACrC,IAAiD,OAA3B,EAAO;IAC7B,IAAiD,OAA3B,EAAO;IAC9B;IACD,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;GAC3B,WAAW;GACX,GAAI;aATN;IAWG,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAS;KAAa,CAAA;IACxD,kBAAC,MAAD;KACE,KAAK;KACL,MAAK;KACL,cAAY;KACZ,WAAW,EAAO;KAEjB;KACE,CAAA;IACJ,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAS;KAAa,CAAA;IACpD;;EAC8B,CAAA"}
+{"version":3,"file":"ViewSwitcherSidebar.js","names":[],"sources":["../../../src/components/ViewSwitcherSidebar/ViewSwitcherSidebar.tsx"],"sourcesContent":["import {\n  createContext,\n  type HTMLAttributes,\n  type KeyboardEvent,\n  type ReactNode,\n  useContext,\n  useRef,\n} from 'react';\n\nimport styles from './ViewSwitcherSidebar.module.css';\n\n// ─── Context ──────────────────────────────────────────────────────────────────\n\ninterface ViewSwitcherSidebarContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n  collapsed: boolean;\n}\n\nconst ViewSwitcherSidebarContext = createContext<ViewSwitcherSidebarContextValue | null>(null);\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useViewSwitcherSidebar() {\n  const ctx = useContext(ViewSwitcherSidebarContext);\n\n  if (!ctx) {\n    throw new Error('ViewSwitcherSidebarItem must be used inside ViewSwitcherSidebar');\n  }\n\n  return ctx;\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport interface ViewSwitcherSidebarProps extends HTMLAttributes<HTMLElement> {\n  /** Name of the currently active view. */\n  value: string;\n  /** Called with the new view name when the user selects an item. */\n  onValueChange: (value: string) => void;\n  /** Accessible label for the group. Defaults to `\"Views\"`. */\n  'aria-label'?: string;\n  /**\n   * When `true`, items render icon-only (labels hidden) and the sidebar\n   * shrinks to its compact width. Used by `AdaptiveLayout` on tablet viewports.\n   */\n  collapsed?: boolean;\n  /** Rendered above the scrollable item list (e.g. user card). */\n  header?: ReactNode;\n  /** Rendered below the scrollable item list (e.g. collapse toggle). */\n  footer?: ReactNode;\n  /** Show the separator line below the header slot. Defaults to `true`. */\n  showHeaderSeparator?: boolean;\n  /** Show the separator line above the footer slot. Defaults to `true`. */\n  showFooterSeparator?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Sidebar-style view switcher for apps with more than 4 top-level views,\n * or when the sidebar layout fits better than a header-bar `ViewSwitcher`.\n *\n * Mirrors `AdwViewSwitcherSidebar` (libadwaita 1.9 / GNOME 50), the modern\n * replacement for `GtkStackSidebar`.\n *\n * Compose with `ViewSwitcherSidebarItem` for each view. The active item is\n * highlighted with the accent colour; keyboard ↑ / ↓ cycles through items.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherSidebar.html\n *\n * @example\n * ```tsx\n * <ViewSwitcherSidebar value={view} onValueChange={setView}>\n *   <ViewSwitcherSidebarItem name=\"photos\" label=\"Photos\" icon={MediaPlay} />\n *   <ViewSwitcherSidebarItem name=\"albums\" label=\"Albums\" icon={Star} count={12} />\n * </ViewSwitcherSidebar>\n * ```\n */\nexport const ViewSwitcherSidebar = ({\n  value,\n  onValueChange,\n  'aria-label': ariaLabel = 'Views',\n  collapsed = false,\n  header,\n  footer,\n  showHeaderSeparator = true,\n  showFooterSeparator = true,\n  children,\n  className,\n  ...props\n}: ViewSwitcherSidebarProps) => {\n  const groupRef = useRef<HTMLUListElement>(null);\n\n  function handleKeyDown(e: KeyboardEvent<HTMLElement>) {\n    const items = Array.from(\n      groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n    );\n    const activeElement = document.activeElement;\n    const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n    if (idx === -1) {\n      return;\n    }\n\n    let next = idx;\n    if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\n      next = (idx + 1) % items.length;\n    } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {\n      next = (idx - 1 + items.length) % items.length;\n    } else if (e.key === 'Home') {\n      next = 0;\n    } else if (e.key === 'End') {\n      next = items.length - 1;\n    } else {\n      return;\n    }\n\n    e.preventDefault();\n    items[next].focus();\n    items[next].click();\n  }\n\n  return (\n    <ViewSwitcherSidebarContext.Provider value={{ value, onValueChange, collapsed }}>\n      <nav\n        className={[\n          styles.sidebar,\n          collapsed ? styles.sidebarCollapsed : null,\n          !showHeaderSeparator ? styles.noHeaderSeparator : null,\n          !showFooterSeparator ? styles.noFooterSeparator : null,\n          className,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        onKeyDown={handleKeyDown}\n        {...props}\n      >\n        {header && <div className={styles.header}>{header}</div>}\n        <ul ref={groupRef} role=\"radiogroup\" aria-label={ariaLabel} className={styles.list}>\n          {children}\n        </ul>\n        {footer && <div className={styles.footer}>{footer}</div>}\n      </nav>\n    </ViewSwitcherSidebarContext.Provider>\n  );\n};\n"],"mappings":";;;;AAmBA,IAAM,IAA6B,EAAsD,IAAI;AAG7F,SAAgB,IAAyB;CACvC,IAAM,IAAM,EAAW,CAA0B;CAEjD,IAAI,CAAC,GACH,MAAU,MAAM,iEAAiE;CAGnF,OAAO;AACT;AA+CA,IAAa,KAAuB,EAClC,UACA,kBACA,cAAc,IAAY,SAC1B,eAAY,IACZ,WACA,WACA,yBAAsB,IACtB,yBAAsB,IACtB,aACA,cACA,GAAG,QAC2B;CAC9B,IAAM,IAAW,EAAyB,IAAI;CAE9C,SAAS,EAAc,GAA+B;EACpD,IAAM,IAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,KAAK,CAAC,CAC3F,GACM,IAAgB,SAAS,eACzB,IAAM,aAAyB,oBAAoB,EAAM,QAAQ,CAAa,IAAI;EAExF,IAAI,MAAQ,IACV;EAGF,IAAI,IAAO;EACX,IAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,cACrC,KAAQ,IAAM,KAAK,EAAM;OACpB,IAAI,EAAE,QAAQ,aAAa,EAAE,QAAQ,aAC1C,KAAQ,IAAM,IAAI,EAAM,UAAU,EAAM;OACnC,IAAI,EAAE,QAAQ,QACnB,IAAO;OACF,IAAI,EAAE,QAAQ,OACnB,IAAO,EAAM,SAAS;OAEtB;EAKF,AAFA,EAAE,eAAe,GACjB,EAAM,GAAM,MAAM,GAClB,EAAM,GAAM,MAAM;CACpB;CAEA,OACE,kBAAC,EAA2B,UAA5B;EAAqC,OAAO;GAAE;GAAO;GAAe;EAAU;YAC5E,kBAAC,OAAD;GACE,WAAW;IACT,EAAO;IACP,IAAY,EAAO,mBAAmB;IACrC,IAAiD,OAA3B,EAAO;IAC7B,IAAiD,OAA3B,EAAO;IAC9B;GACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG;GACX,WAAW;GACX,GAAI;aAXN;IAaG,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAS;IAAY,CAAA;IACvD,kBAAC,MAAD;KAAI,KAAK;KAAU,MAAK;KAAa,cAAY;KAAW,WAAW,EAAO;KAC3E;IACC,CAAA;IACH,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAS;IAAY,CAAA;GACpD;;CAC8B,CAAA;AAEzC"}

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

@@ -1,2 +1,2 @@
-var e={sidebar:`_sidebar_1q4xz_3`,sidebarCollapsed:`_sidebarCollapsed_1q4xz_15`,itemBtn:`_itemBtn_1q4xz_19`,header:`_header_1q4xz_26`,footer:`_footer_1q4xz_31`,noHeaderSeparator:`_noHeaderSeparator_1q4xz_36`,noFooterSeparator:`_noFooterSeparator_1q4xz_40`,list:`_list_1q4xz_46`,item:`_item_1q4xz_19`,active:`_active_1q4xz_92`,itemIcon:`_itemIcon_1q4xz_138`,itemLabel:`_itemLabel_1q4xz_151`,itemSuffix:`_itemSuffix_1q4xz_161`,count:`_count_1q4xz_168`};exports.default=e;
+var e={sidebar:`_sidebar_1pj3d_3`,sidebarCollapsed:`_sidebarCollapsed_1pj3d_15`,itemBtn:`_itemBtn_1pj3d_19`,header:`_header_1pj3d_26`,footer:`_footer_1pj3d_31`,noHeaderSeparator:`_noHeaderSeparator_1pj3d_36`,noFooterSeparator:`_noFooterSeparator_1pj3d_40`,list:`_list_1pj3d_46`,item:`_item_1pj3d_19`,active:`_active_1pj3d_92`,itemIcon:`_itemIcon_1pj3d_130`,itemLabel:`_itemLabel_1pj3d_143`,itemSuffix:`_itemSuffix_1pj3d_153`,count:`_count_1pj3d_160`};exports.default=e;
 //# sourceMappingURL=ViewSwitcherSidebar.module.css.cjs.map