@viax.io/uxm 4.38.0 → 4.40.0

package/dist/studio/lib/registry/inputs/radio-group.cjs

@@ -0,0 +1,86 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var radio_group_exports = {};
+__export(radio_group_exports, {
+  radioGroupDef: () => radioGroupDef
+});
+module.exports = __toCommonJS(radio_group_exports);
+const radioGroupDef = {
+  id: "radio-group",
+  name: "Radio Group",
+  category: "Inputs",
+  description: "Radio button group with multiple options. State knobs cover unselected \xD7 selected across default / hover, plus shared focus ring and disabled opacity.",
+  styleProperties: [
+    // Default — unselected
+    { key: "unselectedBg", label: "Background", control: "color", defaultValue: "transparent", section: "unselectedColors", showWhen: { state: "default" } },
+    { key: "unselectedBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "unselectedColors", showWhen: { state: "default" } },
+    // Default — selected
+    { key: "selectedBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "selectedColors", showWhen: { state: "default" } },
+    { key: "dotColor", label: "Dot", control: "color", defaultValue: "var(--color-accent)", section: "selectedColors", showWhen: { state: "default" } },
+    // Hover — unselected
+    { key: "hoverUnselectedBg", label: "Background", control: "color", defaultValue: "transparent", section: "unselectedColors", showWhen: { state: "hover" } },
+    // text-strong, not text-muted: muted is 2.54:1 on card in light — under the 3:1 UI floor (Principle IV)
+    { key: "hoverUnselectedBorder", label: "Border", control: "color", defaultValue: "var(--color-text-strong)", section: "unselectedColors", showWhen: { state: "hover" } },
+    // Hover — selected
+    { key: "hoverSelectedBorder", label: "Border", control: "color", defaultValue: "var(--color-accent-bold)", section: "selectedColors", showWhen: { state: "hover" } },
+    { key: "hoverDotColor", label: "Dot", control: "color", defaultValue: "var(--color-accent-bold)", section: "selectedColors", showWhen: { state: "hover" } },
+    // Focus — single shared ring color
+    { key: "focusRing", label: "Ring Color", control: "color", defaultValue: "var(--color-accent)", section: "focusState", showWhen: { state: "focus" } },
+    // Disabled — shared opacity
+    { key: "disabledOpacity", label: "Opacity", control: "slider", defaultValue: 0.4, min: 0.1, max: 1, step: 0.05, section: "disabledState", showWhen: { state: "disabled" } },
+    // Shared — always visible
+    { key: "size", label: "Size", control: "number", defaultValue: 20, min: 14, max: 32, step: 2, unit: "px" },
+    { key: "gap", label: "Item Gap", control: "number", defaultValue: 16, min: 4, max: 32, step: 4, unit: "px" },
+    // Error — the circles + option labels stay neutral; the group message
+    // below is the sole signal (errorColor colors it, errorMessageSize sizes it).
+    { key: "errorColor", label: "Message", control: "color", defaultValue: "var(--color-danger-text)", section: "errorState", showWhen: { state: "error" } },
+    { key: "errorMessageSize", label: "Message Size", control: "number", defaultValue: 12, min: 10, max: 16, step: 1, unit: "px", section: "errorState", showWhen: { state: "error" } }
+  ],
+  layoutVariants: [
+    {
+      key: "state",
+      label: "State",
+      options: [
+        { value: "default", label: "Default" },
+        { value: "hover", label: "Hover" },
+        { value: "focus", label: "Focus" },
+        { value: "disabled", label: "Disabled" },
+        { value: "error", label: "Error" }
+      ],
+      defaultValue: "default"
+    },
+    {
+      key: "direction",
+      label: "Direction",
+      options: [
+        { value: "vertical", label: "Vertical" },
+        { value: "horizontal", label: "Horizontal" }
+      ],
+      defaultValue: "vertical"
+    }
+  ],
+  events: [
+    { name: "onChange", description: "Fires when the user picks a different radio option.", payload: "{ value: string }" }
+  ]
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  radioGroupDef
+});
+//# sourceMappingURL=radio-group.cjs.map

package/dist/studio/lib/registry/inputs/radio-group.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/studio/lib/registry/inputs/radio-group.ts"],"sourcesContent":["import type { ComponentDef } from '../../types';\n\nexport const radioGroupDef: ComponentDef = {\n  id: 'radio-group',\n  name: 'Radio Group',\n  category: 'Inputs',\n  description: 'Radio button group with multiple options. State knobs cover unselected × selected across default / hover, plus shared focus ring and disabled opacity.',\n  styleProperties: [\n    // Default — unselected\n    { key: 'unselectedBg', label: 'Background', control: 'color', defaultValue: 'transparent', section: 'unselectedColors', showWhen: { state: 'default' } },\n    { key: 'unselectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'unselectedColors', showWhen: { state: 'default' } },\n    // Default — selected\n    { key: 'selectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'selectedColors', showWhen: { state: 'default' } },\n    { key: 'dotColor', label: 'Dot', control: 'color', defaultValue: 'var(--color-accent)', section: 'selectedColors', showWhen: { state: 'default' } },\n    // Hover — unselected\n    { key: 'hoverUnselectedBg', label: 'Background', control: 'color', defaultValue: 'transparent', section: 'unselectedColors', showWhen: { state: 'hover' } },\n    // text-strong, not text-muted: muted is 2.54:1 on card in light — under the 3:1 UI floor (Principle IV)\n    { key: 'hoverUnselectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-text-strong)', section: 'unselectedColors', showWhen: { state: 'hover' } },\n    // Hover — selected\n    { key: 'hoverSelectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent-bold)', section: 'selectedColors', showWhen: { state: 'hover' } },\n    { key: 'hoverDotColor', label: 'Dot', control: 'color', defaultValue: 'var(--color-accent-bold)', section: 'selectedColors', showWhen: { state: 'hover' } },\n    // Focus — single shared ring color\n    { key: 'focusRing', label: 'Ring Color', control: 'color', defaultValue: 'var(--color-accent)', section: 'focusState', showWhen: { state: 'focus' } },\n    // Disabled — shared opacity\n    { key: 'disabledOpacity', label: 'Opacity', control: 'slider', defaultValue: 0.4, min: 0.1, max: 1, step: 0.05, section: 'disabledState', showWhen: { state: 'disabled' } },\n    // Shared — always visible\n    { key: 'size', label: 'Size', control: 'number', defaultValue: 20, min: 14, max: 32, step: 2, unit: 'px' },\n    { key: 'gap', label: 'Item Gap', control: 'number', defaultValue: 16, min: 4, max: 32, step: 4, unit: 'px' },\n    // Error — the circles + option labels stay neutral; the group message\n    // below is the sole signal (errorColor colors it, errorMessageSize sizes it).\n    { key: 'errorColor', label: 'Message', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'errorState', showWhen: { state: 'error' } },\n    { key: 'errorMessageSize', label: 'Message Size', control: 'number', defaultValue: 12, min: 10, max: 16, step: 1, unit: 'px', section: 'errorState', showWhen: { state: 'error' } },\n  ],\n  layoutVariants: [\n    {\n      key: 'state',\n      label: 'State',\n      options: [\n        { value: 'default', label: 'Default' },\n        { value: 'hover', label: 'Hover' },\n        { value: 'focus', label: 'Focus' },\n        { value: 'disabled', label: 'Disabled' },\n        { value: 'error', label: 'Error' },\n      ],\n      defaultValue: 'default',\n    },\n    {\n      key: 'direction',\n      label: 'Direction',\n      options: [\n        { value: 'vertical', label: 'Vertical' },\n        { value: 'horizontal', label: 'Horizontal' },\n      ],\n      defaultValue: 'vertical',\n    },\n  ],\n  events: [\n    { name: 'onChange', description: 'Fires when the user picks a different radio option.', payload: '{ value: string }' },\n  ],\n};\n"],"mappings":"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","names":[]}

package/dist/studio/lib/registry/inputs/radio-group.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentDef } from '../../types.js';
+export declare const radioGroupDef: ComponentDef;
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/studio/lib/registry/inputs/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../../../src/studio/lib/registry/inputs/radio-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,eAAO,MAAM,aAAa,EAAE,YAyD3B,CAAC"}

package/dist/studio/lib/registry/inputs/radio-group.js

@@ -0,0 +1,62 @@
+const radioGroupDef = {
+  id: "radio-group",
+  name: "Radio Group",
+  category: "Inputs",
+  description: "Radio button group with multiple options. State knobs cover unselected \xD7 selected across default / hover, plus shared focus ring and disabled opacity.",
+  styleProperties: [
+    // Default — unselected
+    { key: "unselectedBg", label: "Background", control: "color", defaultValue: "transparent", section: "unselectedColors", showWhen: { state: "default" } },
+    { key: "unselectedBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "unselectedColors", showWhen: { state: "default" } },
+    // Default — selected
+    { key: "selectedBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "selectedColors", showWhen: { state: "default" } },
+    { key: "dotColor", label: "Dot", control: "color", defaultValue: "var(--color-accent)", section: "selectedColors", showWhen: { state: "default" } },
+    // Hover — unselected
+    { key: "hoverUnselectedBg", label: "Background", control: "color", defaultValue: "transparent", section: "unselectedColors", showWhen: { state: "hover" } },
+    // text-strong, not text-muted: muted is 2.54:1 on card in light — under the 3:1 UI floor (Principle IV)
+    { key: "hoverUnselectedBorder", label: "Border", control: "color", defaultValue: "var(--color-text-strong)", section: "unselectedColors", showWhen: { state: "hover" } },
+    // Hover — selected
+    { key: "hoverSelectedBorder", label: "Border", control: "color", defaultValue: "var(--color-accent-bold)", section: "selectedColors", showWhen: { state: "hover" } },
+    { key: "hoverDotColor", label: "Dot", control: "color", defaultValue: "var(--color-accent-bold)", section: "selectedColors", showWhen: { state: "hover" } },
+    // Focus — single shared ring color
+    { key: "focusRing", label: "Ring Color", control: "color", defaultValue: "var(--color-accent)", section: "focusState", showWhen: { state: "focus" } },
+    // Disabled — shared opacity
+    { key: "disabledOpacity", label: "Opacity", control: "slider", defaultValue: 0.4, min: 0.1, max: 1, step: 0.05, section: "disabledState", showWhen: { state: "disabled" } },
+    // Shared — always visible
+    { key: "size", label: "Size", control: "number", defaultValue: 20, min: 14, max: 32, step: 2, unit: "px" },
+    { key: "gap", label: "Item Gap", control: "number", defaultValue: 16, min: 4, max: 32, step: 4, unit: "px" },
+    // Error — the circles + option labels stay neutral; the group message
+    // below is the sole signal (errorColor colors it, errorMessageSize sizes it).
+    { key: "errorColor", label: "Message", control: "color", defaultValue: "var(--color-danger-text)", section: "errorState", showWhen: { state: "error" } },
+    { key: "errorMessageSize", label: "Message Size", control: "number", defaultValue: 12, min: 10, max: 16, step: 1, unit: "px", section: "errorState", showWhen: { state: "error" } }
+  ],
+  layoutVariants: [
+    {
+      key: "state",
+      label: "State",
+      options: [
+        { value: "default", label: "Default" },
+        { value: "hover", label: "Hover" },
+        { value: "focus", label: "Focus" },
+        { value: "disabled", label: "Disabled" },
+        { value: "error", label: "Error" }
+      ],
+      defaultValue: "default"
+    },
+    {
+      key: "direction",
+      label: "Direction",
+      options: [
+        { value: "vertical", label: "Vertical" },
+        { value: "horizontal", label: "Horizontal" }
+      ],
+      defaultValue: "vertical"
+    }
+  ],
+  events: [
+    { name: "onChange", description: "Fires when the user picks a different radio option.", payload: "{ value: string }" }
+  ]
+};
+export {
+  radioGroupDef
+};
+//# sourceMappingURL=radio-group.js.map

package/dist/studio/lib/registry/inputs/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/studio/lib/registry/inputs/radio-group.ts"],"sourcesContent":["import type { ComponentDef } from '../../types';\n\nexport const radioGroupDef: ComponentDef = {\n  id: 'radio-group',\n  name: 'Radio Group',\n  category: 'Inputs',\n  description: 'Radio button group with multiple options. State knobs cover unselected × selected across default / hover, plus shared focus ring and disabled opacity.',\n  styleProperties: [\n    // Default — unselected\n    { key: 'unselectedBg', label: 'Background', control: 'color', defaultValue: 'transparent', section: 'unselectedColors', showWhen: { state: 'default' } },\n    { key: 'unselectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'unselectedColors', showWhen: { state: 'default' } },\n    // Default — selected\n    { key: 'selectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'selectedColors', showWhen: { state: 'default' } },\n    { key: 'dotColor', label: 'Dot', control: 'color', defaultValue: 'var(--color-accent)', section: 'selectedColors', showWhen: { state: 'default' } },\n    // Hover — unselected\n    { key: 'hoverUnselectedBg', label: 'Background', control: 'color', defaultValue: 'transparent', section: 'unselectedColors', showWhen: { state: 'hover' } },\n    // text-strong, not text-muted: muted is 2.54:1 on card in light — under the 3:1 UI floor (Principle IV)\n    { key: 'hoverUnselectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-text-strong)', section: 'unselectedColors', showWhen: { state: 'hover' } },\n    // Hover — selected\n    { key: 'hoverSelectedBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent-bold)', section: 'selectedColors', showWhen: { state: 'hover' } },\n    { key: 'hoverDotColor', label: 'Dot', control: 'color', defaultValue: 'var(--color-accent-bold)', section: 'selectedColors', showWhen: { state: 'hover' } },\n    // Focus — single shared ring color\n    { key: 'focusRing', label: 'Ring Color', control: 'color', defaultValue: 'var(--color-accent)', section: 'focusState', showWhen: { state: 'focus' } },\n    // Disabled — shared opacity\n    { key: 'disabledOpacity', label: 'Opacity', control: 'slider', defaultValue: 0.4, min: 0.1, max: 1, step: 0.05, section: 'disabledState', showWhen: { state: 'disabled' } },\n    // Shared — always visible\n    { key: 'size', label: 'Size', control: 'number', defaultValue: 20, min: 14, max: 32, step: 2, unit: 'px' },\n    { key: 'gap', label: 'Item Gap', control: 'number', defaultValue: 16, min: 4, max: 32, step: 4, unit: 'px' },\n    // Error — the circles + option labels stay neutral; the group message\n    // below is the sole signal (errorColor colors it, errorMessageSize sizes it).\n    { key: 'errorColor', label: 'Message', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'errorState', showWhen: { state: 'error' } },\n    { key: 'errorMessageSize', label: 'Message Size', control: 'number', defaultValue: 12, min: 10, max: 16, step: 1, unit: 'px', section: 'errorState', showWhen: { state: 'error' } },\n  ],\n  layoutVariants: [\n    {\n      key: 'state',\n      label: 'State',\n      options: [\n        { value: 'default', label: 'Default' },\n        { value: 'hover', label: 'Hover' },\n        { value: 'focus', label: 'Focus' },\n        { value: 'disabled', label: 'Disabled' },\n        { value: 'error', label: 'Error' },\n      ],\n      defaultValue: 'default',\n    },\n    {\n      key: 'direction',\n      label: 'Direction',\n      options: [\n        { value: 'vertical', label: 'Vertical' },\n        { value: 'horizontal', label: 'Horizontal' },\n      ],\n      defaultValue: 'vertical',\n    },\n  ],\n  events: [\n    { name: 'onChange', description: 'Fires when the user picks a different radio option.', payload: '{ value: string }' },\n  ],\n};\n"],"mappings":"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","names":[]}

package/dist/studio/lib/registry/inputs/search-dropdown.cjs

@@ -0,0 +1,86 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var search_dropdown_exports = {};
+__export(search_dropdown_exports, {
+  searchDropdownDef: () => searchDropdownDef
+});
+module.exports = __toCommonJS(search_dropdown_exports);
+const searchDropdownDef = {
+  id: "search-dropdown",
+  name: "Search Dropdown",
+  category: "Inputs",
+  description: "Combobox: trigger button opens a popover with a search input + filtered list. Use for long option lists (icon glyphs, country codes, large enums); native Select covers short ones. Keyboard-navigable (ArrowUp/Down, Enter, Escape) and click-outside-aware. Trigger state coverage matches the rest of the input family \u2014 default / hover / focus / disabled / error.",
+  styleProperties: [
+    // Default — trigger
+    { key: "triggerBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "default" } },
+    { key: "triggerBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "triggerColors", showWhen: { state: "default" } },
+    { key: "triggerColor", label: "Text", control: "color", defaultValue: "var(--color-text)", section: "triggerColors", showWhen: { state: "default" } },
+    // Hover — trigger
+    { key: "triggerHoverBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "hover" } },
+    { key: "triggerHoverBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "triggerColors", showWhen: { state: "hover" } },
+    // Focus — trigger
+    { key: "triggerFocusBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "triggerColors", showWhen: { state: "focus" } },
+    { key: "triggerFocusRing", label: "Ring", control: "color", defaultValue: "var(--color-accent)", section: "focusState", showWhen: { state: "focus" } },
+    // Disabled — trigger
+    { key: "triggerDisabledBg", label: "Background", control: "color", defaultValue: "var(--color-surface-alt)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledColor", label: "Text", control: "color", defaultValue: "var(--color-text-muted)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledOpacity", label: "Opacity", control: "slider", defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: "disabledState", showWhen: { state: "disabled" } },
+    // Error — trigger
+    { key: "triggerErrorBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "error" } },
+    { key: "triggerErrorBorder", label: "Border", control: "color", defaultValue: "var(--color-danger-text)", section: "triggerColors", showWhen: { state: "error" } },
+    { key: "triggerErrorColor", label: "Message", control: "color", defaultValue: "var(--color-danger-text)", section: "errorState", showWhen: { state: "error" } },
+    { key: "triggerErrorMessageSize", label: "Message Size", control: "number", defaultValue: 12, min: 10, max: 16, step: 1, unit: "px", section: "errorState", showWhen: { state: "error" } },
+    // Shared — trigger
+    { key: "triggerRadius", label: "Trigger Radius", control: "slider", defaultValue: 6, min: 0, max: 16, step: 1, unit: "px" },
+    { key: "triggerPaddingX", label: "Trigger Padding X", control: "number", defaultValue: 12, min: 4, max: 20, step: 1, unit: "px" },
+    { key: "triggerPaddingY", label: "Trigger Padding Y", control: "number", defaultValue: 10, min: 2, max: 14, step: 1, unit: "px" },
+    { key: "triggerFontSize", label: "Trigger Font Size", control: "number", defaultValue: 14, min: 10, max: 18, step: 1, unit: "px" }
+    // SearchDropdown's popover is owned by the shared Listbox atom —
+    // see the `listbox` registry entry for panel chrome (bg, border,
+    // radius, shadow), option row states (hover, selected, disabled),
+    // search input, group headers, empty + footer slots. Tune Listbox
+    // once and every dropdown in the app reflects it.
+  ],
+  layoutVariants: [
+    {
+      key: "state",
+      label: "State",
+      options: [
+        { value: "default", label: "Default" },
+        { value: "hover", label: "Hover" },
+        { value: "focus", label: "Focus" },
+        { value: "disabled", label: "Disabled" },
+        { value: "error", label: "Error" }
+      ],
+      defaultValue: "default"
+    }
+  ],
+  events: [
+    { name: "onChange", description: "Fires when the user picks an option from the dropdown (click or Enter).", payload: "{ value: string }" },
+    { name: "onSearch", description: "Fires as the user types in the search box. Use to debounce server-side filtering.", payload: "{ query: string }" },
+    { name: "onOpen", description: "Fires when the popover opens (trigger click or keyboard activation).", payload: "void" },
+    { name: "onClose", description: "Fires when the popover closes (selection, Escape, or outside click).", payload: "void" }
+  ]
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  searchDropdownDef
+});
+//# sourceMappingURL=search-dropdown.cjs.map

package/dist/studio/lib/registry/inputs/search-dropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/studio/lib/registry/inputs/search-dropdown.ts"],"sourcesContent":["import type { ComponentDef } from '../../types';\n\nexport const searchDropdownDef: ComponentDef = {\n  id: 'search-dropdown',\n  name: 'Search Dropdown',\n  category: 'Inputs',\n  description: 'Combobox: trigger button opens a popover with a search input + filtered list. Use for long option lists (icon glyphs, country codes, large enums); native Select covers short ones. Keyboard-navigable (ArrowUp/Down, Enter, Escape) and click-outside-aware. Trigger state coverage matches the rest of the input family — default / hover / focus / disabled / error.',\n  styleProperties: [\n    // Default — trigger\n    { key: 'triggerBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'default' } },\n    { key: 'triggerBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'triggerColors', showWhen: { state: 'default' } },\n    { key: 'triggerColor', label: 'Text', control: 'color', defaultValue: 'var(--color-text)', section: 'triggerColors', showWhen: { state: 'default' } },\n    // Hover — trigger\n    { key: 'triggerHoverBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'hover' } },\n    { key: 'triggerHoverBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'triggerColors', showWhen: { state: 'hover' } },\n    // Focus — trigger\n    { key: 'triggerFocusBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'triggerColors', showWhen: { state: 'focus' } },\n    { key: 'triggerFocusRing', label: 'Ring', control: 'color', defaultValue: 'var(--color-accent)', section: 'focusState', showWhen: { state: 'focus' } },\n    // Disabled — trigger\n    { key: 'triggerDisabledBg', label: 'Background', control: 'color', defaultValue: 'var(--color-surface-alt)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledColor', label: 'Text', control: 'color', defaultValue: 'var(--color-text-muted)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledOpacity', label: 'Opacity', control: 'slider', defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: 'disabledState', showWhen: { state: 'disabled' } },\n    // Error — trigger\n    { key: 'triggerErrorBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'error' } },\n    { key: 'triggerErrorBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'triggerColors', showWhen: { state: 'error' } },\n    { key: 'triggerErrorColor', label: 'Message', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'errorState', showWhen: { state: 'error' } },\n    { key: 'triggerErrorMessageSize', label: 'Message Size', control: 'number', defaultValue: 12, min: 10, max: 16, step: 1, unit: 'px', section: 'errorState', showWhen: { state: 'error' } },\n    // Shared — trigger\n    { key: 'triggerRadius', label: 'Trigger Radius', control: 'slider', defaultValue: 6, min: 0, max: 16, step: 1, unit: 'px' },\n    { key: 'triggerPaddingX', label: 'Trigger Padding X', control: 'number', defaultValue: 12, min: 4, max: 20, step: 1, unit: 'px' },\n    { key: 'triggerPaddingY', label: 'Trigger Padding Y', control: 'number', defaultValue: 10, min: 2, max: 14, step: 1, unit: 'px' },\n    { key: 'triggerFontSize', label: 'Trigger Font Size', control: 'number', defaultValue: 14, min: 10, max: 18, step: 1, unit: 'px' },\n    // SearchDropdown's popover is owned by the shared Listbox atom —\n    // see the `listbox` registry entry for panel chrome (bg, border,\n    // radius, shadow), option row states (hover, selected, disabled),\n    // search input, group headers, empty + footer slots. Tune Listbox\n    // once and every dropdown in the app reflects it.\n  ],\n  layoutVariants: [\n    {\n      key: 'state',\n      label: 'State',\n      options: [\n        { value: 'default', label: 'Default' },\n        { value: 'hover', label: 'Hover' },\n        { value: 'focus', label: 'Focus' },\n        { value: 'disabled', label: 'Disabled' },\n        { value: 'error', label: 'Error' },\n      ],\n      defaultValue: 'default',\n    },\n  ],\n  events: [\n    { name: 'onChange', description: 'Fires when the user picks an option from the dropdown (click or Enter).', payload: '{ value: string }' },\n    { name: 'onSearch', description: 'Fires as the user types in the search box. Use to debounce server-side filtering.', payload: '{ query: string }' },\n    { name: 'onOpen', description: 'Fires when the popover opens (trigger click or keyboard activation).', payload: 'void' },\n    { name: 'onClose', description: 'Fires when the popover closes (selection, Escape, or outside click).', payload: 'void' },\n  ],\n};\n"],"mappings":"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","names":[]}

package/dist/studio/lib/registry/inputs/search-dropdown.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentDef } from '../../types.js';
+export declare const searchDropdownDef: ComponentDef;
+//# sourceMappingURL=search-dropdown.d.ts.map

package/dist/studio/lib/registry/inputs/search-dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/studio/lib/registry/inputs/search-dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,eAAO,MAAM,iBAAiB,EAAE,YAyD/B,CAAC"}

package/dist/studio/lib/registry/inputs/search-dropdown.js

@@ -0,0 +1,62 @@
+const searchDropdownDef = {
+  id: "search-dropdown",
+  name: "Search Dropdown",
+  category: "Inputs",
+  description: "Combobox: trigger button opens a popover with a search input + filtered list. Use for long option lists (icon glyphs, country codes, large enums); native Select covers short ones. Keyboard-navigable (ArrowUp/Down, Enter, Escape) and click-outside-aware. Trigger state coverage matches the rest of the input family \u2014 default / hover / focus / disabled / error.",
+  styleProperties: [
+    // Default — trigger
+    { key: "triggerBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "default" } },
+    { key: "triggerBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "triggerColors", showWhen: { state: "default" } },
+    { key: "triggerColor", label: "Text", control: "color", defaultValue: "var(--color-text)", section: "triggerColors", showWhen: { state: "default" } },
+    // Hover — trigger
+    { key: "triggerHoverBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "hover" } },
+    { key: "triggerHoverBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "triggerColors", showWhen: { state: "hover" } },
+    // Focus — trigger
+    { key: "triggerFocusBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "triggerColors", showWhen: { state: "focus" } },
+    { key: "triggerFocusRing", label: "Ring", control: "color", defaultValue: "var(--color-accent)", section: "focusState", showWhen: { state: "focus" } },
+    // Disabled — trigger
+    { key: "triggerDisabledBg", label: "Background", control: "color", defaultValue: "var(--color-surface-alt)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledColor", label: "Text", control: "color", defaultValue: "var(--color-text-muted)", section: "triggerColors", showWhen: { state: "disabled" } },
+    { key: "triggerDisabledOpacity", label: "Opacity", control: "slider", defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: "disabledState", showWhen: { state: "disabled" } },
+    // Error — trigger
+    { key: "triggerErrorBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "triggerColors", showWhen: { state: "error" } },
+    { key: "triggerErrorBorder", label: "Border", control: "color", defaultValue: "var(--color-danger-text)", section: "triggerColors", showWhen: { state: "error" } },
+    { key: "triggerErrorColor", label: "Message", control: "color", defaultValue: "var(--color-danger-text)", section: "errorState", showWhen: { state: "error" } },
+    { key: "triggerErrorMessageSize", label: "Message Size", control: "number", defaultValue: 12, min: 10, max: 16, step: 1, unit: "px", section: "errorState", showWhen: { state: "error" } },
+    // Shared — trigger
+    { key: "triggerRadius", label: "Trigger Radius", control: "slider", defaultValue: 6, min: 0, max: 16, step: 1, unit: "px" },
+    { key: "triggerPaddingX", label: "Trigger Padding X", control: "number", defaultValue: 12, min: 4, max: 20, step: 1, unit: "px" },
+    { key: "triggerPaddingY", label: "Trigger Padding Y", control: "number", defaultValue: 10, min: 2, max: 14, step: 1, unit: "px" },
+    { key: "triggerFontSize", label: "Trigger Font Size", control: "number", defaultValue: 14, min: 10, max: 18, step: 1, unit: "px" }
+    // SearchDropdown's popover is owned by the shared Listbox atom —
+    // see the `listbox` registry entry for panel chrome (bg, border,
+    // radius, shadow), option row states (hover, selected, disabled),
+    // search input, group headers, empty + footer slots. Tune Listbox
+    // once and every dropdown in the app reflects it.
+  ],
+  layoutVariants: [
+    {
+      key: "state",
+      label: "State",
+      options: [
+        { value: "default", label: "Default" },
+        { value: "hover", label: "Hover" },
+        { value: "focus", label: "Focus" },
+        { value: "disabled", label: "Disabled" },
+        { value: "error", label: "Error" }
+      ],
+      defaultValue: "default"
+    }
+  ],
+  events: [
+    { name: "onChange", description: "Fires when the user picks an option from the dropdown (click or Enter).", payload: "{ value: string }" },
+    { name: "onSearch", description: "Fires as the user types in the search box. Use to debounce server-side filtering.", payload: "{ query: string }" },
+    { name: "onOpen", description: "Fires when the popover opens (trigger click or keyboard activation).", payload: "void" },
+    { name: "onClose", description: "Fires when the popover closes (selection, Escape, or outside click).", payload: "void" }
+  ]
+};
+export {
+  searchDropdownDef
+};
+//# sourceMappingURL=search-dropdown.js.map

package/dist/studio/lib/registry/inputs/search-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/studio/lib/registry/inputs/search-dropdown.ts"],"sourcesContent":["import type { ComponentDef } from '../../types';\n\nexport const searchDropdownDef: ComponentDef = {\n  id: 'search-dropdown',\n  name: 'Search Dropdown',\n  category: 'Inputs',\n  description: 'Combobox: trigger button opens a popover with a search input + filtered list. Use for long option lists (icon glyphs, country codes, large enums); native Select covers short ones. Keyboard-navigable (ArrowUp/Down, Enter, Escape) and click-outside-aware. Trigger state coverage matches the rest of the input family — default / hover / focus / disabled / error.',\n  styleProperties: [\n    // Default — trigger\n    { key: 'triggerBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'default' } },\n    { key: 'triggerBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'triggerColors', showWhen: { state: 'default' } },\n    { key: 'triggerColor', label: 'Text', control: 'color', defaultValue: 'var(--color-text)', section: 'triggerColors', showWhen: { state: 'default' } },\n    // Hover — trigger\n    { key: 'triggerHoverBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'hover' } },\n    { key: 'triggerHoverBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'triggerColors', showWhen: { state: 'hover' } },\n    // Focus — trigger\n    { key: 'triggerFocusBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'triggerColors', showWhen: { state: 'focus' } },\n    { key: 'triggerFocusRing', label: 'Ring', control: 'color', defaultValue: 'var(--color-accent)', section: 'focusState', showWhen: { state: 'focus' } },\n    // Disabled — trigger\n    { key: 'triggerDisabledBg', label: 'Background', control: 'color', defaultValue: 'var(--color-surface-alt)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledColor', label: 'Text', control: 'color', defaultValue: 'var(--color-text-muted)', section: 'triggerColors', showWhen: { state: 'disabled' } },\n    { key: 'triggerDisabledOpacity', label: 'Opacity', control: 'slider', defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: 'disabledState', showWhen: { state: 'disabled' } },\n    // Error — trigger\n    { key: 'triggerErrorBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'triggerColors', showWhen: { state: 'error' } },\n    { key: 'triggerErrorBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'triggerColors', showWhen: { state: 'error' } },\n    { key: 'triggerErrorColor', label: 'Message', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'errorState', showWhen: { state: 'error' } },\n    { key: 'triggerErrorMessageSize', label: 'Message Size', control: 'number', defaultValue: 12, min: 10, max: 16, step: 1, unit: 'px', section: 'errorState', showWhen: { state: 'error' } },\n    // Shared — trigger\n    { key: 'triggerRadius', label: 'Trigger Radius', control: 'slider', defaultValue: 6, min: 0, max: 16, step: 1, unit: 'px' },\n    { key: 'triggerPaddingX', label: 'Trigger Padding X', control: 'number', defaultValue: 12, min: 4, max: 20, step: 1, unit: 'px' },\n    { key: 'triggerPaddingY', label: 'Trigger Padding Y', control: 'number', defaultValue: 10, min: 2, max: 14, step: 1, unit: 'px' },\n    { key: 'triggerFontSize', label: 'Trigger Font Size', control: 'number', defaultValue: 14, min: 10, max: 18, step: 1, unit: 'px' },\n    // SearchDropdown's popover is owned by the shared Listbox atom —\n    // see the `listbox` registry entry for panel chrome (bg, border,\n    // radius, shadow), option row states (hover, selected, disabled),\n    // search input, group headers, empty + footer slots. Tune Listbox\n    // once and every dropdown in the app reflects it.\n  ],\n  layoutVariants: [\n    {\n      key: 'state',\n      label: 'State',\n      options: [\n        { value: 'default', label: 'Default' },\n        { value: 'hover', label: 'Hover' },\n        { value: 'focus', label: 'Focus' },\n        { value: 'disabled', label: 'Disabled' },\n        { value: 'error', label: 'Error' },\n      ],\n      defaultValue: 'default',\n    },\n  ],\n  events: [\n    { name: 'onChange', description: 'Fires when the user picks an option from the dropdown (click or Enter).', payload: '{ value: string }' },\n    { name: 'onSearch', description: 'Fires as the user types in the search box. Use to debounce server-side filtering.', payload: '{ query: string }' },\n    { name: 'onOpen', description: 'Fires when the popover opens (trigger click or keyboard activation).', payload: 'void' },\n    { name: 'onClose', description: 'Fires when the popover closes (selection, Escape, or outside click).', payload: 'void' },\n  ],\n};\n"],"mappings":"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","names":[]}

package/dist/studio/lib/registry/inputs/select-dropdown.cjs

@@ -0,0 +1,103 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var select_dropdown_exports = {};
+__export(select_dropdown_exports, {
+  selectDropdownDef: () => selectDropdownDef
+});
+module.exports = __toCommonJS(select_dropdown_exports);
+const selectDropdownDef = {
+  id: "select-dropdown",
+  name: "Select Dropdown",
+  category: "Inputs",
+  description: 'Dropdown selection field \u2014 internally a Listbox-backed picker. This entry themes the trigger (default / hover / focus / disabled / error); the trigger is identical whether or not the panel searches, so searchability isn\'t a knob here \u2014 it\'s the `searchable` prop (default auto: the panel grows a search box once the option list is long enough), and the search box itself is previewed + themed in the Listbox entry. Clearability isn\'t a knob either: a clear (\u2715) button appears automatically once a value is picked IF the select has a placeholder option (`<option value="" disabled>`), which marks "empty" as a valid state. Mandatory selects (no placeholder \u2014 a value is always chosen) never show it. For a search-first combobox with its own trigger chrome (icon glyphs, dial codes), use the SearchDropdown atom instead.',
+  styleProperties: [
+    // Default
+    { key: "backgroundColor", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "fieldColors", showWhen: { state: "default" } },
+    { key: "borderColor", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "fieldColors", showWhen: { state: "default" } },
+    { key: "color", label: "Text", control: "color", defaultValue: "var(--color-text)", section: "fieldColors", showWhen: { state: "default" } },
+    // Hover
+    { key: "hoverBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "fieldColors", showWhen: { state: "hover" } },
+    { key: "hoverBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "fieldColors", showWhen: { state: "hover" } },
+    // Focus
+    { key: "focusBorder", label: "Border", control: "color", defaultValue: "var(--color-accent)", section: "fieldColors", showWhen: { state: "focus" } },
+    { key: "focusRing", label: "Ring", control: "color", defaultValue: "var(--color-accent)", section: "focusState", showWhen: { state: "focus" } },
+    // Disabled
+    { key: "disabledBg", label: "Background", control: "color", defaultValue: "var(--color-surface-alt)", section: "fieldColors", showWhen: { state: "disabled" } },
+    { key: "disabledBorder", label: "Border", control: "color", defaultValue: "var(--color-border)", section: "fieldColors", showWhen: { state: "disabled" } },
+    { key: "disabledColor", label: "Text", control: "color", defaultValue: "var(--color-text-muted)", section: "fieldColors", showWhen: { state: "disabled" } },
+    { key: "disabledOpacity", label: "Opacity", control: "slider", defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: "disabledState", showWhen: { state: "disabled" } },
+    // Error
+    { key: "errorBg", label: "Background", control: "color", defaultValue: "var(--color-card)", section: "fieldColors", showWhen: { state: "error" } },
+    { key: "errorBorder", label: "Border", control: "color", defaultValue: "var(--color-danger-text)", section: "fieldColors", showWhen: { state: "error" } },
+    { key: "errorColor", label: "Label + Message", control: "color", defaultValue: "var(--color-danger-text)", section: "errorState", showWhen: { state: "error" } },
+    { key: "errorMessageSize", label: "Message Size", control: "number", defaultValue: 12, min: 10, max: 16, step: 1, unit: "px", section: "errorState", showWhen: { state: "error" } },
+    // Shared
+    { key: "borderRadius", label: "Border Radius", control: "slider", defaultValue: 8, min: 0, max: 16, step: 1, unit: "px" },
+    { key: "paddingX", label: "Padding X", control: "number", defaultValue: 12, min: 4, max: 24, step: 2, unit: "px" },
+    { key: "paddingY", label: "Padding Y", control: "number", defaultValue: 10, min: 4, max: 20, step: 2, unit: "px" },
+    { key: "fontSize", label: "Font Size", control: "number", defaultValue: 14, min: 10, max: 20, step: 1, unit: "px" }
+    // Label theming + position live on FormField. See input-text for
+    // the same consolidation rationale.
+    // The search input's placeholder is NOT a workbench knob: its TEXT
+    // is per-instance content the consumer passes at the call site (the
+    // searchable Select renders the shared Listbox panel), and its only
+    // themeable aspect — the placeholder COLOR — lives once on the
+    // `listbox` entry (`searchPlaceholderColor`). A text knob here would
+    // also serialize to a dead `--uxm-…-search-placeholder` CSS var that
+    // paints nothing.
+  ],
+  layoutVariants: [
+    {
+      key: "state",
+      label: "State",
+      options: [
+        { value: "default", label: "Default" },
+        { value: "hover", label: "Hover" },
+        { value: "focus", label: "Focus" },
+        { value: "disabled", label: "Disabled" },
+        { value: "error", label: "Error" }
+      ],
+      defaultValue: "default"
+    },
+    // Behavioral variants — they change WHAT gets shown, not how the
+    // trigger looks. Style knobs (colors, padding, font) apply across
+    // all of these. (Searchability is deliberately NOT here: the trigger
+    // is identical with/without search, and the search box is previewed
+    // in the Listbox entry — see this component's description.)
+    {
+      key: "multiSelect",
+      label: "Mode",
+      options: [
+        { value: "single", label: "Single" },
+        { value: "multi", label: "Multi" }
+      ],
+      defaultValue: "single"
+    }
+  ],
+  events: [
+    { name: "onChange", description: "Fires when the user picks a different option.", payload: "{ value: string }" },
+    { name: "onFocus", description: "Fires when the select receives focus.", payload: "FocusEvent" },
+    { name: "onBlur", description: "Fires when the select loses focus.", payload: "FocusEvent" }
+  ]
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  selectDropdownDef
+});
+//# sourceMappingURL=select-dropdown.cjs.map

package/dist/studio/lib/registry/inputs/select-dropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/studio/lib/registry/inputs/select-dropdown.ts"],"sourcesContent":["import type { ComponentDef } from '../../types';\n\nexport const selectDropdownDef: ComponentDef = {\n  id: 'select-dropdown',\n  name: 'Select Dropdown',\n  category: 'Inputs',\n  description: 'Dropdown selection field — internally a Listbox-backed picker. This entry themes the trigger (default / hover / focus / disabled / error); the trigger is identical whether or not the panel searches, so searchability isn\\'t a knob here — it\\'s the `searchable` prop (default auto: the panel grows a search box once the option list is long enough), and the search box itself is previewed + themed in the Listbox entry. Clearability isn\\'t a knob either: a clear (✕) button appears automatically once a value is picked IF the select has a placeholder option (`<option value=\"\" disabled>`), which marks \"empty\" as a valid state. Mandatory selects (no placeholder — a value is always chosen) never show it. For a search-first combobox with its own trigger chrome (icon glyphs, dial codes), use the SearchDropdown atom instead.',\n  styleProperties: [\n    // Default\n    { key: 'backgroundColor', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'fieldColors', showWhen: { state: 'default' } },\n    { key: 'borderColor', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'fieldColors', showWhen: { state: 'default' } },\n    { key: 'color', label: 'Text', control: 'color', defaultValue: 'var(--color-text)', section: 'fieldColors', showWhen: { state: 'default' } },\n    // Hover\n    { key: 'hoverBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'fieldColors', showWhen: { state: 'hover' } },\n    { key: 'hoverBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'fieldColors', showWhen: { state: 'hover' } },\n    // Focus\n    { key: 'focusBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-accent)', section: 'fieldColors', showWhen: { state: 'focus' } },\n    { key: 'focusRing', label: 'Ring', control: 'color', defaultValue: 'var(--color-accent)', section: 'focusState', showWhen: { state: 'focus' } },\n    // Disabled\n    { key: 'disabledBg', label: 'Background', control: 'color', defaultValue: 'var(--color-surface-alt)', section: 'fieldColors', showWhen: { state: 'disabled' } },\n    { key: 'disabledBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-border)', section: 'fieldColors', showWhen: { state: 'disabled' } },\n    { key: 'disabledColor', label: 'Text', control: 'color', defaultValue: 'var(--color-text-muted)', section: 'fieldColors', showWhen: { state: 'disabled' } },\n    { key: 'disabledOpacity', label: 'Opacity', control: 'slider', defaultValue: 0.6, min: 0.1, max: 1, step: 0.05, section: 'disabledState', showWhen: { state: 'disabled' } },\n    // Error\n    { key: 'errorBg', label: 'Background', control: 'color', defaultValue: 'var(--color-card)', section: 'fieldColors', showWhen: { state: 'error' } },\n    { key: 'errorBorder', label: 'Border', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'fieldColors', showWhen: { state: 'error' } },\n    { key: 'errorColor', label: 'Label + Message', control: 'color', defaultValue: 'var(--color-danger-text)', section: 'errorState', showWhen: { state: 'error' } },\n    { key: 'errorMessageSize', label: 'Message Size', control: 'number', defaultValue: 12, min: 10, max: 16, step: 1, unit: 'px', section: 'errorState', showWhen: { state: 'error' } },\n    // Shared\n    { key: 'borderRadius', label: 'Border Radius', control: 'slider', defaultValue: 8, min: 0, max: 16, step: 1, unit: 'px' },\n    { key: 'paddingX', label: 'Padding X', control: 'number', defaultValue: 12, min: 4, max: 24, step: 2, unit: 'px' },\n    { key: 'paddingY', label: 'Padding Y', control: 'number', defaultValue: 10, min: 4, max: 20, step: 2, unit: 'px' },\n    { key: 'fontSize', label: 'Font Size', control: 'number', defaultValue: 14, min: 10, max: 20, step: 1, unit: 'px' },\n    // Label theming + position live on FormField. See input-text for\n    // the same consolidation rationale.\n    // The search input's placeholder is NOT a workbench knob: its TEXT\n    // is per-instance content the consumer passes at the call site (the\n    // searchable Select renders the shared Listbox panel), and its only\n    // themeable aspect — the placeholder COLOR — lives once on the\n    // `listbox` entry (`searchPlaceholderColor`). A text knob here would\n    // also serialize to a dead `--uxm-…-search-placeholder` CSS var that\n    // paints nothing.\n  ],\n  layoutVariants: [\n    {\n      key: 'state',\n      label: 'State',\n      options: [\n        { value: 'default', label: 'Default' },\n        { value: 'hover', label: 'Hover' },\n        { value: 'focus', label: 'Focus' },\n        { value: 'disabled', label: 'Disabled' },\n        { value: 'error', label: 'Error' },\n      ],\n      defaultValue: 'default',\n    },\n    // Behavioral variants — they change WHAT gets shown, not how the\n    // trigger looks. Style knobs (colors, padding, font) apply across\n    // all of these. (Searchability is deliberately NOT here: the trigger\n    // is identical with/without search, and the search box is previewed\n    // in the Listbox entry — see this component's description.)\n    {\n      key: 'multiSelect',\n      label: 'Mode',\n      options: [\n        { value: 'single', label: 'Single' },\n        { value: 'multi', label: 'Multi' },\n      ],\n      defaultValue: 'single',\n    },\n  ],\n  events: [\n    { name: 'onChange', description: 'Fires when the user picks a different option.', payload: '{ value: string }' },\n    { name: 'onFocus', description: 'Fires when the select receives focus.', payload: 'FocusEvent' },\n    { name: 'onBlur', description: 'Fires when the select loses focus.', payload: 'FocusEvent' },\n  ],\n};\n"],"mappings":"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","names":[]}

package/dist/studio/lib/registry/inputs/select-dropdown.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentDef } from '../../types.js';
+export declare const selectDropdownDef: ComponentDef;
+//# sourceMappingURL=select-dropdown.d.ts.map

package/dist/studio/lib/registry/inputs/select-dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/studio/lib/registry/inputs/select-dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,eAAO,MAAM,iBAAiB,EAAE,YA0E/B,CAAC"}