@adea-ai/ui 0.115.1 → 0.117.0

package/dist/components/composites/appearance-editor/accent-swatch-groups.d.ts

@@ -17,6 +17,12 @@ type AccentSwatchGroupsProps = {
     themeAccentOptions?: readonly AccentOption[];
     resolvedAppearance: 'light' | 'dark';
     themeDefaultColor: string;
+    /**
+     * Whether the group leads with the "Theme default" swatch. Hosts whose
+     * default accent already is a preset omit it — a second entry for the same
+     * colour reads as a duplicate choice.
+     */
+    showThemeDefault?: boolean;
 };
 /**
  * The accent choices, as ONE group: the theme's own primary first, then every

package/dist/components/composites/appearance-editor/accent-swatch-groups.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accent-swatch-groups.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/accent-swatch-groups.tsx"],"names":[],"mappings":"AA0BA,KAAK,YAAY,GAAG,QAAQ,CAAC;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAC,CAAA;AAEF,KAAK,uBAAuB,GAAG;IAC7B,aAAa,EAAE,SAAS,YAAY,EAAE,CAAA;IACtC;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,SAAS,YAAY,EAAE,CAAA;IAC5C,kBAAkB,EAAE,OAAO,GAAG,MAAM,CAAA;IACpC,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,kCAiBhE"}
+{"version":3,"file":"accent-swatch-groups.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/accent-swatch-groups.tsx"],"names":[],"mappings":"AA0BA,KAAK,YAAY,GAAG,QAAQ,CAAC;IAC3B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAC,CAAA;AAEF,KAAK,uBAAuB,GAAG;IAC7B,aAAa,EAAE,SAAS,YAAY,EAAE,CAAA;IACtC;;;;;;;OAOG;IACH,kBAAkB,CAAC,EAAE,SAAS,YAAY,EAAE,CAAA;IAC5C,kBAAkB,EAAE,OAAO,GAAG,MAAM,CAAA;IACpC,iBAAiB,EAAE,MAAM,CAAA;IACzB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,CAAA;AAED;;;;;;;GAOG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,kCAmBhE"}

package/dist/components/composites/appearance-editor/accent-swatch-groups.js

@@ -1,5 +1,5 @@
 import { createComponent, effect, insert, setStyleProperty, template } from "solid-js/web";
-import { For } from "solid-js";
+import { For, Show } from "solid-js";
 import { RadioGroup } from "@kobalte/core/radio-group";
 //#region src/components/composites/appearance-editor/accent-swatch-groups.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<div class="grid grid-cols-4 gap-2"data-accent-grid>`);
@@ -17,11 +17,18 @@ function AccentSwatchGroups(props) {
 	const presets = () => props.accentOptions.filter((option) => option.id !== "theme");
 	return (() => {
 		var _el$ = _tmpl$();
-		insert(_el$, createComponent(AccentSwatch, {
-			id: "theme",
-			label: "Theme default",
-			get color() {
-				return props.themeDefaultColor;
+		insert(_el$, createComponent(Show, {
+			get when() {
+				return props.showThemeDefault ?? true;
+			},
+			get children() {
+				return createComponent(AccentSwatch, {
+					id: "theme",
+					label: "Theme default",
+					get color() {
+						return props.themeDefaultColor;
+					}
+				});
 			}
 		}), null);
 		insert(_el$, createComponent(For, {

package/dist/components/composites/appearance-editor/accent-swatch-groups.js.map

@@ -1 +1 @@
-{"version":3,"file":"accent-swatch-groups.js","names":["RadioGroup","Radio","For","AccentOption","Readonly","id","label","light","dark","AccentSwatchGroupsProps","accentOptions","themeAccentOptions","resolvedAppearance","themeDefaultColor","AccentSwatchGroups","props","presets","filter","option","_el$","_tmpl$","_$insert","_$createComponent","AccentSwatch","color","each","children","Item","value","data-accent-option","ItemInput","ItemLabel","_el$2","_tmpl$2","_$effect","_$p","_$setStyleProperty","_el$3","_tmpl$3","_$createComponent","Radio","_$setStyleProperty"],"sources":["../../../../src/components/composites/appearance-editor/accent-swatch-groups.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\nimport { RadioGroup as Radio } from '@kobalte/core/radio-group'\nimport { For } from 'solid-js'\n\ntype AccentOption = Readonly<{\n  id: string\n  label: string\n  light?: string\n  dark?: string\n}>\n\ntype AccentSwatchGroupsProps = {\n  accentOptions: readonly AccentOption[]\n  /**\n   * Accepted for host compatibility and no longer rendered. The picker offers\n   * one theme-scoped group — the theme's own primary followed by the presets —\n   * instead of splitting additional presets and the theme pair's accent slots\n   * into labelled groups of their own. A stored theme-accent id still resolves\n   * (`resolveAccentPreset`) and is still described by the row; it is just no\n   * longer offered as a swatch, and a host can stop feeding this list.\n   */\n  themeAccentOptions?: readonly AccentOption[]\n  resolvedAppearance: 'light' | 'dark'\n  themeDefaultColor: string\n}\n\n/**\n * The accent choices, as ONE group: the theme's own primary first, then every\n * preset the host feeds, each painted with its value for the resolved\n * appearance — which is what makes the group theme-scoped rather than a\n * catalogue table. The custom-color entry is the host's (`AccentChoices`\n * renders it beside this grid), because whether a free-form colour is accepted\n * is the host's validation to own.\n */\nexport function AccentSwatchGroups(props: AccentSwatchGroupsProps) {\n  const presets = () => props.accentOptions.filter((option) => option.id !== 'theme')\n\n  return (\n    <div class=\"grid grid-cols-4 gap-2\" data-accent-grid>\n      <AccentSwatch id=\"theme\" label=\"Theme default\" color={props.themeDefaultColor} />\n      <For each={presets()}>\n        {(option) => (\n          <AccentSwatch\n            id={option.id}\n            label={option.label}\n            color={(props.resolvedAppearance === 'light' ? option.light : option.dark) ?? ''}\n          />\n        )}\n      </For>\n    </div>\n  )\n}\n\nfunction AccentSwatch(props: { id: string; label: string; color: string }) {\n  return (\n    <Radio.Item\n      value={props.id}\n      data-accent-option={props.id}\n      class=\"rounded-full focus-within:ring-3 focus-within:ring-ring/50\"\n    >\n      <Radio.ItemInput />\n      <Radio.ItemLabel class=\"block size-7 cursor-pointer rounded-full border p-0.5 data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n        <span\n          class=\"block size-full rounded-full\"\n          aria-hidden=\"true\"\n          style={{ 'background-color': props.color }}\n        />\n        <span class=\"sr-only\">{props.label}</span>\n      </Radio.ItemLabel>\n    </Radio.Item>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAwDA,SAAgBc,mBAAmBC,OAAgC;CACjE,MAAMC,gBAAgBD,MAAML,cAAcO,QAAQC,WAAWA,OAAOb,OAAO,OAAO;CAElF,cAAA;EAAA,IAAAc,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,gBAEKC,cAAY;GAAClB,IAAE;GAASC,OAAK;GAAA,IAAiBkB,QAAK;IAAA,OAAET,MAAMF;GAAiB;EAAA,CAAA,GAAA,IAAA;EAAAQ,OAAAF,MAAAG,gBAC5EpB,KAAG;GAAA,IAACuB,OAAI;IAAA,OAAET,QAAQ;GAAC;GAAAU,WAChBR,WAAMI,gBACLC,cAAY;IAAA,IACXlB,KAAE;KAAA,OAAEa,OAAOb;IAAE;IAAA,IACbC,QAAK;KAAA,OAAEY,OAAOZ;IAAK;IAAA,IACnBkB,QAAK;KAAA,QAAGT,MAAMH,uBAAuB,UAAUM,OAAOX,QAAQW,OAAOV,SAAS;IAAE;GAAA,CAAA;EAEnF,CAAA,GAAA,IAAA;EAAA,OAAAW;CAAA,EAAA,CAAA;AAIT;AAEA,SAASI,aAAaR,OAAqD;CACzE,OAAAO,gBACGrB,WAAM0B,MAAI;EAAA,IACTC,QAAK;GAAA,OAAEb,MAAMV;EAAE;EAAA,KAAA,wBAAA;GAAA,OACKU,MAAMV;EAAE;EAAA,SAAA;EAAA,IAAAqB,WAAA;GAAA,OAAA,CAAAJ,gBAG3BrB,WAAM6B,WAAS,CAAA,CAAA,GAAAR,gBACfrB,WAAM8B,WAAS;IAAA,SAAA;IAAA,IAAAL,WAAA;KAAA,OAAA,QAAA;MAAA,IAAAM,QAAAC,QAAA;MAAAC,QAAAC,QAAAC,iBAAAJ,OAAA,oBAIiBjB,MAAMS,KAAK,CAAA;MAAA,OAAAQ;KAAA,EAAA,CAAA,UAAA;MAAA,IAAAK,QAAAC,QAAA;MAAAjB,OAAAgB,aAEnBtB,MAAMT,KAAK;MAAA,OAAA+B;KAAA,EAAA,CAAA,CAAA;IAAA;GAAA,CAAA,CAAA;EAAA;CAAA,CAAA;AAI1C"}
+{"version":3,"file":"accent-swatch-groups.js","names":["RadioGroup","Radio","For","Show","AccentOption","Readonly","id","label","light","dark","AccentSwatchGroupsProps","accentOptions","themeAccentOptions","resolvedAppearance","themeDefaultColor","showThemeDefault","AccentSwatchGroups","props","presets","filter","option","_el$","_tmpl$","_$insert","_$createComponent","when","children","AccentSwatch","color","each","Item","value","data-accent-option","ItemInput","ItemLabel","_el$2","_tmpl$2","_$effect","_$p","_$setStyleProperty","_el$3","_tmpl$3","_$createComponent","Radio","_$setStyleProperty"],"sources":["../../../../src/components/composites/appearance-editor/accent-swatch-groups.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\nimport { RadioGroup as Radio } from '@kobalte/core/radio-group'\nimport { For, Show } from 'solid-js'\n\ntype AccentOption = Readonly<{\n  id: string\n  label: string\n  light?: string\n  dark?: string\n}>\n\ntype AccentSwatchGroupsProps = {\n  accentOptions: readonly AccentOption[]\n  /**\n   * Accepted for host compatibility and no longer rendered. The picker offers\n   * one theme-scoped group — the theme's own primary followed by the presets —\n   * instead of splitting additional presets and the theme pair's accent slots\n   * into labelled groups of their own. A stored theme-accent id still resolves\n   * (`resolveAccentPreset`) and is still described by the row; it is just no\n   * longer offered as a swatch, and a host can stop feeding this list.\n   */\n  themeAccentOptions?: readonly AccentOption[]\n  resolvedAppearance: 'light' | 'dark'\n  themeDefaultColor: string\n  /**\n   * Whether the group leads with the \"Theme default\" swatch. Hosts whose\n   * default accent already is a preset omit it — a second entry for the same\n   * colour reads as a duplicate choice.\n   */\n  showThemeDefault?: boolean\n}\n\n/**\n * The accent choices, as ONE group: the theme's own primary first, then every\n * preset the host feeds, each painted with its value for the resolved\n * appearance — which is what makes the group theme-scoped rather than a\n * catalogue table. The custom-color entry is the host's (`AccentChoices`\n * renders it beside this grid), because whether a free-form colour is accepted\n * is the host's validation to own.\n */\nexport function AccentSwatchGroups(props: AccentSwatchGroupsProps) {\n  const presets = () => props.accentOptions.filter((option) => option.id !== 'theme')\n\n  return (\n    <div class=\"grid grid-cols-4 gap-2\" data-accent-grid>\n      <Show when={props.showThemeDefault ?? true}>\n        <AccentSwatch id=\"theme\" label=\"Theme default\" color={props.themeDefaultColor} />\n      </Show>\n      <For each={presets()}>\n        {(option) => (\n          <AccentSwatch\n            id={option.id}\n            label={option.label}\n            color={(props.resolvedAppearance === 'light' ? option.light : option.dark) ?? ''}\n          />\n        )}\n      </For>\n    </div>\n  )\n}\n\nfunction AccentSwatch(props: { id: string; label: string; color: string }) {\n  return (\n    <Radio.Item\n      value={props.id}\n      data-accent-option={props.id}\n      class=\"rounded-full focus-within:ring-3 focus-within:ring-ring/50\"\n    >\n      <Radio.ItemInput />\n      <Radio.ItemLabel class=\"block size-7 cursor-pointer rounded-full border p-0.5 data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n        <span\n          class=\"block size-full rounded-full\"\n          aria-hidden=\"true\"\n          style={{ 'background-color': props.color }}\n        />\n        <span class=\"sr-only\">{props.label}</span>\n      </Radio.ItemLabel>\n    </Radio.Item>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AA8DA,SAAgBgB,mBAAmBC,OAAgC;CACjE,MAAMC,gBAAgBD,MAAMN,cAAcQ,QAAQC,WAAWA,OAAOd,OAAO,OAAO;CAElF,cAAA;EAAA,IAAAe,OAAAC,OAAA;EAAAC,OAAAF,MAAAG,gBAEKrB,MAAI;GAAA,IAACsB,OAAI;IAAA,OAAER,MAAMF,oBAAoB;GAAI;GAAA,IAAAW,WAAA;IAAA,OAAAF,gBACvCG,cAAY;KAACrB,IAAE;KAASC,OAAK;KAAA,IAAiBqB,QAAK;MAAA,OAAEX,MAAMH;KAAiB;IAAA,CAAA;GAAA;EAAA,CAAA,GAAA,IAAA;EAAAS,OAAAF,MAAAG,gBAE9EtB,KAAG;GAAA,IAAC2B,OAAI;IAAA,OAAEX,QAAQ;GAAC;GAAAQ,WAChBN,WAAMI,gBACLG,cAAY;IAAA,IACXrB,KAAE;KAAA,OAAEc,OAAOd;IAAE;IAAA,IACbC,QAAK;KAAA,OAAEa,OAAOb;IAAK;IAAA,IACnBqB,QAAK;KAAA,QAAGX,MAAMJ,uBAAuB,UAAUO,OAAOZ,QAAQY,OAAOX,SAAS;IAAE;GAAA,CAAA;EAEnF,CAAA,GAAA,IAAA;EAAA,OAAAY;CAAA,EAAA,CAAA;AAIT;AAEA,SAASM,aAAaV,OAAqD;CACzE,OAAAO,gBACGvB,WAAM6B,MAAI;EAAA,IACTC,QAAK;GAAA,OAAEd,MAAMX;EAAE;EAAA,KAAA,wBAAA;GAAA,OACKW,MAAMX;EAAE;EAAA,SAAA;EAAA,IAAAoB,WAAA;GAAA,OAAA,CAAAF,gBAG3BvB,WAAMgC,WAAS,CAAA,CAAA,GAAAT,gBACfvB,WAAMiC,WAAS;IAAA,SAAA;IAAA,IAAAR,WAAA;KAAA,OAAA,QAAA;MAAA,IAAAS,QAAAC,QAAA;MAAAC,QAAAC,QAAAC,iBAAAJ,OAAA,oBAIiBlB,MAAMW,KAAK,CAAA;MAAA,OAAAO;KAAA,EAAA,CAAA,UAAA;MAAA,IAAAK,QAAAC,QAAA;MAAAlB,OAAAiB,aAEnBvB,MAAMV,KAAK;MAAA,OAAAiC;KAAA,EAAA,CAAA,CAAA;IAAA;GAAA,CAAA,CAAA;EAAA;CAAA,CAAA;AAI1C"}

package/dist/components/composites/appearance-editor/appearance-choices.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-choices.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-choices.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAa/D,wBAAgB,WAAW,CAAC,KAAK,EAAE,qBAAqB,kCAyCvD;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,qBAAqB,GAAG,OAAO,CAOpE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,qBAAqB,kCAwCzD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,qBAAqB,kCA6BxD"}
+{"version":3,"file":"appearance-choices.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-choices.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAA;AAa/D,wBAAgB,WAAW,CAAC,KAAK,EAAE,qBAAqB,kCAyCvD;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,qBAAqB,GAAG,OAAO,CAOpE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,qBAAqB,kCA8EzD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,qBAAqB,kCA6BxD"}

package/dist/components/composites/appearance-editor/appearance-choices.js

@@ -7,7 +7,9 @@ import { RadioGroup } from "@kobalte/core/radio-group";
 //#region src/components/composites/appearance-editor/appearance-choices.tsx
 var _tmpl$ = /*#__PURE__*/ template(`<span class="block h-20 w-full">`);
 var _tmpl$2 = /*#__PURE__*/ template(`<span>`);
-var _tmpl$3 = /*#__PURE__*/ template(`<div class="flex flex-col gap-1"><span class="text-xs font-medium text-muted-foreground">Custom`);
+var _tmpl$3 = /*#__PURE__*/ template(`<div class="grid grid-cols-2 gap-2 sm:grid-cols-3"data-accent-grid>`);
+var _tmpl$4 = /*#__PURE__*/ template(`<span class="text-xs font-medium text-muted-foreground">Custom`);
+var _tmpl$5 = /*#__PURE__*/ template(`<div class="flex flex-col gap-1">`);
 var MODES = [
 	{
 		value: "system",
@@ -115,6 +117,14 @@ function isCustomAccent(props) {
 function AccentChoices(props) {
 	const resolvedAppearance = () => props.draft.mode === "system" ? props.resolvedAppearance : props.draft.mode;
 	const accentSelection = () => isCustomAccent(props) ? "custom" : props.draft.accent;
+	const showThemeDefault = () => props.showThemeDefaultAccent ?? true;
+	const labelEntries = () => {
+		const presets = props.accentOptions.filter((option) => option.id !== "theme");
+		return showThemeDefault() ? [{
+			id: "theme",
+			label: "Theme default"
+		}, ...presets] : presets;
+	};
 	return createComponent(RadioGroup, {
 		get value() {
 			return accentSelection();
@@ -127,30 +137,83 @@ function AccentChoices(props) {
 		"class": "flex flex-col items-start gap-3",
 		onChange: (accent) => props.onChange({ accent: accent === "custom" ? props.customAccentValue ?? "" : accent }),
 		get children() {
-			return [createComponent(AccentSwatchGroups, {
-				get accentOptions() {
-					return props.accentOptions;
+			return createComponent(Show, {
+				get when() {
+					return (props.accentEntryStyle ?? "swatches") === "labels";
 				},
-				get resolvedAppearance() {
-					return resolvedAppearance();
+				get fallback() {
+					return [createComponent(AccentSwatchGroups, {
+						get accentOptions() {
+							return props.accentOptions;
+						},
+						get resolvedAppearance() {
+							return resolvedAppearance();
+						},
+						get showThemeDefault() {
+							return showThemeDefault();
+						},
+						get themeDefaultColor() {
+							return memo(() => resolvedAppearance() === "light")() ? props.lightTheme.colors.accent : props.darkTheme.colors.accent;
+						}
+					}), (() => {
+						var _el$4 = _tmpl$5();
+						insert(_el$4, createComponent(Show, {
+							get when() {
+								return props.showCustomAccentCaption ?? true;
+							},
+							get children() {
+								return _tmpl$4();
+							}
+						}), null);
+						insert(_el$4, createComponent(RadioGroup.Item, {
+							value: "custom",
+							get children() {
+								return [createComponent(RadioGroup.ItemInput, {}), createComponent(RadioGroup.ItemLabel, {
+									"class": "flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary",
+									children: "Custom"
+								})];
+							}
+						}), null);
+						return _el$4;
+					})()];
 				},
-				get themeDefaultColor() {
-					return memo(() => resolvedAppearance() === "light")() ? props.lightTheme.colors.accent : props.darkTheme.colors.accent;
+				get children() {
+					var _el$3 = _tmpl$3();
+					insert(_el$3, createComponent(For, {
+						get each() {
+							return labelEntries();
+						},
+						children: (option) => createComponent(RadioGroup.Item, {
+							get value() {
+								return option.id;
+							},
+							"class": "min-w-0",
+							get ["data-accent-option"]() {
+								return option.id;
+							},
+							get children() {
+								return [createComponent(RadioGroup.ItemInput, {}), createComponent(RadioGroup.ItemLabel, {
+									"class": "flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary",
+									get children() {
+										return option.label;
+									}
+								})];
+							}
+						})
+					}), null);
+					insert(_el$3, createComponent(RadioGroup.Item, {
+						value: "custom",
+						"class": "min-w-0",
+						get children() {
+							return [createComponent(RadioGroup.ItemInput, {}), createComponent(RadioGroup.ItemLabel, {
+								"class": "flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary",
+								children: "Custom"
+							})];
+						}
+					}), null);
+					return _el$3;
 				}
-			}), (() => {
-				var _el$3 = _tmpl$3();
-				_el$3.firstChild;
-				insert(_el$3, createComponent(RadioGroup.Item, {
-					value: "custom",
-					get children() {
-						return [createComponent(RadioGroup.ItemInput, {}), createComponent(RadioGroup.ItemLabel, {
-							"class": "flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary",
-							children: "Custom"
-						})];
-					}
-				}), null);
-				return _el$3;
-			})()];
+			});
 		}
 	});
 }

package/dist/components/composites/appearance-editor/appearance-choices.js.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-choices.js","names":["RadioGroup","Radio","For","Show","isThemeAccentId","AccentSwatchGroups","AppearanceEditorProps","ThemeMiniature","ThemeMiniatureSplit","MODES","value","label","const","SURFACES","ModeChoices","props","_$createComponent","draft","mode","disabled","saving","orientation","onChange","option","find","candidate","children","each","Item","data-mode","ItemInput","ItemLabel","_el$","_tmpl$","_$insert","when","fallback","theme","_$memo","lightTheme","darkTheme","light","dark","_el$2","_tmpl$2","isCustomAccent","accent","accentOptions","some","id","AccentChoices","resolvedAppearance","accentSelection","customAccentValue","themeDefaultColor","colors","_el$3","_tmpl$3","_el$4","firstChild","GlassChoices","surface","surfaceCapability","frosted","_$createComponent","Radio","_$memo"],"sources":["../../../../src/components/composites/appearance-editor/appearance-choices.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n// Pinned mode-card, accent-swatch, and glass-chip composition. Kobalte replaces\n// the app port's manual roving focus; it does not replace the donor hierarchy.\nimport { RadioGroup as Radio } from '@kobalte/core/radio-group'\nimport { For, Show } from 'solid-js'\nimport { isThemeAccentId } from '#lib/theme-accents'\nimport { AccentSwatchGroups } from './accent-swatch-groups'\nimport type { AppearanceEditorProps } from './appearance-types'\nimport { ThemeMiniature, ThemeMiniatureSplit } from './theme-preview'\n\nconst MODES = [\n  { value: 'system', label: 'System' },\n  { value: 'light', label: 'Light' },\n  { value: 'dark', label: 'Dark' },\n] as const\nconst SURFACES = [\n  { value: 'theme', label: 'Theme default' },\n  { value: 'frosted', label: 'Frosted' },\n  { value: 'opaque', label: 'Opaque' },\n] as const\nexport function ModeChoices(props: AppearanceEditorProps) {\n  return (\n    <Radio\n      value={props.draft.mode}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Appearance mode\"\n      onChange={(mode) => {\n        const option = MODES.find((candidate) => candidate.value === mode)\n        if (option) props.onChange({ mode: option.value })\n      }}\n      class=\"grid grid-cols-1 gap-3 px-4 py-4 sm:grid-cols-3\"\n    >\n      <For each={MODES}>\n        {(option) => (\n          <Radio.Item\n            value={option.value}\n            data-mode={option.value}\n            class=\"min-w-0 rounded-lg focus-within:ring-3 focus-within:ring-ring/50\"\n          >\n            <Radio.ItemInput />\n            <Radio.ItemLabel class=\"flex cursor-pointer flex-col gap-2 rounded-lg border p-2 text-center text-xs data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\">\n              <span class=\"block h-20 w-full\">\n                <Show\n                  when={option.value === 'system'}\n                  fallback={\n                    <ThemeMiniature\n                      theme={option.value === 'light' ? props.lightTheme : props.darkTheme}\n                    />\n                  }\n                >\n                  <ThemeMiniatureSplit light={props.lightTheme} dark={props.darkTheme} />\n                </Show>\n              </span>\n              <span>{option.label}</span>\n            </Radio.ItemLabel>\n          </Radio.Item>\n        )}\n      </For>\n    </Radio>\n  )\n}\n\n/**\n * Whether the draft accent is the host's custom colour: not the theme default,\n * not a preset, and not a theme accent id. A theme accent id counts as known even\n * when the current pair cannot offer it — it is a stored role, not a colour the\n * user typed, and showing it in the custom field would invite editing `ansi-blue`.\n */\nexport function isCustomAccent(props: AppearanceEditorProps): boolean {\n  const accent = props.draft.accent\n  return (\n    accent !== 'theme' &&\n    !props.accentOptions.some((option) => option.id === accent) &&\n    !isThemeAccentId(accent)\n  )\n}\n\nexport function AccentChoices(props: AppearanceEditorProps) {\n  // The resolved appearance decides which side of a preset pair — and which\n  // theme accent — the swatches paint, so the row previews each choice as the\n  // user will see it.\n  const resolvedAppearance = () =>\n    props.draft.mode === 'system' ? props.resolvedAppearance : props.draft.mode\n  const accentSelection = () => (isCustomAccent(props) ? 'custom' : props.draft.accent)\n  return (\n    <Radio\n      value={accentSelection()}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Accent\"\n      class=\"flex flex-col items-start gap-3\"\n      onChange={(accent) =>\n        props.onChange({\n          accent: accent === 'custom' ? (props.customAccentValue ?? '') : accent,\n        })\n      }\n    >\n      <AccentSwatchGroups\n        accentOptions={props.accentOptions}\n        resolvedAppearance={resolvedAppearance()}\n        themeDefaultColor={\n          resolvedAppearance() === 'light'\n            ? props.lightTheme.colors.accent\n            : props.darkTheme.colors.accent\n        }\n      />\n      <div class=\"flex flex-col gap-1\">\n        <span class=\"text-xs font-medium text-muted-foreground\">Custom</span>\n        <Radio.Item value=\"custom\">\n          <Radio.ItemInput />\n          <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n            Custom\n          </Radio.ItemLabel>\n        </Radio.Item>\n      </div>\n    </Radio>\n  )\n}\n\nexport function GlassChoices(props: AppearanceEditorProps) {\n  return (\n    <Radio\n      value={props.draft.surface}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Glass\"\n      class=\"flex flex-wrap gap-1\"\n      onChange={(surface) => {\n        const option = SURFACES.find((candidate) => candidate.value === surface)\n        if (option) props.onChange({ surface: option.value })\n      }}\n    >\n      <For each={SURFACES}>\n        {(option) => (\n          <Radio.Item\n            value={option.value}\n            disabled={option.value === 'frosted' && !props.surfaceCapability.frosted}\n            class=\"rounded-md focus-within:ring-3 focus-within:ring-ring/50\"\n          >\n            <Radio.ItemInput />\n            <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\">\n              {option.label}\n            </Radio.ItemLabel>\n          </Radio.Item>\n        )}\n      </For>\n    </Radio>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"appearance-choices.js","names":["RadioGroup","Radio","For","Show","isThemeAccentId","AccentSwatchGroups","AppearanceEditorProps","ThemeMiniature","ThemeMiniatureSplit","MODES","value","label","const","SURFACES","ModeChoices","props","_$createComponent","draft","mode","disabled","saving","orientation","onChange","option","find","candidate","children","each","Item","data-mode","ItemInput","ItemLabel","_el$","_tmpl$","_$insert","when","fallback","theme","_$memo","lightTheme","darkTheme","light","dark","_el$2","_tmpl$2","isCustomAccent","accent","accentOptions","some","id","AccentChoices","resolvedAppearance","accentSelection","showThemeDefault","showThemeDefaultAccent","labelEntries","presets","filter","customAccentValue","accentEntryStyle","themeDefaultColor","colors","_el$4","_tmpl$5","showCustomAccentCaption","_tmpl$4","_el$3","_tmpl$3","data-accent-option","GlassChoices","surface","surfaceCapability","frosted","_$createComponent","Radio","_$memo"],"sources":["../../../../src/components/composites/appearance-editor/appearance-choices.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n// Pinned mode-card, accent-swatch, and glass-chip composition. Kobalte replaces\n// the app port's manual roving focus; it does not replace the donor hierarchy.\nimport { RadioGroup as Radio } from '@kobalte/core/radio-group'\nimport { For, Show } from 'solid-js'\nimport { isThemeAccentId } from '#lib/theme-accents'\nimport { AccentSwatchGroups } from './accent-swatch-groups'\nimport type { AppearanceEditorProps } from './appearance-types'\nimport { ThemeMiniature, ThemeMiniatureSplit } from './theme-preview'\n\nconst MODES = [\n  { value: 'system', label: 'System' },\n  { value: 'light', label: 'Light' },\n  { value: 'dark', label: 'Dark' },\n] as const\nconst SURFACES = [\n  { value: 'theme', label: 'Theme default' },\n  { value: 'frosted', label: 'Frosted' },\n  { value: 'opaque', label: 'Opaque' },\n] as const\nexport function ModeChoices(props: AppearanceEditorProps) {\n  return (\n    <Radio\n      value={props.draft.mode}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Appearance mode\"\n      onChange={(mode) => {\n        const option = MODES.find((candidate) => candidate.value === mode)\n        if (option) props.onChange({ mode: option.value })\n      }}\n      class=\"grid grid-cols-1 gap-3 px-4 py-4 sm:grid-cols-3\"\n    >\n      <For each={MODES}>\n        {(option) => (\n          <Radio.Item\n            value={option.value}\n            data-mode={option.value}\n            class=\"min-w-0 rounded-lg focus-within:ring-3 focus-within:ring-ring/50\"\n          >\n            <Radio.ItemInput />\n            <Radio.ItemLabel class=\"flex cursor-pointer flex-col gap-2 rounded-lg border p-2 text-center text-xs data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\">\n              <span class=\"block h-20 w-full\">\n                <Show\n                  when={option.value === 'system'}\n                  fallback={\n                    <ThemeMiniature\n                      theme={option.value === 'light' ? props.lightTheme : props.darkTheme}\n                    />\n                  }\n                >\n                  <ThemeMiniatureSplit light={props.lightTheme} dark={props.darkTheme} />\n                </Show>\n              </span>\n              <span>{option.label}</span>\n            </Radio.ItemLabel>\n          </Radio.Item>\n        )}\n      </For>\n    </Radio>\n  )\n}\n\n/**\n * Whether the draft accent is the host's custom colour: not the theme default,\n * not a preset, and not a theme accent id. A theme accent id counts as known even\n * when the current pair cannot offer it — it is a stored role, not a colour the\n * user typed, and showing it in the custom field would invite editing `ansi-blue`.\n */\nexport function isCustomAccent(props: AppearanceEditorProps): boolean {\n  const accent = props.draft.accent\n  return (\n    accent !== 'theme' &&\n    !props.accentOptions.some((option) => option.id === accent) &&\n    !isThemeAccentId(accent)\n  )\n}\n\nexport function AccentChoices(props: AppearanceEditorProps) {\n  // The resolved appearance decides which side of a preset pair — and which\n  // theme accent — the swatches paint, so the row previews each choice as the\n  // user will see it.\n  const resolvedAppearance = () =>\n    props.draft.mode === 'system' ? props.resolvedAppearance : props.draft.mode\n  const accentSelection = () => (isCustomAccent(props) ? 'custom' : props.draft.accent)\n  const showThemeDefault = () => props.showThemeDefaultAccent ?? true\n  // The named-chip style feeds the same resolved preset list to both entries:\n  // \"Theme default\" leads only when the host has not folded it into a preset.\n  const labelEntries = () => {\n    const presets = props.accentOptions.filter((option) => option.id !== 'theme')\n    return showThemeDefault() ? [{ id: 'theme', label: 'Theme default' }, ...presets] : presets\n  }\n  return (\n    <Radio\n      value={accentSelection()}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Accent\"\n      class=\"flex flex-col items-start gap-3\"\n      onChange={(accent) =>\n        props.onChange({\n          accent: accent === 'custom' ? (props.customAccentValue ?? '') : accent,\n        })\n      }\n    >\n      <Show\n        when={(props.accentEntryStyle ?? 'swatches') === 'labels'}\n        fallback={\n          <>\n            <AccentSwatchGroups\n              accentOptions={props.accentOptions}\n              resolvedAppearance={resolvedAppearance()}\n              showThemeDefault={showThemeDefault()}\n              themeDefaultColor={\n                resolvedAppearance() === 'light'\n                  ? props.lightTheme.colors.accent\n                  : props.darkTheme.colors.accent\n              }\n            />\n            <div class=\"flex flex-col gap-1\">\n              <Show when={props.showCustomAccentCaption ?? true}>\n                <span class=\"text-xs font-medium text-muted-foreground\">Custom</span>\n              </Show>\n              <Radio.Item value=\"custom\">\n                <Radio.ItemInput />\n                <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n                  Custom\n                </Radio.ItemLabel>\n              </Radio.Item>\n            </div>\n          </>\n        }\n      >\n        {/* The named-chip style: one grid, every choice a labelled control,\n            including the custom colour — nothing to caption from above. */}\n        <div class=\"grid grid-cols-2 gap-2 sm:grid-cols-3\" data-accent-grid>\n          <For each={labelEntries()}>\n            {(option) => (\n              <Radio.Item value={option.id} class=\"min-w-0\" data-accent-option={option.id}>\n                <Radio.ItemInput />\n                <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n                  {option.label}\n                </Radio.ItemLabel>\n              </Radio.Item>\n            )}\n          </For>\n          <Radio.Item value=\"custom\" class=\"min-w-0\">\n            <Radio.ItemInput />\n            <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary\">\n              Custom\n            </Radio.ItemLabel>\n          </Radio.Item>\n        </div>\n      </Show>\n    </Radio>\n  )\n}\n\nexport function GlassChoices(props: AppearanceEditorProps) {\n  return (\n    <Radio\n      value={props.draft.surface}\n      disabled={props.saving}\n      orientation=\"horizontal\"\n      aria-label=\"Glass\"\n      class=\"flex flex-wrap gap-1\"\n      onChange={(surface) => {\n        const option = SURFACES.find((candidate) => candidate.value === surface)\n        if (option) props.onChange({ surface: option.value })\n      }}\n    >\n      <For each={SURFACES}>\n        {(option) => (\n          <Radio.Item\n            value={option.value}\n            disabled={option.value === 'frosted' && !props.surfaceCapability.frosted}\n            class=\"rounded-md focus-within:ring-3 focus-within:ring-ring/50\"\n          >\n            <Radio.ItemInput />\n            <Radio.ItemLabel class=\"flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\">\n              {option.label}\n            </Radio.ItemLabel>\n          </Radio.Item>\n        )}\n      </For>\n    </Radio>\n  )\n}\n"],"mappings":"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"}

package/dist/components/composites/appearance-editor/appearance-editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-editor.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-editor.tsx"],"names":[],"mappings":"AAoDA,OAAO,KAAK,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAA;AAIvF;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,kCA0I5D;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,qBAAqB,kCA6CnE;AAED;;4EAE4E;AAC5E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,kCA8B9D"}
+{"version":3,"file":"appearance-editor.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-editor.tsx"],"names":[],"mappings":"AAqDA,OAAO,KAAK,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAA;AAIvF;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,kCAuJ5D;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,qBAAqB,kCA6CnE;AAED;;4EAE4E;AAC5E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,kCAiC9D"}

package/dist/components/composites/appearance-editor/appearance-editor.js

@@ -1,5 +1,6 @@
 import { cn } from "../../../lib/utils.js";
 import { Button } from "../../ui/button/button.js";
+import { ActionButton } from "../action-button/action-button.js";
 import { Input } from "../../ui/input/input.js";
 import { Sheet, SheetBody, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "../../ui/sheet/sheet.js";
 import { Switch } from "../../ui/switch/switch.js";
@@ -155,17 +156,24 @@ function AppearanceEditor(props) {
 				return _el$4;
 			}
 		}), null);
-		insert(_el$3, createComponent(AppearanceFontSettingsGroup, {
-			get settings() {
-				return props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS;
-			},
-			get menuPortalMount() {
-				return props.menuPortalMount;
-			},
-			get disabled() {
-				return props.saving;
+		insert(_el$3, createComponent(Show, {
+			get when() {
+				return props.fontSettingsPlacement !== "end";
 			},
-			onChange: (fonts) => props.onChange({ fonts })
+			get children() {
+				return createComponent(AppearanceFontSettingsGroup, {
+					get settings() {
+						return props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS;
+					},
+					get menuPortalMount() {
+						return props.menuPortalMount;
+					},
+					get disabled() {
+						return props.saving;
+					},
+					onChange: (fonts) => props.onChange({ fonts })
+				});
+			}
 		}), null);
 		insert(_el$3, createComponent(SettingsRow, {
 			title: "Glass",
@@ -229,6 +237,25 @@ function AppearanceEditor(props) {
 				});
 			}
 		}), null);
+		insert(_el$3, createComponent(Show, {
+			get when() {
+				return props.fontSettingsPlacement === "end";
+			},
+			get children() {
+				return createComponent(AppearanceFontSettingsGroup, {
+					get settings() {
+						return props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS;
+					},
+					get menuPortalMount() {
+						return props.menuPortalMount;
+					},
+					get disabled() {
+						return props.saving;
+					},
+					onChange: (fonts) => props.onChange({ fonts })
+				});
+			}
+		}), null);
 		insert(_el$, createComponent(Show, {
 			get when() {
 				return !props.hideActions;
@@ -315,10 +342,10 @@ function AppearancePopover(props) {
 		onOpenChange: (open) => open ? props.onOpen() : props.onDismiss(),
 		get children() {
 			return [createComponent(SheetTrigger, {
-				as: Button,
-				type: "button",
+				as: ActionButton,
 				variant: "ghost",
 				size: "icon-sm",
+				tooltip: "Open appearance settings",
 				"aria-label": "Appearance settings",
 				get children() {
 					return createComponent(Palette, {});

package/dist/components/composites/appearance-editor/appearance-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-editor.js","names":["EyeOff","Palette","PanelsTopLeft","SlidersHorizontal","Show","createSignal","createUniqueId","cn","Button","Input","AppearanceFontSettingsGroup","DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS","Switch","Sheet","SheetBody","SheetContent","SheetDescription","SheetFooter","SheetHeader","SheetTitle","SheetTrigger","AppearanceEditorProps","AppearancePopoverProps","ModeChoices","AccentChoices","GlassChoices","isCustomAccent","SettingsRow","TerminalRow","ThemeRow","AppearanceEditor","props","errorId","custom","accentDescription","draft","accent","preset","accentOptions","find","option","id","label","offered","themeAccentOptions","toLowerCase","glassDescription","surface","surfaceCapability","themeDefaultDescription","_el$","_tmpl$6","_el$3","firstChild","_$insert","_$createComponent","when","recoveryNotice","children","_el$2","_tmpl$","appearance","selectedId","lightThemeId","preview","lightTheme","themes","disabled","saving","onSelect","onChange","darkThemeId","darkTheme","terminalThemeId","undefined","_$memo","resolvedAppearance","title","icon","description","_el$4","_tmpl$3","_el$5","_$setAttribute","value","aria-invalid","customAccentError","aria-describedby","onInput","event","currentTarget","_el$6","_tmpl$2","settings","fonts","menuPortalMount","frosted","reason","_el$7","_tmpl$4","checked","reduceTransparency","onManageThemes","type","size","variant","onClick","hideActions","_el$8","_tmpl$5","AppearanceEditorActions","_$effect","_$className","class","saveReasonId","_el$9","_tmpl$8","_el$1","_el$10","saveDisabledReason","_el$0","_tmpl$7","onReset","onCancel","aria-busy","onSave","AppearancePopover","setMenuPortalMount","HTMLElement","open","onOpenChange","onOpen","onDismiss","as","side","closeLabel","ref","_$mergeProps","_$createComponent","_$memo","_$className","_$mergeProps"],"sources":["../../../../src/components/composites/appearance-editor/appearance-editor.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n/*\n * Composition substantially translated from Zeron settings/appearance.rs and\n * settings/widgets.rs, pinned at 30a9a9537c5ec96226c87f4bf349b6f77c5dfb59,\n * preserving Adea's existing appearance-surface.tsx port: System/Light/Dark\n * miniatures, compact independent theme rows, accent swatches and helper copy,\n * glass chips, and theme library affordance. Kobalte replaces the port's manual\n * radio keyboard model. The controlled draft and explicit action ports replace\n * GPUI globals and app-specific storage/native authority. Save/Cancel/Reset and\n * custom accent/reduced-transparency are accepted Adea divergences (#425).\n */\nimport { EyeOff, Palette, PanelsTopLeft, SlidersHorizontal } from 'lucide-solid'\nimport { Show, createSignal, createUniqueId } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport { Button } from '../../ui/button/button'\nimport { Input } from '../../ui/input/input'\nimport { AppearanceFontSettingsGroup } from './font-settings-group'\nimport { DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS } from '#lib/appearance-font-settings'\n\nimport { Switch } from '../../ui/switch/switch'\nimport {\n  Sheet,\n  SheetBody,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from '../../ui/sheet/sheet'\nimport type { AppearanceEditorProps, AppearancePopoverProps } from './appearance-types'\nimport { ModeChoices, AccentChoices, GlassChoices, isCustomAccent } from './appearance-choices'\nimport { SettingsRow, TerminalRow, ThemeRow } from './appearance-rows'\n\n/**\n * A live editor whose persistence and preview authority belong to its host.\n * No ThemeProvider is required, and no catalogue, renderer engine or storage is\n * imported. Hosts normalize unknown IDs and custom colors, report recovery,\n * snapshot on open, preview on changes, commit on Save, and restore on dismissal.\n * Both theme rows remain mounted when mode changes. Density remains outside the\n * accepted appearance surface; typeface settings are shared and host-persisted.\n */\nexport function AppearanceEditor(props: AppearanceEditorProps) {\n  const errorId = createUniqueId()\n  const custom = () => isCustomAccent(props)\n  const accentDescription = () => {\n    if (props.draft.accent === 'theme') return \"Theme default · Uses the palette's intended color.\"\n    const preset = props.accentOptions.find((option) => option.id === props.draft.accent)\n    if (preset) return `${preset.label} · Controls, glyphs, selections, code, and activity.`\n    if (custom()) return 'Custom · Controls, glyphs, selections, code, and activity.'\n    const offered = props.themeAccentOptions?.find((option) => option.id === props.draft.accent)\n    // A stored theme accent survives a theme switch by id; when the new pair\n    // cannot offer that slot the host falls back to the theme's own primary,\n    // and the description says so rather than naming a colour not on screen.\n    return offered\n      ? `Theme ${offered.label.toLowerCase()} · The theme's own color, on controls and activity.`\n      : \"Theme default · This theme does not carry that accent, so it uses the palette's intended color.\"\n  }\n  const glassDescription = () =>\n    props.draft.surface === 'opaque'\n      ? 'Solid surfaces for every theme.'\n      : props.draft.surface === 'frosted'\n        ? 'Theme-colored glass where supported.'\n        : (props.surfaceCapability.themeDefaultDescription ?? \"Uses this theme's default surface.\")\n  return (\n    <div data-appearance-editor class={cn('min-w-0', props.class)}>\n      <Show when={props.recoveryNotice}>\n        <p role=\"status\" class=\"px-4 py-2 text-sm text-muted-foreground\">\n          {props.recoveryNotice}\n        </p>\n      </Show>\n      <ModeChoices {...props} />\n      <div class=\"divide-y divide-border rounded-lg border\">\n        <ThemeRow\n          appearance=\"light\"\n          selectedId={props.draft.lightThemeId}\n          preview={props.lightTheme}\n          themes={props.themes}\n          disabled={props.saving}\n          onSelect={(lightThemeId) => props.onChange({ lightThemeId })}\n        />\n        <ThemeRow\n          appearance=\"dark\"\n          selectedId={props.draft.darkThemeId}\n          preview={props.darkTheme}\n          themes={props.themes}\n          disabled={props.saving}\n          onSelect={(darkThemeId) => props.onChange({ darkThemeId })}\n        />\n        {/* The row exists only when the host carries a terminal preference:\n            the draft field is the show/hide switch, so the editor can never\n            render a terminal row that writes nothing. */}\n        <Show when={props.draft.terminalThemeId !== undefined}>\n          <TerminalRow\n            selectedId={props.draft.terminalThemeId ?? 'theme'}\n            preview={props.resolvedAppearance === 'dark' ? props.darkTheme : props.lightTheme}\n            themes={props.themes}\n            disabled={props.saving}\n            onSelect={(terminalThemeId) => props.onChange({ terminalThemeId })}\n          />\n        </Show>\n        <SettingsRow title=\"Accent\" icon={<SlidersHorizontal />} description={accentDescription()}>\n          <AccentChoices {...props} />\n        </SettingsRow>\n        <Show when={custom()}>\n          <div class=\"px-4 py-3\">\n            <label class=\"mb-2 block text-xs font-medium\" for={`${errorId}-input`}>\n              Custom accent\n            </label>\n            <Input\n              id={`${errorId}-input`}\n              value={props.draft.accent}\n              disabled={props.saving}\n              aria-invalid={!!props.customAccentError}\n              aria-describedby={props.customAccentError ? errorId : undefined}\n              onInput={(event) => props.onChange({ accent: event.currentTarget.value })}\n            />\n            <Show when={props.customAccentError}>\n              <p id={errorId} role=\"alert\" class=\"mt-1 text-xs text-foreground\">\n                {props.customAccentError}\n              </p>\n            </Show>\n          </div>\n        </Show>\n        <AppearanceFontSettingsGroup\n          settings={props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS}\n          menuPortalMount={props.menuPortalMount}\n          disabled={props.saving}\n          onChange={(fonts) => props.onChange({ fonts })}\n        />\n        <SettingsRow title=\"Glass\" icon={<PanelsTopLeft />} description={glassDescription()}>\n          <GlassChoices {...props} />\n        </SettingsRow>\n        <Show when={!props.surfaceCapability.frosted && props.surfaceCapability.reason}>\n          <p role=\"status\" class=\"px-4 py-2 text-xs text-muted-foreground\">\n            {props.surfaceCapability.reason}\n          </p>\n        </Show>\n        <SettingsRow\n          title=\"Reduce transparency\"\n          icon={<EyeOff />}\n          description=\"Prefer solid surfaces, including during live preview.\"\n        >\n          <Switch\n            checked={props.draft.reduceTransparency}\n            disabled={props.saving}\n            onChange={(reduceTransparency: boolean) => props.onChange({ reduceTransparency })}\n            aria-label=\"Reduce transparency\"\n          />\n        </SettingsRow>\n        <SettingsRow\n          title=\"Theme library\"\n          icon={<Palette />}\n          description={\n            props.onManageThemes\n              ? 'Manage themes through the application.'\n              : 'Theme import is unavailable.'\n          }\n        >\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            disabled={!props.onManageThemes || props.saving}\n            onClick={() => props.onManageThemes?.()}\n          >\n            Manage themes\n          </Button>\n        </SettingsRow>\n      </div>\n      <Show when={!props.hideActions}>\n        {/* Sticky so Save/Cancel stay reachable in a tall scroll container: the\n            editor scrolls with its host panel, and actions parked at the bottom\n            of a long form were unreachable without scrolling past every row. */}\n        <div class=\"sticky bottom-0 z-10 mt-2 border-t bg-background px-4 py-3\">\n          <AppearanceEditorActions {...props} />\n        </div>\n      </Show>\n    </div>\n  )\n}\n\n/**\n * Reset, Cancel and Save, with the reason Save is unavailable. Rendered by the\n * editor itself, or — with `hideActions` — by a host that pins them in its own\n * footer, as `AppearancePopover` does.\n */\nexport function AppearanceEditorActions(props: AppearanceEditorProps) {\n  const saveReasonId = createUniqueId()\n  return (\n    <div class=\"flex w-full flex-col gap-2\">\n      <Show when={props.saveDisabledReason}>\n        <p id={saveReasonId} role=\"status\" class=\"text-xs text-muted-foreground\">\n          {props.saveDisabledReason}\n        </p>\n      </Show>\n      {/* `global-appearance-editor-actions` lets these buttons grow with the UI\n          font preference, like the rest of Appearance's own controls. */}\n      <div class=\"global-appearance-editor-actions flex flex-wrap items-center gap-2\">\n        <Button\n          type=\"button\"\n          size=\"sm\"\n          variant=\"ghost\"\n          disabled={props.saving}\n          onClick={() => props.onReset()}\n        >\n          Reset\n        </Button>\n        <div class=\"ml-auto flex gap-2\">\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            disabled={props.saving}\n            onClick={() => props.onCancel()}\n          >\n            Cancel\n          </Button>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            disabled={props.saving || !!props.customAccentError || !!props.saveDisabledReason}\n            aria-busy={props.saving}\n            aria-describedby={props.saveDisabledReason ? saveReasonId : undefined}\n            onClick={() => props.onSave()}\n          >\n            {props.saving ? 'Saving…' : 'Save'}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/** The editor in an inset Sheet docked beside the main view: the body scrolls and\n * Reset/Cancel/Save sit in the panel's full-width footer, always reachable.\n * Dismissal (Escape, the close button, an outside click) is `onDismiss`. */\nexport function AppearancePopover(props: AppearancePopoverProps) {\n  const [menuPortalMount, setMenuPortalMount] = createSignal<HTMLElement>()\n\n  return (\n    <Sheet open={props.open} onOpenChange={(open) => (open ? props.onOpen() : props.onDismiss())}>\n      <SheetTrigger\n        as={Button}\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"icon-sm\"\n        aria-label=\"Appearance settings\"\n      >\n        <Palette />\n      </SheetTrigger>\n      <SheetContent side=\"end\" closeLabel=\"Close appearance settings\" ref={setMenuPortalMount}>\n        <SheetHeader>\n          <SheetTitle>Appearance</SheetTitle>\n          <SheetDescription>\n            Changes preview immediately. Save keeps them; Cancel restores the previous appearance.\n          </SheetDescription>\n        </SheetHeader>\n        <SheetBody>\n          <AppearanceEditor {...props} menuPortalMount={menuPortalMount()} hideActions />\n        </SheetBody>\n        <SheetFooter>\n          <AppearanceEditorActions {...props} />\n        </SheetFooter>\n      </SheetContent>\n    </Sheet>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"appearance-editor.js","names":["EyeOff","Palette","PanelsTopLeft","SlidersHorizontal","Show","createSignal","createUniqueId","cn","ActionButton","Button","Input","AppearanceFontSettingsGroup","DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS","Switch","Sheet","SheetBody","SheetContent","SheetDescription","SheetFooter","SheetHeader","SheetTitle","SheetTrigger","AppearanceEditorProps","AppearancePopoverProps","ModeChoices","AccentChoices","GlassChoices","isCustomAccent","SettingsRow","TerminalRow","ThemeRow","AppearanceEditor","props","errorId","custom","accentDescription","draft","accent","preset","accentOptions","find","option","id","label","offered","themeAccentOptions","toLowerCase","glassDescription","surface","surfaceCapability","themeDefaultDescription","_el$","_tmpl$6","_el$3","firstChild","_$insert","_$createComponent","when","recoveryNotice","children","_el$2","_tmpl$","appearance","selectedId","lightThemeId","preview","lightTheme","themes","disabled","saving","onSelect","onChange","darkThemeId","darkTheme","terminalThemeId","undefined","_$memo","resolvedAppearance","title","icon","description","_el$4","_tmpl$3","_el$5","_$setAttribute","value","aria-invalid","customAccentError","aria-describedby","onInput","event","currentTarget","_el$6","_tmpl$2","fontSettingsPlacement","settings","fonts","menuPortalMount","frosted","reason","_el$7","_tmpl$4","checked","reduceTransparency","onManageThemes","type","size","variant","onClick","hideActions","_el$8","_tmpl$5","AppearanceEditorActions","_$effect","_$className","class","saveReasonId","_el$9","_tmpl$8","_el$1","_el$10","saveDisabledReason","_el$0","_tmpl$7","onReset","onCancel","aria-busy","onSave","AppearancePopover","setMenuPortalMount","HTMLElement","open","onOpenChange","onOpen","onDismiss","as","tooltip","side","closeLabel","ref","_$mergeProps","_$createComponent","_$memo","_$className","_$mergeProps"],"sources":["../../../../src/components/composites/appearance-editor/appearance-editor.tsx"],"sourcesContent":["/*\n * MIT License\n *\n * Copyright (c) 2026 Wing\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n/*\n * Composition substantially translated from Zeron settings/appearance.rs and\n * settings/widgets.rs, pinned at 30a9a9537c5ec96226c87f4bf349b6f77c5dfb59,\n * preserving Adea's existing appearance-surface.tsx port: System/Light/Dark\n * miniatures, compact independent theme rows, accent swatches and helper copy,\n * glass chips, and theme library affordance. Kobalte replaces the port's manual\n * radio keyboard model. The controlled draft and explicit action ports replace\n * GPUI globals and app-specific storage/native authority. Save/Cancel/Reset and\n * custom accent/reduced-transparency are accepted Adea divergences (#425).\n */\nimport { EyeOff, Palette, PanelsTopLeft, SlidersHorizontal } from 'lucide-solid'\nimport { Show, createSignal, createUniqueId } from 'solid-js'\nimport { cn } from '#lib/utils'\nimport { ActionButton } from '../action-button'\nimport { Button } from '../../ui/button/button'\nimport { Input } from '../../ui/input/input'\nimport { AppearanceFontSettingsGroup } from './font-settings-group'\nimport { DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS } from '#lib/appearance-font-settings'\n\nimport { Switch } from '../../ui/switch/switch'\nimport {\n  Sheet,\n  SheetBody,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from '../../ui/sheet/sheet'\nimport type { AppearanceEditorProps, AppearancePopoverProps } from './appearance-types'\nimport { ModeChoices, AccentChoices, GlassChoices, isCustomAccent } from './appearance-choices'\nimport { SettingsRow, TerminalRow, ThemeRow } from './appearance-rows'\n\n/**\n * A live editor whose persistence and preview authority belong to its host.\n * No ThemeProvider is required, and no catalogue, renderer engine or storage is\n * imported. Hosts normalize unknown IDs and custom colors, report recovery,\n * snapshot on open, preview on changes, commit on Save, and restore on dismissal.\n * Both theme rows remain mounted when mode changes. Density remains outside the\n * accepted appearance surface; typeface settings are shared and host-persisted.\n */\nexport function AppearanceEditor(props: AppearanceEditorProps) {\n  const errorId = createUniqueId()\n  const custom = () => isCustomAccent(props)\n  const accentDescription = () => {\n    if (props.draft.accent === 'theme') return \"Theme default · Uses the palette's intended color.\"\n    const preset = props.accentOptions.find((option) => option.id === props.draft.accent)\n    if (preset) return `${preset.label} · Controls, glyphs, selections, code, and activity.`\n    if (custom()) return 'Custom · Controls, glyphs, selections, code, and activity.'\n    const offered = props.themeAccentOptions?.find((option) => option.id === props.draft.accent)\n    // A stored theme accent survives a theme switch by id; when the new pair\n    // cannot offer that slot the host falls back to the theme's own primary,\n    // and the description says so rather than naming a colour not on screen.\n    return offered\n      ? `Theme ${offered.label.toLowerCase()} · The theme's own color, on controls and activity.`\n      : \"Theme default · This theme does not carry that accent, so it uses the palette's intended color.\"\n  }\n  const glassDescription = () =>\n    props.draft.surface === 'opaque'\n      ? 'Solid surfaces for every theme.'\n      : props.draft.surface === 'frosted'\n        ? 'Theme-colored glass where supported.'\n        : (props.surfaceCapability.themeDefaultDescription ?? \"Uses this theme's default surface.\")\n  return (\n    <div data-appearance-editor class={cn('min-w-0', props.class)}>\n      <Show when={props.recoveryNotice}>\n        <p role=\"status\" class=\"px-4 py-2 text-sm text-muted-foreground\">\n          {props.recoveryNotice}\n        </p>\n      </Show>\n      <ModeChoices {...props} />\n      <div class=\"divide-y divide-border rounded-lg border\">\n        <ThemeRow\n          appearance=\"light\"\n          selectedId={props.draft.lightThemeId}\n          preview={props.lightTheme}\n          themes={props.themes}\n          disabled={props.saving}\n          onSelect={(lightThemeId) => props.onChange({ lightThemeId })}\n        />\n        <ThemeRow\n          appearance=\"dark\"\n          selectedId={props.draft.darkThemeId}\n          preview={props.darkTheme}\n          themes={props.themes}\n          disabled={props.saving}\n          onSelect={(darkThemeId) => props.onChange({ darkThemeId })}\n        />\n        {/* The row exists only when the host carries a terminal preference:\n            the draft field is the show/hide switch, so the editor can never\n            render a terminal row that writes nothing. */}\n        <Show when={props.draft.terminalThemeId !== undefined}>\n          <TerminalRow\n            selectedId={props.draft.terminalThemeId ?? 'theme'}\n            preview={props.resolvedAppearance === 'dark' ? props.darkTheme : props.lightTheme}\n            themes={props.themes}\n            disabled={props.saving}\n            onSelect={(terminalThemeId) => props.onChange({ terminalThemeId })}\n          />\n        </Show>\n        <SettingsRow title=\"Accent\" icon={<SlidersHorizontal />} description={accentDescription()}>\n          <AccentChoices {...props} />\n        </SettingsRow>\n        <Show when={custom()}>\n          <div class=\"px-4 py-3\">\n            <label class=\"mb-2 block text-xs font-medium\" for={`${errorId}-input`}>\n              Custom accent\n            </label>\n            <Input\n              id={`${errorId}-input`}\n              value={props.draft.accent}\n              disabled={props.saving}\n              aria-invalid={!!props.customAccentError}\n              aria-describedby={props.customAccentError ? errorId : undefined}\n              onInput={(event) => props.onChange({ accent: event.currentTarget.value })}\n            />\n            <Show when={props.customAccentError}>\n              <p id={errorId} role=\"alert\" class=\"mt-1 text-xs text-foreground\">\n                {props.customAccentError}\n              </p>\n            </Show>\n          </div>\n        </Show>\n        {/* Inline, the typefaces read as one more palette choice; `end` hands\n            the closing slot to them for hosts whose order is palette and\n            surface first, text last. */}\n        <Show when={props.fontSettingsPlacement !== 'end'}>\n          <AppearanceFontSettingsGroup\n            settings={props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS}\n            menuPortalMount={props.menuPortalMount}\n            disabled={props.saving}\n            onChange={(fonts) => props.onChange({ fonts })}\n          />\n        </Show>\n        <SettingsRow title=\"Glass\" icon={<PanelsTopLeft />} description={glassDescription()}>\n          <GlassChoices {...props} />\n        </SettingsRow>\n        <Show when={!props.surfaceCapability.frosted && props.surfaceCapability.reason}>\n          <p role=\"status\" class=\"px-4 py-2 text-xs text-muted-foreground\">\n            {props.surfaceCapability.reason}\n          </p>\n        </Show>\n        <SettingsRow\n          title=\"Reduce transparency\"\n          icon={<EyeOff />}\n          description=\"Prefer solid surfaces, including during live preview.\"\n        >\n          <Switch\n            checked={props.draft.reduceTransparency}\n            disabled={props.saving}\n            onChange={(reduceTransparency: boolean) => props.onChange({ reduceTransparency })}\n            aria-label=\"Reduce transparency\"\n          />\n        </SettingsRow>\n        <SettingsRow\n          title=\"Theme library\"\n          icon={<Palette />}\n          description={\n            props.onManageThemes\n              ? 'Manage themes through the application.'\n              : 'Theme import is unavailable.'\n          }\n        >\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            disabled={!props.onManageThemes || props.saving}\n            onClick={() => props.onManageThemes?.()}\n          >\n            Manage themes\n          </Button>\n        </SettingsRow>\n        <Show when={props.fontSettingsPlacement === 'end'}>\n          <AppearanceFontSettingsGroup\n            settings={props.draft.fonts ?? DEFAULT_APPEARANCE_EDITOR_FONT_SETTINGS}\n            menuPortalMount={props.menuPortalMount}\n            disabled={props.saving}\n            onChange={(fonts) => props.onChange({ fonts })}\n          />\n        </Show>\n      </div>\n      <Show when={!props.hideActions}>\n        {/* Sticky so Save/Cancel stay reachable in a tall scroll container: the\n            editor scrolls with its host panel, and actions parked at the bottom\n            of a long form were unreachable without scrolling past every row. */}\n        <div class=\"sticky bottom-0 z-10 mt-2 border-t bg-background px-4 py-3\">\n          <AppearanceEditorActions {...props} />\n        </div>\n      </Show>\n    </div>\n  )\n}\n\n/**\n * Reset, Cancel and Save, with the reason Save is unavailable. Rendered by the\n * editor itself, or — with `hideActions` — by a host that pins them in its own\n * footer, as `AppearancePopover` does.\n */\nexport function AppearanceEditorActions(props: AppearanceEditorProps) {\n  const saveReasonId = createUniqueId()\n  return (\n    <div class=\"flex w-full flex-col gap-2\">\n      <Show when={props.saveDisabledReason}>\n        <p id={saveReasonId} role=\"status\" class=\"text-xs text-muted-foreground\">\n          {props.saveDisabledReason}\n        </p>\n      </Show>\n      {/* `global-appearance-editor-actions` lets these buttons grow with the UI\n          font preference, like the rest of Appearance's own controls. */}\n      <div class=\"global-appearance-editor-actions flex flex-wrap items-center gap-2\">\n        <Button\n          type=\"button\"\n          size=\"sm\"\n          variant=\"ghost\"\n          disabled={props.saving}\n          onClick={() => props.onReset()}\n        >\n          Reset\n        </Button>\n        <div class=\"ml-auto flex gap-2\">\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            disabled={props.saving}\n            onClick={() => props.onCancel()}\n          >\n            Cancel\n          </Button>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            disabled={props.saving || !!props.customAccentError || !!props.saveDisabledReason}\n            aria-busy={props.saving}\n            aria-describedby={props.saveDisabledReason ? saveReasonId : undefined}\n            onClick={() => props.onSave()}\n          >\n            {props.saving ? 'Saving…' : 'Save'}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\n/** The editor in an inset Sheet docked beside the main view: the body scrolls and\n * Reset/Cancel/Save sit in the panel's full-width footer, always reachable.\n * Dismissal (Escape, the close button, an outside click) is `onDismiss`. */\nexport function AppearancePopover(props: AppearancePopoverProps) {\n  const [menuPortalMount, setMenuPortalMount] = createSignal<HTMLElement>()\n\n  return (\n    <Sheet open={props.open} onOpenChange={(open) => (open ? props.onOpen() : props.onDismiss())}>\n      {/* The trigger is an icon-only action, so it explains itself through the\n          shared ActionButton's tooltip (keyboard focus included) rather than a\n          bare aria-label. */}\n      <SheetTrigger\n        as={ActionButton}\n        variant=\"ghost\"\n        size=\"icon-sm\"\n        tooltip=\"Open appearance settings\"\n        aria-label=\"Appearance settings\"\n      >\n        <Palette />\n      </SheetTrigger>\n      <SheetContent side=\"end\" closeLabel=\"Close appearance settings\" ref={setMenuPortalMount}>\n        <SheetHeader>\n          <SheetTitle>Appearance</SheetTitle>\n          <SheetDescription>\n            Changes preview immediately. Save keeps them; Cancel restores the previous appearance.\n          </SheetDescription>\n        </SheetHeader>\n        <SheetBody>\n          <AppearanceEditor {...props} menuPortalMount={menuPortalMount()} hideActions />\n        </SheetBody>\n        <SheetFooter>\n          <AppearanceEditorActions {...props} />\n        </SheetFooter>\n      </SheetContent>\n    </Sheet>\n  )\n}\n"],"mappings":"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"}

package/dist/components/composites/appearance-editor/appearance-types.d.ts

@@ -59,6 +59,32 @@ export type AppearanceEditorProps = {
     class?: string;
     /** Leave Reset/Cancel/Save to the host, which renders `AppearanceEditorActions`. */
     hideActions?: boolean;
+    /**
+     * Where the typeface settings sit in the option list. `inline` — the default
+     * — renders them between the accent and glass rows, where they read as one
+     * more palette choice. `end` closes the list with them: hosts whose option
+     * order is palette-and-surface first, text last, pass `end` instead of
+     * recomposing the editor.
+     */
+    fontSettingsPlacement?: 'inline' | 'end';
+    /**
+     * How the accent row renders its choices. `swatches` — the default — paints
+     * each choice as a colour circle. `labels` renders every choice as a named
+     * chip, for hosts whose accent contract is textual rather than chromatic.
+     */
+    accentEntryStyle?: 'swatches' | 'labels';
+    /**
+     * Whether the accent row leads with a "Theme default" swatch. Default on.
+     * Hosts whose default accent already is one of the catalogue presets pass
+     * `false`: the extra entry would duplicate the preset's own colour.
+     */
+    showThemeDefaultAccent?: boolean;
+    /**
+     * Whether the swatch accent style captions its custom-colour entry. Default
+     * on. `false` leaves the custom chip to name itself — for hosts where the
+     * caption reads as a second "Custom" label on the control.
+     */
+    showCustomAccentCaption?: boolean;
 };
 export type AppearancePopoverProps = AppearanceEditorProps & {
     open: boolean;

package/dist/components/composites/appearance-editor/appearance-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"appearance-types.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAC/E,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA;AAEjF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,IAAI,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAA;IACjC,YAAY,EAAE,MAAM,CAAA;IACpB,WAAW,EAAE,MAAM,CAAA;IACnB;;;;;OAKG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,+EAA+E;IAC/E,MAAM,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,KAAK,CAAC,EAAE,4BAA4B,CAAA;IACpC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAA;IACvC,kBAAkB,EAAE,OAAO,CAAA;CAC5B,CAAC,CAAA;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,eAAe,CAAA;IACtB,8EAA8E;IAC9E,UAAU,EAAE,SAAS,CAAA;IACrB,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,EAAE,OAAO,GAAG,MAAM,CAAA;IACpC,MAAM,EAAE,SAAS,eAAe,EAAE,CAAA;IAClC,aAAa,EAAE,SAAS,YAAY,EAAE,CAAA;IACtC;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,SAAS,YAAY,EAAE,CAAA;IAC5C,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;IACnD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,iBAAiB,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,uBAAuB,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IAC1F,mFAAmF;IACnF,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,6EAA6E;IAC7E,eAAe,CAAC,EAAE,WAAW,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oFAAoF;IACpF,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,GAAG;IAC3D,IAAI,EAAE,OAAO,CAAA;IACb,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,SAAS,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA"}
+{"version":3,"file":"appearance-types.d.ts","sourceRoot":"","sources":["../../../../src/components/composites/appearance-editor/appearance-types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAC/E,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA;AAEjF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,IAAI,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAA;IACjC,YAAY,EAAE,MAAM,CAAA;IACpB,WAAW,EAAE,MAAM,CAAA;IACnB;;;;;OAKG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,+EAA+E;IAC/E,MAAM,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,KAAK,CAAC,EAAE,4BAA4B,CAAA;IACpC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAA;IACvC,kBAAkB,EAAE,OAAO,CAAA;CAC5B,CAAC,CAAA;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,eAAe,CAAA;IACtB,8EAA8E;IAC9E,UAAU,EAAE,SAAS,CAAA;IACrB,SAAS,EAAE,SAAS,CAAA;IACpB,kBAAkB,EAAE,OAAO,GAAG,MAAM,CAAA;IACpC,MAAM,EAAE,SAAS,eAAe,EAAE,CAAA;IAClC,aAAa,EAAE,SAAS,YAAY,EAAE,CAAA;IACtC;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,SAAS,YAAY,EAAE,CAAA;IAC5C,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC,KAAK,IAAI,CAAA;IACnD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,iBAAiB,EAAE;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,uBAAuB,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IAC1F,mFAAmF;IACnF,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,6EAA6E;IAC7E,eAAe,CAAC,EAAE,WAAW,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oFAAoF;IACpF,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;;;;OAMG;IACH,qBAAqB,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;IACxC;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,UAAU,GAAG,QAAQ,CAAA;IACxC;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC;;;;OAIG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;CAClC,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,GAAG;IAC3D,IAAI,EAAE,OAAO,CAAA;IACb,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,SAAS,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA"}

package/dist/components/conversation/transcript-composition.d.ts

@@ -53,6 +53,12 @@ export type TranscriptCompositionProps<T> = Omit<ComponentProps<'div'>, 'childre
     /** Optional controlled disclosure map keyed by `transcriptDisclosureKey`. */
     disclosure?: ReadonlyMap<string, boolean>;
     onDisclosureChange?: (key: string, expanded: boolean) => void;
+    /**
+     * Row rhythm. `compact` (default) packs rows 4px apart; `comfortable` spaces
+     * them 12px apart and stacks each row's rendered parts, for a chat stream
+     * whose rows are separate messages rather than one running log.
+     */
+    density?: 'compact' | 'comfortable';
 };
 /** Stable, transcript-scoped key for host-owned disclosure restoration. */
 export declare function transcriptDisclosureKey(resetKey: string | number | null | undefined, mode: TranscriptFoldMode, firstRowId: string): string;

package/dist/components/conversation/transcript-composition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"transcript-composition.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/transcript-composition.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"transcript-composition.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/transcript-composition.tsx"],"names":[],"mappings":"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"}

package/dist/components/conversation/transcript-composition.js

@@ -2,14 +2,14 @@ import { cn } from "../../lib/utils.js";
 import { Button } from "../ui/button/button.js";
 import { applyTranscriptRunningState, createTranscriptGrouper } from "./transcript-grouping.js";
 import { planTranscriptFold } from "./transcript-folding.js";
-import { createComponent, effect, insert, memo, mergeProps, setAttribute, spread, template } from "solid-js/web";
+import { className, createComponent, effect, insert, memo, mergeProps, setAttribute, spread, template } from "solid-js/web";
 import { ChevronDown } from "lucide-solid";
 import { For, Show, createComponent as createComponent$1, createMemo, createSignal, createUniqueId, splitProps } from "solid-js";
 //#region src/components/conversation/transcript-composition.tsx
-var _tmpl$ = /*#__PURE__*/ template(`<div data-slot=transcript-row class="flex min-w-0 flex-col gap-1"><div data-slot=transcript-row-content>`);
+var _tmpl$ = /*#__PURE__*/ template(`<div data-slot=transcript-row class="flex min-w-0 flex-col gap-1"><div data-slot=transcript-row-content class="group-data-[density=comfortable]/transcript:flex group-data-[density=comfortable]/transcript:flex-col">`);
 var _tmpl$2 = /*#__PURE__*/ template(`<span>`);
 var _tmpl$3 = /*#__PURE__*/ template(`<div class="flex justify-end">`);
-var _tmpl$4 = /*#__PURE__*/ template(`<div data-slot=transcript-composition><div data-slot=transcript-rows class="flex min-w-0 flex-col gap-1">`);
+var _tmpl$4 = /*#__PURE__*/ template(`<div data-slot=transcript-composition><div data-slot=transcript-rows>`);
 var encodeId = (value) => encodeURIComponent(value);
 /** Stable, transcript-scoped key for host-owned disclosure restoration. */
 function transcriptDisclosureKey(resetKey, mode, firstRowId) {
@@ -240,6 +240,7 @@ function TranscriptComposition(props) {
 		"foldMode",
 		"foldState",
 		"onFoldStateChange",
+		"density",
 		"disclosure",
 		"onDisclosureChange"
 	]);
@@ -338,8 +339,11 @@ function TranscriptComposition(props) {
 			get ["data-fold-state"]() {
 				return foldState();
 			},
+			get ["data-density"]() {
+				return local.density ?? "compact";
+			},
 			get ["class"]() {
-				return cn("flex w-full min-w-0 flex-col gap-1", local.class);
+				return cn("group/transcript flex w-full min-w-0 flex-col gap-1", local.class);
 			}
 		}, rest), false, true);
 		insert(_el$4, createComponent(Show, {
@@ -386,6 +390,7 @@ function TranscriptComposition(props) {
 				onToggle: updateDisclosure
 			})
 		}));
+		effect(() => className(_el$6, cn("flex min-w-0 flex-col", local.density === "comfortable" ? "gap-3" : "gap-1")));
 		return _el$4;
 	})();
 }