npm - @gnome-ui/react - Versions diffs - 1.45.1 → 1.46.0 - Mend

@gnome-ui/react 1.45.1 → 1.46.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (576) hide show

package/dist/components/CheckRow/CheckRow.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`./CheckRow.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({title:r,subtitle:i,leading:a,checked:o,defaultChecked:s=!1,onCheckedChange:c,disabled:l=!1,className:u,onClick:d,...f}){let p=o!==void 0,[m,h]=(0,t.useState)(s),g=p?o:m,_=(0,t.useId)(),v=e=>{let t=!g;p||h(t),c?.(t),d?.(e)};return(0,n.jsxs)(`button`,{role:`checkbox`,"aria-checked":g,"aria-labelledby":_,disabled:l,className:[e.default.row,l?e.default.disabled:null,u].filter(Boolean).join(` `),onClick:v,...f,children:[(0,n.jsx)(`span`,{className:e.default.checkboxWrap,"aria-hidden":`true`,children:(0,n.jsx)(`span`,{className:[e.default.checkbox,g?e.default.checkboxChecked:null].filter(Boolean).join(` `),children:g&&(0,n.jsx)(`svg`,{className:e.default.checkmark,width:`12`,height:`12`,viewBox:`0 0 12 12`,focusable:`false`,children:(0,n.jsx)(`path`,{d:`M2 6l3 3 5-5`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.75`,strokeLinecap:`round`,strokeLinejoin:`round`})})})}),a&&(0,n.jsx)(`span`,{className:e.default.leading,children:a}),(0,n.jsxs)(`span`,{className:e.default.content,id:_,children:[(0,n.jsx)(`span`,{className:e.default.title,children:r}),i&&(0,n.jsx)(`span`,{className:e.default.subtitle,children:i})]})]})}exports.CheckRow=r;
+const e=require("./CheckRow.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({title:r,subtitle:i,leading:a,checked:o,defaultChecked:s=!1,onCheckedChange:c,disabled:l=!1,className:u,onClick:d,...f})=>{let p=o!==void 0,[m,h]=(0,t.useState)(s),g=p?o:m,_=(0,t.useId)();return(0,n.jsxs)(`button`,{role:`checkbox`,"aria-checked":g,"aria-labelledby":_,disabled:l,className:[e.default.row,l?e.default.disabled:null,u].filter(Boolean).join(` `),onClick:e=>{let t=!g;p||h(t),c?.(t),d?.(e)},...f,children:[(0,n.jsx)(`span`,{className:e.default.checkboxWrap,"aria-hidden":`true`,children:(0,n.jsx)(`span`,{className:[e.default.checkbox,g?e.default.checkboxChecked:null].filter(Boolean).join(` `),children:g&&(0,n.jsx)(`svg`,{className:e.default.checkmark,width:`12`,height:`12`,viewBox:`0 0 12 12`,focusable:`false`,children:(0,n.jsx)(`path`,{d:`M2 6l3 3 5-5`,fill:`none`,stroke:`currentColor`,strokeWidth:`1.75`,strokeLinecap:`round`,strokeLinejoin:`round`})})})}),a&&(0,n.jsx)(`span`,{className:e.default.leading,children:a}),(0,n.jsxs)(`span`,{className:e.default.content,id:_,children:[(0,n.jsx)(`span`,{className:e.default.title,children:r}),i&&(0,n.jsx)(`span`,{className:e.default.subtitle,children:i})]})]})};exports.CheckRow=r;
 //# sourceMappingURL=CheckRow.cjs.map

package/dist/components/CheckRow/CheckRow.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckRow.cjs","names":[],"sources":["../../../src/components/CheckRow/CheckRow.tsx"],"sourcesContent":["import { type HTMLAttributes, type MouseEvent, type ReactNode, useId, useState } from 'react';\n\nimport styles from './CheckRow.module.css';\n\nexport interface CheckRowProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {\n /** Primary label. /\n title: string;\n /* Secondary line below the title. /\n subtitle?: string;\n /* Icon or image placed at the leading edge. /\n leading?: ReactNode;\n /* Controlled checked state. /\n checked?: boolean;\n /* Initial checked state when uncontrolled. Defaults to `false`. /\n defaultChecked?: boolean;\n /* Called when the checked state changes. /\n onCheckedChange?: (checked: boolean) => void;\n /* Disables the row. /\n disabled?: boolean;\n}\n\n/\n Activatable row with an integrated checkbox.\n \n The entire row is a button — clicking anywhere toggles the checkbox.\n * Mirrors the `AdwCheckButton`-in-a-row pattern used in list selection contexts.\n \n Supports both controlled (`checked`) and uncontrolled (`defaultChecked`) modes.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.CheckButton.html\n /\nexport ~~function~~ CheckRow({\n title,\n subtitle,\n leading,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n disabled = false,\n className,\n onClick,\n ...props\n}: CheckRowProps) {\n const isControlled = controlledChecked !== undefined;\n const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked);\n const checked = isControlled ? controlledChecked : uncontrolledChecked;\n\n const labelId = useId();\n\n const handleClick = (e: MouseEvent<HTMLButtonElement>) => {\n const next = !checked;\n\n if (!isControlled) {\n setUncontrolledChecked(next);\n }\n\n onCheckedChange?.(next);\n onClick?.(e);\n };\n\n return (\n <button\n role=\"checkbox\"\n aria-checked={checked}\n aria-labelledby={labelId}\n disabled={disabled}\n className={[styles.row, disabled ? styles.disabled : null, className]\n .filter(Boolean)\n .join(' ')}\n onClick={handleClick}\n {...props}\n >\n {/ Visual checkbox — aria-hidden since the button carries the role */}\n <span className={styles.checkboxWrap} aria-hidden=\"true\">\n <span\n className={[styles.checkbox, checked ? styles.checkboxChecked : null]\n .filter(Boolean)\n .join(' ')}\n >\n {checked && (\n <svg\n className={styles.checkmark}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n focusable=\"false\"\n >\n <path\n d=\"M2 6l3 3 5-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.75\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </span>\n </span>\n\n {leading && <span className={styles.leading}>{leading}</span>}\n\n <span className={styles.content} id={labelId}>\n <span className={styles.title}>{title}</span>\n {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n </span>\n </button>\n );\n}\n"],"mappings":"mGA+BA,~~SAAgB~~,~~EAAS~~,CACvB,QACA,WACA,UACA,QAAS,EACT,iBAAiB,GACjB,kBACA,WAAW,GACX,YACA,UACA,GAAG,~~GACa~~,~~CAChB~~,IAAM,EAAe,IAAsB,IAAA,GACrC,CAAC,EAAqB,IAAA,EAAA,EAAA,UAAmC,~~EAAe~~,~~CACxE~~,EAAU,EAAe,EAAoB,EAE7C,GAAA,EAAA,EAAA,~~QAAiB~~,~~CAEjB~~,~~EAAe,GAAqC,CACxD,IAAM,EAAO,CAAC,EAET,GACH,EAAuB,EAAK,CAG9B,IAAkB,EAAK,CACvB,IAAU,EAAE,EAGd,~~OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,WACL,eAAc,EACd,kBAAiB,EACP,WACV,UAAW,CAAC,EAAA,QAAO,IAAK,EAAW,EAAA,QAAO,SAAW,KAAM,~~EAAU~~,~~CAClE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~,~~CACZ~~,~~QAAS~~,~~EACT~~,GAAI,WATN,EAYE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,aAAc,cAAY,iBAChD,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,CAAC,EAAA,QAAO,SAAU,EAAU,EAAA,QAAO,gBAAkB,~~KAAK~~,~~CAClE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~,~~UAEX~~,IACC,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,QAAO,UAClB,MAAM,KACN,OAAO,KACP,QAAQ,YACR,UAAU,kBAEV,EAAA,EAAA,KAAC,OAAD,CACE,EAAE,eACF,KAAK,OACL,OAAO,eACP,YAAY,OACZ,cAAc,QACd,eAAe,~~QACf~~,CAAA,CACE,CAAA,CAEH,CAAA,CACF,CAAA,~~CAEN~~,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,~~EAAe~~,CAAA,~~EAE7D~~,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,QAAS,GAAI,WAArC,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,GACA"}
1	+ {"version":3,"file":"CheckRow.cjs","names":[],"sources":["../../../src/components/CheckRow/CheckRow.tsx"],"sourcesContent":["import { type HTMLAttributes, type MouseEvent, type ReactNode, useId, useState } from 'react';\n\nimport styles from './CheckRow.module.css';\n\nexport interface CheckRowProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {\n /** Primary label. /\n title: string;\n /* Secondary line below the title. /\n subtitle?: string;\n /* Icon or image placed at the leading edge. /\n leading?: ReactNode;\n /* Controlled checked state. /\n checked?: boolean;\n /* Initial checked state when uncontrolled. Defaults to `false`. /\n defaultChecked?: boolean;\n /* Called when the checked state changes. /\n onCheckedChange?: (checked: boolean) => void;\n /* Disables the row. /\n disabled?: boolean;\n}\n\n/\n Activatable row with an integrated checkbox.\n \n The entire row is a button — clicking anywhere toggles the checkbox.\n * Mirrors the `AdwCheckButton`-in-a-row pattern used in list selection contexts.\n \n Supports both controlled (`checked`) and uncontrolled (`defaultChecked`) modes.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.CheckButton.html\n /\nexport const CheckRow = ({\n title,\n subtitle,\n leading,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n disabled = false,\n className,\n onClick,\n ...props\n}: CheckRowProps) => {\n const isControlled = controlledChecked !== undefined;\n const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked);\n const checked = isControlled ? controlledChecked : uncontrolledChecked;\n\n const labelId = useId();\n\n const handleClick = (e: MouseEvent<HTMLButtonElement>) => {\n const next = !checked;\n\n if (!isControlled) {\n setUncontrolledChecked(next);\n }\n\n onCheckedChange?.(next);\n onClick?.(e);\n };\n\n return (\n <button\n role=\"checkbox\"\n aria-checked={checked}\n aria-labelledby={labelId}\n disabled={disabled}\n className={[styles.row, disabled ? styles.disabled : null, className]\n .filter(Boolean)\n .join(' ')}\n onClick={handleClick}\n {...props}\n >\n {/ Visual checkbox — aria-hidden since the button carries the role */}\n <span className={styles.checkboxWrap} aria-hidden=\"true\">\n <span\n className={[styles.checkbox, checked ? styles.checkboxChecked : null]\n .filter(Boolean)\n .join(' ')}\n >\n {checked && (\n <svg\n className={styles.checkmark}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n focusable=\"false\"\n >\n <path\n d=\"M2 6l3 3 5-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.75\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </span>\n </span>\n\n {leading && <span className={styles.leading}>{leading}</span>}\n\n <span className={styles.content} id={labelId}>\n <span className={styles.title}>{title}</span>\n {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n </span>\n </button>\n );\n};\n"],"mappings":"mGA+BA,IAAa,GAAY,CACvB,QACA,WACA,UACA,QAAS,EACT,iBAAiB,GACjB,kBACA,WAAW,GACX,YACA,UACA,GAAG,KACgB,CACnB,IAAM,EAAe,IAAsB,IAAA,GACrC,CAAC,EAAqB,IAAA,EAAA,EAAA,UAAmC,CAAc,EACvE,EAAU,EAAe,EAAoB,EAE7C,GAAA,EAAA,EAAA,OAAgB,EAatB,OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,WACL,eAAc,EACd,kBAAiB,EACP,WACV,UAAW,CAAC,EAAA,QAAO,IAAK,EAAW,EAAA,QAAO,SAAW,KAAM,CAAS,EACjE,OAAO,OAAO,EACd,KAAK,GAAG,EACX,QApBiB,GAAqC,CACxD,IAAM,EAAO,CAAC,EAET,GACH,EAAuB,CAAI,EAG7B,IAAkB,CAAI,EACtB,IAAU,CAAC,CACb,EAYI,GAAI,WATN,EAYE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,aAAc,cAAY,iBAChD,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,CAAC,EAAA,QAAO,SAAU,EAAU,EAAA,QAAO,gBAAkB,IAAI,EACjE,OAAO,OAAO,EACd,KAAK,GAAG,WAEV,IACC,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,QAAO,UAClB,MAAM,KACN,OAAO,KACP,QAAQ,YACR,UAAU,kBAEV,EAAA,EAAA,KAAC,OAAD,CACE,EAAE,eACF,KAAK,OACL,OAAO,eACP,YAAY,OACZ,cAAc,QACd,eAAe,OAChB,CAAA,CACE,CAAA,CAEH,CAAA,CACF,CAAA,EAEL,IAAW,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAU,CAAc,CAAA,GAE5D,EAAA,EAAA,MAAC,OAAD,CAAM,UAAW,EAAA,QAAO,QAAS,GAAI,WAArC,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,GACA,GAEZ"}

package/dist/components/CheckRow/CheckRow.d.ts CHANGED Viewed

@@ -25,4 +25,4 @@ export interface CheckRowProps extends Omit<HTMLAttributes<HTMLButtonElement>, '
  *
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.CheckButton.html
  */
-export declare function CheckRow({ title, subtitle, leading, checked: controlledChecked, defaultChecked, onCheckedChange, disabled, className, onClick, ...props }: CheckRowProps): import("react/jsx-runtime").JSX.Element;
+export declare const CheckRow: ({ title, subtitle, leading, checked: controlledChecked, defaultChecked, onCheckedChange, disabled, className, onClick, ...props }: CheckRowProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/CheckRow/CheckRow.js CHANGED Viewed

@@ -2,11 +2,8 @@ import e from "./CheckRow.module.css.js";
 import { useId as t, useState as n } from "react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/CheckRow/CheckRow.tsx
-function a({ title: a, subtitle: o, leading: s, checked: c, defaultChecked: l = !1, onCheckedChange: u, disabled: d = !1, className: f, onClick: p, ...m }) {
-	let h = c !== void 0, [g, _] = n(l), v = h ? c : g, y = t(), b = (e) => {
-		let t = !v;
-		h || _(t), u?.(t), p?.(e);
-	};
+var a = ({ title: a, subtitle: o, leading: s, checked: c, defaultChecked: l = !1, onCheckedChange: u, disabled: d = !1, className: f, onClick: p, ...m }) => {
+	let h = c !== void 0, [g, _] = n(l), v = h ? c : g, y = t();
 	return /* @__PURE__ */ i("button", {
 		role: "checkbox",
 		"aria-checked": v,
@@ -17,7 +14,10 @@ function a({ title: a, subtitle: o, leading: s, checked: c, defaultChecked: l =
 			d ? e.disabled : null,
 			f
 		].filter(Boolean).join(" "),
-		onClick: b,
+		onClick: (e) => {
+			let t = !v;
+			h || _(t), u?.(t), p?.(e);
+		},
 		...m,
 		children: [
 			/* @__PURE__ */ r("span", {
@@ -59,7 +59,7 @@ function a({ title: a, subtitle: o, leading: s, checked: c, defaultChecked: l =
 			})
 		]
 	});
-}
+};
 //#endregion
 export { a as CheckRow };

package/dist/components/CheckRow/CheckRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckRow.js","names":[],"sources":["../../../src/components/CheckRow/CheckRow.tsx"],"sourcesContent":["import { type HTMLAttributes, type MouseEvent, type ReactNode, useId, useState } from 'react';\n\nimport styles from './CheckRow.module.css';\n\nexport interface CheckRowProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {\n /** Primary label. /\n title: string;\n /* Secondary line below the title. /\n subtitle?: string;\n /* Icon or image placed at the leading edge. /\n leading?: ReactNode;\n /* Controlled checked state. /\n checked?: boolean;\n /* Initial checked state when uncontrolled. Defaults to `false`. /\n defaultChecked?: boolean;\n /* Called when the checked state changes. /\n onCheckedChange?: (checked: boolean) => void;\n /* Disables the row. /\n disabled?: boolean;\n}\n\n/\n Activatable row with an integrated checkbox.\n \n The entire row is a button — clicking anywhere toggles the checkbox.\n * Mirrors the `AdwCheckButton`-in-a-row pattern used in list selection contexts.\n \n Supports both controlled (`checked`) and uncontrolled (`defaultChecked`) modes.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.CheckButton.html\n /\nexport ~~function~~ CheckRow({\n title,\n subtitle,\n leading,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n disabled = false,\n className,\n onClick,\n ...props\n}: CheckRowProps) {\n const isControlled = controlledChecked !== undefined;\n const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked);\n const checked = isControlled ? controlledChecked : uncontrolledChecked;\n\n const labelId = useId();\n\n const handleClick = (e: MouseEvent<HTMLButtonElement>) => {\n const next = !checked;\n\n if (!isControlled) {\n setUncontrolledChecked(next);\n }\n\n onCheckedChange?.(next);\n onClick?.(e);\n };\n\n return (\n <button\n role=\"checkbox\"\n aria-checked={checked}\n aria-labelledby={labelId}\n disabled={disabled}\n className={[styles.row, disabled ? styles.disabled : null, className]\n .filter(Boolean)\n .join(' ')}\n onClick={handleClick}\n {...props}\n >\n {/ Visual checkbox — aria-hidden since the button carries the role */}\n <span className={styles.checkboxWrap} aria-hidden=\"true\">\n <span\n className={[styles.checkbox, checked ? styles.checkboxChecked : null]\n .filter(Boolean)\n .join(' ')}\n >\n {checked && (\n <svg\n className={styles.checkmark}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n focusable=\"false\"\n >\n <path\n d=\"M2 6l3 3 5-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.75\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </span>\n </span>\n\n {leading && <span className={styles.leading}>{leading}</span>}\n\n <span className={styles.content} id={labelId}>\n <span className={styles.title}>{title}</span>\n {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n </span>\n </button>\n );\n}\n"],"mappings":";;;;AA+BA,~~SAAgB~~,~~EAAS~~,EACvB,UACA,aACA,YACA,SAAS,GACT,oBAAiB,IACjB,oBACA,cAAW,IACX,cACA,YACA,GAAG,~~KACa~~;~~CAChB~~,IAAM,IAAe,MAAsB,KAAA,GACrC,CAAC,GAAqB,KAA0B,EAAS,~~EAAe~~,~~EACxE~~,IAAU,IAAe,IAAoB,GAE7C,IAAU,~~GAAO,EAEjB,KAAe,MAAqC~~;~~EACxD~~,~~IAAM~~,~~IAAO,CAAC;AAOd,EALK,KACH,EAAuB,EAAK,EAG9B,IAAkB,EAAK,EACvB,IAAU,EAAE;;AAGd,QACE,~~kBAAC,UAAD;EACE,MAAK;EACL,gBAAc;EACd,mBAAiB;EACP;EACV,WAAW;GAAC,EAAO;GAAK,IAAW,EAAO,WAAW;GAAM;~~GAAU~~,~~CAClE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~;~~EACZ~~,~~SAAS~~;~~EACT~~,GAAI;YATN;GAYE,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAc,eAAY;cAChD,kBAAC,QAAD;KACE,WAAW,CAAC,EAAO,UAAU,IAAU,EAAO,kBAAkB,~~KAAK~~,~~CAClE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~;~~eAEX~~,KACC,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;~~KAEH~~,CAAA;~~IACF~~,CAAA;~~GAEN~~,KAAW,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAU;~~IAAe~~,CAAA;~~GAE7D~~,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAS,IAAI;cAArC,CACE,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAQ;~~KAAa~~,CAAA,~~EAC5C~~,KAAY,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAW;~~KAAgB~~,CAAA,CAC3D;;~~GACA~~"}
1	+ {"version":3,"file":"CheckRow.js","names":[],"sources":["../../../src/components/CheckRow/CheckRow.tsx"],"sourcesContent":["import { type HTMLAttributes, type MouseEvent, type ReactNode, useId, useState } from 'react';\n\nimport styles from './CheckRow.module.css';\n\nexport interface CheckRowProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {\n /** Primary label. /\n title: string;\n /* Secondary line below the title. /\n subtitle?: string;\n /* Icon or image placed at the leading edge. /\n leading?: ReactNode;\n /* Controlled checked state. /\n checked?: boolean;\n /* Initial checked state when uncontrolled. Defaults to `false`. /\n defaultChecked?: boolean;\n /* Called when the checked state changes. /\n onCheckedChange?: (checked: boolean) => void;\n /* Disables the row. /\n disabled?: boolean;\n}\n\n/\n Activatable row with an integrated checkbox.\n \n The entire row is a button — clicking anywhere toggles the checkbox.\n * Mirrors the `AdwCheckButton`-in-a-row pattern used in list selection contexts.\n \n Supports both controlled (`checked`) and uncontrolled (`defaultChecked`) modes.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.CheckButton.html\n /\nexport const CheckRow = ({\n title,\n subtitle,\n leading,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n disabled = false,\n className,\n onClick,\n ...props\n}: CheckRowProps) => {\n const isControlled = controlledChecked !== undefined;\n const [uncontrolledChecked, setUncontrolledChecked] = useState(defaultChecked);\n const checked = isControlled ? controlledChecked : uncontrolledChecked;\n\n const labelId = useId();\n\n const handleClick = (e: MouseEvent<HTMLButtonElement>) => {\n const next = !checked;\n\n if (!isControlled) {\n setUncontrolledChecked(next);\n }\n\n onCheckedChange?.(next);\n onClick?.(e);\n };\n\n return (\n <button\n role=\"checkbox\"\n aria-checked={checked}\n aria-labelledby={labelId}\n disabled={disabled}\n className={[styles.row, disabled ? styles.disabled : null, className]\n .filter(Boolean)\n .join(' ')}\n onClick={handleClick}\n {...props}\n >\n {/ Visual checkbox — aria-hidden since the button carries the role */}\n <span className={styles.checkboxWrap} aria-hidden=\"true\">\n <span\n className={[styles.checkbox, checked ? styles.checkboxChecked : null]\n .filter(Boolean)\n .join(' ')}\n >\n {checked && (\n <svg\n className={styles.checkmark}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 12 12\"\n focusable=\"false\"\n >\n <path\n d=\"M2 6l3 3 5-5\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"1.75\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </span>\n </span>\n\n {leading && <span className={styles.leading}>{leading}</span>}\n\n <span className={styles.content} id={labelId}>\n <span className={styles.title}>{title}</span>\n {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n </span>\n </button>\n );\n};\n"],"mappings":";;;;AA+BA,IAAa,KAAY,EACvB,UACA,aACA,YACA,SAAS,GACT,oBAAiB,IACjB,oBACA,cAAW,IACX,cACA,YACA,GAAG,QACgB;CACnB,IAAM,IAAe,MAAsB,KAAA,GACrC,CAAC,GAAqB,KAA0B,EAAS,CAAc,GACvE,IAAU,IAAe,IAAoB,GAE7C,IAAU,EAAM;CAatB,OACE,kBAAC,UAAD;EACE,MAAK;EACL,gBAAc;EACd,mBAAiB;EACP;EACV,WAAW;GAAC,EAAO;GAAK,IAAW,EAAO,WAAW;GAAM;EAAS,EACjE,OAAO,OAAO,EACd,KAAK,GAAG;EACX,UApBiB,MAAqC;GACxD,IAAM,IAAO,CAAC;GAOd,AALK,KACH,EAAuB,CAAI,GAG7B,IAAkB,CAAI,GACtB,IAAU,CAAC;EACb;EAYI,GAAI;YATN;GAYE,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAc,eAAY;cAChD,kBAAC,QAAD;KACE,WAAW,CAAC,EAAO,UAAU,IAAU,EAAO,kBAAkB,IAAI,EACjE,OAAO,OAAO,EACd,KAAK,GAAG;eAEV,KACC,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;IAEH,CAAA;GACF,CAAA;GAEL,KAAW,kBAAC,QAAD;IAAM,WAAW,EAAO;cAAU;GAAc,CAAA;GAE5D,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAS,IAAI;cAArC,CACE,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAQ;IAAY,CAAA,GAC3C,KAAY,kBAAC,QAAD;KAAM,WAAW,EAAO;eAAW;IAAe,CAAA,CAC3D;;EACA;;AAEZ"}

package/dist/components/CheckRow.cjs CHANGED Viewed

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

package/dist/components/Checkbox/Checkbox.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`./Checkbox.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({indeterminate:r=!1,className:i,...a}){let o=(0,t.useRef)(null);return(0,t.useEffect)(()=>{o.current&&(o.current.indeterminate=r)},[r]),(0,n.jsx)(`input`,{ref:o,type:`checkbox`,className:[e.default.checkbox,i].filter(Boolean).join(` `),...a})}exports.Checkbox=r;
+const e=require("./Checkbox.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({indeterminate:r=!1,className:i,...a})=>{let o=(0,t.useRef)(null);return(0,t.useEffect)(()=>{o.current&&(o.current.indeterminate=r)},[r]),(0,n.jsx)(`input`,{ref:o,type:`checkbox`,className:[e.default.checkbox,i].filter(Boolean).join(` `),...a})};exports.Checkbox=r;
 //# sourceMappingURL=Checkbox.cjs.map

package/dist/components/Checkbox/Checkbox.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.cjs","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { type InputHTMLAttributes, useEffect, useRef } from 'react';\n\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n /*\n Indeterminate state — shown when only some children in a group are checked.\n * Takes visual precedence over `checked`.\n /\n indeterminate?: boolean;\n /* Accessible label. Required when no visible `<label>` is associated. /\n 'aria-label'?: string;\n}\n\n/\n Checkbox for multi-selection, following the GNOME HIG and Adwaita style.\n \n Supports three states: unchecked, checked, and indeterminate (mixed).\n * Use `indeterminate` for \"select all\" controls when only some items are selected.\n \n Renders as `<input type=\"checkbox\">` — natively keyboard-accessible and\n * compatible with standard form libraries.\n \n @see https://developer.gnome.org/hig/patterns/controls/checkboxes.html\n */\nexport ~~function~~ Checkbox({ indeterminate = false, className, ...props }: CheckboxProps) {\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.indeterminate = indeterminate;\n }\n }, [indeterminate]);\n\n return (\n <input\n ref={ref}\n type=\"checkbox\"\n className={[styles.checkbox, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n}\n"],"mappings":"mGAyBA,~~SAAgB~~,~~EAAS~~,CAAE,gBAAgB,GAAO,YAAW,GAAG,~~GAAwB~~,~~CACtF~~,IAAM,GAAA,EAAA,EAAA,QAA+B,~~KAAK~~,~~CAQ1C~~,OANA,EAAA,EAAA,eAAgB,CACV,EAAI,UACN,EAAI,QAAQ,cAAgB,~~IAE7B~~,CAAC,~~EAAc~~,CAAC,~~EAGjB~~,EAAA,EAAA,KAAC,QAAD,CACO,MACL,KAAK,WACL,UAAW,CAAC,EAAA,QAAO,SAAU,~~EAAU~~,~~CAAC~~,OAAO,~~QAAQ~~,~~CAAC~~,KAAK,~~IAAI~~,~~CACjE~~,GAAI,~~EACJ~~,CAAA"}
1	+ {"version":3,"file":"Checkbox.cjs","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { type InputHTMLAttributes, useEffect, useRef } from 'react';\n\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n /*\n Indeterminate state — shown when only some children in a group are checked.\n * Takes visual precedence over `checked`.\n /\n indeterminate?: boolean;\n /* Accessible label. Required when no visible `<label>` is associated. /\n 'aria-label'?: string;\n}\n\n/\n Checkbox for multi-selection, following the GNOME HIG and Adwaita style.\n \n Supports three states: unchecked, checked, and indeterminate (mixed).\n * Use `indeterminate` for \"select all\" controls when only some items are selected.\n \n Renders as `<input type=\"checkbox\">` — natively keyboard-accessible and\n * compatible with standard form libraries.\n \n @see https://developer.gnome.org/hig/patterns/controls/checkboxes.html\n */\nexport const Checkbox = ({ indeterminate = false, className, ...props }: CheckboxProps) => {\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.indeterminate = indeterminate;\n }\n }, [indeterminate]);\n\n return (\n <input\n ref={ref}\n type=\"checkbox\"\n className={[styles.checkbox, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n};\n"],"mappings":"mGAyBA,IAAa,GAAY,CAAE,gBAAgB,GAAO,YAAW,GAAG,KAA2B,CACzF,IAAM,GAAA,EAAA,EAAA,QAA+B,IAAI,EAQzC,OANA,EAAA,EAAA,eAAgB,CACV,EAAI,UACN,EAAI,QAAQ,cAAgB,EAEhC,EAAG,CAAC,CAAa,CAAC,GAGhB,EAAA,EAAA,KAAC,QAAD,CACO,MACL,KAAK,WACL,UAAW,CAAC,EAAA,QAAO,SAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAChE,GAAI,CACL,CAAA,CAEL"}

package/dist/components/Checkbox/Checkbox.d.ts CHANGED Viewed

@@ -19,4 +19,4 @@ export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement
  *
  * @see https://developer.gnome.org/hig/patterns/controls/checkboxes.html
  */
-export declare function Checkbox({ indeterminate, className, ...props }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+export declare const Checkbox: ({ indeterminate, className, ...props }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Checkbox/Checkbox.js CHANGED Viewed

@@ -2,7 +2,7 @@ import e from "./Checkbox.module.css.js";
 import { useEffect as t, useRef as n } from "react";
 import { jsx as r } from "react/jsx-runtime";
 //#region src/components/Checkbox/Checkbox.tsx
-function i({ indeterminate: i = !1, className: a, ...o }) {
+var i = ({ indeterminate: i = !1, className: a, ...o }) => {
 	let s = n(null);
 	return t(() => {
 		s.current && (s.current.indeterminate = i);
@@ -12,7 +12,7 @@ function i({ indeterminate: i = !1, className: a, ...o }) {
 		className: [e.checkbox, a].filter(Boolean).join(" "),
 		...o
 	});
-}
+};
 //#endregion
 export { i as Checkbox };

package/dist/components/Checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { type InputHTMLAttributes, useEffect, useRef } from 'react';\n\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n /*\n Indeterminate state — shown when only some children in a group are checked.\n * Takes visual precedence over `checked`.\n /\n indeterminate?: boolean;\n /* Accessible label. Required when no visible `<label>` is associated. /\n 'aria-label'?: string;\n}\n\n/\n Checkbox for multi-selection, following the GNOME HIG and Adwaita style.\n \n Supports three states: unchecked, checked, and indeterminate (mixed).\n * Use `indeterminate` for \"select all\" controls when only some items are selected.\n \n Renders as `<input type=\"checkbox\">` — natively keyboard-accessible and\n * compatible with standard form libraries.\n \n @see https://developer.gnome.org/hig/patterns/controls/checkboxes.html\n */\nexport ~~function~~ Checkbox({ indeterminate = false, className, ...props }: CheckboxProps) {\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.indeterminate = indeterminate;\n }\n }, [indeterminate]);\n\n return (\n <input\n ref={ref}\n type=\"checkbox\"\n className={[styles.checkbox, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n}\n"],"mappings":";;;;AAyBA,~~SAAgB~~,~~EAAS~~,EAAE,mBAAgB,IAAO,cAAW,GAAG,~~KAAwB~~;~~CACtF~~,IAAM,IAAM,EAAyB,~~KAAK~~;~~AAQ1C~~,~~QANA~~,QAAgB;~~AACd~~,~~EAAI~~,EAAI,YACN,EAAI,QAAQ,gBAAgB;~~IAE7B~~,CAAC,~~EAAc~~,CAAC,~~EAGjB~~,kBAAC,SAAD;EACO;EACL,MAAK;EACL,WAAW,CAAC,EAAO,UAAU,~~EAAU~~,~~CAAC~~,OAAO,~~QAAQ~~,~~CAAC~~,KAAK,~~IAAI~~;~~EACjE~~,GAAI;~~EACJ~~,CAAA"}
1	+ {"version":3,"file":"Checkbox.js","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { type InputHTMLAttributes, useEffect, useRef } from 'react';\n\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n /*\n Indeterminate state — shown when only some children in a group are checked.\n * Takes visual precedence over `checked`.\n /\n indeterminate?: boolean;\n /* Accessible label. Required when no visible `<label>` is associated. /\n 'aria-label'?: string;\n}\n\n/\n Checkbox for multi-selection, following the GNOME HIG and Adwaita style.\n \n Supports three states: unchecked, checked, and indeterminate (mixed).\n * Use `indeterminate` for \"select all\" controls when only some items are selected.\n \n Renders as `<input type=\"checkbox\">` — natively keyboard-accessible and\n * compatible with standard form libraries.\n \n @see https://developer.gnome.org/hig/patterns/controls/checkboxes.html\n */\nexport const Checkbox = ({ indeterminate = false, className, ...props }: CheckboxProps) => {\n const ref = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (ref.current) {\n ref.current.indeterminate = indeterminate;\n }\n }, [indeterminate]);\n\n return (\n <input\n ref={ref}\n type=\"checkbox\"\n className={[styles.checkbox, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n};\n"],"mappings":";;;;AAyBA,IAAa,KAAY,EAAE,mBAAgB,IAAO,cAAW,GAAG,QAA2B;CACzF,IAAM,IAAM,EAAyB,IAAI;CAQzC,OANA,QAAgB;EACd,AAAI,EAAI,YACN,EAAI,QAAQ,gBAAgB;CAEhC,GAAG,CAAC,CAAa,CAAC,GAGhB,kBAAC,SAAD;EACO;EACL,MAAK;EACL,WAAW,CAAC,EAAO,UAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;EAChE,GAAI;CACL,CAAA;AAEL"}

package/dist/components/Checkbox.cjs CHANGED Viewed

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

package/dist/components/Chip/Chip.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`../Icon/Icon.cjs`),t=require(`./Chip.module.css.cjs`);let n=require(`react/jsx-runtime`),r=require(`@gnome-ui/icons`);function i({label:i,icon:a,onRemove:o,selectable:s=!1,selected:c=!1,onToggle:l,disabled:u=!1,className:d,...f}){let p=s&&!o,m=[t.default.chip,c?t.default.selected:null,u?t.default.disabled:null,p?t.default.selectable:null,d].filter(Boolean).join(` `),h=(0,n.jsxs)(n.Fragment,{children:[a&&(0,n.jsx)(`span`,{className:t.default.icon,children:(0,n.jsx)(e.Icon,{icon:a,size:`sm`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.label,children:i}),o&&(0,n.jsx)(`button`,{type:`button`,className:t.default.remove,"aria-label":`Remove ${i}`,disabled:u,onClick:e=>{e.stopPropagation(),o()},tabIndex:u?-1:0,children:(0,n.jsx)(e.Icon,{icon:r.Close,size:`sm`,"aria-hidden":!0})})]});return p?(0,n.jsx)(`button`,{type:`button`,role:`checkbox`,"aria-checked":c,"aria-label":i,disabled:u,onClick:l,className:m,...f,children:h}):(0,n.jsx)(`span`,{className:m,...f,children:h})}exports.Chip=i;
+const e=require("../Icon/Icon.cjs"),t=require("./Chip.module.css.cjs");let n=require("react/jsx-runtime"),r=require("@gnome-ui/icons");var i=({label:i,icon:a,onRemove:o,selectable:s=!1,selected:c=!1,onToggle:l,disabled:u=!1,className:d,...f})=>{let p=s&&!o,m=[t.default.chip,c?t.default.selected:null,u?t.default.disabled:null,p?t.default.selectable:null,d].filter(Boolean).join(` `),h=(0,n.jsxs)(n.Fragment,{children:[a&&(0,n.jsx)(`span`,{className:t.default.icon,children:(0,n.jsx)(e.Icon,{icon:a,size:`sm`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.label,children:i}),o&&(0,n.jsx)(`button`,{type:`button`,className:t.default.remove,"aria-label":`Remove ${i}`,disabled:u,onClick:e=>{e.stopPropagation(),o()},tabIndex:u?-1:0,children:(0,n.jsx)(e.Icon,{icon:r.Close,size:`sm`,"aria-hidden":!0})})]});return p?(0,n.jsx)(`button`,{type:`button`,role:`checkbox`,"aria-checked":c,"aria-label":i,disabled:u,onClick:l,className:m,...f,children:h}):(0,n.jsx)(`span`,{className:m,...f,children:h})};exports.Chip=i;
 //# sourceMappingURL=Chip.cjs.map

package/dist/components/Chip/Chip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.cjs","names":[],"sources":["../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport { Close } from '@gnome-ui/icons';\nimport type { HTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Chip.module.css';\n\nexport interface ChipProps extends HTMLAttributes<HTMLElement> {\n /** Text label displayed inside the chip. /\n label: string;\n /* Leading icon from `@gnome-ui/icons`. /\n icon?: IconDefinition;\n /\n When provided, renders a remove (×) button and calls this handler.\n * The chip root becomes a `<span>`; only the remove button is interactive.\n /\n onRemove?: () => void;\n /\n When true the chip renders as a toggle button.\n * Use `selected` + `onToggle` to control its state.\n /\n selectable?: boolean;\n /* Active/selected state. Only relevant when `selectable` is true. /\n selected?: boolean;\n /\n Called when a selectable chip is clicked.\n * Only relevant when `selectable` is true.\n /\n onToggle?: () => void;\n /* Disabled state — applies to both selectable chips and the remove button. /\n disabled?: boolean;\n}\n\n/\n Compact pill-shaped label for tags, filters, and selection states.\n \n Three usage modes:\n * - Static — just a visual label (no `onRemove`, no `selectable`).\n * - Removable — add `onRemove` to show a × button.\n * - Selectable — add `selectable` + `selected` + `onToggle` for toggle behaviour.\n \n Pair with `WrapBox` for multi-chip layouts.\n */\nexport ~~function~~ Chip({\n label,\n icon,\n onRemove,\n selectable = false,\n selected = false,\n onToggle,\n disabled = false,\n className,\n ...props\n}: ChipProps) {\n const isInteractive = selectable && !onRemove;\n\n const chipClasses = [\n styles.chip,\n selected ? styles.selected : null,\n disabled ? styles.disabled : null,\n isInteractive ? styles.selectable : null,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const content = (\n <>\n {icon && (\n <span className={styles.icon}>\n <Icon icon={icon} size=\"sm\" aria-hidden />\n </span>\n )}\n <span className={styles.label}>{label}</span>\n {onRemove && (\n <button\n type=\"button\"\n className={styles.remove}\n aria-label={`Remove ${label}`}\n disabled={disabled}\n onClick={(e) => {\n e.stopPropagation();\n onRemove();\n }}\n tabIndex={disabled ? -1 : 0}\n >\n <Icon icon={Close} size=\"sm\" aria-hidden />\n </button>\n )}\n </>\n );\n\n if (isInteractive) {\n return (\n <button\n type=\"button\"\n role=\"checkbox\"\n aria-checked={selected}\n aria-label={label}\n disabled={disabled}\n onClick={onToggle}\n className={chipClasses}\n {...(props as HTMLAttributes<HTMLButtonElement>)}\n >\n {content}\n </button>\n );\n }\n\n return (\n <span className={chipClasses} {...props}>\n {content}\n </span>\n );\n}\n"],"mappings":"uIA4CA,~~SAAgB~~,~~EAAK~~,CACnB,QACA,OACA,WACA,aAAa,GACb,WAAW,GACX,WACA,WAAW,GACX,YACA,GAAG,~~GACS~~,~~CACZ~~,IAAM,EAAgB,GAAc,CAAC,EAE/B,EAAc,CAClB,EAAA,QAAO,KACP,EAAW,EAAA,QAAO,SAAW,KAC7B,EAAW,EAAA,QAAO,SAAW,KAC7B,EAAgB,EAAA,QAAO,WAAa,KACpC,~~EACD~~,~~CACE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~,~~CAEN~~,GACJ,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,CACG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,~~GAAc~~,CAAA,CACrC,CAAA,~~EAET~~,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,~~EAAa~~,CAAA,~~CAC5C~~,IACC,EAAA,EAAA,KAAC,SAAD,CACE,KAAK,SACL,UAAW,EAAA,QAAO,OAClB,aAAY,UAAU,IACZ,WACV,QAAU,GAAM,CACd,EAAE,~~iBAAiB~~,~~CACnB~~,~~GAAU~~,~~EAEZ~~,SAAU,EAAW,GAAK,YAE1B,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,KAAM,EAAA,MAAO,KAAK,KAAK,cAAA,~~GAAc~~,CAAA,CACpC,CAAA,CAEV,CAAA,CAAA,~~CAoBL~~,OAjBI,GAEA,EAAA,EAAA,KAAC,SAAD,CACE,KAAK,SACL,KAAK,WACL,eAAc,EACd,aAAY,EACF,WACV,QAAS,EACT,UAAW,EACX,GAAK,WAEJ,~~EACM~~,CAAA,~~EAKX~~,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAa,GAAI,WAC/B,~~EACI~~,CAAA"}
1	+ {"version":3,"file":"Chip.cjs","names":[],"sources":["../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport { Close } from '@gnome-ui/icons';\nimport type { HTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Chip.module.css';\n\nexport interface ChipProps extends HTMLAttributes<HTMLElement> {\n /** Text label displayed inside the chip. /\n label: string;\n /* Leading icon from `@gnome-ui/icons`. /\n icon?: IconDefinition;\n /\n When provided, renders a remove (×) button and calls this handler.\n * The chip root becomes a `<span>`; only the remove button is interactive.\n /\n onRemove?: () => void;\n /\n When true the chip renders as a toggle button.\n * Use `selected` + `onToggle` to control its state.\n /\n selectable?: boolean;\n /* Active/selected state. Only relevant when `selectable` is true. /\n selected?: boolean;\n /\n Called when a selectable chip is clicked.\n * Only relevant when `selectable` is true.\n /\n onToggle?: () => void;\n /* Disabled state — applies to both selectable chips and the remove button. /\n disabled?: boolean;\n}\n\n/\n Compact pill-shaped label for tags, filters, and selection states.\n \n Three usage modes:\n * - Static — just a visual label (no `onRemove`, no `selectable`).\n * - Removable — add `onRemove` to show a × button.\n * - Selectable — add `selectable` + `selected` + `onToggle` for toggle behaviour.\n \n Pair with `WrapBox` for multi-chip layouts.\n */\nexport const Chip = ({\n label,\n icon,\n onRemove,\n selectable = false,\n selected = false,\n onToggle,\n disabled = false,\n className,\n ...props\n}: ChipProps) => {\n const isInteractive = selectable && !onRemove;\n\n const chipClasses = [\n styles.chip,\n selected ? styles.selected : null,\n disabled ? styles.disabled : null,\n isInteractive ? styles.selectable : null,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const content = (\n <>\n {icon && (\n <span className={styles.icon}>\n <Icon icon={icon} size=\"sm\" aria-hidden />\n </span>\n )}\n <span className={styles.label}>{label}</span>\n {onRemove && (\n <button\n type=\"button\"\n className={styles.remove}\n aria-label={`Remove ${label}`}\n disabled={disabled}\n onClick={(e) => {\n e.stopPropagation();\n onRemove();\n }}\n tabIndex={disabled ? -1 : 0}\n >\n <Icon icon={Close} size=\"sm\" aria-hidden />\n </button>\n )}\n </>\n );\n\n if (isInteractive) {\n return (\n <button\n type=\"button\"\n role=\"checkbox\"\n aria-checked={selected}\n aria-label={label}\n disabled={disabled}\n onClick={onToggle}\n className={chipClasses}\n {...(props as HTMLAttributes<HTMLButtonElement>)}\n >\n {content}\n </button>\n );\n }\n\n return (\n <span className={chipClasses} {...props}>\n {content}\n </span>\n );\n};\n"],"mappings":"uIA4CA,IAAa,GAAQ,CACnB,QACA,OACA,WACA,aAAa,GACb,WAAW,GACX,WACA,WAAW,GACX,YACA,GAAG,KACY,CACf,IAAM,EAAgB,GAAc,CAAC,EAE/B,EAAc,CAClB,EAAA,QAAO,KACP,EAAW,EAAA,QAAO,SAAW,KAC7B,EAAW,EAAA,QAAO,SAAW,KAC7B,EAAgB,EAAA,QAAO,WAAa,KACpC,CACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG,EAEL,GACJ,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,CACG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,EAAa,CAAA,CACrC,CAAA,GAER,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,CAAY,CAAA,EAC3C,IACC,EAAA,EAAA,KAAC,SAAD,CACE,KAAK,SACL,UAAW,EAAA,QAAO,OAClB,aAAY,UAAU,IACZ,WACV,QAAU,GAAM,CACd,EAAE,gBAAgB,EAClB,EAAS,CACX,EACA,SAAU,EAAW,GAAK,YAE1B,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,KAAM,EAAA,MAAO,KAAK,KAAK,cAAA,EAAa,CAAA,CACpC,CAAA,CAEV,CAAA,CAAA,EAoBJ,OAjBI,GAEA,EAAA,EAAA,KAAC,SAAD,CACE,KAAK,SACL,KAAK,WACL,eAAc,EACd,aAAY,EACF,WACV,QAAS,EACT,UAAW,EACX,GAAK,WAEJ,CACK,CAAA,GAKV,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAa,GAAI,WAC/B,CACG,CAAA,CAEV"}

package/dist/components/Chip/Chip.d.ts CHANGED Viewed

@@ -35,4 +35,4 @@ export interface ChipProps extends HTMLAttributes<HTMLElement> {
  *
  * Pair with `WrapBox` for multi-chip layouts.
  */
-export declare function Chip({ label, icon, onRemove, selectable, selected, onToggle, disabled, className, ...props }: ChipProps): import("react/jsx-runtime").JSX.Element;
+export declare const Chip: ({ label, icon, onRemove, selectable, selected, onToggle, disabled, className, ...props }: ChipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Chip/Chip.js CHANGED Viewed

@@ -3,7 +3,7 @@ import t from "./Chip.module.css.js";
 import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
 import { Close as a } from "@gnome-ui/icons";
 //#region src/components/Chip/Chip.tsx
-function o({ label: o, icon: s, onRemove: c, selectable: l = !1, selected: u = !1, onToggle: d, disabled: f = !1, className: p, ...m }) {
+var o = ({ label: o, icon: s, onRemove: c, selectable: l = !1, selected: u = !1, onToggle: d, disabled: f = !1, className: p, ...m }) => {
 	let h = l && !c, g = [
 		t.chip,
 		u ? t.selected : null,
@@ -54,7 +54,7 @@ function o({ label: o, icon: s, onRemove: c, selectable: l = !1, selected: u = !
 		...m,
 		children: _
 	});
-}
+};
 //#endregion
 export { o as Chip };

package/dist/components/Chip/Chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.js","names":[],"sources":["../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport { Close } from '@gnome-ui/icons';\nimport type { HTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Chip.module.css';\n\nexport interface ChipProps extends HTMLAttributes<HTMLElement> {\n /** Text label displayed inside the chip. /\n label: string;\n /* Leading icon from `@gnome-ui/icons`. /\n icon?: IconDefinition;\n /\n When provided, renders a remove (×) button and calls this handler.\n * The chip root becomes a `<span>`; only the remove button is interactive.\n /\n onRemove?: () => void;\n /\n When true the chip renders as a toggle button.\n * Use `selected` + `onToggle` to control its state.\n /\n selectable?: boolean;\n /* Active/selected state. Only relevant when `selectable` is true. /\n selected?: boolean;\n /\n Called when a selectable chip is clicked.\n * Only relevant when `selectable` is true.\n /\n onToggle?: () => void;\n /* Disabled state — applies to both selectable chips and the remove button. /\n disabled?: boolean;\n}\n\n/\n Compact pill-shaped label for tags, filters, and selection states.\n \n Three usage modes:\n * - Static — just a visual label (no `onRemove`, no `selectable`).\n * - Removable — add `onRemove` to show a × button.\n * - Selectable — add `selectable` + `selected` + `onToggle` for toggle behaviour.\n \n Pair with `WrapBox` for multi-chip layouts.\n */\nexport ~~function~~ Chip({\n label,\n icon,\n onRemove,\n selectable = false,\n selected = false,\n onToggle,\n disabled = false,\n className,\n ...props\n}: ChipProps) {\n const isInteractive = selectable && !onRemove;\n\n const chipClasses = [\n styles.chip,\n selected ? styles.selected : null,\n disabled ? styles.disabled : null,\n isInteractive ? styles.selectable : null,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const content = (\n <>\n {icon && (\n <span className={styles.icon}>\n <Icon icon={icon} size=\"sm\" aria-hidden />\n </span>\n )}\n <span className={styles.label}>{label}</span>\n {onRemove && (\n <button\n type=\"button\"\n className={styles.remove}\n aria-label={`Remove ${label}`}\n disabled={disabled}\n onClick={(e) => {\n e.stopPropagation();\n onRemove();\n }}\n tabIndex={disabled ? -1 : 0}\n >\n <Icon icon={Close} size=\"sm\" aria-hidden />\n </button>\n )}\n </>\n );\n\n if (isInteractive) {\n return (\n <button\n type=\"button\"\n role=\"checkbox\"\n aria-checked={selected}\n aria-label={label}\n disabled={disabled}\n onClick={onToggle}\n className={chipClasses}\n {...(props as HTMLAttributes<HTMLButtonElement>)}\n >\n {content}\n </button>\n );\n }\n\n return (\n <span className={chipClasses} {...props}>\n {content}\n </span>\n );\n}\n"],"mappings":";;;;;AA4CA,~~SAAgB~~,~~EAAK~~,EACnB,UACA,SACA,aACA,gBAAa,IACb,cAAW,IACX,aACA,cAAW,IACX,cACA,GAAG,~~KACS~~;~~CACZ~~,IAAM,IAAgB,KAAc,CAAC,GAE/B,IAAc;EAClB,EAAO;EACP,IAAW,EAAO,WAAW;EAC7B,IAAW,EAAO,WAAW;EAC7B,IAAgB,EAAO,aAAa;EACpC;~~EACD~~,~~CACE~~,OAAO,~~QAAQ~~,~~CACf~~,KAAK,~~IAAI~~,~~EAEN~~,IACJ,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,QAAD;GAAM,WAAW,EAAO;aACtB,kBAAC,GAAD;IAAY;IAAM,MAAK;IAAK,eAAA;~~IAAc~~,CAAA;~~GACrC~~,CAAA;~~EAET~~,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAQ;~~GAAa~~,CAAA;~~EAC5C~~,KACC,kBAAC,UAAD;GACE,MAAK;GACL,WAAW,EAAO;GAClB,cAAY,UAAU;GACZ;GACV,UAAU,MAAM;~~AAEd~~,~~IADA~~,EAAE,~~iBAAiB~~,~~EACnB~~,~~GAAU;;GAEZ~~,UAAU,IAAW,KAAK;aAE1B,kBAAC,GAAD;IAAM,MAAM;IAAO,MAAK;IAAK,eAAA;~~IAAc~~,CAAA;~~GACpC~~,CAAA;~~EAEV~~,EAAA,CAAA;~~AAoBL~~,~~QAjBI~~,IAEA,kBAAC,UAAD;EACE,MAAK;EACL,MAAK;EACL,gBAAc;EACd,cAAY;EACF;EACV,SAAS;EACT,WAAW;EACX,GAAK;YAEJ;~~EACM~~,CAAA,~~GAKX~~,kBAAC,QAAD;EAAM,WAAW;EAAa,GAAI;YAC/B;~~EACI~~,CAAA"}
1	+ {"version":3,"file":"Chip.js","names":[],"sources":["../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport { Close } from '@gnome-ui/icons';\nimport type { HTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './Chip.module.css';\n\nexport interface ChipProps extends HTMLAttributes<HTMLElement> {\n /** Text label displayed inside the chip. /\n label: string;\n /* Leading icon from `@gnome-ui/icons`. /\n icon?: IconDefinition;\n /\n When provided, renders a remove (×) button and calls this handler.\n * The chip root becomes a `<span>`; only the remove button is interactive.\n /\n onRemove?: () => void;\n /\n When true the chip renders as a toggle button.\n * Use `selected` + `onToggle` to control its state.\n /\n selectable?: boolean;\n /* Active/selected state. Only relevant when `selectable` is true. /\n selected?: boolean;\n /\n Called when a selectable chip is clicked.\n * Only relevant when `selectable` is true.\n /\n onToggle?: () => void;\n /* Disabled state — applies to both selectable chips and the remove button. /\n disabled?: boolean;\n}\n\n/\n Compact pill-shaped label for tags, filters, and selection states.\n \n Three usage modes:\n * - Static — just a visual label (no `onRemove`, no `selectable`).\n * - Removable — add `onRemove` to show a × button.\n * - Selectable — add `selectable` + `selected` + `onToggle` for toggle behaviour.\n \n Pair with `WrapBox` for multi-chip layouts.\n */\nexport const Chip = ({\n label,\n icon,\n onRemove,\n selectable = false,\n selected = false,\n onToggle,\n disabled = false,\n className,\n ...props\n}: ChipProps) => {\n const isInteractive = selectable && !onRemove;\n\n const chipClasses = [\n styles.chip,\n selected ? styles.selected : null,\n disabled ? styles.disabled : null,\n isInteractive ? styles.selectable : null,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const content = (\n <>\n {icon && (\n <span className={styles.icon}>\n <Icon icon={icon} size=\"sm\" aria-hidden />\n </span>\n )}\n <span className={styles.label}>{label}</span>\n {onRemove && (\n <button\n type=\"button\"\n className={styles.remove}\n aria-label={`Remove ${label}`}\n disabled={disabled}\n onClick={(e) => {\n e.stopPropagation();\n onRemove();\n }}\n tabIndex={disabled ? -1 : 0}\n >\n <Icon icon={Close} size=\"sm\" aria-hidden />\n </button>\n )}\n </>\n );\n\n if (isInteractive) {\n return (\n <button\n type=\"button\"\n role=\"checkbox\"\n aria-checked={selected}\n aria-label={label}\n disabled={disabled}\n onClick={onToggle}\n className={chipClasses}\n {...(props as HTMLAttributes<HTMLButtonElement>)}\n >\n {content}\n </button>\n );\n }\n\n return (\n <span className={chipClasses} {...props}>\n {content}\n </span>\n );\n};\n"],"mappings":";;;;;AA4CA,IAAa,KAAQ,EACnB,UACA,SACA,aACA,gBAAa,IACb,cAAW,IACX,aACA,cAAW,IACX,cACA,GAAG,QACY;CACf,IAAM,IAAgB,KAAc,CAAC,GAE/B,IAAc;EAClB,EAAO;EACP,IAAW,EAAO,WAAW;EAC7B,IAAW,EAAO,WAAW;EAC7B,IAAgB,EAAO,aAAa;EACpC;CACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG,GAEL,IACJ,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,QAAD;GAAM,WAAW,EAAO;aACtB,kBAAC,GAAD;IAAY;IAAM,MAAK;IAAK,eAAA;GAAa,CAAA;EACrC,CAAA;EAER,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAQ;EAAY,CAAA;EAC3C,KACC,kBAAC,UAAD;GACE,MAAK;GACL,WAAW,EAAO;GAClB,cAAY,UAAU;GACZ;GACV,UAAU,MAAM;IAEd,AADA,EAAE,gBAAgB,GAClB,EAAS;GACX;GACA,UAAU,IAAW,KAAK;aAE1B,kBAAC,GAAD;IAAM,MAAM;IAAO,MAAK;IAAK,eAAA;GAAa,CAAA;EACpC,CAAA;CAEV,EAAA,CAAA;CAoBJ,OAjBI,IAEA,kBAAC,UAAD;EACE,MAAK;EACL,MAAK;EACL,gBAAc;EACd,cAAY;EACF;EACV,SAAS;EACT,WAAW;EACX,GAAK;YAEJ;CACK,CAAA,IAKV,kBAAC,QAAD;EAAM,WAAW;EAAa,GAAI;YAC/B;CACG,CAAA;AAEV"}

package/dist/components/Chip.cjs CHANGED Viewed

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

package/dist/components/Clamp/Clamp.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`./Clamp.module.css.cjs`);let t=require(`react/jsx-runtime`);function n({maximumSize:n=600,children:r,className:i,style:a,...o}){return(0,t.jsx)(`div`,{className:[e.default.clamp,i].filter(Boolean).join(` `),style:{maxWidth:n,...a},...o,children:r})}exports.Clamp=n;
+const e=require("./Clamp.module.css.cjs");let t=require("react/jsx-runtime");var n=({maximumSize:n=600,children:r,className:i,style:a,...o})=>(0,t.jsx)(`div`,{className:[e.default.clamp,i].filter(Boolean).join(` `),style:{maxWidth:n,...a},...o,children:r});exports.Clamp=n;
 //# sourceMappingURL=Clamp.cjs.map

package/dist/components/Clamp/Clamp.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Clamp.cjs","names":[],"sources":["../../../src/components/Clamp/Clamp.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Clamp.module.css';\n\nexport interface ClampProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Maximum content width in pixels.\n * The element shrinks freely below this value.\n * Defaults to `600` — the Adwaita recommended narrow-content width.\n /\n maximumSize?: number;\n /\n Fractional width (0–1) of the viewport to use when the viewport is\n * narrower than `maximumSize`. Useful for keeping a comfortable margin\n * on medium-width screens. Set to `1` (default) to always fill the width.\n /\n tighteningThreshold?: number;\n children?: ReactNode;\n}\n\n/\n Constrains its child to a maximum width while allowing it to shrink freely,\n * mirroring the Adwaita `AdwClamp` widget.\n \n Use this to keep readable line lengths and comfortable reading widths on\n * large screens while still filling the available space on narrow screens.\n \n @example\n * // Settings page — content never wider than 600 px\n * <Clamp maximumSize={600}>\n * <BoxedList>…</BoxedList>\n * </Clamp>\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Clamp.html\n */\nexport ~~function~~ Clamp({ maximumSize = 600, children, className, style, ...props }: ClampProps) {\n return (\n <div\n className={[styles.clamp, className].filter(Boolean).join(' ')}\n style={{ maxWidth: maximumSize, ...style }}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":"6EAmCA,~~SAAgB~~,~~EAAM~~,CAAE,cAAc,IAAK,WAAU,YAAW,QAAO,GAAG,~~GAAqB~~,~~CAC7F,OACE,~~EAAA,EAAA,KAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,MAAO,~~EAAU~~,~~CAAC~~,OAAO,~~QAAQ~~,~~CAAC~~,KAAK,~~IAAI~~,~~CAC9D~~,MAAO,CAAE,SAAU,EAAa,GAAG,~~EAAO~~,~~CAC1C~~,GAAI,EAEH,~~WACG~~,CAAA"}
1	+ {"version":3,"file":"Clamp.cjs","names":[],"sources":["../../../src/components/Clamp/Clamp.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Clamp.module.css';\n\nexport interface ClampProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Maximum content width in pixels.\n * The element shrinks freely below this value.\n * Defaults to `600` — the Adwaita recommended narrow-content width.\n /\n maximumSize?: number;\n /\n Fractional width (0–1) of the viewport to use when the viewport is\n * narrower than `maximumSize`. Useful for keeping a comfortable margin\n * on medium-width screens. Set to `1` (default) to always fill the width.\n /\n tighteningThreshold?: number;\n children?: ReactNode;\n}\n\n/\n Constrains its child to a maximum width while allowing it to shrink freely,\n * mirroring the Adwaita `AdwClamp` widget.\n \n Use this to keep readable line lengths and comfortable reading widths on\n * large screens while still filling the available space on narrow screens.\n \n @example\n * // Settings page — content never wider than 600 px\n * <Clamp maximumSize={600}>\n * <BoxedList>…</BoxedList>\n * </Clamp>\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Clamp.html\n */\nexport const Clamp = ({ maximumSize = 600, children, className, style, ...props }: ClampProps) => {\n return (\n <div\n className={[styles.clamp, className].filter(Boolean).join(' ')}\n style={{ maxWidth: maximumSize, ...style }}\n {...props}\n >\n {children}\n </div>\n );\n};\n"],"mappings":"6EAmCA,IAAa,GAAS,CAAE,cAAc,IAAK,WAAU,YAAW,QAAO,GAAG,MAEtE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,CAAC,EAAA,QAAO,MAAO,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC7D,MAAO,CAAE,SAAU,EAAa,GAAG,CAAM,EACzC,GAAI,EAEH,UACE,CAAA"}

package/dist/components/Clamp/Clamp.d.ts CHANGED Viewed

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

package/dist/components/Clamp/Clamp.js CHANGED Viewed

@@ -1,17 +1,15 @@
 import e from "./Clamp.module.css.js";
 import { jsx as t } from "react/jsx-runtime";
 //#region src/components/Clamp/Clamp.tsx
-function n({ maximumSize: n = 600, children: r, className: i, style: a, ...o }) {
-	return /* @__PURE__ */ t("div", {
-		className: [e.clamp, i].filter(Boolean).join(" "),
-		style: {
-			maxWidth: n,
-			...a
-		},
-		...o,
-		children: r
-	});
-}
+var n = ({ maximumSize: n = 600, children: r, className: i, style: a, ...o }) => /* @__PURE__ */ t("div", {
+	className: [e.clamp, i].filter(Boolean).join(" "),
+	style: {
+		maxWidth: n,
+		...a
+	},
+	...o,
+	children: r
+});
 //#endregion
 export { n as Clamp };

package/dist/components/Clamp/Clamp.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Clamp.js","names":[],"sources":["../../../src/components/Clamp/Clamp.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Clamp.module.css';\n\nexport interface ClampProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Maximum content width in pixels.\n * The element shrinks freely below this value.\n * Defaults to `600` — the Adwaita recommended narrow-content width.\n /\n maximumSize?: number;\n /\n Fractional width (0–1) of the viewport to use when the viewport is\n * narrower than `maximumSize`. Useful for keeping a comfortable margin\n * on medium-width screens. Set to `1` (default) to always fill the width.\n /\n tighteningThreshold?: number;\n children?: ReactNode;\n}\n\n/\n Constrains its child to a maximum width while allowing it to shrink freely,\n * mirroring the Adwaita `AdwClamp` widget.\n \n Use this to keep readable line lengths and comfortable reading widths on\n * large screens while still filling the available space on narrow screens.\n \n @example\n * // Settings page — content never wider than 600 px\n * <Clamp maximumSize={600}>\n * <BoxedList>…</BoxedList>\n * </Clamp>\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Clamp.html\n */\nexport ~~function~~ Clamp({ maximumSize = 600, children, className, style, ...props }: ClampProps) {\n return (\n <div\n className={[styles.clamp, className].filter(Boolean).join(' ')}\n style={{ maxWidth: maximumSize, ...style }}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":";;;AAmCA,~~SAAgB~~,~~EAAM~~,EAAE,iBAAc,KAAK,aAAU,cAAW,UAAO,GAAG,~~KAAqB;AAC7F~~,~~QACE,~~kBAAC,OAAD;~~EACE~~,WAAW,CAAC,EAAO,OAAO,~~EAAU~~,~~CAAC~~,OAAO,~~QAAQ~~,~~CAAC~~,KAAK,~~IAAI~~;~~EAC9D~~,OAAO;~~GAAE~~,UAAU;~~GAAa~~,GAAG;~~GAAO~~;~~EAC1C~~,GAAI;~~EAEH~~;~~EACG~~,CAAA"}
1	+ {"version":3,"file":"Clamp.js","names":[],"sources":["../../../src/components/Clamp/Clamp.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Clamp.module.css';\n\nexport interface ClampProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Maximum content width in pixels.\n * The element shrinks freely below this value.\n * Defaults to `600` — the Adwaita recommended narrow-content width.\n /\n maximumSize?: number;\n /\n Fractional width (0–1) of the viewport to use when the viewport is\n * narrower than `maximumSize`. Useful for keeping a comfortable margin\n * on medium-width screens. Set to `1` (default) to always fill the width.\n /\n tighteningThreshold?: number;\n children?: ReactNode;\n}\n\n/\n Constrains its child to a maximum width while allowing it to shrink freely,\n * mirroring the Adwaita `AdwClamp` widget.\n \n Use this to keep readable line lengths and comfortable reading widths on\n * large screens while still filling the available space on narrow screens.\n \n @example\n * // Settings page — content never wider than 600 px\n * <Clamp maximumSize={600}>\n * <BoxedList>…</BoxedList>\n * </Clamp>\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.Clamp.html\n */\nexport const Clamp = ({ maximumSize = 600, children, className, style, ...props }: ClampProps) => {\n return (\n <div\n className={[styles.clamp, className].filter(Boolean).join(' ')}\n style={{ maxWidth: maximumSize, ...style }}\n {...props}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAmCA,IAAa,KAAS,EAAE,iBAAc,KAAK,aAAU,cAAW,UAAO,GAAG,QAEtE,kBAAC,OAAD;CACE,WAAW,CAAC,EAAO,OAAO,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAC7D,OAAO;EAAE,UAAU;EAAa,GAAG;CAAM;CACzC,GAAI;CAEH;AACE,CAAA"}

package/dist/components/Clamp.cjs CHANGED Viewed

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

package/dist/components/ColorPicker/ColorPicker.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`./ColorPicker.module.css.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`);function r({color:t,selected:r=!1,size:i=`md`,onSelect:a,disabled:o=!1,className:s,style:c,"aria-label":l,...u}){return(0,n.jsx)(`button`,{type:`button`,role:`radio`,"aria-checked":r,"aria-label":l??t,disabled:o,className:[e.default.swatch,e.default[`swatch-${i}`],r?e.default.swatchSelected:null,s].filter(Boolean).join(` `),style:{"--swatch-color":t,...c},onClick:()=>a?.(t),...u,children:r&&(0,n.jsx)(`svg`,{className:e.default.checkmark,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M3 8l3.5 3.5L13 5`,stroke:`white`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`})})})}var i=[{value:`#3584e4`,label:`Blue`},{value:`#2ec27e`,label:`Green`},{value:`#f6d32d`,label:`Yellow`},{value:`#ff7800`,label:`Orange`},{value:`#e01b24`,label:`Red`},{value:`#9141ac`,label:`Purple`},{value:`#986a44`,label:`Brown`},{value:`#2190a4`,label:`Teal`},{value:`#5e5c64`,label:`Slate`}];function a({value:a,onChange:o,colors:s=i,allowCustom:c=!1,size:l=`md`,className:u,style:d,"aria-label":f,...p}){let m=(0,t.useRef)(null),h=s.findIndex(e=>e.value===a),g=h>=0?h:0;function _(e){let t=Array.from(e.currentTarget.querySelectorAll(`[role="radio"]:not([disabled])`)),n=document.activeElement,r=t.indexOf(n);if(r===-1)return;let i=-1;if(e.key===`ArrowRight`||e.key===`ArrowDown`?(e.preventDefault(),i=(r+1)%t.length):(e.key===`ArrowLeft`||e.key===`ArrowUp`)&&(e.preventDefault(),i=(r-1+t.length)%t.length),i>=0){t[i].focus();let e=t[i].dataset.color;e&&o?.(e)}}let v=a!==void 0&&!s.some(e=>e.value===a);return(0,n.jsxs)(`div`,{role:`radiogroup`,"aria-label":f??`Color`,className:[e.default.picker,u].filter(Boolean).join(` `),style:d,onKeyDown:_,...p,children:[s.map((e,t)=>(0,n.jsx)(r,{color:e.value,size:l,selected:e.value===a,onSelect:o,"aria-label":e.label??e.value,tabIndex:t===g&&!v?0:-1,"data-color":e.value},e.value)),c&&(0,n.jsxs)(n.Fragment,{children:[v&&a&&(0,n.jsx)(r,{color:a,size:l,selected:!0,onSelect:()=>m.current?.click(),"aria-label":`Custom color`,tabIndex:0,"data-color":a}),(0,n.jsx)(`button`,{type:`button`,"aria-label":`Choose custom color`,className:[e.default.swatch,e.default[`swatch-${l}`],e.default.customButton].filter(Boolean).join(` `),tabIndex:-1,onClick:()=>m.current?.click(),children:(0,n.jsx)(`svg`,{viewBox:`0 0 16 16`,className:e.default.plusIcon,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M8 3v10M3 8h10`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`})})}),(0,n.jsx)(`input`,{ref:m,type:`color`,value:v&&a?a:`#000000`,className:e.default.nativeInput,"aria-hidden":`true`,tabIndex:-1,onChange:e=>o?.(e.target.value)})]})]})}exports.ColorPicker=a,exports.ColorSwatch=r,exports.GNOME_PALETTE=i;
+const e=require("./ColorPicker.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({color:t,selected:r=!1,size:i=`md`,onSelect:a,disabled:o=!1,className:s,style:c,"aria-label":l,...u})=>(0,n.jsx)(`button`,{type:`button`,role:`radio`,"aria-checked":r,"aria-label":l??t,disabled:o,className:[e.default.swatch,e.default[`swatch-${i}`],r?e.default.swatchSelected:null,s].filter(Boolean).join(` `),style:{"--swatch-color":t,...c},onClick:()=>a?.(t),...u,children:r&&(0,n.jsx)(`svg`,{className:e.default.checkmark,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M3 8l3.5 3.5L13 5`,stroke:`white`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`})})}),i=[{value:`#3584e4`,label:`Blue`},{value:`#2ec27e`,label:`Green`},{value:`#f6d32d`,label:`Yellow`},{value:`#ff7800`,label:`Orange`},{value:`#e01b24`,label:`Red`},{value:`#9141ac`,label:`Purple`},{value:`#986a44`,label:`Brown`},{value:`#2190a4`,label:`Teal`},{value:`#5e5c64`,label:`Slate`}],a=({value:a,onChange:o,colors:s=i,allowCustom:c=!1,size:l=`md`,className:u,style:d,"aria-label":f,...p})=>{let m=(0,t.useRef)(null),h=s.findIndex(e=>e.value===a),g=h>=0?h:0;function _(e){let t=Array.from(e.currentTarget.querySelectorAll(`[role="radio"]:not([disabled])`)),n=document.activeElement,r=t.indexOf(n);if(r===-1)return;let i=-1;if(e.key===`ArrowRight`||e.key===`ArrowDown`?(e.preventDefault(),i=(r+1)%t.length):(e.key===`ArrowLeft`||e.key===`ArrowUp`)&&(e.preventDefault(),i=(r-1+t.length)%t.length),i>=0){t[i].focus();let e=t[i].dataset.color;e&&o?.(e)}}let v=a!==void 0&&!s.some(e=>e.value===a);return(0,n.jsxs)(`div`,{role:`radiogroup`,"aria-label":f??`Color`,className:[e.default.picker,u].filter(Boolean).join(` `),style:d,onKeyDown:_,...p,children:[s.map((e,t)=>(0,n.jsx)(r,{color:e.value,size:l,selected:e.value===a,onSelect:o,"aria-label":e.label??e.value,tabIndex:t===g&&!v?0:-1,"data-color":e.value},e.value)),c&&(0,n.jsxs)(n.Fragment,{children:[v&&a&&(0,n.jsx)(r,{color:a,size:l,selected:!0,onSelect:()=>m.current?.click(),"aria-label":`Custom color`,tabIndex:0,"data-color":a}),(0,n.jsx)(`button`,{type:`button`,"aria-label":`Choose custom color`,className:[e.default.swatch,e.default[`swatch-${l}`],e.default.customButton].filter(Boolean).join(` `),tabIndex:-1,onClick:()=>m.current?.click(),children:(0,n.jsx)(`svg`,{viewBox:`0 0 16 16`,className:e.default.plusIcon,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M8 3v10M3 8h10`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`})})}),(0,n.jsx)(`input`,{ref:m,type:`color`,value:v&&a?a:`#000000`,className:e.default.nativeInput,"aria-hidden":`true`,tabIndex:-1,onChange:e=>o?.(e.target.value)})]})]})};exports.ColorPicker=a,exports.ColorSwatch=r,exports.GNOME_PALETTE=i;
 //# sourceMappingURL=ColorPicker.cjs.map

package/dist/components/ColorPicker/ColorPicker.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorPicker.cjs","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { type CSSProperties, type HTMLAttributes, type KeyboardEvent, useRef } from 'react';\n\nimport styles from './ColorPicker.module.css';\n\n// ─── ColorSwatch ─────────────────────────────────────────────────────────────\n\nexport type ColorSwatchSize = 'sm' \| 'md' \| 'lg';\n\nexport interface ColorSwatchProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' \| 'onSelect'> {\n /** CSS color value displayed as the swatch background. /\n color: string;\n /* Whether this swatch is the currently selected color. /\n selected?: boolean;\n /* Swatch diameter. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n /* Called when the user clicks or activates the swatch. /\n onSelect?: (color: string) => void;\n /* Accessible label. Defaults to the color value. /\n 'aria-label'?: string;\n disabled?: boolean;\n}\n\n/\n Single circular color swatch button.\n \n Can be used standalone or composed inside `ColorPicker`.\n * Shows a white checkmark when `selected`.\n /\nexport function ColorSwatch({\n color,\n selected = false,\n size = 'md',\n onSelect,\n disabled = false,\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorSwatchProps) {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={selected}\n aria-label={ariaLabel ?? color}\n disabled={disabled}\n className={[\n styles.swatch,\n styles[`swatch-${size}`],\n selected ? styles.swatchSelected : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ '--swatch-color': color, ...style } as CSSProperties}\n onClick={() => onSelect?.(color)}\n {...props}\n >\n {selected && (\n <svg className={styles.checkmark} viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M3 8l3.5 3.5L13 5\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </button>\n );\n}\n\n// ─── ColorPicker ─────────────────────────────────────────────────────────────\n\nexport interface ColorPickerColor {\n /* CSS color value (hex recommended). /\n value: string;\n /* Human-readable name shown as aria-label and tooltip. /\n label?: string;\n}\n\n/* Default Adwaita-named palette (matches Avatar color set). /\n// eslint-disable-next-line react-refresh/only-export-components\nexport const GNOME_PALETTE: ColorPickerColor[] = [\n { value: '#3584e4', label: 'Blue' },\n { value: '#2ec27e', label: 'Green' },\n { value: '#f6d32d', label: 'Yellow' },\n { value: '#ff7800', label: 'Orange' },\n { value: '#e01b24', label: 'Red' },\n { value: '#9141ac', label: 'Purple' },\n { value: '#986a44', label: 'Brown' },\n { value: '#2190a4', label: 'Teal' },\n { value: '#5e5c64', label: 'Slate' },\n];\n\nexport interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n /* Currently selected color value. /\n value?: string;\n /* Called when the user selects a color. /\n onChange?: (value: string) => void;\n /\n Palette of colors to display.\n * Defaults to `GNOME_PALETTE` (the 9 Adwaita named colors).\n /\n colors?: ColorPickerColor[];\n /\n Show a \"Custom…\" button at the end that opens a native color picker.\n * When a custom color is chosen it is passed to `onChange` and shown\n * as a selected swatch until another palette color is picked.\n * Defaults to `false`.\n /\n allowCustom?: boolean;\n /* Swatch size. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n}\n\n/\n Color palette picker following the Adwaita `GtkColorButton` + swatch pattern.\n \n Renders a row of circular `ColorSwatch` items. Keyboard navigation uses\n * arrow keys (roving tabindex). Optionally adds a \"Custom…\" button backed\n * by a hidden `<input type=\"color\">`.\n \n ```tsx\n * <ColorPicker value={color} onChange={setColor} />\n * <ColorPicker value={color} onChange={setColor} allowCustom />\n * <ColorPicker\n * value={color}\n * onChange={setColor}\n * colors={[{ value: \"#ff0000\", label: \"Red\" }, …]}\n * />\n * ```\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ColorButton.html\n /\nexport function ColorPicker({\n value,\n onChange,\n colors = GNOME_PALETTE,\n allowCustom = false,\n size = 'md',\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorPickerProps) {\n const customInputRef = useRef<HTMLInputElement>(null);\n\n // Roving tabindex: only the selected (or first) swatch is in the tab order.\n const activeIndex = colors.findIndex((c) => c.value === value);\n const rovingIndex = activeIndex >= 0 ? activeIndex : 0;\n\n // Arrow-key navigation within the radiogroup.\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const all = Array.from(\n e.currentTarget.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])'),\n );\n const focused = document.activeElement as HTMLButtonElement;\n const idx = all.indexOf(focused);\n\n if (idx === -1) {\n return;\n }\n\n let next = -1;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n e.preventDefault();\n next = (idx + 1) % all.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n next = (idx - 1 + all.length) % all.length;\n }\n\n if (next >= 0) {\n all[next].focus();\n const color = all[next].dataset.color;\n\n if (color) {\n onChange?.(color);\n }\n }\n }\n\n // Decide whether the current `value` is a custom (not in palette) color.\n const isCustom = value !== undefined && !colors.some((c) => c.value === value);\n\n return (\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel ?? 'Color'}\n className={[styles.picker, className].filter(Boolean).join(' ')}\n style={style}\n onKeyDown={handleKeyDown}\n {...props}\n >\n {colors.map((color, i) => (\n <ColorSwatch\n key={color.value}\n color={color.value}\n size={size}\n selected={color.value === value}\n onSelect={onChange}\n aria-label={color.label ?? color.value}\n tabIndex={i === rovingIndex && !isCustom ? 0 : -1}\n data-color={color.value}\n />\n ))}\n\n {allowCustom && (\n <>\n {/ Custom swatch — shows the picked color when active /}\n {isCustom && value && (\n <ColorSwatch\n color={value}\n size={size}\n selected\n onSelect={() => customInputRef.current?.click()}\n aria-label=\"Custom color\"\n tabIndex={0}\n data-color={value}\n />\n )}\n\n {/ + button that opens the native color input */}\n <button\n type=\"button\"\n aria-label=\"Choose custom color\"\n className={[styles.swatch, styles[`swatch-${size}`], styles.customButton]\n .filter(Boolean)\n .join(' ')}\n tabIndex={isCustom ? -1 : -1}\n onClick={() => customInputRef.current?.click()}\n >\n <svg viewBox=\"0 0 16 16\" className={styles.plusIcon} aria-hidden=\"true\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n </button>\n\n <input\n ref={customInputRef}\n type=\"color\"\n value={isCustom && value ? value : '#000000'}\n className={styles.nativeInput}\n aria-hidden=\"true\"\n tabIndex={-1}\n onChange={(e) => onChange?.(e.target.value)}\n />\n </>\n )}\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"ColorPicker.cjs","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { type CSSProperties, type HTMLAttributes, type KeyboardEvent, useRef } from 'react';\n\nimport styles from './ColorPicker.module.css';\n\n// ─── ColorSwatch ─────────────────────────────────────────────────────────────\n\nexport type ColorSwatchSize = 'sm' \| 'md' \| 'lg';\n\nexport interface ColorSwatchProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' \| 'onSelect'> {\n /** CSS color value displayed as the swatch background. /\n color: string;\n /* Whether this swatch is the currently selected color. /\n selected?: boolean;\n /* Swatch diameter. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n /* Called when the user clicks or activates the swatch. /\n onSelect?: (color: string) => void;\n /* Accessible label. Defaults to the color value. /\n 'aria-label'?: string;\n disabled?: boolean;\n}\n\n/\n Single circular color swatch button.\n \n Can be used standalone or composed inside `ColorPicker`.\n * Shows a white checkmark when `selected`.\n /\nexport const ColorSwatch = ({\n color,\n selected = false,\n size = 'md',\n onSelect,\n disabled = false,\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorSwatchProps) => {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={selected}\n aria-label={ariaLabel ?? color}\n disabled={disabled}\n className={[\n styles.swatch,\n styles[`swatch-${size}`],\n selected ? styles.swatchSelected : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ '--swatch-color': color, ...style } as CSSProperties}\n onClick={() => onSelect?.(color)}\n {...props}\n >\n {selected && (\n <svg className={styles.checkmark} viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M3 8l3.5 3.5L13 5\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </button>\n );\n};\n\n// ─── ColorPicker ─────────────────────────────────────────────────────────────\n\nexport interface ColorPickerColor {\n /* CSS color value (hex recommended). /\n value: string;\n /* Human-readable name shown as aria-label and tooltip. /\n label?: string;\n}\n\n/* Default Adwaita-named palette (matches Avatar color set). /\n// eslint-disable-next-line react-refresh/only-export-components\nexport const GNOME_PALETTE: ColorPickerColor[] = [\n { value: '#3584e4', label: 'Blue' },\n { value: '#2ec27e', label: 'Green' },\n { value: '#f6d32d', label: 'Yellow' },\n { value: '#ff7800', label: 'Orange' },\n { value: '#e01b24', label: 'Red' },\n { value: '#9141ac', label: 'Purple' },\n { value: '#986a44', label: 'Brown' },\n { value: '#2190a4', label: 'Teal' },\n { value: '#5e5c64', label: 'Slate' },\n];\n\nexport interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n /* Currently selected color value. /\n value?: string;\n /* Called when the user selects a color. /\n onChange?: (value: string) => void;\n /\n Palette of colors to display.\n * Defaults to `GNOME_PALETTE` (the 9 Adwaita named colors).\n /\n colors?: ColorPickerColor[];\n /\n Show a \"Custom…\" button at the end that opens a native color picker.\n * When a custom color is chosen it is passed to `onChange` and shown\n * as a selected swatch until another palette color is picked.\n * Defaults to `false`.\n /\n allowCustom?: boolean;\n /* Swatch size. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n}\n\n/\n Color palette picker following the Adwaita `GtkColorButton` + swatch pattern.\n \n Renders a row of circular `ColorSwatch` items. Keyboard navigation uses\n * arrow keys (roving tabindex). Optionally adds a \"Custom…\" button backed\n * by a hidden `<input type=\"color\">`.\n \n ```tsx\n * <ColorPicker value={color} onChange={setColor} />\n * <ColorPicker value={color} onChange={setColor} allowCustom />\n * <ColorPicker\n * value={color}\n * onChange={setColor}\n * colors={[{ value: \"#ff0000\", label: \"Red\" }, …]}\n * />\n * ```\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ColorButton.html\n /\nexport const ColorPicker = ({\n value,\n onChange,\n colors = GNOME_PALETTE,\n allowCustom = false,\n size = 'md',\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorPickerProps) => {\n const customInputRef = useRef<HTMLInputElement>(null);\n\n // Roving tabindex: only the selected (or first) swatch is in the tab order.\n const activeIndex = colors.findIndex((c) => c.value === value);\n const rovingIndex = activeIndex >= 0 ? activeIndex : 0;\n\n // Arrow-key navigation within the radiogroup.\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const all = Array.from(\n e.currentTarget.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])'),\n );\n const focused = document.activeElement as HTMLButtonElement;\n const idx = all.indexOf(focused);\n\n if (idx === -1) {\n return;\n }\n\n let next = -1;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n e.preventDefault();\n next = (idx + 1) % all.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n next = (idx - 1 + all.length) % all.length;\n }\n\n if (next >= 0) {\n all[next].focus();\n const color = all[next].dataset.color;\n\n if (color) {\n onChange?.(color);\n }\n }\n }\n\n // Decide whether the current `value` is a custom (not in palette) color.\n const isCustom = value !== undefined && !colors.some((c) => c.value === value);\n\n return (\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel ?? 'Color'}\n className={[styles.picker, className].filter(Boolean).join(' ')}\n style={style}\n onKeyDown={handleKeyDown}\n {...props}\n >\n {colors.map((color, i) => (\n <ColorSwatch\n key={color.value}\n color={color.value}\n size={size}\n selected={color.value === value}\n onSelect={onChange}\n aria-label={color.label ?? color.value}\n tabIndex={i === rovingIndex && !isCustom ? 0 : -1}\n data-color={color.value}\n />\n ))}\n\n {allowCustom && (\n <>\n {/ Custom swatch — shows the picked color when active /}\n {isCustom && value && (\n <ColorSwatch\n color={value}\n size={size}\n selected\n onSelect={() => customInputRef.current?.click()}\n aria-label=\"Custom color\"\n tabIndex={0}\n data-color={value}\n />\n )}\n\n {/ + button that opens the native color input */}\n <button\n type=\"button\"\n aria-label=\"Choose custom color\"\n className={[styles.swatch, styles[`swatch-${size}`], styles.customButton]\n .filter(Boolean)\n .join(' ')}\n tabIndex={isCustom ? -1 : -1}\n onClick={() => customInputRef.current?.click()}\n >\n <svg viewBox=\"0 0 16 16\" className={styles.plusIcon} aria-hidden=\"true\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n </button>\n\n <input\n ref={customInputRef}\n type=\"color\"\n value={isCustom && value ? value : '#000000'}\n className={styles.nativeInput}\n aria-hidden=\"true\"\n tabIndex={-1}\n onChange={(e) => onChange?.(e.target.value)}\n />\n </>\n )}\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/components/ColorPicker/ColorPicker.d.ts CHANGED Viewed

@@ -19,7 +19,7 @@ export interface ColorSwatchProps extends Omit<HTMLAttributes<HTMLButtonElement>
  * Can be used standalone or composed inside `ColorPicker`.
  * Shows a white checkmark when `selected`.
  */
-export declare function ColorSwatch({ color, selected, size, onSelect, disabled, className, style, 'aria-label': ariaLabel, ...props }: ColorSwatchProps): import("react/jsx-runtime").JSX.Element;
+export declare const ColorSwatch: ({ color, selected, size, onSelect, disabled, className, style, "aria-label": ariaLabel, ...props }: ColorSwatchProps) => import("react/jsx-runtime").JSX.Element;
 export interface ColorPickerColor {
     /** CSS color value (hex recommended). */
     value: string;
@@ -67,4 +67,4 @@ export interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, '
  *
  * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ColorButton.html
  */
-export declare function ColorPicker({ value, onChange, colors, allowCustom, size, className, style, 'aria-label': ariaLabel, ...props }: ColorPickerProps): import("react/jsx-runtime").JSX.Element;
+export declare const ColorPicker: ({ value, onChange, colors, allowCustom, size, className, style, "aria-label": ariaLabel, ...props }: ColorPickerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ColorPicker/ColorPicker.js CHANGED Viewed

@@ -2,41 +2,38 @@ import e from "./ColorPicker.module.css.js";
 import { useRef as t } from "react";
 import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/ColorPicker/ColorPicker.tsx
-function a({ color: t, selected: n = !1, size: i = "md", onSelect: a, disabled: o = !1, className: s, style: c, "aria-label": l, ...u }) {
-	return /* @__PURE__ */ r("button", {
-		type: "button",
-		role: "radio",
-		"aria-checked": n,
-		"aria-label": l ?? t,
-		disabled: o,
-		className: [
-			e.swatch,
-			e[`swatch-${i}`],
-			n ? e.swatchSelected : null,
-			s
-		].filter(Boolean).join(" "),
-		style: {
-			"--swatch-color": t,
-			...c
-		},
-		onClick: () => a?.(t),
-		...u,
-		children: n && /* @__PURE__ */ r("svg", {
-			className: e.checkmark,
-			viewBox: "0 0 16 16",
-			fill: "none",
-			"aria-hidden": "true",
-			children: /* @__PURE__ */ r("path", {
-				d: "M3 8l3.5 3.5L13 5",
-				stroke: "white",
-				strokeWidth: "2",
-				strokeLinecap: "round",
-				strokeLinejoin: "round"
-			})
+var a = ({ color: t, selected: n = !1, size: i = "md", onSelect: a, disabled: o = !1, className: s, style: c, "aria-label": l, ...u }) => /* @__PURE__ */ r("button", {
+	type: "button",
+	role: "radio",
+	"aria-checked": n,
+	"aria-label": l ?? t,
+	disabled: o,
+	className: [
+		e.swatch,
+		e[`swatch-${i}`],
+		n ? e.swatchSelected : null,
+		s
+	].filter(Boolean).join(" "),
+	style: {
+		"--swatch-color": t,
+		...c
+	},
+	onClick: () => a?.(t),
+	...u,
+	children: n && /* @__PURE__ */ r("svg", {
+		className: e.checkmark,
+		viewBox: "0 0 16 16",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ r("path", {
+			d: "M3 8l3.5 3.5L13 5",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
 		})
-	});
-}
-var o = [
+	})
+}), o = [
 	{
 		value: "#3584e4",
 		label: "Blue"
@@ -73,8 +70,7 @@ var o = [
 		value: "#5e5c64",
 		label: "Slate"
 	}
-];
-function s({ value: s, onChange: c, colors: l = o, allowCustom: u = !1, size: d = "md", className: f, style: p, "aria-label": m, ...h }) {
+], s = ({ value: s, onChange: c, colors: l = o, allowCustom: u = !1, size: d = "md", className: f, style: p, "aria-label": m, ...h }) => {
 	let g = t(null), _ = l.findIndex((e) => e.value === s), v = _ >= 0 ? _ : 0;
 	function y(e) {
 		let t = Array.from(e.currentTarget.querySelectorAll("[role=\"radio\"]:not([disabled])")), n = document.activeElement, r = t.indexOf(n);
@@ -145,7 +141,7 @@ function s({ value: s, onChange: c, colors: l = o, allowCustom: u = !1, size: d
 			})
 		] })]
 	});
-}
+};
 //#endregion
 export { s as ColorPicker, a as ColorSwatch, o as GNOME_PALETTE };

package/dist/components/ColorPicker/ColorPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorPicker.js","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { type CSSProperties, type HTMLAttributes, type KeyboardEvent, useRef } from 'react';\n\nimport styles from './ColorPicker.module.css';\n\n// ─── ColorSwatch ─────────────────────────────────────────────────────────────\n\nexport type ColorSwatchSize = 'sm' \| 'md' \| 'lg';\n\nexport interface ColorSwatchProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' \| 'onSelect'> {\n /** CSS color value displayed as the swatch background. /\n color: string;\n /* Whether this swatch is the currently selected color. /\n selected?: boolean;\n /* Swatch diameter. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n /* Called when the user clicks or activates the swatch. /\n onSelect?: (color: string) => void;\n /* Accessible label. Defaults to the color value. /\n 'aria-label'?: string;\n disabled?: boolean;\n}\n\n/\n Single circular color swatch button.\n \n Can be used standalone or composed inside `ColorPicker`.\n * Shows a white checkmark when `selected`.\n /\nexport function ColorSwatch({\n color,\n selected = false,\n size = 'md',\n onSelect,\n disabled = false,\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorSwatchProps) {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={selected}\n aria-label={ariaLabel ?? color}\n disabled={disabled}\n className={[\n styles.swatch,\n styles[`swatch-${size}`],\n selected ? styles.swatchSelected : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ '--swatch-color': color, ...style } as CSSProperties}\n onClick={() => onSelect?.(color)}\n {...props}\n >\n {selected && (\n <svg className={styles.checkmark} viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M3 8l3.5 3.5L13 5\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </button>\n );\n}\n\n// ─── ColorPicker ─────────────────────────────────────────────────────────────\n\nexport interface ColorPickerColor {\n /* CSS color value (hex recommended). /\n value: string;\n /* Human-readable name shown as aria-label and tooltip. /\n label?: string;\n}\n\n/* Default Adwaita-named palette (matches Avatar color set). /\n// eslint-disable-next-line react-refresh/only-export-components\nexport const GNOME_PALETTE: ColorPickerColor[] = [\n { value: '#3584e4', label: 'Blue' },\n { value: '#2ec27e', label: 'Green' },\n { value: '#f6d32d', label: 'Yellow' },\n { value: '#ff7800', label: 'Orange' },\n { value: '#e01b24', label: 'Red' },\n { value: '#9141ac', label: 'Purple' },\n { value: '#986a44', label: 'Brown' },\n { value: '#2190a4', label: 'Teal' },\n { value: '#5e5c64', label: 'Slate' },\n];\n\nexport interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n /* Currently selected color value. /\n value?: string;\n /* Called when the user selects a color. /\n onChange?: (value: string) => void;\n /\n Palette of colors to display.\n * Defaults to `GNOME_PALETTE` (the 9 Adwaita named colors).\n /\n colors?: ColorPickerColor[];\n /\n Show a \"Custom…\" button at the end that opens a native color picker.\n * When a custom color is chosen it is passed to `onChange` and shown\n * as a selected swatch until another palette color is picked.\n * Defaults to `false`.\n /\n allowCustom?: boolean;\n /* Swatch size. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n}\n\n/\n Color palette picker following the Adwaita `GtkColorButton` + swatch pattern.\n \n Renders a row of circular `ColorSwatch` items. Keyboard navigation uses\n * arrow keys (roving tabindex). Optionally adds a \"Custom…\" button backed\n * by a hidden `<input type=\"color\">`.\n \n ```tsx\n * <ColorPicker value={color} onChange={setColor} />\n * <ColorPicker value={color} onChange={setColor} allowCustom />\n * <ColorPicker\n * value={color}\n * onChange={setColor}\n * colors={[{ value: \"#ff0000\", label: \"Red\" }, …]}\n * />\n * ```\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ColorButton.html\n /\nexport function ColorPicker({\n value,\n onChange,\n colors = GNOME_PALETTE,\n allowCustom = false,\n size = 'md',\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorPickerProps) {\n const customInputRef = useRef<HTMLInputElement>(null);\n\n // Roving tabindex: only the selected (or first) swatch is in the tab order.\n const activeIndex = colors.findIndex((c) => c.value === value);\n const rovingIndex = activeIndex >= 0 ? activeIndex : 0;\n\n // Arrow-key navigation within the radiogroup.\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const all = Array.from(\n e.currentTarget.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])'),\n );\n const focused = document.activeElement as HTMLButtonElement;\n const idx = all.indexOf(focused);\n\n if (idx === -1) {\n return;\n }\n\n let next = -1;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n e.preventDefault();\n next = (idx + 1) % all.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n next = (idx - 1 + all.length) % all.length;\n }\n\n if (next >= 0) {\n all[next].focus();\n const color = all[next].dataset.color;\n\n if (color) {\n onChange?.(color);\n }\n }\n }\n\n // Decide whether the current `value` is a custom (not in palette) color.\n const isCustom = value !== undefined && !colors.some((c) => c.value === value);\n\n return (\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel ?? 'Color'}\n className={[styles.picker, className].filter(Boolean).join(' ')}\n style={style}\n onKeyDown={handleKeyDown}\n {...props}\n >\n {colors.map((color, i) => (\n <ColorSwatch\n key={color.value}\n color={color.value}\n size={size}\n selected={color.value === value}\n onSelect={onChange}\n aria-label={color.label ?? color.value}\n tabIndex={i === rovingIndex && !isCustom ? 0 : -1}\n data-color={color.value}\n />\n ))}\n\n {allowCustom && (\n <>\n {/ Custom swatch — shows the picked color when active /}\n {isCustom && value && (\n <ColorSwatch\n color={value}\n size={size}\n selected\n onSelect={() => customInputRef.current?.click()}\n aria-label=\"Custom color\"\n tabIndex={0}\n data-color={value}\n />\n )}\n\n {/ + button that opens the native color input */}\n <button\n type=\"button\"\n aria-label=\"Choose custom color\"\n className={[styles.swatch, styles[`swatch-${size}`], styles.customButton]\n .filter(Boolean)\n .join(' ')}\n tabIndex={isCustom ? -1 : -1}\n onClick={() => customInputRef.current?.click()}\n >\n <svg viewBox=\"0 0 16 16\" className={styles.plusIcon} aria-hidden=\"true\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n </button>\n\n <input\n ref={customInputRef}\n type=\"color\"\n value={isCustom && value ? value : '#000000'}\n className={styles.nativeInput}\n aria-hidden=\"true\"\n tabIndex={-1}\n onChange={(e) => onChange?.(e.target.value)}\n />\n </>\n )}\n </div>\n );\n}\n"],"mappings":";;;;AA6BA,SAAgB,EAAY,EAC1B,UACA,cAAW,IACX,UAAO,MACP,aACA,cAAW,IACX,cACA,UACA,cAAc,GACd,GAAG,KACgB;AACnB,QACE,kBAAC,UAAD;EACE,MAAK;EACL,MAAK;EACL,gBAAc;EACd,cAAY,KAAa;EACf;EACV,WAAW;GACT,EAAO;GACP,EAAO,UAAU;GACjB,IAAW,EAAO,iBAAiB;GACnC;GACD,CACE,OAAO,QAAQ,CACf,KAAK,IAAI;EACZ,OAAO;GAAE,kBAAkB;GAAO,GAAG;GAAO;EAC5C,eAAe,IAAW,EAAM;EAChC,GAAI;YAEH,KACC,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAW,SAAQ;GAAY,MAAK;GAAO,eAAY;aAC5E,kBAAC,QAAD;IACE,GAAE;IACF,QAAO;IACP,aAAY;IACZ,eAAc;IACd,gBAAe;IACf,CAAA;GACE,CAAA;EAED,CAAA;;AAeb,IAAa,IAAoC;CAC/C;EAAE,OAAO;EAAW,OAAO;EAAQ;CACnC;EAAE,OAAO;EAAW,OAAO;EAAS;CACpC;EAAE,OAAO;EAAW,OAAO;EAAU;CACrC;EAAE,OAAO;EAAW,OAAO;EAAU;CACrC;EAAE,OAAO;EAAW,OAAO;EAAO;CAClC;EAAE,OAAO;EAAW,OAAO;EAAU;CACrC;EAAE,OAAO;EAAW,OAAO;EAAS;CACpC;EAAE,OAAO;EAAW,OAAO;EAAQ;CACnC;EAAE,OAAO;EAAW,OAAO;EAAS;CACrC;AA0CD,SAAgB,EAAY,EAC1B,UACA,aACA,YAAS,GACT,iBAAc,IACd,UAAO,MACP,cACA,UACA,cAAc,GACd,GAAG,KACgB;CACnB,IAAM,IAAiB,EAAyB,KAAK,EAG/C,IAAc,EAAO,WAAW,MAAM,EAAE,UAAU,EAAM,EACxD,IAAc,KAAe,IAAI,IAAc;CAGrD,SAAS,EAAc,GAAkC;EACvD,IAAM,IAAM,MAAM,KAChB,EAAE,cAAc,iBAAoC,mCAAiC,CACtF,EACK,IAAU,SAAS,eACnB,IAAM,EAAI,QAAQ,EAAQ;AAEhC,MAAI,MAAQ,GACV;EAGF,IAAI,IAAO;AASX,MARI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,eACtC,EAAE,gBAAgB,EAClB,KAAQ,IAAM,KAAK,EAAI,WACd,EAAE,QAAQ,eAAe,EAAE,QAAQ,eAC5C,EAAE,gBAAgB,EAClB,KAAQ,IAAM,IAAI,EAAI,UAAU,EAAI,SAGlC,KAAQ,GAAG;AACb,KAAI,GAAM,OAAO;GACjB,IAAM,IAAQ,EAAI,GAAM,QAAQ;AAEhC,GAAI,KACF,IAAW,EAAM;;;CAMvB,IAAM,IAAW,MAAU,KAAA,KAAa,CAAC,EAAO,MAAM,MAAM,EAAE,UAAU,EAAM;AAE9E,QACE,kBAAC,OAAD;EACE,MAAK;EACL,cAAY,KAAa;EACzB,WAAW,CAAC,EAAO,QAAQ,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACxD;EACP,WAAW;EACX,GAAI;YANN,CAQG,EAAO,KAAK,GAAO,MAClB,kBAAC,GAAD;GAEE,OAAO,EAAM;GACP;GACN,UAAU,EAAM,UAAU;GAC1B,UAAU;GACV,cAAY,EAAM,SAAS,EAAM;GACjC,UAAU,MAAM,KAAe,CAAC,IAAW,IAAI;GAC/C,cAAY,EAAM;GAClB,EARK,EAAM,MAQX,CACF,EAED,KACC,kBAAA,GAAA,EAAA,UAAA;GAEG,KAAY,KACX,kBAAC,GAAD;IACE,OAAO;IACD;IACN,UAAA;IACA,gBAAgB,EAAe,SAAS,OAAO;IAC/C,cAAW;IACX,UAAU;IACV,cAAY;IACZ,CAAA;GAIJ,kBAAC,UAAD;IACE,MAAK;IACL,cAAW;IACX,WAAW;KAAC,EAAO;KAAQ,EAAO,UAAU;KAAS,EAAO;KAAa,CACtE,OAAO,QAAQ,CACf,KAAK,IAAI;IACZ,UAAqB;IACrB,eAAe,EAAe,SAAS,OAAO;cAE9C,kBAAC,OAAD;KAAK,SAAQ;KAAY,WAAW,EAAO;KAAU,eAAY;eAC/D,kBAAC,QAAD;MACE,GAAE;MACF,QAAO;MACP,aAAY;MACZ,eAAc;MACd,CAAA;KACE,CAAA;IACC,CAAA;GAET,kBAAC,SAAD;IACE,KAAK;IACL,MAAK;IACL,OAAO,KAAY,IAAQ,IAAQ;IACnC,WAAW,EAAO;IAClB,eAAY;IACZ,UAAU;IACV,WAAW,MAAM,IAAW,EAAE,OAAO,MAAM;IAC3C,CAAA;GACD,EAAA,CAAA,CAED"}
1	+ {"version":3,"file":"ColorPicker.js","names":[],"sources":["../../../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import { type CSSProperties, type HTMLAttributes, type KeyboardEvent, useRef } from 'react';\n\nimport styles from './ColorPicker.module.css';\n\n// ─── ColorSwatch ─────────────────────────────────────────────────────────────\n\nexport type ColorSwatchSize = 'sm' \| 'md' \| 'lg';\n\nexport interface ColorSwatchProps\n extends Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' \| 'onSelect'> {\n /** CSS color value displayed as the swatch background. /\n color: string;\n /* Whether this swatch is the currently selected color. /\n selected?: boolean;\n /* Swatch diameter. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n /* Called when the user clicks or activates the swatch. /\n onSelect?: (color: string) => void;\n /* Accessible label. Defaults to the color value. /\n 'aria-label'?: string;\n disabled?: boolean;\n}\n\n/\n Single circular color swatch button.\n \n Can be used standalone or composed inside `ColorPicker`.\n * Shows a white checkmark when `selected`.\n /\nexport const ColorSwatch = ({\n color,\n selected = false,\n size = 'md',\n onSelect,\n disabled = false,\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorSwatchProps) => {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={selected}\n aria-label={ariaLabel ?? color}\n disabled={disabled}\n className={[\n styles.swatch,\n styles[`swatch-${size}`],\n selected ? styles.swatchSelected : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ '--swatch-color': color, ...style } as CSSProperties}\n onClick={() => onSelect?.(color)}\n {...props}\n >\n {selected && (\n <svg className={styles.checkmark} viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n <path\n d=\"M3 8l3.5 3.5L13 5\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )}\n </button>\n );\n};\n\n// ─── ColorPicker ─────────────────────────────────────────────────────────────\n\nexport interface ColorPickerColor {\n /* CSS color value (hex recommended). /\n value: string;\n /* Human-readable name shown as aria-label and tooltip. /\n label?: string;\n}\n\n/* Default Adwaita-named palette (matches Avatar color set). /\n// eslint-disable-next-line react-refresh/only-export-components\nexport const GNOME_PALETTE: ColorPickerColor[] = [\n { value: '#3584e4', label: 'Blue' },\n { value: '#2ec27e', label: 'Green' },\n { value: '#f6d32d', label: 'Yellow' },\n { value: '#ff7800', label: 'Orange' },\n { value: '#e01b24', label: 'Red' },\n { value: '#9141ac', label: 'Purple' },\n { value: '#986a44', label: 'Brown' },\n { value: '#2190a4', label: 'Teal' },\n { value: '#5e5c64', label: 'Slate' },\n];\n\nexport interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n /* Currently selected color value. /\n value?: string;\n /* Called when the user selects a color. /\n onChange?: (value: string) => void;\n /\n Palette of colors to display.\n * Defaults to `GNOME_PALETTE` (the 9 Adwaita named colors).\n /\n colors?: ColorPickerColor[];\n /\n Show a \"Custom…\" button at the end that opens a native color picker.\n * When a custom color is chosen it is passed to `onChange` and shown\n * as a selected swatch until another palette color is picked.\n * Defaults to `false`.\n /\n allowCustom?: boolean;\n /* Swatch size. Defaults to `\"md\"`. /\n size?: ColorSwatchSize;\n}\n\n/\n Color palette picker following the Adwaita `GtkColorButton` + swatch pattern.\n \n Renders a row of circular `ColorSwatch` items. Keyboard navigation uses\n * arrow keys (roving tabindex). Optionally adds a \"Custom…\" button backed\n * by a hidden `<input type=\"color\">`.\n \n ```tsx\n * <ColorPicker value={color} onChange={setColor} />\n * <ColorPicker value={color} onChange={setColor} allowCustom />\n * <ColorPicker\n * value={color}\n * onChange={setColor}\n * colors={[{ value: \"#ff0000\", label: \"Red\" }, …]}\n * />\n * ```\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ColorButton.html\n /\nexport const ColorPicker = ({\n value,\n onChange,\n colors = GNOME_PALETTE,\n allowCustom = false,\n size = 'md',\n className,\n style,\n 'aria-label': ariaLabel,\n ...props\n}: ColorPickerProps) => {\n const customInputRef = useRef<HTMLInputElement>(null);\n\n // Roving tabindex: only the selected (or first) swatch is in the tab order.\n const activeIndex = colors.findIndex((c) => c.value === value);\n const rovingIndex = activeIndex >= 0 ? activeIndex : 0;\n\n // Arrow-key navigation within the radiogroup.\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const all = Array.from(\n e.currentTarget.querySelectorAll<HTMLButtonElement>('[role=\"radio\"]:not([disabled])'),\n );\n const focused = document.activeElement as HTMLButtonElement;\n const idx = all.indexOf(focused);\n\n if (idx === -1) {\n return;\n }\n\n let next = -1;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n e.preventDefault();\n next = (idx + 1) % all.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n e.preventDefault();\n next = (idx - 1 + all.length) % all.length;\n }\n\n if (next >= 0) {\n all[next].focus();\n const color = all[next].dataset.color;\n\n if (color) {\n onChange?.(color);\n }\n }\n }\n\n // Decide whether the current `value` is a custom (not in palette) color.\n const isCustom = value !== undefined && !colors.some((c) => c.value === value);\n\n return (\n <div\n role=\"radiogroup\"\n aria-label={ariaLabel ?? 'Color'}\n className={[styles.picker, className].filter(Boolean).join(' ')}\n style={style}\n onKeyDown={handleKeyDown}\n {...props}\n >\n {colors.map((color, i) => (\n <ColorSwatch\n key={color.value}\n color={color.value}\n size={size}\n selected={color.value === value}\n onSelect={onChange}\n aria-label={color.label ?? color.value}\n tabIndex={i === rovingIndex && !isCustom ? 0 : -1}\n data-color={color.value}\n />\n ))}\n\n {allowCustom && (\n <>\n {/ Custom swatch — shows the picked color when active /}\n {isCustom && value && (\n <ColorSwatch\n color={value}\n size={size}\n selected\n onSelect={() => customInputRef.current?.click()}\n aria-label=\"Custom color\"\n tabIndex={0}\n data-color={value}\n />\n )}\n\n {/ + button that opens the native color input */}\n <button\n type=\"button\"\n aria-label=\"Choose custom color\"\n className={[styles.swatch, styles[`swatch-${size}`], styles.customButton]\n .filter(Boolean)\n .join(' ')}\n tabIndex={isCustom ? -1 : -1}\n onClick={() => customInputRef.current?.click()}\n >\n <svg viewBox=\"0 0 16 16\" className={styles.plusIcon} aria-hidden=\"true\">\n <path\n d=\"M8 3v10M3 8h10\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n />\n </svg>\n </button>\n\n <input\n ref={customInputRef}\n type=\"color\"\n value={isCustom && value ? value : '#000000'}\n className={styles.nativeInput}\n aria-hidden=\"true\"\n tabIndex={-1}\n onChange={(e) => onChange?.(e.target.value)}\n />\n </>\n )}\n </div>\n );\n};\n"],"mappings":"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"}