@devslab/dds-solid 0.23.0 → 0.25.0

package/dist/number-input.server.js

@@ -0,0 +1,237 @@
+import { n as describedBy, t as classes } from "./assets/utils-Ou0UJRlO.js";
+import { t as useDirection } from "./assets/direction-BpTqmXs-.js";
+import { c as isKorean } from "./assets/date-only-0Ldsjp43.js";
+import { Show, createEffect, createMemo, createSignal, createUniqueId, mergeProps, on } from "solid-js";
+import { createComponent, escape, mergeProps as mergeProps$1, ssr, ssrAttribute, ssrElement, ssrHydrationKey } from "solid-js/web";
+import { NumberInput as NumberInput$1, useNumberInput } from "@ark-ui/solid/number-input";
+//#region src/number-input.tsx
+var _tmpl$ = [
+	"<svg",
+	" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">",
+	"</svg>"
+];
+var _tmpl$2 = ["<path", "></path>"];
+var _tmpl$3 = [
+	"<span",
+	" class=\"dds-number-input__suffix\">",
+	"</span>"
+];
+var _tmpl$4 = [
+	"<span",
+	" class=\"dds-number-input__steppers\"><!--$-->",
+	"<!--/--><!--$-->",
+	"<!--/--></span>"
+];
+var _tmpl$5 = [
+	"<input",
+	" type=\"hidden\"",
+	"",
+	">"
+];
+function numberInputMessages(locale, messages = {}) {
+	const ko = isKorean(locale);
+	return {
+		decrease: ko ? "값 줄이기" : "Decrease",
+		increase: ko ? "값 늘리기" : "Increase",
+		...messages
+	};
+}
+var MINUS = ["M5 12h14"];
+var PLUS = ["M12 5v14", "M5 12h14"];
+function StepIcon(props) {
+	return ssr(_tmpl$, ssrHydrationKey(), escape(props.path.map((d) => ssr(_tmpl$2, ssrHydrationKey() + ssrAttribute("d", escape(d, true), false)))));
+}
+var FULL_WIDTH = {
+	"，": ",",
+	"．": ".",
+	"－": "-",
+	"−": "-"
+};
+/** Full-width digits from Japanese/Chinese IMEs become ASCII; other text is left for validation. */
+function normalizeNumberText(text) {
+	return text.replace(/[０-９，．－−]/g, (char) => char >= "０" && char <= "９" ? String.fromCharCode(char.charCodeAt(0) - 65296 + 48) : FULL_WIDTH[char]);
+}
+function separators(formatter) {
+	const parts = [...formatter.formatToParts(-1234567.5), ...formatter.formatToParts(1234567.5)];
+	const find = (type) => parts.find((part) => part.type === type)?.value;
+	const affixes = /* @__PURE__ */ new Set();
+	for (const part of parts) if (![
+		"integer",
+		"group",
+		"decimal",
+		"fraction",
+		"minusSign"
+	].includes(part.type)) for (const char of part.value) affixes.add(char);
+	return {
+		group: find("group") ?? "",
+		decimal: find("decimal") ?? ".",
+		minus: find("minusSign") ?? "-",
+		affixes
+	};
+}
+/**
+* A localized number field. Values are numbers (or null for empty); display
+* text is formatted with Intl and never leaves the component.
+*/
+function NumberInput(props) {
+	const generated = createUniqueId();
+	const id = () => props.id ?? `dds-number-input-${generated}`;
+	const suffixId = () => `${id()}-suffix`;
+	const locale = () => props.locale ?? "ko-KR";
+	const messages = () => numberInputMessages(locale(), props.messages);
+	const formatOptions = createMemo(() => props.formatOptions ?? { maximumFractionDigits: 0 });
+	const formatter = createMemo(() => new Intl.NumberFormat(locale(), formatOptions()));
+	createMemo(() => separators(formatter()));
+	const fractions = () => (formatter().resolvedOptions().maximumFractionDigits ?? 0) > 0;
+	const format = (next) => next === null || !Number.isFinite(next) ? "" : formatter().format(next);
+	const controlled = () => props.value !== void 0;
+	const [internal, setInternal] = createSignal(props.defaultValue ?? null);
+	const current = () => controlled() ? props.value ?? null : internal();
+	const [draft, setDraft] = createSignal(format(current()));
+	const [draftNumber, setDraftNumber] = createSignal(current());
+	const outOfRange = () => {
+		const next = draftNumber();
+		return next !== null && (props.min !== void 0 && next < props.min || props.max !== void 0 && next > props.max);
+	};
+	const invalid = () => !!props.invalid || outOfRange();
+	let root;
+	const direction = useDirection(() => root, () => props.dir);
+	const commit = (next) => {
+		if (next === current()) return;
+		if (!controlled()) setInternal(next);
+		props.onValueChange?.(next);
+	};
+	const api = useNumberInput(() => ({
+		id: `${id()}-root`,
+		ids: {
+			root: `${id()}-root`,
+			input: id()
+		},
+		dir: direction(),
+		locale: locale(),
+		formatOptions: formatOptions(),
+		value: draft(),
+		step: props.step ?? 1,
+		...props.min !== void 0 ? { min: props.min } : {},
+		...props.max !== void 0 ? { max: props.max } : {},
+		allowMouseWheel: false,
+		clampValueOnBlur: true,
+		spinOnPress: true,
+		inputMode: fractions() ? "decimal" : "numeric",
+		disabled: props.disabled,
+		readOnly: props.readOnly,
+		required: props.required,
+		invalid: invalid(),
+		translations: {
+			decrementLabel: messages().decrease,
+			incrementLabel: messages().increase,
+			valueText: (text) => text && props.suffix ? `${text} ${props.suffix}` : text
+		},
+		onValueChange: (details) => {
+			const next = Number.isNaN(details.valueAsNumber) ? null : details.valueAsNumber;
+			setDraft(details.value);
+			setDraftNumber(next);
+			commit(next);
+		}
+	}));
+	createEffect(on(current, (next) => {
+		if (next === draftNumber()) return;
+		setDraft(format(next));
+		setDraftNumber(next);
+	}, { defer: true }));
+	createEffect(() => {
+		props.form;
+	});
+	const inputAttributes = mergeProps(() => {
+		const { onKeyDown: _keyDown, onBeforeInput: _beforeInput, onInput: _input, onFocusOut: _focusOut, value: _value, ...attributes } = api().getInputProps();
+		return attributes;
+	});
+	return createComponent(NumberInput$1.RootProvider, {
+		value: api,
+		get ["class"]() {
+			return classes("dds-number-input", props.class);
+		},
+		get ["data-label-placement"]() {
+			return props.labelPlacement ?? "outside";
+		},
+		get ["data-readonly"]() {
+			return props.readOnly ? "" : void 0;
+		},
+		get ["data-stepper"]() {
+			return props.stepper === false ? void 0 : "";
+		},
+		get children() {
+			return [
+				createComponent(Show, {
+					get when() {
+						return props.label;
+					},
+					get children() {
+						return createComponent(NumberInput$1.Label, {
+							"class": "dds-number-input__label",
+							get children() {
+								return props.label;
+							}
+						});
+					}
+				}),
+				createComponent(NumberInput$1.Control, {
+					"class": "dds-number-input__control",
+					get children() {
+						return [
+							ssrElement("input", mergeProps$1(inputAttributes, {
+								"class": "dds-number-input__field",
+								get value() {
+									return draft();
+								},
+								get placeholder() {
+									return props.placeholder;
+								},
+								get ["aria-label"]() {
+									return props.label ? void 0 : props["aria-label"];
+								},
+								get ["aria-labelledby"]() {
+									return props.label ? void 0 : props["aria-labelledby"];
+								},
+								get ["aria-describedby"]() {
+									return describedBy(props.suffix ? suffixId() : void 0, props["aria-describedby"]);
+								}
+							}), void 0, true),
+							createComponent(Show, {
+								get when() {
+									return props.suffix;
+								},
+								get children() {
+									return ssr(_tmpl$3, ssrHydrationKey() + ssrAttribute("id", escape(suffixId(), true), false), escape(props.suffix));
+								}
+							}),
+							createComponent(Show, {
+								get when() {
+									return props.stepper !== false;
+								},
+								get children() {
+									return ssr(_tmpl$4, ssrHydrationKey(), escape(createComponent(NumberInput$1.DecrementTrigger, {
+										"class": "dds-number-input__step",
+										get children() {
+											return createComponent(StepIcon, { path: MINUS });
+										}
+									})), escape(createComponent(NumberInput$1.IncrementTrigger, {
+										"class": "dds-number-input__step",
+										get children() {
+											return createComponent(StepIcon, { path: PLUS });
+										}
+									})));
+								}
+							})
+						];
+					}
+				}),
+				ssr(_tmpl$5, ssrHydrationKey(), ssrAttribute("name", escape(props.name, true), false) + ssrAttribute("form", escape(props.form, true), false) + ssrAttribute("value", draftNumber() === null ? "" : escape(String(draftNumber()), true), false), ssrAttribute("disabled", props.disabled, true))
+			];
+		}
+	});
+}
+//#endregion
+export { NumberInput, normalizeNumberText, numberInputMessages };
+
+//# sourceMappingURL=number-input.server.js.map

package/dist/number-input.server.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-input.server.js","names":["NumberInput","ArkNumberInput","useNumberInput","createEffect","createMemo","createSignal","createUniqueId","mergeProps","on","onCleanup","Show","isKorean","useDirection","Direction","classes","describedBy","NumberInputMessages","decrease","increase","numberInputMessages","locale","messages","Required","ko","NumberInputProps","value","defaultValue","onValueChange","next","min","max","step","formatOptions","Intl","NumberFormatOptions","stepper","suffix","label","labelPlacement","id","name","form","required","disabled","readOnly","invalid","placeholder","dir","class","MINUS","PLUS","StepIcon","props","path","_$ssr","_tmpl$","_$ssrHydrationKey","_$escape","map","d","_tmpl$2","_$ssrAttribute","FULL_WIDTH","Record","normalizeNumberText","text","replace","char","String","fromCharCode","charCodeAt","separators","formatter","NumberFormat","parts","formatToParts","find","type","part","affixes","Set","includes","add","group","decimal","minus","generated","suffixId","maximumFractionDigits","syntax","fractions","resolvedOptions","format","Number","isFinite","controlled","undefined","internal","setInternal","current","draft","setDraft","draftNumber","setDraftNumber","outOfRange","root","HTMLDivElement","input","HTMLInputElement","composing","resetting","direction","commit","api","ids","allowMouseWheel","clampValueOnBlur","spinOnPress","inputMode","const","translations","decrementLabel","incrementLabel","valueText","details","isNaN","valueAsNumber","defer","reset","event","Event","setTimeout","defaultPrevented","addEventListener","capture","removeEventListener","inputAttributes","onKeyDown","_keyDown","onBeforeInput","_beforeInput","onInput","_input","onFocusOut","_focusOut","_value","attributes","getInputProps","zag","acceptable","decimals","trim","has","stepBy","delta","Math","setValue","_$createComponent","RootProvider","data-label-placement","data-readonly","data-stepper","children","when","Label","Control","_$ssrElement","_$mergeProps","aria-label","aria-labelledby","aria-describedby","_tmpl$3","_tmpl$4","DecrementTrigger","IncrementTrigger","_tmpl$5"],"sources":["../src/number-input.tsx"],"sourcesContent":["import {\n  NumberInput as ArkNumberInput,\n  useNumberInput,\n} from \"@ark-ui/solid/number-input\";\nimport {\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  mergeProps,\n  on,\n  onCleanup,\n  Show,\n} from \"solid-js\";\nimport { isKorean } from \"./date-only\";\nimport { useDirection, type Direction } from \"./direction\";\nimport { classes, describedBy } from \"./utils\";\n\nexport interface NumberInputMessages {\n  /** Accessible name of the − button. */\n  decrease?: string;\n  /** Accessible name of the + button. */\n  increase?: string;\n}\n\nexport function numberInputMessages(\n  locale: string,\n  messages: NumberInputMessages = {},\n): Required<NumberInputMessages> {\n  const ko = isKorean(locale);\n  return {\n    decrease: ko ? \"값 줄이기\" : \"Decrease\",\n    increase: ko ? \"값 늘리기\" : \"Increase\",\n    ...messages,\n  };\n}\n\nexport interface NumberInputProps {\n  /** null means empty. Controlled when not undefined. */\n  value?: number | null;\n  defaultValue?: number | null;\n  /** Called with the new number, or null when emptied, only after a user change. */\n  onValueChange?: (next: number | null) => void;\n  min?: number;\n  max?: number;\n  /** Arrow keys and the stepper buttons move by step; PageUp/PageDown by ten steps. */\n  step?: number;\n  /** Formatting and parsing locale. Defaults to ko-KR. */\n  locale?: string;\n  /** Defaults to whole numbers with thousands separators. */\n  formatOptions?: Intl.NumberFormatOptions;\n  /** Show the − / + buttons. Defaults to true. */\n  stepper?: boolean;\n  /** Unit shown after the digits, for example 원, 개 or 분. */\n  suffix?: string;\n  label?: string;\n  labelPlacement?: \"outside\" | \"hidden\";\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  id?: string;\n  /** Submits the plain number (1234.5), never the formatted text. */\n  name?: string;\n  form?: string;\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  /** Also invalid on its own while the number is outside min/max. */\n  invalid?: boolean;\n  placeholder?: string;\n  messages?: NumberInputMessages;\n  dir?: Direction;\n  class?: string;\n}\n\n// Inlined from @devslab/dds-icons (minus/plus): importing the shared Icon here\n// would move the whole icon set into a chunk shared with the root entry.\nconst MINUS = [\"M5 12h14\"];\nconst PLUS = [\"M12 5v14\", \"M5 12h14\"];\nfunction StepIcon(props: { path: string[] }) {\n  return (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n      {props.path.map((d) => <path d={d} />)}\n    </svg>\n  );\n}\n\nconst FULL_WIDTH: Record<string, string> = {\n  \"，\": \",\",\n  \"．\": \".\",\n  \"－\": \"-\",\n  \"−\": \"-\",\n};\n/** Full-width digits from Japanese/Chinese IMEs become ASCII; other text is left for validation. */\nexport function normalizeNumberText(text: string) {\n  return text.replace(/[０-９，．－−]/g, (char) =>\n    char >= \"０\" && char <= \"９\"\n      ? String.fromCharCode(char.charCodeAt(0) - 0xff10 + 48)\n      : FULL_WIDTH[char]!,\n  );\n}\n\nfunction separators(formatter: Intl.NumberFormat) {\n  const parts = [\n    ...formatter.formatToParts(-1234567.5),\n    ...formatter.formatToParts(1234567.5),\n  ];\n  const find = (type: string) => parts.find((part) => part.type === type)?.value;\n  const affixes = new Set<string>();\n  for (const part of parts)\n    if (![\"integer\", \"group\", \"decimal\", \"fraction\", \"minusSign\"].includes(part.type))\n      for (const char of part.value) affixes.add(char);\n  return {\n    group: find(\"group\") ?? \"\",\n    decimal: find(\"decimal\") ?? \".\",\n    minus: find(\"minusSign\") ?? \"-\",\n    affixes,\n  };\n}\n\n/**\n * A localized number field. Values are numbers (or null for empty); display\n * text is formatted with Intl and never leaves the component.\n */\nexport function NumberInput(props: NumberInputProps) {\n  const generated = createUniqueId();\n  const id = () => props.id ?? `dds-number-input-${generated}`;\n  const suffixId = () => `${id()}-suffix`;\n  const locale = () => props.locale ?? \"ko-KR\";\n  const messages = () => numberInputMessages(locale(), props.messages);\n  const formatOptions = createMemo<Intl.NumberFormatOptions>(\n    () => props.formatOptions ?? { maximumFractionDigits: 0 },\n  );\n  const formatter = createMemo(\n    () => new Intl.NumberFormat(locale(), formatOptions()),\n  );\n  const syntax = createMemo(() => separators(formatter()));\n  const fractions = () =>\n    (formatter().resolvedOptions().maximumFractionDigits ?? 0) > 0;\n  const format = (next: number | null) =>\n    next === null || !Number.isFinite(next) ? \"\" : formatter().format(next);\n\n  const controlled = () => props.value !== undefined;\n  const [internal, setInternal] = createSignal<number | null>(\n    props.defaultValue ?? null,\n  );\n  const current = () => (controlled() ? (props.value ?? null) : internal());\n  // draft is the text in the field; draftNumber is what that text means.\n  const [draft, setDraft] = createSignal(format(current()));\n  const [draftNumber, setDraftNumber] = createSignal(current());\n  const outOfRange = () => {\n    const next = draftNumber();\n    return (\n      next !== null &&\n      ((props.min !== undefined && next < props.min) ||\n        (props.max !== undefined && next > props.max))\n    );\n  };\n  const invalid = () => !!props.invalid || outOfRange();\n\n  let root: HTMLDivElement | undefined;\n  let input: HTMLInputElement | undefined;\n  let composing = false;\n  let resetting = false;\n  const direction = useDirection(() => root, () => props.dir);\n\n  const commit = (next: number | null) => {\n    if (next === current()) return;\n    if (!controlled()) setInternal(next);\n    props.onValueChange?.(next);\n  };\n\n  const api = useNumberInput(() => ({\n    id: `${id()}-root`,\n    // Zag prefixes part IDs with \"number-input:\"; pin the two DDS documents.\n    ids: { root: `${id()}-root`, input: id() },\n    dir: direction(),\n    locale: locale(),\n    formatOptions: formatOptions(),\n    value: draft(),\n    step: props.step ?? 1,\n    // Unset bounds stay absent: Zag's defaults are the safe-integer limits.\n    ...(props.min !== undefined ? { min: props.min } : {}),\n    ...(props.max !== undefined ? { max: props.max } : {}),\n    allowMouseWheel: false,\n    clampValueOnBlur: true,\n    spinOnPress: true,\n    inputMode: fractions() ? (\"decimal\" as const) : (\"numeric\" as const),\n    disabled: props.disabled,\n    readOnly: props.readOnly,\n    required: props.required,\n    invalid: invalid(),\n    translations: {\n      decrementLabel: messages().decrease,\n      incrementLabel: messages().increase,\n      valueText: (text: string) =>\n        text && props.suffix ? `${text} ${props.suffix}` : text,\n    },\n    onValueChange: (details) => {\n      if (resetting) return;\n      const next = Number.isNaN(details.valueAsNumber)\n        ? null\n        : details.valueAsNumber;\n      setDraft(details.value);\n      setDraftNumber(next);\n      commit(next);\n    },\n  }));\n\n  // A parent-owned value that changes from outside replaces the field text.\n  createEffect(\n    on(\n      current,\n      (next) => {\n        if (next === draftNumber()) return;\n        setDraft(format(next));\n        setDraftNumber(next);\n      },\n      { defer: true },\n    ),\n  );\n\n  createEffect(() => {\n    void props.form;\n    const form = input?.form;\n    if (!form) return;\n    const reset = (event: Event) => {\n      resetting = true;\n      // A task, not a microtask: after a reset-button click, microtasks run\n      // before the browser resets the controls and would be overwritten.\n      setTimeout(() => {\n        resetting = false;\n        if (event.defaultPrevented) return;\n        if (!controlled()) setInternal(props.defaultValue ?? null);\n        setDraft(format(current()));\n        setDraftNumber(current());\n        if (input) input.value = draft();\n      });\n    };\n    // Capture runs before Zag's own reset listener, which would emit a change.\n    form.addEventListener(\"reset\", reset, { capture: true });\n    onCleanup(() => form.removeEventListener(\"reset\", reset, { capture: true }));\n  });\n\n  // Keep everything from Zag except the handlers DDS composes below.\n  const inputAttributes = mergeProps(() => {\n    const {\n      onKeyDown: _keyDown,\n      onBeforeInput: _beforeInput,\n      onInput: _input,\n      onFocusOut: _focusOut,\n      value: _value,\n      ...attributes\n    } = api().getInputProps() as Record<string, unknown>;\n    return attributes;\n  });\n  const zag = () =>\n    api().getInputProps() as Record<string, ((event: Event) => void) | undefined>;\n\n  const acceptable = (text: string) => {\n    const { group, decimal, minus, affixes } = syntax();\n    let decimals = 0;\n    for (const char of text) {\n      if (char >= \"0\" && char <= \"9\") continue;\n      if (char === group || (group.trim() === \"\" && char === \" \")) continue;\n      if (char === decimal) {\n        decimals += 1;\n        if (!fractions() || decimals > 1) return false;\n        continue;\n      }\n      if (char === minus || char === \"-\") {\n        if (props.min !== undefined && props.min >= 0) return false;\n        continue;\n      }\n      if (affixes.has(char)) continue;\n      return false;\n    }\n    return true;\n  };\n\n  const stepBy = (delta: number) => {\n    let next = (draftNumber() ?? 0) + delta;\n    if (props.min !== undefined) next = Math.max(props.min, next);\n    if (props.max !== undefined) next = Math.min(props.max, next);\n    api().setValue(next);\n  };\n\n  return (\n    <ArkNumberInput.RootProvider\n      ref={root}\n      value={api}\n      class={classes(\"dds-number-input\", props.class)}\n      data-label-placement={props.labelPlacement ?? \"outside\"}\n      data-readonly={props.readOnly ? \"\" : undefined}\n      data-stepper={props.stepper === false ? undefined : \"\"}\n    >\n      <Show when={props.label}>\n        <ArkNumberInput.Label class=\"dds-number-input__label\">\n          {props.label}\n        </ArkNumberInput.Label>\n      </Show>\n      <ArkNumberInput.Control class=\"dds-number-input__control\">\n        <input\n          {...inputAttributes}\n          ref={input}\n          class=\"dds-number-input__field\"\n          value={draft()}\n          placeholder={props.placeholder}\n          aria-label={props.label ? undefined : props[\"aria-label\"]}\n          aria-labelledby={props.label ? undefined : props[\"aria-labelledby\"]}\n          aria-describedby={describedBy(\n            props.suffix ? suffixId() : undefined,\n            props[\"aria-describedby\"],\n          )}\n          onCompositionStart={() => {\n            composing = true;\n          }}\n          onCompositionEnd={(event) => {\n            composing = false;\n            // Hand the finished composition to the normal input path.\n            event.currentTarget.dispatchEvent(\n              new InputEvent(\"input\", { bubbles: true }),\n            );\n          }}\n          onBeforeInput={(event) => {\n            if (composing || event.isComposing) return;\n            const target = event.currentTarget;\n            const data = normalizeNumberText(event.data ?? \"\");\n            const next =\n              target.value.slice(0, target.selectionStart ?? target.value.length) +\n              data +\n              target.value.slice(target.selectionEnd ?? target.value.length);\n            if (!acceptable(normalizeNumberText(next))) event.preventDefault();\n          }}\n          onInput={(event) => {\n            if (composing) return;\n            const target = event.currentTarget;\n            const normalized = normalizeNumberText(target.value);\n            if (!acceptable(normalized)) {\n              // Letters, pasted units and the like are refused, not guessed at.\n              target.value = draft();\n              return;\n            }\n            if (normalized !== target.value) {\n              const start = target.selectionStart;\n              const end = target.selectionEnd;\n              target.value = normalized;\n              target.setSelectionRange(start, end);\n            }\n            zag().onInput?.(event);\n          }}\n          onKeyDown={(event) => {\n            if (props.readOnly || props.disabled) return;\n            if (event.isComposing || event.keyCode === 229) return;\n            const step = props.step ?? 1;\n            if (event.key === \"PageUp\" || event.key === \"PageDown\") {\n              event.preventDefault();\n              stepBy((event.key === \"PageUp\" ? 10 : -10) * step);\n              return;\n            }\n            // Home/End jump to a bound only when that bound exists;\n            // otherwise they keep moving the caret.\n            if (event.key === \"Home\" && props.min === undefined) return;\n            if (event.key === \"End\" && props.max === undefined) return;\n            zag().onKeyDown?.(event);\n          }}\n          onFocusOut={(event) => {\n            zag().onFocusOut?.(event);\n            // A parent that declined the typed number gets its own value back.\n            if (controlled() && draftNumber() !== current()) {\n              setDraft(format(current()));\n              setDraftNumber(current());\n            }\n          }}\n        />\n        <Show when={props.suffix}>\n          <span id={suffixId()} class=\"dds-number-input__suffix\">\n            {props.suffix}\n          </span>\n        </Show>\n        <Show when={props.stepper !== false}>\n          <span class=\"dds-number-input__steppers\">\n            <ArkNumberInput.DecrementTrigger class=\"dds-number-input__step\">\n              <StepIcon path={MINUS} />\n            </ArkNumberInput.DecrementTrigger>\n            <ArkNumberInput.IncrementTrigger class=\"dds-number-input__step\">\n              <StepIcon path={PLUS} />\n            </ArkNumberInput.IncrementTrigger>\n          </span>\n        </Show>\n      </ArkNumberInput.Control>\n      <input\n        type=\"hidden\"\n        name={props.name}\n        form={props.form}\n        value={draftNumber() === null ? \"\" : String(draftNumber())}\n        disabled={props.disabled}\n      />\n    </ArkNumberInput.RootProvider>\n  );\n}\n"],"mappings":"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"}

package/dist/segmented-control.d.ts

@@ -0,0 +1,40 @@
+import { type Direction } from "./direction";
+export interface SegmentedControlItem {
+    /** Nonempty ID, unique within the control. This is what callbacks and forms receive. */
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+export interface SegmentedControlProps {
+    items: readonly SegmentedControlItem[];
+    value?: string;
+    defaultValue?: string;
+    /** Called with the chosen item ID, only after a user choice. */
+    onValueChange?: (value: string) => void;
+    /** Visible group label. Without it, supply aria-label or aria-labelledby. */
+    label?: string;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    "aria-describedby"?: string;
+    id?: string;
+    name?: string;
+    form?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    invalid?: boolean;
+    /** md is 40px tall like other DDS controls, sm is 32px. */
+    size?: "md" | "sm";
+    /** Segments share the available width equally instead of sizing to their labels. */
+    fullWidth?: boolean;
+    dir?: Direction;
+    class?: string;
+}
+export declare function validateSegmentedItems(items: readonly SegmentedControlItem[]): void;
+/**
+ * Single choice among a few visible options (view switch, filter).
+ * Radio-group semantics come from Ark: one tab stop, arrow keys move and select,
+ * and each segment submits through a native radio input.
+ */
+export declare function SegmentedControl(props: SegmentedControlProps): import("solid-js").JSX.Element;
+//# sourceMappingURL=segmented-control.d.ts.map

package/dist/segmented-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.d.ts","sourceRoot":"","sources":["../src/segmented-control.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAgB,KAAK,SAAS,EAAE,MAAM,aAAa,CAAC;AAI3D,MAAM,WAAW,oBAAoB;IACnC,wFAAwF;IACxF,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,SAAS,oBAAoB,EAAE,CAAC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,SAAS,oBAAoB,EAAE,QAW5E;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,kCAoF5D"}

package/dist/segmented-control.js

@@ -0,0 +1,133 @@
+import { t as e } from "./utils-oKxhg9RG.js";
+import { t } from "./direction-CS85IDNU.js";
+import { n } from "./choice-types-kSaEnZPr.js";
+import { For as r, Show as i, createEffect as a, createUniqueId as o } from "solid-js";
+import { createComponent as s, getNextElement as c, insert as l, memo as u, template as d } from "solid-js/web";
+import { SegmentGroup as f } from "@ark-ui/solid/segment-group";
+//#region src/segmented-control.tsx
+var p = /*#__PURE__*/ d("<div class=dds-segmented__track>");
+function m(e) {
+	if (e.length === 0) throw Error("DDS SegmentedControl: items must not be empty");
+	let t = /* @__PURE__ */ new Set();
+	for (let n of e) {
+		if (!n.value || t.has(n.value)) throw Error(`DDS SegmentedControl: item values must be nonempty and unique (${JSON.stringify(n.value)})`);
+		t.add(n.value);
+	}
+}
+function h(d) {
+	let h = o(), g, _ = t(() => g, () => d.dir), v = d.value ?? d.defaultValue;
+	return a(() => m(d.items)), a(() => {
+		n() && !d.label && !d["aria-label"] && !d["aria-labelledby"] && console.warn("DDS SegmentedControl: supply label, aria-label or aria-labelledby.");
+	}), s(f.Root, {
+		ref(e) {
+			var t = g;
+			typeof t == "function" ? t(e) : g = e;
+		},
+		get id() {
+			return d.id ?? `dds-segmented-${h}`;
+		},
+		get ids() {
+			return u(() => !!d.id)() ? { root: d.id } : void 0;
+		},
+		get dir() {
+			return _();
+		},
+		orientation: "horizontal",
+		get value() {
+			return d.value;
+		},
+		get defaultValue() {
+			return d.defaultValue;
+		},
+		get name() {
+			return d.name;
+		},
+		get form() {
+			return d.form;
+		},
+		get required() {
+			return d.required;
+		},
+		get disabled() {
+			return d.disabled;
+		},
+		get readOnly() {
+			return d.readOnly;
+		},
+		get invalid() {
+			return d.invalid;
+		},
+		onValueChange: (e) => {
+			e.value !== null && d.onValueChange?.(e.value);
+		},
+		get "aria-label"() {
+			return u(() => !!d.label)() ? void 0 : d["aria-label"];
+		},
+		get "aria-labelledby"() {
+			return u(() => !!d.label)() ? void 0 : d["aria-labelledby"] ?? null;
+		},
+		get "aria-describedby"() {
+			return d["aria-describedby"];
+		},
+		get class() {
+			return e("dds-segmented", d.class);
+		},
+		get "data-size"() {
+			return d.size ?? "md";
+		},
+		get "data-full-width"() {
+			return d.fullWidth ? "" : void 0;
+		},
+		get children() {
+			return [s(i, {
+				get when() {
+					return d.label;
+				},
+				get children() {
+					return s(f.Label, {
+						class: "dds-segmented__label",
+						get children() {
+							return d.label;
+						}
+					});
+				}
+			}), (() => {
+				var e = c(p);
+				return l(e, s(r, {
+					get each() {
+						return d.items;
+					},
+					children: (e) => s(f.Item, {
+						get value() {
+							return e.value;
+						},
+						get disabled() {
+							return e.disabled;
+						},
+						class: "dds-segmented__item",
+						get title() {
+							return u(() => !!d.fullWidth)() ? e.label : void 0;
+						},
+						get children() {
+							return [s(f.ItemText, {
+								class: "dds-segmented__text",
+								get "data-text"() {
+									return e.label;
+								},
+								get children() {
+									return e.label;
+								}
+							}), s(f.ItemHiddenInput, { ref: (t) => {
+								t.defaultChecked = v === e.value;
+							} })];
+						}
+					})
+				})), e;
+			})()];
+		}
+	});
+}
+//#endregion
+export { h as SegmentedControl, m as validateSegmentedItems };
+
+//# sourceMappingURL=segmented-control.js.map

package/dist/segmented-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.js","names":["SegmentGroup","createEffect","createUniqueId","For","Show","useDirection","Direction","choiceWarningsEnabled","classes","SegmentedControlItem","value","label","disabled","SegmentedControlProps","items","defaultValue","onValueChange","id","name","form","required","readOnly","invalid","size","fullWidth","dir","class","validateSegmentedItems","length","Error","ids","Set","item","has","JSON","stringify","add","SegmentedControl","props","generated","root","HTMLDivElement","direction","initialValue","console","warn","_$createComponent","Root","ref","r$","_ref$","_$memo","undefined","orientation","details","aria-label","aria-labelledby","aria-describedby","data-size","data-full-width","children","when","Label","_el$","_$getNextElement","_tmpl$","_$insert","each","Item","title","ItemText","data-text","ItemHiddenInput","input","defaultChecked"],"sources":["../src/segmented-control.tsx"],"sourcesContent":["import { SegmentGroup } from \"@ark-ui/solid/segment-group\";\nimport { createEffect, createUniqueId, For, Show } from \"solid-js\";\nimport { useDirection, type Direction } from \"./direction\";\nimport { choiceWarningsEnabled } from \"./choice-types\";\nimport { classes } from \"./utils\";\n\nexport interface SegmentedControlItem {\n  /** Nonempty ID, unique within the control. This is what callbacks and forms receive. */\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\nexport interface SegmentedControlProps {\n  items: readonly SegmentedControlItem[];\n  value?: string;\n  defaultValue?: string;\n  /** Called with the chosen item ID, only after a user choice. */\n  onValueChange?: (value: string) => void;\n  /** Visible group label. Without it, supply aria-label or aria-labelledby. */\n  label?: string;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  id?: string;\n  name?: string;\n  form?: string;\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  invalid?: boolean;\n  /** md is 40px tall like other DDS controls, sm is 32px. */\n  size?: \"md\" | \"sm\";\n  /** Segments share the available width equally instead of sizing to their labels. */\n  fullWidth?: boolean;\n  dir?: Direction;\n  class?: string;\n}\n\nexport function validateSegmentedItems(items: readonly SegmentedControlItem[]) {\n  if (items.length === 0)\n    throw new Error(\"DDS SegmentedControl: items must not be empty\");\n  const ids = new Set<string>();\n  for (const item of items) {\n    if (!item.value || ids.has(item.value))\n      throw new Error(\n        `DDS SegmentedControl: item values must be nonempty and unique (${JSON.stringify(item.value)})`,\n      );\n    ids.add(item.value);\n  }\n}\n\n/**\n * Single choice among a few visible options (view switch, filter).\n * Radio-group semantics come from Ark: one tab stop, arrow keys move and select,\n * and each segment submits through a native radio input.\n */\nexport function SegmentedControl(props: SegmentedControlProps) {\n  // Ark derives every part ID (label, radios) from the root ID; an undefined\n  // id prop would override its generated one and collide across instances.\n  const generated = createUniqueId();\n  let root: HTMLDivElement | undefined;\n  const direction = useDirection(() => root, () => props.dir);\n  const initialValue = props.value ?? props.defaultValue;\n  createEffect(() => validateSegmentedItems(props.items));\n  createEffect(() => {\n    if (\n      choiceWarningsEnabled() &&\n      !props.label &&\n      !props[\"aria-label\"] &&\n      !props[\"aria-labelledby\"]\n    )\n      console.warn(\n        \"DDS SegmentedControl: supply label, aria-label or aria-labelledby.\",\n      );\n  });\n  return (\n    <SegmentGroup.Root\n      ref={root}\n      id={props.id ?? `dds-segmented-${generated}`}\n      // A consumer id lands on the group element itself, not on Zag's prefixed root ID.\n      ids={props.id ? { root: props.id } : undefined}\n      dir={direction()}\n      orientation=\"horizontal\"\n      value={props.value}\n      defaultValue={props.defaultValue}\n      name={props.name}\n      form={props.form}\n      required={props.required}\n      disabled={props.disabled}\n      readOnly={props.readOnly}\n      invalid={props.invalid}\n      onValueChange={(details) => {\n        if (details.value !== null) props.onValueChange?.(details.value);\n      }}\n      // Without a visible label the group is named by the consumer's attributes;\n      // Ark's own aria-labelledby would otherwise point at a label that is not rendered.\n      aria-label={props.label ? undefined : props[\"aria-label\"]}\n      // (null removes Ark's attribute; undefined would let it through the merge.)\n      aria-labelledby={\n        props.label\n          ? undefined\n          : ((props[\"aria-labelledby\"] ?? null) as unknown as string)\n      }\n      aria-describedby={props[\"aria-describedby\"]}\n      class={classes(\"dds-segmented\", props.class)}\n      data-size={props.size ?? \"md\"}\n      data-full-width={props.fullWidth ? \"\" : undefined}\n    >\n      <Show when={props.label}>\n        <SegmentGroup.Label class=\"dds-segmented__label\">\n          {props.label}\n        </SegmentGroup.Label>\n      </Show>\n      <div class=\"dds-segmented__track\">\n        <For each={props.items}>\n          {(item) => (\n            <SegmentGroup.Item\n              value={item.value}\n              disabled={item.disabled}\n              class=\"dds-segmented__item\"\n              title={props.fullWidth ? item.label : undefined}\n            >\n              <SegmentGroup.ItemText\n                class=\"dds-segmented__text\"\n                data-text={item.label}\n              >\n                {item.label}\n              </SegmentGroup.ItemText>\n              <SegmentGroup.ItemHiddenInput\n                ref={(input) => {\n                  // Native form reset returns to the first rendered choice.\n                  input.defaultChecked = initialValue === item.value;\n                }}\n              />\n            </SegmentGroup.Item>\n          )}\n        </For>\n      </div>\n    </SegmentGroup.Root>\n  );\n}\n"],"mappings":"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"}

package/dist/segmented-control.server.js

@@ -0,0 +1,138 @@
+import { t as classes } from "./assets/utils-Ou0UJRlO.js";
+import { t as useDirection } from "./assets/direction-BpTqmXs-.js";
+import { n as choiceWarningsEnabled } from "./assets/choice-types-h4YVL8xH.js";
+import { For, Show, createEffect, createUniqueId } from "solid-js";
+import { createComponent, escape, memo, ssr, ssrHydrationKey } from "solid-js/web";
+import { SegmentGroup } from "@ark-ui/solid/segment-group";
+//#region src/segmented-control.tsx
+var _tmpl$ = [
+	"<div",
+	" class=\"dds-segmented__track\">",
+	"</div>"
+];
+function validateSegmentedItems(items) {
+	if (items.length === 0) throw new Error("DDS SegmentedControl: items must not be empty");
+	const ids = /* @__PURE__ */ new Set();
+	for (const item of items) {
+		if (!item.value || ids.has(item.value)) throw new Error(`DDS SegmentedControl: item values must be nonempty and unique (${JSON.stringify(item.value)})`);
+		ids.add(item.value);
+	}
+}
+/**
+* Single choice among a few visible options (view switch, filter).
+* Radio-group semantics come from Ark: one tab stop, arrow keys move and select,
+* and each segment submits through a native radio input.
+*/
+function SegmentedControl(props) {
+	const generated = createUniqueId();
+	let root;
+	const direction = useDirection(() => root, () => props.dir);
+	props.value ?? props.defaultValue;
+	createEffect(() => validateSegmentedItems(props.items));
+	createEffect(() => {
+		if (choiceWarningsEnabled() && !props.label && !props["aria-label"] && !props["aria-labelledby"]) console.warn("DDS SegmentedControl: supply label, aria-label or aria-labelledby.");
+	});
+	return createComponent(SegmentGroup.Root, {
+		get id() {
+			return props.id ?? `dds-segmented-${generated}`;
+		},
+		get ids() {
+			return memo(() => !!props.id)() ? { root: props.id } : void 0;
+		},
+		get dir() {
+			return direction();
+		},
+		orientation: "horizontal",
+		get value() {
+			return props.value;
+		},
+		get defaultValue() {
+			return props.defaultValue;
+		},
+		get name() {
+			return props.name;
+		},
+		get form() {
+			return props.form;
+		},
+		get required() {
+			return props.required;
+		},
+		get disabled() {
+			return props.disabled;
+		},
+		get readOnly() {
+			return props.readOnly;
+		},
+		get invalid() {
+			return props.invalid;
+		},
+		onValueChange: (details) => {
+			if (details.value !== null) props.onValueChange?.(details.value);
+		},
+		get ["aria-label"]() {
+			return memo(() => !!props.label)() ? void 0 : props["aria-label"];
+		},
+		get ["aria-labelledby"]() {
+			return memo(() => !!props.label)() ? void 0 : props["aria-labelledby"] ?? null;
+		},
+		get ["aria-describedby"]() {
+			return props["aria-describedby"];
+		},
+		get ["class"]() {
+			return classes("dds-segmented", props.class);
+		},
+		get ["data-size"]() {
+			return props.size ?? "md";
+		},
+		get ["data-full-width"]() {
+			return props.fullWidth ? "" : void 0;
+		},
+		get children() {
+			return [createComponent(Show, {
+				get when() {
+					return props.label;
+				},
+				get children() {
+					return createComponent(SegmentGroup.Label, {
+						"class": "dds-segmented__label",
+						get children() {
+							return props.label;
+						}
+					});
+				}
+			}), ssr(_tmpl$, ssrHydrationKey(), escape(createComponent(For, {
+				get each() {
+					return props.items;
+				},
+				children: (item) => createComponent(SegmentGroup.Item, {
+					get value() {
+						return item.value;
+					},
+					get disabled() {
+						return item.disabled;
+					},
+					"class": "dds-segmented__item",
+					get title() {
+						return memo(() => !!props.fullWidth)() ? item.label : void 0;
+					},
+					get children() {
+						return [createComponent(SegmentGroup.ItemText, {
+							"class": "dds-segmented__text",
+							get ["data-text"]() {
+								return item.label;
+							},
+							get children() {
+								return item.label;
+							}
+						}), createComponent(SegmentGroup.ItemHiddenInput, {})];
+					}
+				})
+			})))];
+		}
+	});
+}
+//#endregion
+export { SegmentedControl, validateSegmentedItems };
+
+//# sourceMappingURL=segmented-control.server.js.map

package/dist/segmented-control.server.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.server.js","names":["SegmentGroup","createEffect","createUniqueId","For","Show","useDirection","Direction","choiceWarningsEnabled","classes","SegmentedControlItem","value","label","disabled","SegmentedControlProps","items","defaultValue","onValueChange","id","name","form","required","readOnly","invalid","size","fullWidth","dir","class","validateSegmentedItems","length","Error","ids","Set","item","has","JSON","stringify","add","SegmentedControl","props","generated","root","HTMLDivElement","direction","initialValue","console","warn","_$createComponent","Root","_$memo","undefined","orientation","details","aria-label","aria-labelledby","aria-describedby","data-size","data-full-width","children","when","Label","_$ssr","_tmpl$","_$ssrHydrationKey","_$escape","each","Item","title","ItemText","data-text","ItemHiddenInput"],"sources":["../src/segmented-control.tsx"],"sourcesContent":["import { SegmentGroup } from \"@ark-ui/solid/segment-group\";\nimport { createEffect, createUniqueId, For, Show } from \"solid-js\";\nimport { useDirection, type Direction } from \"./direction\";\nimport { choiceWarningsEnabled } from \"./choice-types\";\nimport { classes } from \"./utils\";\n\nexport interface SegmentedControlItem {\n  /** Nonempty ID, unique within the control. This is what callbacks and forms receive. */\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\nexport interface SegmentedControlProps {\n  items: readonly SegmentedControlItem[];\n  value?: string;\n  defaultValue?: string;\n  /** Called with the chosen item ID, only after a user choice. */\n  onValueChange?: (value: string) => void;\n  /** Visible group label. Without it, supply aria-label or aria-labelledby. */\n  label?: string;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  id?: string;\n  name?: string;\n  form?: string;\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  invalid?: boolean;\n  /** md is 40px tall like other DDS controls, sm is 32px. */\n  size?: \"md\" | \"sm\";\n  /** Segments share the available width equally instead of sizing to their labels. */\n  fullWidth?: boolean;\n  dir?: Direction;\n  class?: string;\n}\n\nexport function validateSegmentedItems(items: readonly SegmentedControlItem[]) {\n  if (items.length === 0)\n    throw new Error(\"DDS SegmentedControl: items must not be empty\");\n  const ids = new Set<string>();\n  for (const item of items) {\n    if (!item.value || ids.has(item.value))\n      throw new Error(\n        `DDS SegmentedControl: item values must be nonempty and unique (${JSON.stringify(item.value)})`,\n      );\n    ids.add(item.value);\n  }\n}\n\n/**\n * Single choice among a few visible options (view switch, filter).\n * Radio-group semantics come from Ark: one tab stop, arrow keys move and select,\n * and each segment submits through a native radio input.\n */\nexport function SegmentedControl(props: SegmentedControlProps) {\n  // Ark derives every part ID (label, radios) from the root ID; an undefined\n  // id prop would override its generated one and collide across instances.\n  const generated = createUniqueId();\n  let root: HTMLDivElement | undefined;\n  const direction = useDirection(() => root, () => props.dir);\n  const initialValue = props.value ?? props.defaultValue;\n  createEffect(() => validateSegmentedItems(props.items));\n  createEffect(() => {\n    if (\n      choiceWarningsEnabled() &&\n      !props.label &&\n      !props[\"aria-label\"] &&\n      !props[\"aria-labelledby\"]\n    )\n      console.warn(\n        \"DDS SegmentedControl: supply label, aria-label or aria-labelledby.\",\n      );\n  });\n  return (\n    <SegmentGroup.Root\n      ref={root}\n      id={props.id ?? `dds-segmented-${generated}`}\n      // A consumer id lands on the group element itself, not on Zag's prefixed root ID.\n      ids={props.id ? { root: props.id } : undefined}\n      dir={direction()}\n      orientation=\"horizontal\"\n      value={props.value}\n      defaultValue={props.defaultValue}\n      name={props.name}\n      form={props.form}\n      required={props.required}\n      disabled={props.disabled}\n      readOnly={props.readOnly}\n      invalid={props.invalid}\n      onValueChange={(details) => {\n        if (details.value !== null) props.onValueChange?.(details.value);\n      }}\n      // Without a visible label the group is named by the consumer's attributes;\n      // Ark's own aria-labelledby would otherwise point at a label that is not rendered.\n      aria-label={props.label ? undefined : props[\"aria-label\"]}\n      // (null removes Ark's attribute; undefined would let it through the merge.)\n      aria-labelledby={\n        props.label\n          ? undefined\n          : ((props[\"aria-labelledby\"] ?? null) as unknown as string)\n      }\n      aria-describedby={props[\"aria-describedby\"]}\n      class={classes(\"dds-segmented\", props.class)}\n      data-size={props.size ?? \"md\"}\n      data-full-width={props.fullWidth ? \"\" : undefined}\n    >\n      <Show when={props.label}>\n        <SegmentGroup.Label class=\"dds-segmented__label\">\n          {props.label}\n        </SegmentGroup.Label>\n      </Show>\n      <div class=\"dds-segmented__track\">\n        <For each={props.items}>\n          {(item) => (\n            <SegmentGroup.Item\n              value={item.value}\n              disabled={item.disabled}\n              class=\"dds-segmented__item\"\n              title={props.fullWidth ? item.label : undefined}\n            >\n              <SegmentGroup.ItemText\n                class=\"dds-segmented__text\"\n                data-text={item.label}\n              >\n                {item.label}\n              </SegmentGroup.ItemText>\n              <SegmentGroup.ItemHiddenInput\n                ref={(input) => {\n                  // Native form reset returns to the first rendered choice.\n                  input.defaultChecked = initialValue === item.value;\n                }}\n              />\n            </SegmentGroup.Item>\n          )}\n        </For>\n      </div>\n    </SegmentGroup.Root>\n  );\n}\n"],"mappings":"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"}

package/dist/select-picker.js

@@ -1,4 +1,4 @@
-import { t as e } from "./choice-BPMiJlPJ.js";
+import { t as e } from "./choice-CTNeFOVo.js";
 import { createComponent as t, mergeProps as n } from "solid-js/web";
 //#region src/select-picker.tsx
 function r(r) {