@gnome-ui/react 1.45.1 → 1.46.0

package/dist/components/Dropdown/Dropdown.js

@@ -1,149 +1,153 @@
 import { Icon as e } from "../Icon/Icon.js";
 import t from "./Dropdown.module.css.js";
-import { useCallback as n, useEffect as r, useId as i, useRef as a, useState as o } from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { Check as l, PanDown as u } from "@gnome-ui/icons";
+import { useCallback as n, useEffect as r, useId as i, useLayoutEffect as a, useRef as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Check as u, PanDown as d } from "@gnome-ui/icons";
 //#region src/components/Dropdown/Dropdown.tsx
-function d({ options: d, value: f, onChange: p, placeholder: m = "Select an option", disabled: h, className: g, ..._ }) {
-	let [v, y] = o(!1), [b, x] = o(-1), [S, C] = o(!1), w = i(), T = i(), E = a(null), D = a(null), O = d.find((e) => e.value === f), k = n(() => {
-		if (!E.current) return;
-		let e = E.current.getBoundingClientRect(), t = window.innerHeight - e.bottom, n = Math.min(d.length * 48 + 8, 280);
-		C(t < n && e.top > n);
-	}, [d.length]), A = n(() => {
-		if (h) return;
-		k(), y(!0);
-		let e = d.findIndex((e) => e.value === f && !e.disabled);
-		x(e >= 0 ? e : d.findIndex((e) => !e.disabled));
+var f = ({ options: f, value: p, onChange: m, placeholder: h = "Select an option", disabled: g, className: _, ...v }) => {
+	let [y, b] = s(!1), [x, S] = s(-1), [C, w] = s(!1), T = i(), E = i(), D = o(null), O = o(null), k = f.find((e) => e.value === p), A = n(() => {
+		if (!D.current) return;
+		let e = D.current.getBoundingClientRect(), t = window.innerHeight - e.bottom, n = Math.min(f.length * 48 + 8, 280);
+		w(t < n && e.top > n);
+	}, [f.length]), j = n(() => {
+		if (g) return;
+		A(), b(!0);
+		let e = f.findIndex((e) => e.value === p && !e.disabled);
+		S(e >= 0 ? e : f.findIndex((e) => !e.disabled));
 	}, [
-		h,
-		k,
-		d,
-		f
-	]), j = n(() => {
-		y(!1), x(-1), E.current?.focus();
-	}, []), M = n((e) => {
-		e.disabled || (p?.(e.value), j());
-	}, [p, j]);
-	r(() => {
-		!v || b < 0 || !D.current || D.current.children[b]?.scrollIntoView({ block: "nearest" });
-	}, [b, v]), r(() => {
-		if (!v) return;
+		g,
+		A,
+		f,
+		p
+	]), M = n(() => {
+		b(!1), S(-1), D.current?.focus();
+	}, []), N = n((e) => {
+		e.disabled || (m?.(e.value), M());
+	}, [m, M]);
+	a(() => {
+		if (!y || !D.current || !O.current) return;
+		let e = D.current.getBoundingClientRect(), t = O.current.offsetHeight;
+		w(window.innerHeight - e.bottom < t && e.top > t);
+	}, [y]), r(() => {
+		!y || x < 0 || !O.current || O.current.children[x]?.scrollIntoView({ block: "nearest" });
+	}, [x, y]), r(() => {
+		if (!y) return;
 		let e = (e) => {
-			!E.current?.contains(e.target) && !D.current?.contains(e.target) && j();
+			!D.current?.contains(e.target) && !O.current?.contains(e.target) && M();
 		};
 		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-	}, [v, j]);
-	let N = n((e) => {
+	}, [y, M]);
+	let P = n((e) => {
 		switch (e.key) {
 			case "Enter":
 			case " ":
 			case "ArrowDown":
-				e.preventDefault(), A();
+				e.preventDefault(), j();
 				break;
 			case "ArrowUp":
-				e.preventDefault(), k(), y(!0), x(d.reduce((e, t, n) => t.disabled ? e : n, -1));
+				e.preventDefault(), A(), b(!0), S(f.reduce((e, t, n) => t.disabled ? e : n, -1));
 				break;
 		}
 	}, [
+		j,
 		A,
-		k,
-		d
-	]), P = n((e) => {
-		let t = d.map((e, t) => ({
+		f
+	]), F = n((e) => {
+		let t = f.map((e, t) => ({
 			o: e,
 			i: t
-		})).filter(({ o: e }) => !e.disabled).map(({ i: e }) => e), n = t.indexOf(b);
+		})).filter(({ o: e }) => !e.disabled).map(({ i: e }) => e), n = t.indexOf(x);
 		switch (e.key) {
 			case "ArrowDown": {
 				e.preventDefault();
 				let r = t[Math.min(n + 1, t.length - 1)];
-				x(r ?? b);
+				S(r ?? x);
 				break;
 			}
 			case "ArrowUp": {
 				e.preventDefault();
 				let r = t[Math.max(n - 1, 0)];
-				x(r ?? b);
+				S(r ?? x);
 				break;
 			}
 			case "Home":
-				e.preventDefault(), x(t[0] ?? -1);
+				e.preventDefault(), S(t[0] ?? -1);
 				break;
 			case "End":
-				e.preventDefault(), x(t[t.length - 1] ?? -1);
+				e.preventDefault(), S(t[t.length - 1] ?? -1);
 				break;
 			case "Enter":
 			case " ":
-				e.preventDefault(), b >= 0 && M(d[b]);
+				e.preventDefault(), x >= 0 && N(f[x]);
 				break;
 			case "Escape":
 			case "Tab":
-				j();
+				M();
 				break;
 		}
 	}, [
-		d,
-		b,
-		M,
-		j
+		f,
+		x,
+		N,
+		M
 	]);
-	return /* @__PURE__ */ c("div", {
-		className: [t.wrapper, g].filter(Boolean).join(" "),
-		..._,
-		children: [/* @__PURE__ */ c("button", {
-			ref: E,
-			id: w,
+	return /* @__PURE__ */ l("div", {
+		className: [t.wrapper, _].filter(Boolean).join(" "),
+		...v,
+		children: [/* @__PURE__ */ l("button", {
+			ref: D,
+			id: T,
 			type: "button",
 			role: "combobox",
 			"aria-haspopup": "listbox",
-			"aria-expanded": v,
-			"aria-controls": T,
-			"aria-activedescendant": v && b >= 0 ? `${T}-opt-${b}` : void 0,
-			disabled: h,
-			className: [t.trigger, v ? t.triggerOpen : null].filter(Boolean).join(" "),
-			onClick: () => v ? j() : A(),
-			onKeyDown: N,
-			children: [/* @__PURE__ */ s("span", {
-				className: [t.triggerLabel, O ? null : t.placeholder].filter(Boolean).join(" "),
-				children: O?.label ?? m
-			}), /* @__PURE__ */ s(e, {
-				icon: u,
+			"aria-expanded": y,
+			"aria-controls": E,
+			"aria-activedescendant": y && x >= 0 ? `${E}-opt-${x}` : void 0,
+			disabled: g,
+			className: [t.trigger, y ? t.triggerOpen : null].filter(Boolean).join(" "),
+			onClick: () => y ? M() : j(),
+			onKeyDown: P,
+			children: [/* @__PURE__ */ c("span", {
+				className: [t.triggerLabel, k ? null : t.placeholder].filter(Boolean).join(" "),
+				children: k?.label ?? h
+			}), /* @__PURE__ */ c(e, {
+				icon: d,
 				size: "md",
 				"aria-hidden": !0,
-				className: [t.chevron, v ? t.chevronOpen : null].filter(Boolean).join(" ")
+				className: [t.chevron, y ? t.chevronOpen : null].filter(Boolean).join(" ")
 			})]
-		}), v && /* @__PURE__ */ s("ul", {
-			ref: D,
-			id: T,
+		}), y && /* @__PURE__ */ c("ul", {
+			ref: O,
+			id: E,
 			role: "listbox",
-			"aria-labelledby": w,
+			"aria-labelledby": T,
 			tabIndex: -1,
-			className: [t.list, S ? t.listUp : t.listDown].filter(Boolean).join(" "),
-			onKeyDown: P,
-			children: d.map((n, r) => /* @__PURE__ */ c("li", {
-				id: `${T}-opt-${r}`,
+			className: [t.list, C ? t.listUp : t.listDown].filter(Boolean).join(" "),
+			onKeyDown: F,
+			children: f.map((n, r) => /* @__PURE__ */ l("li", {
+				id: `${E}-opt-${r}`,
 				role: "option",
-				"aria-selected": n.value === f,
+				"aria-selected": n.value === p,
 				"aria-disabled": n.disabled,
 				className: [
 					t.option,
-					n.value === f ? t.optionSelected : null,
-					r === b ? t.optionActive : null,
+					n.value === p ? t.optionSelected : null,
+					r === x ? t.optionActive : null,
 					n.disabled ? t.optionDisabled : null
 				].filter(Boolean).join(" "),
-				onMouseEnter: () => !n.disabled && x(r),
-				onClick: () => M(n),
-				children: [/* @__PURE__ */ c("span", {
+				onMouseEnter: () => !n.disabled && S(r),
+				onClick: () => N(n),
+				children: [/* @__PURE__ */ l("span", {
 					className: t.optionText,
-					children: [/* @__PURE__ */ s("span", {
+					children: [/* @__PURE__ */ c("span", {
 						className: t.optionLabel,
 						children: n.label
-					}), n.description && /* @__PURE__ */ s("span", {
+					}), n.description && /* @__PURE__ */ c("span", {
 						className: t.optionDesc,
 						children: n.description
 					})]
-				}), n.value === f && /* @__PURE__ */ s(e, {
-					icon: l,
+				}), n.value === p && /* @__PURE__ */ c(e, {
+					icon: u,
 					size: "md",
 					"aria-hidden": !0,
 					className: t.checkIcon
@@ -151,8 +155,8 @@ function d({ options: d, value: f, onChange: p, placeholder: m = "Select an opti
 			}, n.value))
 		})]
 	});
-}
+};
 //#endregion
-export { d as Dropdown };
+export { f as Dropdown };
 
 //# sourceMappingURL=Dropdown.js.map

package/dist/components/Dropdown/Dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.js","names":[],"sources":["../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { Check, PanDown } from '@gnome-ui/icons';\nimport {\n  type HTMLAttributes,\n  type KeyboardEvent,\n  useCallback,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Dropdown.module.css';\n\nexport interface DropdownOption<V extends string = string> {\n  /** The value submitted / returned on selection. */\n  value: V;\n  /** Display label shown in the list and trigger. */\n  label: string;\n  /** Optional descriptive text shown below the label. */\n  description?: string;\n  /** Whether the option is selectable. */\n  disabled?: boolean;\n}\n\nexport interface DropdownProps<V extends string = string>\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  /** The list of selectable options. */\n  options: DropdownOption<V>[];\n  /** The currently selected value. */\n  value?: V;\n  /** Called when the user selects an option. */\n  onChange?: (value: V) => void;\n  /** Placeholder shown when no option is selected. */\n  placeholder?: string;\n  /** Accessible label for the control (used as `aria-label`). */\n  'aria-label'?: string;\n  /** Disables the entire control. */\n  disabled?: boolean;\n}\n\n/**\n * Expandable option list following the Adwaita combo-row / drop-down pattern.\n *\n * - Fully keyboard-navigable: Space/Enter opens; ↑/↓ navigate; Enter selects; Escape closes.\n * - Uses `role=\"combobox\"` + `role=\"listbox\"` + `role=\"option\"` ARIA pattern.\n * - Closes when clicking outside or pressing Escape.\n * - The list flips above the trigger when there is not enough space below.\n *\n * @see https://developer.gnome.org/hig/patterns/controls/drop-down-lists.html\n */\nexport function Dropdown<V extends string = string>({\n  options,\n  value,\n  onChange,\n  placeholder = 'Select an option',\n  disabled,\n  className,\n  ...props\n}: DropdownProps<V>) {\n  const [open, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number>(-1);\n  const [flipUp, setFlipUp] = useState(false);\n\n  const triggerId = useId();\n  const listboxId = useId();\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n\n  const selected = options.find((o) => o.value === value);\n\n  // Compute flip direction when opening\n  const computeFlip = useCallback(() => {\n    if (!triggerRef.current) {\n      return;\n    }\n\n    const rect = triggerRef.current.getBoundingClientRect();\n    const spaceBelow = window.innerHeight - rect.bottom;\n    const listH = Math.min(options.length * 48 + 8, 280);\n\n    setFlipUp(spaceBelow < listH && rect.top > listH);\n  }, [options.length]);\n\n  const openList = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n\n    computeFlip();\n    setOpen(true);\n    const idx = options.findIndex((o) => o.value === value && !o.disabled);\n\n    setActiveIndex(idx >= 0 ? idx : options.findIndex((o) => !o.disabled));\n  }, [disabled, computeFlip, options, value]);\n\n  const closeList = useCallback(() => {\n    setOpen(false);\n    setActiveIndex(-1);\n    triggerRef.current?.focus();\n  }, []);\n\n  const selectOption = useCallback(\n    (opt: DropdownOption<V>) => {\n      if (opt.disabled) {\n        return;\n      }\n\n      onChange?.(opt.value);\n      closeList();\n    },\n    [onChange, closeList],\n  );\n\n  // Scroll active item into view\n  useEffect(() => {\n    if (!open || activeIndex < 0 || !listRef.current) {\n      return;\n    }\n\n    const item = listRef.current.children[activeIndex] as HTMLElement | undefined;\n\n    item?.scrollIntoView({ block: 'nearest' });\n  }, [activeIndex, open]);\n\n  // Close on outside click\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n\n    const handler = (e: MouseEvent) => {\n      if (\n        !triggerRef.current?.contains(e.target as Node) &&\n        !listRef.current?.contains(e.target as Node)\n      ) {\n        closeList();\n      }\n    };\n\n    document.addEventListener('mousedown', handler);\n\n    return () => document.removeEventListener('mousedown', handler);\n  }, [open, closeList]);\n\n  // Trigger keyboard handler\n  const handleTriggerKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLButtonElement>) => {\n      switch (e.key) {\n        case 'Enter':\n        case ' ':\n        case 'ArrowDown':\n          e.preventDefault();\n          openList();\n          break;\n        case 'ArrowUp':\n          e.preventDefault();\n          computeFlip();\n          setOpen(true);\n          setActiveIndex(options.reduce((last, o, i) => (!o.disabled ? i : last), -1));\n          break;\n      }\n    },\n    [openList, computeFlip, options],\n  );\n\n  // Listbox keyboard handler\n  const handleListKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLUListElement>) => {\n      const enabledIndexes = options\n        .map((o, i) => ({ o, i }))\n        .filter(({ o }) => !o.disabled)\n        .map(({ i }) => i);\n\n      const currentPos = enabledIndexes.indexOf(activeIndex);\n\n      switch (e.key) {\n        case 'ArrowDown': {\n          e.preventDefault();\n          const next = enabledIndexes[Math.min(currentPos + 1, enabledIndexes.length - 1)];\n\n          setActiveIndex(next ?? activeIndex);\n          break;\n        }\n        case 'ArrowUp': {\n          e.preventDefault();\n          const prev = enabledIndexes[Math.max(currentPos - 1, 0)];\n\n          setActiveIndex(prev ?? activeIndex);\n          break;\n        }\n        case 'Home':\n          e.preventDefault();\n          setActiveIndex(enabledIndexes[0] ?? -1);\n          break;\n        case 'End':\n          e.preventDefault();\n          setActiveIndex(enabledIndexes[enabledIndexes.length - 1] ?? -1);\n          break;\n        case 'Enter':\n        case ' ': {\n          e.preventDefault();\n          if (activeIndex >= 0) {\n            selectOption(options[activeIndex]);\n          }\n\n          break;\n        }\n        case 'Escape':\n        case 'Tab':\n          closeList();\n          break;\n      }\n    },\n    [options, activeIndex, selectOption, closeList],\n  );\n\n  return (\n    <div className={[styles.wrapper, className].filter(Boolean).join(' ')} {...props}>\n      {/* Trigger button */}\n      <button\n        ref={triggerRef}\n        id={triggerId}\n        type=\"button\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={open}\n        aria-controls={listboxId}\n        aria-activedescendant={\n          open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : undefined\n        }\n        disabled={disabled}\n        className={[styles.trigger, open ? styles.triggerOpen : null].filter(Boolean).join(' ')}\n        onClick={() => (open ? closeList() : openList())}\n        onKeyDown={handleTriggerKeyDown}\n      >\n        <span\n          className={[styles.triggerLabel, !selected ? styles.placeholder : null]\n            .filter(Boolean)\n            .join(' ')}\n        >\n          {selected?.label ?? placeholder}\n        </span>\n        <Icon\n          icon={PanDown}\n          size=\"md\"\n          aria-hidden\n          className={[styles.chevron, open ? styles.chevronOpen : null].filter(Boolean).join(' ')}\n        />\n      </button>\n\n      {/* Listbox */}\n      {open && (\n        <ul\n          ref={listRef}\n          id={listboxId}\n          role=\"listbox\"\n          aria-labelledby={triggerId}\n          tabIndex={-1}\n          className={[styles.list, flipUp ? styles.listUp : styles.listDown]\n            .filter(Boolean)\n            .join(' ')}\n          onKeyDown={handleListKeyDown}\n        >\n          {options.map((opt, i) => (\n            <li\n              key={opt.value}\n              id={`${listboxId}-opt-${i}`}\n              role=\"option\"\n              aria-selected={opt.value === value}\n              aria-disabled={opt.disabled}\n              className={[\n                styles.option,\n                opt.value === value ? styles.optionSelected : null,\n                i === activeIndex ? styles.optionActive : null,\n                opt.disabled ? styles.optionDisabled : null,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n              onMouseEnter={() => !opt.disabled && setActiveIndex(i)}\n              onClick={() => selectOption(opt)}\n            >\n              <span className={styles.optionText}>\n                <span className={styles.optionLabel}>{opt.label}</span>\n                {opt.description && <span className={styles.optionDesc}>{opt.description}</span>}\n              </span>\n              {opt.value === value && (\n                <Icon icon={Check} size=\"md\" aria-hidden className={styles.checkIcon} />\n              )}\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Dropdown.js","names":[],"sources":["../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { Check, PanDown } from '@gnome-ui/icons';\nimport {\n  type HTMLAttributes,\n  type KeyboardEvent,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Dropdown.module.css';\n\nexport interface DropdownOption<V extends string = string> {\n  /** The value submitted / returned on selection. */\n  value: V;\n  /** Display label shown in the list and trigger. */\n  label: string;\n  /** Optional descriptive text shown below the label. */\n  description?: string;\n  /** Whether the option is selectable. */\n  disabled?: boolean;\n}\n\nexport interface DropdownProps<V extends string = string>\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  /** The list of selectable options. */\n  options: DropdownOption<V>[];\n  /** The currently selected value. */\n  value?: V;\n  /** Called when the user selects an option. */\n  onChange?: (value: V) => void;\n  /** Placeholder shown when no option is selected. */\n  placeholder?: string;\n  /** Accessible label for the control (used as `aria-label`). */\n  'aria-label'?: string;\n  /** Disables the entire control. */\n  disabled?: boolean;\n}\n\n/**\n * Expandable option list following the Adwaita combo-row / drop-down pattern.\n *\n * - Fully keyboard-navigable: Space/Enter opens; ↑/↓ navigate; Enter selects; Escape closes.\n * - Uses `role=\"combobox\"` + `role=\"listbox\"` + `role=\"option\"` ARIA pattern.\n * - Closes when clicking outside or pressing Escape.\n * - The list flips above the trigger when there is not enough space below.\n *\n * @see https://developer.gnome.org/hig/patterns/controls/drop-down-lists.html\n */\nexport const Dropdown = <V extends string = string>({\n  options,\n  value,\n  onChange,\n  placeholder = 'Select an option',\n  disabled,\n  className,\n  ...props\n}: DropdownProps<V>) => {\n  const [open, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number>(-1);\n  const [flipUp, setFlipUp] = useState(false);\n\n  const triggerId = useId();\n  const listboxId = useId();\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n\n  const selected = options.find((o) => o.value === value);\n\n  // Compute flip direction when opening\n  const computeFlip = useCallback(() => {\n    if (!triggerRef.current) {\n      return;\n    }\n\n    const rect = triggerRef.current.getBoundingClientRect();\n    const spaceBelow = window.innerHeight - rect.bottom;\n    const listH = Math.min(options.length * 48 + 8, 280);\n\n    setFlipUp(spaceBelow < listH && rect.top > listH);\n  }, [options.length]);\n\n  const openList = useCallback(() => {\n    if (disabled) {\n      return;\n    }\n\n    computeFlip();\n    setOpen(true);\n    const idx = options.findIndex((o) => o.value === value && !o.disabled);\n\n    setActiveIndex(idx >= 0 ? idx : options.findIndex((o) => !o.disabled));\n  }, [disabled, computeFlip, options, value]);\n\n  const closeList = useCallback(() => {\n    setOpen(false);\n    setActiveIndex(-1);\n    triggerRef.current?.focus();\n  }, []);\n\n  const selectOption = useCallback(\n    (opt: DropdownOption<V>) => {\n      if (opt.disabled) {\n        return;\n      }\n\n      onChange?.(opt.value);\n      closeList();\n    },\n    [onChange, closeList],\n  );\n\n  // Refine the flip with the real list height once it has rendered — the\n  // pre-open estimate can't account for option descriptions or wrapped labels.\n  useLayoutEffect(() => {\n    if (!open || !triggerRef.current || !listRef.current) {\n      return;\n    }\n\n    const rect = triggerRef.current.getBoundingClientRect();\n    const listH = listRef.current.offsetHeight;\n\n    setFlipUp(window.innerHeight - rect.bottom < listH && rect.top > listH);\n  }, [open]);\n\n  // Scroll active item into view\n  useEffect(() => {\n    if (!open || activeIndex < 0 || !listRef.current) {\n      return;\n    }\n\n    const item = listRef.current.children[activeIndex] as HTMLElement | undefined;\n\n    item?.scrollIntoView({ block: 'nearest' });\n  }, [activeIndex, open]);\n\n  // Close on outside click\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n\n    const handler = (e: MouseEvent) => {\n      if (\n        !triggerRef.current?.contains(e.target as Node) &&\n        !listRef.current?.contains(e.target as Node)\n      ) {\n        closeList();\n      }\n    };\n\n    document.addEventListener('mousedown', handler);\n\n    return () => document.removeEventListener('mousedown', handler);\n  }, [open, closeList]);\n\n  // Trigger keyboard handler\n  const handleTriggerKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLButtonElement>) => {\n      switch (e.key) {\n        case 'Enter':\n        case ' ':\n        case 'ArrowDown':\n          e.preventDefault();\n          openList();\n          break;\n        case 'ArrowUp':\n          e.preventDefault();\n          computeFlip();\n          setOpen(true);\n          setActiveIndex(options.reduce((last, o, i) => (!o.disabled ? i : last), -1));\n          break;\n      }\n    },\n    [openList, computeFlip, options],\n  );\n\n  // Listbox keyboard handler\n  const handleListKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLUListElement>) => {\n      const enabledIndexes = options\n        .map((o, i) => ({ o, i }))\n        .filter(({ o }) => !o.disabled)\n        .map(({ i }) => i);\n\n      const currentPos = enabledIndexes.indexOf(activeIndex);\n\n      switch (e.key) {\n        case 'ArrowDown': {\n          e.preventDefault();\n          const next = enabledIndexes[Math.min(currentPos + 1, enabledIndexes.length - 1)];\n\n          setActiveIndex(next ?? activeIndex);\n          break;\n        }\n        case 'ArrowUp': {\n          e.preventDefault();\n          const prev = enabledIndexes[Math.max(currentPos - 1, 0)];\n\n          setActiveIndex(prev ?? activeIndex);\n          break;\n        }\n        case 'Home':\n          e.preventDefault();\n          setActiveIndex(enabledIndexes[0] ?? -1);\n          break;\n        case 'End':\n          e.preventDefault();\n          setActiveIndex(enabledIndexes[enabledIndexes.length - 1] ?? -1);\n          break;\n        case 'Enter':\n        case ' ': {\n          e.preventDefault();\n          if (activeIndex >= 0) {\n            selectOption(options[activeIndex]);\n          }\n\n          break;\n        }\n        case 'Escape':\n        case 'Tab':\n          closeList();\n          break;\n      }\n    },\n    [options, activeIndex, selectOption, closeList],\n  );\n\n  return (\n    <div className={[styles.wrapper, className].filter(Boolean).join(' ')} {...props}>\n      {/* Trigger button */}\n      <button\n        ref={triggerRef}\n        id={triggerId}\n        type=\"button\"\n        role=\"combobox\"\n        aria-haspopup=\"listbox\"\n        aria-expanded={open}\n        aria-controls={listboxId}\n        aria-activedescendant={\n          open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : undefined\n        }\n        disabled={disabled}\n        className={[styles.trigger, open ? styles.triggerOpen : null].filter(Boolean).join(' ')}\n        onClick={() => (open ? closeList() : openList())}\n        onKeyDown={handleTriggerKeyDown}\n      >\n        <span\n          className={[styles.triggerLabel, !selected ? styles.placeholder : null]\n            .filter(Boolean)\n            .join(' ')}\n        >\n          {selected?.label ?? placeholder}\n        </span>\n        <Icon\n          icon={PanDown}\n          size=\"md\"\n          aria-hidden\n          className={[styles.chevron, open ? styles.chevronOpen : null].filter(Boolean).join(' ')}\n        />\n      </button>\n\n      {/* Listbox */}\n      {open && (\n        <ul\n          ref={listRef}\n          id={listboxId}\n          role=\"listbox\"\n          aria-labelledby={triggerId}\n          tabIndex={-1}\n          className={[styles.list, flipUp ? styles.listUp : styles.listDown]\n            .filter(Boolean)\n            .join(' ')}\n          onKeyDown={handleListKeyDown}\n        >\n          {options.map((opt, i) => (\n            <li\n              key={opt.value}\n              id={`${listboxId}-opt-${i}`}\n              role=\"option\"\n              aria-selected={opt.value === value}\n              aria-disabled={opt.disabled}\n              className={[\n                styles.option,\n                opt.value === value ? styles.optionSelected : null,\n                i === activeIndex ? styles.optionActive : null,\n                opt.disabled ? styles.optionDisabled : null,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n              onMouseEnter={() => !opt.disabled && setActiveIndex(i)}\n              onClick={() => selectOption(opt)}\n            >\n              <span className={styles.optionText}>\n                <span className={styles.optionLabel}>{opt.label}</span>\n                {opt.description && <span className={styles.optionDesc}>{opt.description}</span>}\n              </span>\n              {opt.value === value && (\n                <Icon icon={Check} size=\"md\" aria-hidden className={styles.checkIcon} />\n              )}\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var e=`_wrapper_15m1u_3`,t=`_trigger_15m1u_11`,n=`_triggerOpen_15m1u_63`,r=`_triggerLabel_15m1u_73`,i=`_placeholder_15m1u_81`,a=`_chevron_15m1u_87`,o=`_chevronOpen_15m1u_94`,s=`_list_15m1u_100`,c=`_listDown_15m1u_137`,l=`_listUp_15m1u_141`,u=`_option_15m1u_161`,d=`_optionActive_15m1u_178`,f=`_optionSelected_15m1u_182`,p=`_optionDisabled_15m1u_186`,m=`_optionText_15m1u_194`,h=`_optionLabel_15m1u_202`,g=`_optionDesc_15m1u_208`,_=`_checkIcon_15m1u_218`,v={wrapper:e,trigger:t,triggerOpen:n,triggerLabel:r,placeholder:i,chevron:a,chevronOpen:o,list:s,"list-in":`_list-in_15m1u_1`,listDown:c,listUp:l,"list-in-up":`_list-in-up_15m1u_1`,option:u,optionActive:d,optionSelected:f,optionDisabled:p,optionText:m,optionLabel:h,optionDesc:g,checkIcon:_};exports.default=v;
+var e={wrapper:`_wrapper_15m1u_3`,trigger:`_trigger_15m1u_11`,triggerOpen:`_triggerOpen_15m1u_63`,triggerLabel:`_triggerLabel_15m1u_73`,placeholder:`_placeholder_15m1u_81`,chevron:`_chevron_15m1u_87`,chevronOpen:`_chevronOpen_15m1u_94`,list:`_list_15m1u_100`,"list-in":`_list-in_15m1u_1`,listDown:`_listDown_15m1u_137`,listUp:`_listUp_15m1u_141`,"list-in-up":`_list-in-up_15m1u_1`,option:`_option_15m1u_161`,optionActive:`_optionActive_15m1u_178`,optionSelected:`_optionSelected_15m1u_182`,optionDisabled:`_optionDisabled_15m1u_186`,optionText:`_optionText_15m1u_194`,optionLabel:`_optionLabel_15m1u_202`,optionDesc:`_optionDesc_15m1u_208`,checkIcon:`_checkIcon_15m1u_218`};exports.default=e;
 //# sourceMappingURL=Dropdown.module.css.cjs.map

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

@@ -1,27 +1,26 @@
-//#region src/components/Dropdown/Dropdown.module.css
-var e = "_wrapper_15m1u_3", t = "_trigger_15m1u_11", n = "_triggerOpen_15m1u_63", r = "_triggerLabel_15m1u_73", i = "_placeholder_15m1u_81", a = "_chevron_15m1u_87", o = "_chevronOpen_15m1u_94", s = "_list_15m1u_100", c = "_listDown_15m1u_137", l = "_listUp_15m1u_141", u = "_option_15m1u_161", d = "_optionActive_15m1u_178", f = "_optionSelected_15m1u_182", p = "_optionDisabled_15m1u_186", m = "_optionText_15m1u_194", h = "_optionLabel_15m1u_202", g = "_optionDesc_15m1u_208", _ = "_checkIcon_15m1u_218", v = {
-	wrapper: e,
-	trigger: t,
-	triggerOpen: n,
-	triggerLabel: r,
-	placeholder: i,
-	chevron: a,
-	chevronOpen: o,
-	list: s,
+var e = {
+	wrapper: "_wrapper_15m1u_3",
+	trigger: "_trigger_15m1u_11",
+	triggerOpen: "_triggerOpen_15m1u_63",
+	triggerLabel: "_triggerLabel_15m1u_73",
+	placeholder: "_placeholder_15m1u_81",
+	chevron: "_chevron_15m1u_87",
+	chevronOpen: "_chevronOpen_15m1u_94",
+	list: "_list_15m1u_100",
 	"list-in": "_list-in_15m1u_1",
-	listDown: c,
-	listUp: l,
+	listDown: "_listDown_15m1u_137",
+	listUp: "_listUp_15m1u_141",
 	"list-in-up": "_list-in-up_15m1u_1",
-	option: u,
-	optionActive: d,
-	optionSelected: f,
-	optionDisabled: p,
-	optionText: m,
-	optionLabel: h,
-	optionDesc: g,
-	checkIcon: _
+	option: "_option_15m1u_161",
+	optionActive: "_optionActive_15m1u_178",
+	optionSelected: "_optionSelected_15m1u_182",
+	optionDisabled: "_optionDisabled_15m1u_186",
+	optionText: "_optionText_15m1u_194",
+	optionLabel: "_optionLabel_15m1u_202",
+	optionDesc: "_optionDesc_15m1u_208",
+	checkIcon: "_checkIcon_15m1u_218"
 };
 //#endregion
-export { v as default };
+export { e as default };
 
 //# sourceMappingURL=Dropdown.module.css.js.map

package/dist/components/Dropdown.cjs

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

package/dist/components/EntryRow/EntryRow.cjs

@@ -1,2 +1,2 @@
-const e=require(`./EntryRow.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({title:r,value:i,defaultValue:a=``,onValueChange:o,leading:s,trailing:c,disabled:l,className:u,id:d,onChange:f,...p}){let m=(0,t.useId)(),h=d??m,g=i!==void 0,[_,v]=(0,t.useState)(String(a)),y=g?String(i):_,[b,x]=(0,t.useState)(!1),S=(0,t.useRef)(null),C=b||y.length>0;return(0,n.jsxs)(`div`,{className:[e.default.row,b?e.default.focused:null,l?e.default.disabled:null,u].filter(Boolean).join(` `),onClick:()=>S.current?.focus(),children:[s&&(0,n.jsx)(`span`,{className:e.default.leading,children:s}),(0,n.jsxs)(`span`,{className:e.default.fieldWrap,children:[(0,n.jsx)(`label`,{htmlFor:h,className:[e.default.label,C?e.default.labelFloated:null].filter(Boolean).join(` `),children:r}),(0,n.jsx)(`input`,{ref:S,id:h,className:[e.default.input,C?e.default.inputFloated:null].filter(Boolean).join(` `),value:y,disabled:l,onFocus:()=>x(!0),onBlur:()=>x(!1),onChange:e=>{g||v(e.target.value),o?.(e.target.value),f?.(e)},...p})]}),c&&(0,n.jsx)(`span`,{className:e.default.trailing,children:c})]})}exports.EntryRow=r;
+const e=require("./EntryRow.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({title:r,value:i,defaultValue:a=``,onValueChange:o,leading:s,trailing:c,disabled:l,className:u,id:d,onChange:f,...p})=>{let m=(0,t.useId)(),h=d??m,g=i!==void 0,[_,v]=(0,t.useState)(String(a)),y=g?String(i):_,[b,x]=(0,t.useState)(!1),S=(0,t.useRef)(null),C=b||y.length>0;return(0,n.jsxs)(`div`,{className:[e.default.row,b?e.default.focused:null,l?e.default.disabled:null,u].filter(Boolean).join(` `),onClick:()=>S.current?.focus(),children:[s&&(0,n.jsx)(`span`,{className:e.default.leading,children:s}),(0,n.jsxs)(`span`,{className:e.default.fieldWrap,children:[(0,n.jsx)(`label`,{htmlFor:h,className:[e.default.label,C?e.default.labelFloated:null].filter(Boolean).join(` `),children:r}),(0,n.jsx)(`input`,{ref:S,id:h,className:[e.default.input,C?e.default.inputFloated:null].filter(Boolean).join(` `),value:y,disabled:l,onFocus:()=>x(!0),onBlur:()=>x(!1),onChange:e=>{g||v(e.target.value),o?.(e.target.value),f?.(e)},...p})]}),c&&(0,n.jsx)(`span`,{className:e.default.trailing,children:c})]})};exports.EntryRow=r;
 //# sourceMappingURL=EntryRow.cjs.map

package/dist/components/EntryRow/EntryRow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EntryRow.cjs","names":[],"sources":["../../../src/components/EntryRow/EntryRow.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport styles from './EntryRow.module.css';\n\nexport interface EntryRowProps extends InputHTMLAttributes<HTMLInputElement> {\n  /**\n   * Acts as a floating label: shown small above the input when the field has\n   * content or focus, shown as a placeholder when empty and unfocused.\n   */\n  title: string;\n  /** Called when the input value changes. */\n  onValueChange?: (value: string) => void;\n  /** Icon or widget placed at the leading edge. */\n  leading?: ReactNode;\n  /** Icon or widget placed at the trailing edge (e.g. a clear button, copy button). */\n  trailing?: ReactNode;\n}\n\n/**\n * Row with an inline text entry field.\n *\n * Mirrors `AdwEntryRow` — the `title` floats up as a small label when the\n * field is focused or has content, acting as a placeholder when empty and\n * unfocused. Use inside a `BoxedList` for inline settings that require text input.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.EntryRow.html\n */\nexport function EntryRow({\n  title,\n  value: controlledValue,\n  defaultValue = '',\n  onValueChange,\n  leading,\n  trailing,\n  disabled,\n  className,\n  id: externalId,\n  onChange,\n  ...props\n}: EntryRowProps) {\n  const generatedId = useId();\n  const inputId = externalId ?? generatedId;\n\n  const isControlled = controlledValue !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(String(defaultValue));\n  const inputValue = isControlled ? String(controlledValue) : uncontrolledValue;\n\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const floated = focused || inputValue.length > 0;\n\n  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) {\n      setUncontrolledValue(e.target.value);\n    }\n\n    onValueChange?.(e.target.value);\n    onChange?.(e);\n  };\n\n  return (\n    <div\n      className={[\n        styles.row,\n        focused ? styles.focused : null,\n        disabled ? styles.disabled : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={() => inputRef.current?.focus()}\n    >\n      {leading && <span className={styles.leading}>{leading}</span>}\n\n      <span className={styles.fieldWrap}>\n        <label\n          htmlFor={inputId}\n          className={[styles.label, floated ? styles.labelFloated : null].filter(Boolean).join(' ')}\n        >\n          {title}\n        </label>\n        <input\n          ref={inputRef}\n          id={inputId}\n          className={[styles.input, floated ? styles.inputFloated : null].filter(Boolean).join(' ')}\n          value={inputValue}\n          disabled={disabled}\n          onFocus={() => setFocused(true)}\n          onBlur={() => setFocused(false)}\n          onChange={handleChange}\n          {...props}\n        />\n      </span>\n\n      {trailing && <span className={styles.trailing}>{trailing}</span>}\n    </div>\n  );\n}\n"],"mappings":"mGAkCA,SAAgB,EAAS,CACvB,QACA,MAAO,EACP,eAAe,GACf,gBACA,UACA,WACA,WACA,YACA,GAAI,EACJ,WACA,GAAG,GACa,CAChB,IAAM,GAAA,EAAA,EAAA,QAAqB,CACrB,EAAU,GAAc,EAExB,EAAe,IAAoB,IAAA,GACnC,CAAC,EAAmB,IAAA,EAAA,EAAA,UAAiC,OAAO,EAAa,CAAC,CAC1E,EAAa,EAAe,OAAO,EAAgB,CAAG,EAEtD,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,GAAM,CACvC,GAAA,EAAA,EAAA,QAAoC,KAAK,CAEzC,EAAU,GAAW,EAAW,OAAS,EAW/C,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CACT,EAAA,QAAO,IACP,EAAU,EAAA,QAAO,QAAU,KAC3B,EAAW,EAAA,QAAO,SAAW,KAC7B,EACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,YAAe,EAAS,SAAS,OAAO,UAT1C,CAWG,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,EAAe,CAAA,EAE7D,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBAAxB,EACE,EAAA,EAAA,KAAC,QAAD,CACE,QAAS,EACT,UAAW,CAAC,EAAA,QAAO,MAAO,EAAU,EAAA,QAAO,aAAe,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,UAExF,EACK,CAAA,EACR,EAAA,EAAA,KAAC,QAAD,CACE,IAAK,EACL,GAAI,EACJ,UAAW,CAAC,EAAA,QAAO,MAAO,EAAU,EAAA,QAAO,aAAe,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI,CACzF,MAAO,EACG,WACV,YAAe,EAAW,GAAK,CAC/B,WAAc,EAAW,GAAM,CAC/B,SAtCc,GAAqC,CACpD,GACH,EAAqB,EAAE,OAAO,MAAM,CAGtC,IAAgB,EAAE,OAAO,MAAM,CAC/B,IAAW,EAAE,EAiCP,GAAI,EACJ,CAAA,CACG,GAEN,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,EAAgB,CAAA,CAC5D"}
+{"version":3,"file":"EntryRow.cjs","names":[],"sources":["../../../src/components/EntryRow/EntryRow.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport styles from './EntryRow.module.css';\n\nexport interface EntryRowProps extends InputHTMLAttributes<HTMLInputElement> {\n  /**\n   * Acts as a floating label: shown small above the input when the field has\n   * content or focus, shown as a placeholder when empty and unfocused.\n   */\n  title: string;\n  /** Called when the input value changes. */\n  onValueChange?: (value: string) => void;\n  /** Icon or widget placed at the leading edge. */\n  leading?: ReactNode;\n  /** Icon or widget placed at the trailing edge (e.g. a clear button, copy button). */\n  trailing?: ReactNode;\n}\n\n/**\n * Row with an inline text entry field.\n *\n * Mirrors `AdwEntryRow` — the `title` floats up as a small label when the\n * field is focused or has content, acting as a placeholder when empty and\n * unfocused. Use inside a `BoxedList` for inline settings that require text input.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.EntryRow.html\n */\nexport const EntryRow = ({\n  title,\n  value: controlledValue,\n  defaultValue = '',\n  onValueChange,\n  leading,\n  trailing,\n  disabled,\n  className,\n  id: externalId,\n  onChange,\n  ...props\n}: EntryRowProps) => {\n  const generatedId = useId();\n  const inputId = externalId ?? generatedId;\n\n  const isControlled = controlledValue !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(String(defaultValue));\n  const inputValue = isControlled ? String(controlledValue) : uncontrolledValue;\n\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const floated = focused || inputValue.length > 0;\n\n  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) {\n      setUncontrolledValue(e.target.value);\n    }\n\n    onValueChange?.(e.target.value);\n    onChange?.(e);\n  };\n\n  return (\n    <div\n      className={[\n        styles.row,\n        focused ? styles.focused : null,\n        disabled ? styles.disabled : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={() => inputRef.current?.focus()}\n    >\n      {leading && <span className={styles.leading}>{leading}</span>}\n\n      <span className={styles.fieldWrap}>\n        <label\n          htmlFor={inputId}\n          className={[styles.label, floated ? styles.labelFloated : null].filter(Boolean).join(' ')}\n        >\n          {title}\n        </label>\n        <input\n          ref={inputRef}\n          id={inputId}\n          className={[styles.input, floated ? styles.inputFloated : null].filter(Boolean).join(' ')}\n          value={inputValue}\n          disabled={disabled}\n          onFocus={() => setFocused(true)}\n          onBlur={() => setFocused(false)}\n          onChange={handleChange}\n          {...props}\n        />\n      </span>\n\n      {trailing && <span className={styles.trailing}>{trailing}</span>}\n    </div>\n  );\n};\n"],"mappings":"mGAkCA,IAAa,GAAY,CACvB,QACA,MAAO,EACP,eAAe,GACf,gBACA,UACA,WACA,WACA,YACA,GAAI,EACJ,WACA,GAAG,KACgB,CACnB,IAAM,GAAA,EAAA,EAAA,OAAoB,EACpB,EAAU,GAAc,EAExB,EAAe,IAAoB,IAAA,GACnC,CAAC,EAAmB,IAAA,EAAA,EAAA,UAAiC,OAAO,CAAY,CAAC,EACzE,EAAa,EAAe,OAAO,CAAe,EAAI,EAEtD,CAAC,EAAS,IAAA,EAAA,EAAA,UAAuB,EAAK,EACtC,GAAA,EAAA,EAAA,QAAoC,IAAI,EAExC,EAAU,GAAW,EAAW,OAAS,EAW/C,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CACT,EAAA,QAAO,IACP,EAAU,EAAA,QAAO,QAAU,KAC3B,EAAW,EAAA,QAAO,SAAW,KAC7B,CACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG,EACX,YAAe,EAAS,SAAS,MAAM,WATzC,CAWG,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,CAAc,CAAA,GAE5D,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBAAxB,EACE,EAAA,EAAA,KAAC,QAAD,CACE,QAAS,EACT,UAAW,CAAC,EAAA,QAAO,MAAO,EAAU,EAAA,QAAO,aAAe,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,WAEvF,CACI,CAAA,GACP,EAAA,EAAA,KAAC,QAAD,CACE,IAAK,EACL,GAAI,EACJ,UAAW,CAAC,EAAA,QAAO,MAAO,EAAU,EAAA,QAAO,aAAe,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EACxF,MAAO,EACG,WACV,YAAe,EAAW,EAAI,EAC9B,WAAc,EAAW,EAAK,EAC9B,SAtCc,GAAqC,CACpD,GACH,EAAqB,EAAE,OAAO,KAAK,EAGrC,IAAgB,EAAE,OAAO,KAAK,EAC9B,IAAW,CAAC,CACd,EAgCQ,GAAI,CACL,CAAA,CACG,IAEL,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,CAAe,CAAA,CAC5D,GAET"}

package/dist/components/EntryRow/EntryRow.d.ts

@@ -21,4 +21,4 @@ export interface EntryRowProps extends InputHTMLAttributes<HTMLInputElement> {
  *
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.EntryRow.html
  */
-export declare function EntryRow({ title, value: controlledValue, defaultValue, onValueChange, leading, trailing, disabled, className, id: externalId, onChange, ...props }: EntryRowProps): import("react/jsx-runtime").JSX.Element;
+export declare const EntryRow: ({ title, value: controlledValue, defaultValue, onValueChange, leading, trailing, disabled, className, id: externalId, onChange, ...props }: EntryRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/EntryRow/EntryRow.js

@@ -2,7 +2,7 @@ import e from "./EntryRow.module.css.js";
 import { useId as t, useRef as n, useState as r } from "react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/EntryRow/EntryRow.tsx
-function o({ title: o, value: s, defaultValue: c = "", onValueChange: l, leading: u, trailing: d, disabled: f, className: p, id: m, onChange: h, ...g }) {
+var o = ({ title: o, value: s, defaultValue: c = "", onValueChange: l, leading: u, trailing: d, disabled: f, className: p, id: m, onChange: h, ...g }) => {
 	let _ = t(), v = m ?? _, y = s !== void 0, [b, x] = r(String(c)), S = y ? String(s) : b, [C, w] = r(!1), T = n(null), E = C || S.length > 0;
 	return /* @__PURE__ */ a("div", {
 		className: [
@@ -43,7 +43,7 @@ function o({ title: o, value: s, defaultValue: c = "", onValueChange: l, leading
 			})
 		]
 	});
-}
+};
 //#endregion
 export { o as EntryRow };
 

package/dist/components/EntryRow/EntryRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntryRow.js","names":[],"sources":["../../../src/components/EntryRow/EntryRow.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport styles from './EntryRow.module.css';\n\nexport interface EntryRowProps extends InputHTMLAttributes<HTMLInputElement> {\n  /**\n   * Acts as a floating label: shown small above the input when the field has\n   * content or focus, shown as a placeholder when empty and unfocused.\n   */\n  title: string;\n  /** Called when the input value changes. */\n  onValueChange?: (value: string) => void;\n  /** Icon or widget placed at the leading edge. */\n  leading?: ReactNode;\n  /** Icon or widget placed at the trailing edge (e.g. a clear button, copy button). */\n  trailing?: ReactNode;\n}\n\n/**\n * Row with an inline text entry field.\n *\n * Mirrors `AdwEntryRow` — the `title` floats up as a small label when the\n * field is focused or has content, acting as a placeholder when empty and\n * unfocused. Use inside a `BoxedList` for inline settings that require text input.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.EntryRow.html\n */\nexport function EntryRow({\n  title,\n  value: controlledValue,\n  defaultValue = '',\n  onValueChange,\n  leading,\n  trailing,\n  disabled,\n  className,\n  id: externalId,\n  onChange,\n  ...props\n}: EntryRowProps) {\n  const generatedId = useId();\n  const inputId = externalId ?? generatedId;\n\n  const isControlled = controlledValue !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(String(defaultValue));\n  const inputValue = isControlled ? String(controlledValue) : uncontrolledValue;\n\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const floated = focused || inputValue.length > 0;\n\n  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) {\n      setUncontrolledValue(e.target.value);\n    }\n\n    onValueChange?.(e.target.value);\n    onChange?.(e);\n  };\n\n  return (\n    <div\n      className={[\n        styles.row,\n        focused ? styles.focused : null,\n        disabled ? styles.disabled : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={() => inputRef.current?.focus()}\n    >\n      {leading && <span className={styles.leading}>{leading}</span>}\n\n      <span className={styles.fieldWrap}>\n        <label\n          htmlFor={inputId}\n          className={[styles.label, floated ? styles.labelFloated : null].filter(Boolean).join(' ')}\n        >\n          {title}\n        </label>\n        <input\n          ref={inputRef}\n          id={inputId}\n          className={[styles.input, floated ? styles.inputFloated : null].filter(Boolean).join(' ')}\n          value={inputValue}\n          disabled={disabled}\n          onFocus={() => setFocused(true)}\n          onBlur={() => setFocused(false)}\n          onChange={handleChange}\n          {...props}\n        />\n      </span>\n\n      {trailing && <span className={styles.trailing}>{trailing}</span>}\n    </div>\n  );\n}\n"],"mappings":";;;;AAkCA,SAAgB,EAAS,EACvB,UACA,OAAO,GACP,kBAAe,IACf,kBACA,YACA,aACA,aACA,cACA,IAAI,GACJ,aACA,GAAG,KACa;CAChB,IAAM,IAAc,GAAO,EACrB,IAAU,KAAc,GAExB,IAAe,MAAoB,KAAA,GACnC,CAAC,GAAmB,KAAwB,EAAS,OAAO,EAAa,CAAC,EAC1E,IAAa,IAAe,OAAO,EAAgB,GAAG,GAEtD,CAAC,GAAS,KAAc,EAAS,GAAM,EACvC,IAAW,EAAyB,KAAK,EAEzC,IAAU,KAAW,EAAW,SAAS;AAW/C,QACE,kBAAC,OAAD;EACE,WAAW;GACT,EAAO;GACP,IAAU,EAAO,UAAU;GAC3B,IAAW,EAAO,WAAW;GAC7B;GACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,eAAe,EAAS,SAAS,OAAO;YAT1C;GAWG,KAAW,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAU;IAAe,CAAA;GAE7D,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAxB,CACE,kBAAC,SAAD;KACE,SAAS;KACT,WAAW,CAAC,EAAO,OAAO,IAAU,EAAO,eAAe,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;eAExF;KACK,CAAA,EACR,kBAAC,SAAD;KACE,KAAK;KACL,IAAI;KACJ,WAAW,CAAC,EAAO,OAAO,IAAU,EAAO,eAAe,KAAK,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;KACzF,OAAO;KACG;KACV,eAAe,EAAW,GAAK;KAC/B,cAAc,EAAW,GAAM;KAC/B,WAtCc,MAAqC;AAMzD,MALK,KACH,EAAqB,EAAE,OAAO,MAAM,EAGtC,IAAgB,EAAE,OAAO,MAAM,EAC/B,IAAW,EAAE;;KAiCP,GAAI;KACJ,CAAA,CACG;;GAEN,KAAY,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAW;IAAgB,CAAA;GAC5D"}
+{"version":3,"file":"EntryRow.js","names":[],"sources":["../../../src/components/EntryRow/EntryRow.tsx"],"sourcesContent":["import {\n  type ChangeEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  useId,\n  useRef,\n  useState,\n} from 'react';\n\nimport styles from './EntryRow.module.css';\n\nexport interface EntryRowProps extends InputHTMLAttributes<HTMLInputElement> {\n  /**\n   * Acts as a floating label: shown small above the input when the field has\n   * content or focus, shown as a placeholder when empty and unfocused.\n   */\n  title: string;\n  /** Called when the input value changes. */\n  onValueChange?: (value: string) => void;\n  /** Icon or widget placed at the leading edge. */\n  leading?: ReactNode;\n  /** Icon or widget placed at the trailing edge (e.g. a clear button, copy button). */\n  trailing?: ReactNode;\n}\n\n/**\n * Row with an inline text entry field.\n *\n * Mirrors `AdwEntryRow` — the `title` floats up as a small label when the\n * field is focused or has content, acting as a placeholder when empty and\n * unfocused. Use inside a `BoxedList` for inline settings that require text input.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.EntryRow.html\n */\nexport const EntryRow = ({\n  title,\n  value: controlledValue,\n  defaultValue = '',\n  onValueChange,\n  leading,\n  trailing,\n  disabled,\n  className,\n  id: externalId,\n  onChange,\n  ...props\n}: EntryRowProps) => {\n  const generatedId = useId();\n  const inputId = externalId ?? generatedId;\n\n  const isControlled = controlledValue !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(String(defaultValue));\n  const inputValue = isControlled ? String(controlledValue) : uncontrolledValue;\n\n  const [focused, setFocused] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const floated = focused || inputValue.length > 0;\n\n  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    if (!isControlled) {\n      setUncontrolledValue(e.target.value);\n    }\n\n    onValueChange?.(e.target.value);\n    onChange?.(e);\n  };\n\n  return (\n    <div\n      className={[\n        styles.row,\n        focused ? styles.focused : null,\n        disabled ? styles.disabled : null,\n        className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={() => inputRef.current?.focus()}\n    >\n      {leading && <span className={styles.leading}>{leading}</span>}\n\n      <span className={styles.fieldWrap}>\n        <label\n          htmlFor={inputId}\n          className={[styles.label, floated ? styles.labelFloated : null].filter(Boolean).join(' ')}\n        >\n          {title}\n        </label>\n        <input\n          ref={inputRef}\n          id={inputId}\n          className={[styles.input, floated ? styles.inputFloated : null].filter(Boolean).join(' ')}\n          value={inputValue}\n          disabled={disabled}\n          onFocus={() => setFocused(true)}\n          onBlur={() => setFocused(false)}\n          onChange={handleChange}\n          {...props}\n        />\n      </span>\n\n      {trailing && <span className={styles.trailing}>{trailing}</span>}\n    </div>\n  );\n};\n"],"mappings":";;;;AAkCA,IAAa,KAAY,EACvB,UACA,OAAO,GACP,kBAAe,IACf,kBACA,YACA,aACA,aACA,cACA,IAAI,GACJ,aACA,GAAG,QACgB;CACnB,IAAM,IAAc,EAAM,GACpB,IAAU,KAAc,GAExB,IAAe,MAAoB,KAAA,GACnC,CAAC,GAAmB,KAAwB,EAAS,OAAO,CAAY,CAAC,GACzE,IAAa,IAAe,OAAO,CAAe,IAAI,GAEtD,CAAC,GAAS,KAAc,EAAS,EAAK,GACtC,IAAW,EAAyB,IAAI,GAExC,IAAU,KAAW,EAAW,SAAS;CAW/C,OACE,kBAAC,OAAD;EACE,WAAW;GACT,EAAO;GACP,IAAU,EAAO,UAAU;GAC3B,IAAW,EAAO,WAAW;GAC7B;EACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG;EACX,eAAe,EAAS,SAAS,MAAM;YATzC;GAWG,KAAW,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAU;GAAc,CAAA;GAE5D,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAxB,CACE,kBAAC,SAAD;KACE,SAAS;KACT,WAAW,CAAC,EAAO,OAAO,IAAU,EAAO,eAAe,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;eAEvF;IACI,CAAA,GACP,kBAAC,SAAD;KACE,KAAK;KACL,IAAI;KACJ,WAAW,CAAC,EAAO,OAAO,IAAU,EAAO,eAAe,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;KACxF,OAAO;KACG;KACV,eAAe,EAAW,EAAI;KAC9B,cAAc,EAAW,EAAK;KAC9B,WAtCc,MAAqC;MAMzD,AALK,KACH,EAAqB,EAAE,OAAO,KAAK,GAGrC,IAAgB,EAAE,OAAO,KAAK,GAC9B,IAAW,CAAC;KACd;KAgCQ,GAAI;IACL,CAAA,CACG;;GAEL,KAAY,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAW;GAAe,CAAA;EAC5D;;AAET"}

package/dist/components/EntryRow.cjs

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

package/dist/components/ExpanderRow/ExpanderRow.cjs

@@ -1,2 +1,2 @@
-const e=require(`../Separator/Separator.cjs`),t=require(`./ExpanderRow.module.css.cjs`);let n=require(`react`),r=require(`react/jsx-runtime`);function i({title:i,subtitle:a,leading:o,trailing:s,children:c,expanded:l,defaultExpanded:u=!1,onExpandedChange:d,className:f,...p}){let m=l!==void 0,[h,g]=(0,n.useState)(u),_=m?l:h,v=(0,n.useId)(),y=(0,n.useId)(),b=()=>{let e=!_;m||g(e),d?.(e)},x=n.Children.toArray(c).filter(Boolean);return(0,r.jsxs)(`div`,{className:[t.default.expanderRow,_?t.default.expanded:null,f].filter(Boolean).join(` `),...p,children:[(0,r.jsxs)(`button`,{id:y,className:t.default.header,"aria-expanded":_,"aria-controls":v,onClick:b,children:[o&&(0,r.jsx)(`span`,{className:t.default.leading,children:o}),(0,r.jsxs)(`span`,{className:t.default.content,children:[(0,r.jsx)(`span`,{className:t.default.title,children:i}),a&&(0,r.jsx)(`span`,{className:t.default.subtitle,children:a})]}),s&&(0,r.jsx)(`span`,{className:t.default.trailing,children:s}),(0,r.jsx)(`span`,{className:[t.default.chevronWrap,_?t.default.chevronOpen:null].filter(Boolean).join(` `),"aria-hidden":`true`,children:(0,r.jsx)(`svg`,{className:t.default.chevron,width:`16`,height:`16`,viewBox:`0 0 16 16`,focusable:`false`,children:(0,r.jsx)(`path`,{d:`M4 6l4 4 4-4`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})})})]}),(0,r.jsx)(`div`,{id:v,role:`region`,"aria-labelledby":y,className:t.default.panel,children:(0,r.jsx)(`div`,{className:t.default.panelInner,children:x.map((n,i)=>(0,r.jsxs)(`div`,{className:t.default.childItem,children:[(0,r.jsx)(e.Separator,{"aria-hidden":`true`}),n]},i))})})]})}exports.ExpanderRow=i;
+const e=require("../Separator/Separator.cjs"),t=require("./ExpanderRow.module.css.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=({title:i,subtitle:a,leading:o,trailing:s,children:c,expanded:l,defaultExpanded:u=!1,onExpandedChange:d,className:f,...p})=>{let m=l!==void 0,[h,g]=(0,n.useState)(u),_=m?l:h,v=(0,n.useId)(),y=(0,n.useId)(),b=()=>{let e=!_;m||g(e),d?.(e)},x=n.Children.toArray(c).filter(Boolean);return(0,r.jsxs)(`div`,{className:[t.default.expanderRow,_?t.default.expanded:null,f].filter(Boolean).join(` `),...p,children:[(0,r.jsxs)(`button`,{id:y,className:t.default.header,"aria-expanded":_,"aria-controls":v,onClick:b,children:[o&&(0,r.jsx)(`span`,{className:t.default.leading,children:o}),(0,r.jsxs)(`span`,{className:t.default.content,children:[(0,r.jsx)(`span`,{className:t.default.title,children:i}),a&&(0,r.jsx)(`span`,{className:t.default.subtitle,children:a})]}),s&&(0,r.jsx)(`span`,{className:t.default.trailing,children:s}),(0,r.jsx)(`span`,{className:[t.default.chevronWrap,_?t.default.chevronOpen:null].filter(Boolean).join(` `),"aria-hidden":`true`,children:(0,r.jsx)(`svg`,{className:t.default.chevron,width:`16`,height:`16`,viewBox:`0 0 16 16`,focusable:`false`,children:(0,r.jsx)(`path`,{d:`M4 6l4 4 4-4`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})})})]}),(0,r.jsx)(`div`,{id:v,role:`region`,"aria-labelledby":y,className:t.default.panel,children:(0,r.jsx)(`div`,{className:t.default.panelInner,children:x.map((n,i)=>(0,r.jsxs)(`div`,{className:t.default.childItem,children:[(0,r.jsx)(e.Separator,{"aria-hidden":`true`}),n]},i))})})]})};exports.ExpanderRow=i;
 //# sourceMappingURL=ExpanderRow.cjs.map

package/dist/components/ExpanderRow/ExpanderRow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ExpanderRow.cjs","names":[],"sources":["../../../src/components/ExpanderRow/ExpanderRow.tsx"],"sourcesContent":["import { Children, type HTMLAttributes, type ReactNode, useId, useState } from 'react';\n\nimport { Separator } from '../Separator';\n\nimport styles from './ExpanderRow.module.css';\n\nexport interface ExpanderRowProps extends HTMLAttributes<HTMLDivElement> {\n  /** Primary label. */\n  title: string;\n  /** Secondary line below the title. */\n  subtitle?: string;\n  /** Icon or image placed at the leading edge of the header row. */\n  leading?: ReactNode;\n  /**\n   * Widget placed at the trailing edge of the header row, before the chevron\n   * (e.g. a value label or a Switch). Stop event propagation inside it so the\n   * row's toggle isn't triggered.\n   */\n  trailing?: ReactNode;\n  /**\n   * Nested rows revealed when expanded. Use `ActionRow`, `ButtonRow`, or any\n   * row-shaped element — separators are inserted automatically.\n   */\n  children?: ReactNode;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Initial expanded state when uncontrolled. Defaults to `false`. */\n  defaultExpanded?: boolean;\n  /** Called when the expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n}\n\n/**\n * Collapsible `ActionRow` that reveals nested rows on activation.\n *\n * Mirrors `AdwExpanderRow` — the header row toggles a reveal animation exposing\n * child rows. Supports both controlled and uncontrolled expand state.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ExpanderRow.html\n */\nexport function ExpanderRow({\n  title,\n  subtitle,\n  leading,\n  trailing,\n  children,\n  expanded: controlledExpanded,\n  defaultExpanded = false,\n  onExpandedChange,\n  className,\n  ...props\n}: ExpanderRowProps) {\n  const isControlled = controlledExpanded !== undefined;\n  const [uncontrolledExpanded, setUncontrolledExpanded] = useState(defaultExpanded);\n  const expanded = isControlled ? controlledExpanded : uncontrolledExpanded;\n\n  const panelId = useId();\n  const headerId = useId();\n\n  const toggle = () => {\n    const next = !expanded;\n\n    if (!isControlled) {\n      setUncontrolledExpanded(next);\n    }\n\n    onExpandedChange?.(next);\n  };\n\n  const childItems = Children.toArray(children).filter(Boolean);\n\n  return (\n    <div\n      className={[styles.expanderRow, expanded ? styles.expanded : null, className]\n        .filter(Boolean)\n        .join(' ')}\n      {...props}\n    >\n      {/* ─── Header (toggle button) ─────────────────────────────────────── */}\n      <button\n        id={headerId}\n        className={styles.header}\n        aria-expanded={expanded}\n        aria-controls={panelId}\n        onClick={toggle}\n      >\n        {leading && <span className={styles.leading}>{leading}</span>}\n\n        <span className={styles.content}>\n          <span className={styles.title}>{title}</span>\n          {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n        </span>\n\n        {trailing && <span className={styles.trailing}>{trailing}</span>}\n\n        <span\n          className={[styles.chevronWrap, expanded ? styles.chevronOpen : null]\n            .filter(Boolean)\n            .join(' ')}\n          aria-hidden=\"true\"\n        >\n          <svg\n            className={styles.chevron}\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            focusable=\"false\"\n          >\n            <path\n              d=\"M4 6l4 4 4-4\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.5\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          </svg>\n        </span>\n      </button>\n\n      {/* ─── Reveal panel ───────────────────────────────────────────────── */}\n      <div id={panelId} role=\"region\" aria-labelledby={headerId} className={styles.panel}>\n        <div className={styles.panelInner}>\n          {childItems.map((child, i) => (\n            <div key={i} className={styles.childItem}>\n              <Separator aria-hidden=\"true\" />\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"8IAwCA,SAAgB,EAAY,CAC1B,QACA,WACA,UACA,WACA,WACA,SAAU,EACV,kBAAkB,GAClB,mBACA,YACA,GAAG,GACgB,CACnB,IAAM,EAAe,IAAuB,IAAA,GACtC,CAAC,EAAsB,IAAA,EAAA,EAAA,UAAoC,EAAgB,CAC3E,EAAW,EAAe,EAAqB,EAE/C,GAAA,EAAA,EAAA,QAAiB,CACjB,GAAA,EAAA,EAAA,QAAkB,CAElB,MAAe,CACnB,IAAM,EAAO,CAAC,EAET,GACH,EAAwB,EAAK,CAG/B,IAAmB,EAAK,EAGpB,EAAa,EAAA,SAAS,QAAQ,EAAS,CAAC,OAAO,QAAQ,CAE7D,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,YAAa,EAAW,EAAA,QAAO,SAAW,KAAM,EAAU,CAC1E,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,GAAI,WAJN,EAOE,EAAA,EAAA,MAAC,SAAD,CACE,GAAI,EACJ,UAAW,EAAA,QAAO,OAClB,gBAAe,EACf,gBAAe,EACf,QAAS,WALX,CAOG,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,EAAe,CAAA,EAE7D,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAxB,EACE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,EAAa,CAAA,CAC5C,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,EAAgB,CAAA,CAC3D,GAEN,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,EAAgB,CAAA,EAEhE,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,CAAC,EAAA,QAAO,YAAa,EAAW,EAAA,QAAO,YAAc,KAAK,CAClE,OAAO,QAAQ,CACf,KAAK,IAAI,CACZ,cAAY,iBAEZ,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,QAAO,QAClB,MAAM,KACN,OAAO,KACP,QAAQ,YACR,UAAU,kBAEV,EAAA,EAAA,KAAC,OAAD,CACE,EAAE,eACF,KAAK,OACL,OAAO,eACP,YAAY,MACZ,cAAc,QACd,eAAe,QACf,CAAA,CACE,CAAA,CACD,CAAA,CACA,IAGT,EAAA,EAAA,KAAC,MAAD,CAAK,GAAI,EAAS,KAAK,SAAS,kBAAiB,EAAU,UAAW,EAAA,QAAO,gBAC3E,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,oBACpB,EAAW,KAAK,EAAO,KACtB,EAAA,EAAA,MAAC,MAAD,CAAa,UAAW,EAAA,QAAO,mBAA/B,EACE,EAAA,EAAA,KAAC,EAAA,UAAD,CAAW,cAAY,OAAS,CAAA,CAC/B,EACG,EAHI,EAGJ,CACN,CACE,CAAA,CACF,CAAA,CACF"}
+{"version":3,"file":"ExpanderRow.cjs","names":[],"sources":["../../../src/components/ExpanderRow/ExpanderRow.tsx"],"sourcesContent":["import { Children, type HTMLAttributes, type ReactNode, useId, useState } from 'react';\n\nimport { Separator } from '../Separator';\n\nimport styles from './ExpanderRow.module.css';\n\nexport interface ExpanderRowProps extends HTMLAttributes<HTMLDivElement> {\n  /** Primary label. */\n  title: string;\n  /** Secondary line below the title. */\n  subtitle?: string;\n  /** Icon or image placed at the leading edge of the header row. */\n  leading?: ReactNode;\n  /**\n   * Widget placed at the trailing edge of the header row, before the chevron\n   * (e.g. a value label or a Switch). Stop event propagation inside it so the\n   * row's toggle isn't triggered.\n   */\n  trailing?: ReactNode;\n  /**\n   * Nested rows revealed when expanded. Use `ActionRow`, `ButtonRow`, or any\n   * row-shaped element — separators are inserted automatically.\n   */\n  children?: ReactNode;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Initial expanded state when uncontrolled. Defaults to `false`. */\n  defaultExpanded?: boolean;\n  /** Called when the expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n}\n\n/**\n * Collapsible `ActionRow` that reveals nested rows on activation.\n *\n * Mirrors `AdwExpanderRow` — the header row toggles a reveal animation exposing\n * child rows. Supports both controlled and uncontrolled expand state.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ExpanderRow.html\n */\nexport const ExpanderRow = ({\n  title,\n  subtitle,\n  leading,\n  trailing,\n  children,\n  expanded: controlledExpanded,\n  defaultExpanded = false,\n  onExpandedChange,\n  className,\n  ...props\n}: ExpanderRowProps) => {\n  const isControlled = controlledExpanded !== undefined;\n  const [uncontrolledExpanded, setUncontrolledExpanded] = useState(defaultExpanded);\n  const expanded = isControlled ? controlledExpanded : uncontrolledExpanded;\n\n  const panelId = useId();\n  const headerId = useId();\n\n  const toggle = () => {\n    const next = !expanded;\n\n    if (!isControlled) {\n      setUncontrolledExpanded(next);\n    }\n\n    onExpandedChange?.(next);\n  };\n\n  const childItems = Children.toArray(children).filter(Boolean);\n\n  return (\n    <div\n      className={[styles.expanderRow, expanded ? styles.expanded : null, className]\n        .filter(Boolean)\n        .join(' ')}\n      {...props}\n    >\n      {/* ─── Header (toggle button) ─────────────────────────────────────── */}\n      <button\n        id={headerId}\n        className={styles.header}\n        aria-expanded={expanded}\n        aria-controls={panelId}\n        onClick={toggle}\n      >\n        {leading && <span className={styles.leading}>{leading}</span>}\n\n        <span className={styles.content}>\n          <span className={styles.title}>{title}</span>\n          {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n        </span>\n\n        {trailing && <span className={styles.trailing}>{trailing}</span>}\n\n        <span\n          className={[styles.chevronWrap, expanded ? styles.chevronOpen : null]\n            .filter(Boolean)\n            .join(' ')}\n          aria-hidden=\"true\"\n        >\n          <svg\n            className={styles.chevron}\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            focusable=\"false\"\n          >\n            <path\n              d=\"M4 6l4 4 4-4\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.5\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          </svg>\n        </span>\n      </button>\n\n      {/* ─── Reveal panel ───────────────────────────────────────────────── */}\n      <div id={panelId} role=\"region\" aria-labelledby={headerId} className={styles.panel}>\n        <div className={styles.panelInner}>\n          {childItems.map((child, i) => (\n            <div key={i} className={styles.childItem}>\n              <Separator aria-hidden=\"true\" />\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":"8IAwCA,IAAa,GAAe,CAC1B,QACA,WACA,UACA,WACA,WACA,SAAU,EACV,kBAAkB,GAClB,mBACA,YACA,GAAG,KACmB,CACtB,IAAM,EAAe,IAAuB,IAAA,GACtC,CAAC,EAAsB,IAAA,EAAA,EAAA,UAAoC,CAAe,EAC1E,EAAW,EAAe,EAAqB,EAE/C,GAAA,EAAA,EAAA,OAAgB,EAChB,GAAA,EAAA,EAAA,OAAiB,EAEjB,MAAe,CACnB,IAAM,EAAO,CAAC,EAET,GACH,EAAwB,CAAI,EAG9B,IAAmB,CAAI,CACzB,EAEM,EAAa,EAAA,SAAS,QAAQ,CAAQ,EAAE,OAAO,OAAO,EAE5D,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,YAAa,EAAW,EAAA,QAAO,SAAW,KAAM,CAAS,EACzE,OAAO,OAAO,EACd,KAAK,GAAG,EACX,GAAI,WAJN,EAOE,EAAA,EAAA,MAAC,SAAD,CACE,GAAI,EACJ,UAAW,EAAA,QAAO,OAClB,gBAAe,EACf,gBAAe,EACf,QAAS,WALX,CAOG,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,CAAc,CAAA,GAE5D,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAxB,EACE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,CAAY,CAAA,EAC3C,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,CAAe,CAAA,CAC3D,IAEL,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBAAW,CAAe,CAAA,GAE/D,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,CAAC,EAAA,QAAO,YAAa,EAAW,EAAA,QAAO,YAAc,IAAI,EACjE,OAAO,OAAO,EACd,KAAK,GAAG,EACX,cAAY,iBAEZ,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,QAAO,QAClB,MAAM,KACN,OAAO,KACP,QAAQ,YACR,UAAU,kBAEV,EAAA,EAAA,KAAC,OAAD,CACE,EAAE,eACF,KAAK,OACL,OAAO,eACP,YAAY,MACZ,cAAc,QACd,eAAe,OAChB,CAAA,CACE,CAAA,CACD,CAAA,CACA,KAGR,EAAA,EAAA,KAAC,MAAD,CAAK,GAAI,EAAS,KAAK,SAAS,kBAAiB,EAAU,UAAW,EAAA,QAAO,gBAC3E,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,oBACpB,EAAW,KAAK,EAAO,KACtB,EAAA,EAAA,MAAC,MAAD,CAAa,UAAW,EAAA,QAAO,mBAA/B,EACE,EAAA,EAAA,KAAC,EAAA,UAAD,CAAW,cAAY,MAAQ,CAAA,EAC9B,CACE,GAHK,CAGL,CACN,CACE,CAAA,CACF,CAAA,CACF,GAET"}

package/dist/components/ExpanderRow/ExpanderRow.d.ts

@@ -32,4 +32,4 @@ export interface ExpanderRowProps extends HTMLAttributes<HTMLDivElement> {
  *
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ExpanderRow.html
  */
-export declare function ExpanderRow({ title, subtitle, leading, trailing, children, expanded: controlledExpanded, defaultExpanded, onExpandedChange, className, ...props }: ExpanderRowProps): import("react/jsx-runtime").JSX.Element;
+export declare const ExpanderRow: ({ title, subtitle, leading, trailing, children, expanded: controlledExpanded, defaultExpanded, onExpandedChange, className, ...props }: ExpanderRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ExpanderRow/ExpanderRow.js

@@ -3,7 +3,7 @@ import t from "./ExpanderRow.module.css.js";
 import { Children as n, useId as r, useState as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/components/ExpanderRow/ExpanderRow.tsx
-function s({ title: s, subtitle: c, leading: l, trailing: u, children: d, expanded: f, defaultExpanded: p = !1, onExpandedChange: m, className: h, ...g }) {
+var s = ({ title: s, subtitle: c, leading: l, trailing: u, children: d, expanded: f, defaultExpanded: p = !1, onExpandedChange: m, className: h, ...g }) => {
 	let _ = f !== void 0, [v, y] = i(p), b = _ ? f : v, x = r(), S = r(), C = () => {
 		let e = !b;
 		_ || y(e), m?.(e);
@@ -74,7 +74,7 @@ function s({ title: s, subtitle: c, leading: l, trailing: u, children: d, expand
 			})
 		})]
 	});
-}
+};
 //#endregion
 export { s as ExpanderRow };
 

package/dist/components/ExpanderRow/ExpanderRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpanderRow.js","names":[],"sources":["../../../src/components/ExpanderRow/ExpanderRow.tsx"],"sourcesContent":["import { Children, type HTMLAttributes, type ReactNode, useId, useState } from 'react';\n\nimport { Separator } from '../Separator';\n\nimport styles from './ExpanderRow.module.css';\n\nexport interface ExpanderRowProps extends HTMLAttributes<HTMLDivElement> {\n  /** Primary label. */\n  title: string;\n  /** Secondary line below the title. */\n  subtitle?: string;\n  /** Icon or image placed at the leading edge of the header row. */\n  leading?: ReactNode;\n  /**\n   * Widget placed at the trailing edge of the header row, before the chevron\n   * (e.g. a value label or a Switch). Stop event propagation inside it so the\n   * row's toggle isn't triggered.\n   */\n  trailing?: ReactNode;\n  /**\n   * Nested rows revealed when expanded. Use `ActionRow`, `ButtonRow`, or any\n   * row-shaped element — separators are inserted automatically.\n   */\n  children?: ReactNode;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Initial expanded state when uncontrolled. Defaults to `false`. */\n  defaultExpanded?: boolean;\n  /** Called when the expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n}\n\n/**\n * Collapsible `ActionRow` that reveals nested rows on activation.\n *\n * Mirrors `AdwExpanderRow` — the header row toggles a reveal animation exposing\n * child rows. Supports both controlled and uncontrolled expand state.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ExpanderRow.html\n */\nexport function ExpanderRow({\n  title,\n  subtitle,\n  leading,\n  trailing,\n  children,\n  expanded: controlledExpanded,\n  defaultExpanded = false,\n  onExpandedChange,\n  className,\n  ...props\n}: ExpanderRowProps) {\n  const isControlled = controlledExpanded !== undefined;\n  const [uncontrolledExpanded, setUncontrolledExpanded] = useState(defaultExpanded);\n  const expanded = isControlled ? controlledExpanded : uncontrolledExpanded;\n\n  const panelId = useId();\n  const headerId = useId();\n\n  const toggle = () => {\n    const next = !expanded;\n\n    if (!isControlled) {\n      setUncontrolledExpanded(next);\n    }\n\n    onExpandedChange?.(next);\n  };\n\n  const childItems = Children.toArray(children).filter(Boolean);\n\n  return (\n    <div\n      className={[styles.expanderRow, expanded ? styles.expanded : null, className]\n        .filter(Boolean)\n        .join(' ')}\n      {...props}\n    >\n      {/* ─── Header (toggle button) ─────────────────────────────────────── */}\n      <button\n        id={headerId}\n        className={styles.header}\n        aria-expanded={expanded}\n        aria-controls={panelId}\n        onClick={toggle}\n      >\n        {leading && <span className={styles.leading}>{leading}</span>}\n\n        <span className={styles.content}>\n          <span className={styles.title}>{title}</span>\n          {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n        </span>\n\n        {trailing && <span className={styles.trailing}>{trailing}</span>}\n\n        <span\n          className={[styles.chevronWrap, expanded ? styles.chevronOpen : null]\n            .filter(Boolean)\n            .join(' ')}\n          aria-hidden=\"true\"\n        >\n          <svg\n            className={styles.chevron}\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            focusable=\"false\"\n          >\n            <path\n              d=\"M4 6l4 4 4-4\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.5\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          </svg>\n        </span>\n      </button>\n\n      {/* ─── Reveal panel ───────────────────────────────────────────────── */}\n      <div id={panelId} role=\"region\" aria-labelledby={headerId} className={styles.panel}>\n        <div className={styles.panelInner}>\n          {childItems.map((child, i) => (\n            <div key={i} className={styles.childItem}>\n              <Separator aria-hidden=\"true\" />\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAwCA,SAAgB,EAAY,EAC1B,UACA,aACA,YACA,aACA,aACA,UAAU,GACV,qBAAkB,IAClB,qBACA,cACA,GAAG,KACgB;CACnB,IAAM,IAAe,MAAuB,KAAA,GACtC,CAAC,GAAsB,KAA2B,EAAS,EAAgB,EAC3E,IAAW,IAAe,IAAqB,GAE/C,IAAU,GAAO,EACjB,IAAW,GAAO,EAElB,UAAe;EACnB,IAAM,IAAO,CAAC;AAMd,EAJK,KACH,EAAwB,EAAK,EAG/B,IAAmB,EAAK;IAGpB,IAAa,EAAS,QAAQ,EAAS,CAAC,OAAO,QAAQ;AAE7D,QACE,kBAAC,OAAD;EACE,WAAW;GAAC,EAAO;GAAa,IAAW,EAAO,WAAW;GAAM;GAAU,CAC1E,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,GAAI;YAJN,CAOE,kBAAC,UAAD;GACE,IAAI;GACJ,WAAW,EAAO;GAClB,iBAAe;GACf,iBAAe;GACf,SAAS;aALX;IAOG,KAAW,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAU;KAAe,CAAA;IAE7D,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAxB,CACE,kBAAC,QAAD;MAAM,WAAW,EAAO;gBAAQ;MAAa,CAAA,EAC5C,KAAY,kBAAC,QAAD;MAAM,WAAW,EAAO;gBAAW;MAAgB,CAAA,CAC3D;;IAEN,KAAY,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAW;KAAgB,CAAA;IAEhE,kBAAC,QAAD;KACE,WAAW,CAAC,EAAO,aAAa,IAAW,EAAO,cAAc,KAAK,CAClE,OAAO,QAAQ,CACf,KAAK,IAAI;KACZ,eAAY;eAEZ,kBAAC,OAAD;MACE,WAAW,EAAO;MAClB,OAAM;MACN,QAAO;MACP,SAAQ;MACR,WAAU;gBAEV,kBAAC,QAAD;OACE,GAAE;OACF,MAAK;OACL,QAAO;OACP,aAAY;OACZ,eAAc;OACd,gBAAe;OACf,CAAA;MACE,CAAA;KACD,CAAA;IACA;MAGT,kBAAC,OAAD;GAAK,IAAI;GAAS,MAAK;GAAS,mBAAiB;GAAU,WAAW,EAAO;aAC3E,kBAAC,OAAD;IAAK,WAAW,EAAO;cACpB,EAAW,KAAK,GAAO,MACtB,kBAAC,OAAD;KAAa,WAAW,EAAO;eAA/B,CACE,kBAAC,GAAD,EAAW,eAAY,QAAS,CAAA,EAC/B,EACG;OAHI,EAGJ,CACN;IACE,CAAA;GACF,CAAA,CACF"}
+{"version":3,"file":"ExpanderRow.js","names":[],"sources":["../../../src/components/ExpanderRow/ExpanderRow.tsx"],"sourcesContent":["import { Children, type HTMLAttributes, type ReactNode, useId, useState } from 'react';\n\nimport { Separator } from '../Separator';\n\nimport styles from './ExpanderRow.module.css';\n\nexport interface ExpanderRowProps extends HTMLAttributes<HTMLDivElement> {\n  /** Primary label. */\n  title: string;\n  /** Secondary line below the title. */\n  subtitle?: string;\n  /** Icon or image placed at the leading edge of the header row. */\n  leading?: ReactNode;\n  /**\n   * Widget placed at the trailing edge of the header row, before the chevron\n   * (e.g. a value label or a Switch). Stop event propagation inside it so the\n   * row's toggle isn't triggered.\n   */\n  trailing?: ReactNode;\n  /**\n   * Nested rows revealed when expanded. Use `ActionRow`, `ButtonRow`, or any\n   * row-shaped element — separators are inserted automatically.\n   */\n  children?: ReactNode;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Initial expanded state when uncontrolled. Defaults to `false`. */\n  defaultExpanded?: boolean;\n  /** Called when the expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n}\n\n/**\n * Collapsible `ActionRow` that reveals nested rows on activation.\n *\n * Mirrors `AdwExpanderRow` — the header row toggles a reveal animation exposing\n * child rows. Supports both controlled and uncontrolled expand state.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ExpanderRow.html\n */\nexport const ExpanderRow = ({\n  title,\n  subtitle,\n  leading,\n  trailing,\n  children,\n  expanded: controlledExpanded,\n  defaultExpanded = false,\n  onExpandedChange,\n  className,\n  ...props\n}: ExpanderRowProps) => {\n  const isControlled = controlledExpanded !== undefined;\n  const [uncontrolledExpanded, setUncontrolledExpanded] = useState(defaultExpanded);\n  const expanded = isControlled ? controlledExpanded : uncontrolledExpanded;\n\n  const panelId = useId();\n  const headerId = useId();\n\n  const toggle = () => {\n    const next = !expanded;\n\n    if (!isControlled) {\n      setUncontrolledExpanded(next);\n    }\n\n    onExpandedChange?.(next);\n  };\n\n  const childItems = Children.toArray(children).filter(Boolean);\n\n  return (\n    <div\n      className={[styles.expanderRow, expanded ? styles.expanded : null, className]\n        .filter(Boolean)\n        .join(' ')}\n      {...props}\n    >\n      {/* ─── Header (toggle button) ─────────────────────────────────────── */}\n      <button\n        id={headerId}\n        className={styles.header}\n        aria-expanded={expanded}\n        aria-controls={panelId}\n        onClick={toggle}\n      >\n        {leading && <span className={styles.leading}>{leading}</span>}\n\n        <span className={styles.content}>\n          <span className={styles.title}>{title}</span>\n          {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n        </span>\n\n        {trailing && <span className={styles.trailing}>{trailing}</span>}\n\n        <span\n          className={[styles.chevronWrap, expanded ? styles.chevronOpen : null]\n            .filter(Boolean)\n            .join(' ')}\n          aria-hidden=\"true\"\n        >\n          <svg\n            className={styles.chevron}\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            focusable=\"false\"\n          >\n            <path\n              d=\"M4 6l4 4 4-4\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"1.5\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            />\n          </svg>\n        </span>\n      </button>\n\n      {/* ─── Reveal panel ───────────────────────────────────────────────── */}\n      <div id={panelId} role=\"region\" aria-labelledby={headerId} className={styles.panel}>\n        <div className={styles.panelInner}>\n          {childItems.map((child, i) => (\n            <div key={i} className={styles.childItem}>\n              <Separator aria-hidden=\"true\" />\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;AAwCA,IAAa,KAAe,EAC1B,UACA,aACA,YACA,aACA,aACA,UAAU,GACV,qBAAkB,IAClB,qBACA,cACA,GAAG,QACmB;CACtB,IAAM,IAAe,MAAuB,KAAA,GACtC,CAAC,GAAsB,KAA2B,EAAS,CAAe,GAC1E,IAAW,IAAe,IAAqB,GAE/C,IAAU,EAAM,GAChB,IAAW,EAAM,GAEjB,UAAe;EACnB,IAAM,IAAO,CAAC;EAMd,AAJK,KACH,EAAwB,CAAI,GAG9B,IAAmB,CAAI;CACzB,GAEM,IAAa,EAAS,QAAQ,CAAQ,EAAE,OAAO,OAAO;CAE5D,OACE,kBAAC,OAAD;EACE,WAAW;GAAC,EAAO;GAAa,IAAW,EAAO,WAAW;GAAM;EAAS,EACzE,OAAO,OAAO,EACd,KAAK,GAAG;EACX,GAAI;YAJN,CAOE,kBAAC,UAAD;GACE,IAAI;GACJ,WAAW,EAAO;GAClB,iBAAe;GACf,iBAAe;GACf,SAAS;aALX;IAOG,KAAW,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAU;IAAc,CAAA;IAE5D,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAxB,CACE,kBAAC,QAAD;MAAM,WAAW,EAAO;gBAAQ;KAAY,CAAA,GAC3C,KAAY,kBAAC,QAAD;MAAM,WAAW,EAAO;gBAAW;KAAe,CAAA,CAC3D;;IAEL,KAAY,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAW;IAAe,CAAA;IAE/D,kBAAC,QAAD;KACE,WAAW,CAAC,EAAO,aAAa,IAAW,EAAO,cAAc,IAAI,EACjE,OAAO,OAAO,EACd,KAAK,GAAG;KACX,eAAY;eAEZ,kBAAC,OAAD;MACE,WAAW,EAAO;MAClB,OAAM;MACN,QAAO;MACP,SAAQ;MACR,WAAU;gBAEV,kBAAC,QAAD;OACE,GAAE;OACF,MAAK;OACL,QAAO;OACP,aAAY;OACZ,eAAc;OACd,gBAAe;MAChB,CAAA;KACE,CAAA;IACD,CAAA;GACA;MAGR,kBAAC,OAAD;GAAK,IAAI;GAAS,MAAK;GAAS,mBAAiB;GAAU,WAAW,EAAO;aAC3E,kBAAC,OAAD;IAAK,WAAW,EAAO;cACpB,EAAW,KAAK,GAAO,MACtB,kBAAC,OAAD;KAAa,WAAW,EAAO;eAA/B,CACE,kBAAC,GAAD,EAAW,eAAY,OAAQ,CAAA,GAC9B,CACE;OAHK,CAGL,CACN;GACE,CAAA;EACF,CAAA,CACF;;AAET"}

package/dist/components/ExpanderRow.cjs

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

package/dist/components/Footer/Footer.cjs

@@ -1,2 +1,2 @@
-const e=require(`./Footer.module.css.cjs`);let t=require(`react/jsx-runtime`);function n({start:n,end:r,children:i,flat:a=!1,className:o,...s}){return(0,t.jsxs)(`footer`,{className:[e.default.footer,a?e.default.flat:null,o].filter(Boolean).join(` `),...s,children:[(0,t.jsx)(`div`,{className:e.default.slot,children:n}),i!=null&&(0,t.jsx)(`div`,{className:e.default.center,children:i}),(0,t.jsx)(`div`,{className:[e.default.slot,e.default.slotEnd].filter(Boolean).join(` `),children:r})]})}exports.Footer=n;
+const e=require("./Footer.module.css.cjs");let t=require("react/jsx-runtime");var n=({start:n,end:r,children:i,flat:a=!1,className:o,...s})=>(0,t.jsxs)(`footer`,{className:[e.default.footer,a?e.default.flat:null,o].filter(Boolean).join(` `),...s,children:[(0,t.jsx)(`div`,{className:e.default.slot,children:n}),i!=null&&(0,t.jsx)(`div`,{className:e.default.center,children:i}),(0,t.jsx)(`div`,{className:[e.default.slot,e.default.slotEnd].filter(Boolean).join(` `),children:r})]});exports.Footer=n;
 //# sourceMappingURL=Footer.cjs.map