@smwb/ui-solid 0.3.0 → 0.4.1

package/dist/headless/source/components/inputs/slider/slider.jsx

@@ -0,0 +1,404 @@
+import { For, Show, createSignal, mergeProps, onCleanup, onMount, splitProps } from "solid-js";
+import { isServer } from "solid-js/web";
+import cn from "clsx";
+import { rescale, toPercent, coordX, coordY } from "./utils";
+import { TextField, TextFieldWrapper } from "../textField";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function resolveMarks(marks, min, max, step) {
+  if (!marks) return [];
+  if (Array.isArray(marks)) return marks;
+  const s = step && step > 0 ? step : (max - min) / 10;
+  const result = [];
+  for (let v = min; v <= max + 1e-9; v += s) {
+    result.push({ value: Math.round(v * 1e6) / 1e6 });
+  }
+  return result;
+}
+function RangeSlider(props) {
+  const merged = mergeProps(
+    { min: 0, max: 100, disabled: false, size: "medium", color: "primary", orientation: "horizontal" },
+    props
+  );
+  const [local, rest] = splitProps(merged, [
+    "defaultValue",
+    "value",
+    "onChange",
+    "min",
+    "max",
+    "name",
+    "disabled",
+    "class",
+    "step",
+    "label",
+    "helperText",
+    "error",
+    "size",
+    "color",
+    "orientation",
+    "marks",
+    "getAriaValueText",
+    "aria-label",
+    "range",
+    "variant",
+    "valueField",
+    "withTicks",
+    "ref"
+  ]);
+  const isVertical = () => local.orientation === "vertical";
+  const normalize = (v) => {
+    const arr = Array.isArray(v) ? v : [local.min, local.max];
+    const lo = Math.min(arr[0] ?? local.min, arr[1] ?? local.max);
+    const hi = Math.max(arr[0] ?? local.min, arr[1] ?? local.max);
+    return [lo, hi];
+  };
+  const isControlled = local.value !== void 0;
+  const [valueState, setValueState] = createSignal(normalize(local.defaultValue));
+  const value = () => isControlled ? normalize(local.value) : valueState();
+  let containerEl;
+  let activeThumb = 0;
+  let isPressed = false;
+  const markList = () => resolveMarks(local.marks, local.min, local.max, local.step);
+  const positionToValue = (event) => {
+    const rect = containerEl?.getBoundingClientRect();
+    if (!rect) return local.min;
+    if (isVertical()) {
+      const y = coordY(event) - rect.top;
+      return rescale(rect.height - y, [0, rect.height], [local.min, local.max], { step: local.step });
+    }
+    const x = coordX(event) - rect.left;
+    return rescale(x, [0, rect.width], [local.min, local.max], { step: local.step });
+  };
+  const commit = (next, event) => {
+    const lo = Math.min(next[0], next[1]);
+    const hi = Math.max(next[0], next[1]);
+    const clamped = [Math.max(local.min, lo), Math.min(local.max, hi)];
+    if (!isControlled) setValueState(clamped);
+    local.onChange?.(event, clamped, props);
+  };
+  const moveThumb = (raw, event) => {
+    const current = value();
+    const next = [current[0], current[1]];
+    next[activeThumb] = Math.max(local.min, Math.min(local.max, raw));
+    commit(next, event);
+  };
+  const pickThumb = (raw) => {
+    const current = value();
+    activeThumb = Math.abs(raw - current[0]) <= Math.abs(raw - current[1]) ? 0 : 1;
+  };
+  const onMouseMove = (event) => {
+    if (!isPressed) return;
+    event.preventDefault();
+    moveThumb(positionToValue(event), event);
+  };
+  const onMouseEnd = () => {
+    isPressed = false;
+    if (isServer) return;
+    document.removeEventListener("mousemove", onMouseMove);
+    document.removeEventListener("mouseup", onMouseEnd);
+    document.removeEventListener("touchmove", onMouseMove);
+    document.removeEventListener("touchend", onMouseEnd);
+  };
+  const onMouseDown = (event) => {
+    if (local.disabled || event.button !== 0) return;
+    const raw = positionToValue(event);
+    pickThumb(raw);
+    isPressed = true;
+    moveThumb(raw, event);
+    document.addEventListener("mousemove", onMouseMove);
+    document.addEventListener("mouseup", onMouseEnd);
+  };
+  const onTouchStartNative = (event) => {
+    if (local.disabled) return;
+    const raw = positionToValue(event);
+    pickThumb(raw);
+    isPressed = true;
+    moveThumb(raw, event);
+    document.addEventListener("touchmove", onMouseMove);
+    document.addEventListener("touchend", onMouseEnd);
+  };
+  onMount(() => {
+    if (!containerEl) return;
+    containerEl.addEventListener("touchstart", onTouchStartNative);
+    onCleanup(() => containerEl?.removeEventListener("touchstart", onTouchStartNative));
+  });
+  onCleanup(onMouseEnd);
+  const onThumbKeyDown = (idx) => (event) => {
+    if (local.disabled) return;
+    const delta = local.step && local.step > 0 ? local.step : 1;
+    const current = value();
+    let next = null;
+    if (event.key === "ArrowLeft" || event.key === "ArrowDown") next = current[idx] - delta;
+    else if (event.key === "ArrowRight" || event.key === "ArrowUp") next = current[idx] + delta;
+    else if (event.key === "Home") next = local.min;
+    else if (event.key === "End") next = local.max;
+    if (next !== null) {
+      event.preventDefault();
+      activeThumb = idx;
+      moveThumb(next, event);
+    }
+  };
+  const classes = () => cn("smwb-slider", "smwb-slider--range", local.class, {
+    "smwb-slider--disabled": local.disabled,
+    "smwb-slider--vertical": isVertical()
+  }, local.size !== "medium" && `smwb-slider_size-${local.size}`, local.color !== "primary" && `smwb-slider_color-${local.color}`);
+  return <TextFieldWrapper label={local.label} helperText={local.helperText} disabled={local.disabled} error={local.error} fullWidth shrink>
+      <div class="smwb-slider__container">
+        <span ref={mergeRefs(local.ref, (el) => containerEl = el)} onMouseDown={onMouseDown} class={classes()} {...rest}>
+          <Show when={markList().length > 0}>
+            <span class="smwb-slider__marks" aria-hidden="true">
+              <For each={markList()}>
+                {(m) => <span class="smwb-slider__mark" style={isVertical() ? { bottom: `${toPercent(m.value, local.min, local.max)}%` } : { left: `${toPercent(m.value, local.min, local.max)}%` }}>
+                    <Show when={m.label != null}>
+                      <span class="smwb-slider__mark-label">{m.label}</span>
+                    </Show>
+                  </span>}
+              </For>
+            </span>
+          </Show>
+          <span class="smwb-slider__rail" />
+          <span
+    class="smwb-slider__track"
+    style={(() => {
+      const p0 = toPercent(value()[0], local.min, local.max);
+      const p1 = toPercent(value()[1], local.min, local.max);
+      const startPct = `${Math.min(p0, p1)}%`;
+      const spanPct = `${Math.abs(p1 - p0)}%`;
+      return isVertical() ? { bottom: startPct, height: spanPct } : { left: startPct, width: spanPct };
+    })()}
+  />
+          <For each={[0, 1]}>
+            {(idx) => <span
+    class={cn("smwb-slider__thumb", `smwb-slider__thumb--${idx === 0 ? "start" : "end"}`)}
+    style={isVertical() ? { bottom: `${toPercent(value()[idx], local.min, local.max)}%` } : { left: `${toPercent(value()[idx], local.min, local.max)}%` }}
+  >
+                <input
+    data-testid={`slider-input-${idx}`}
+    class="smwb-slider__input"
+    type="range"
+    min={local.min}
+    max={local.max}
+    step={local.step}
+    name={local.name ? `${local.name}[${idx}]` : void 0}
+    value={value()[idx]}
+    disabled={local.disabled}
+    onChange={() => void 0}
+    onKeyDown={onThumbKeyDown(idx)}
+    tabindex={local.disabled ? -1 : 0}
+    aria-label={local["aria-label"] ? `${local["aria-label"]} ${idx === 0 ? "minimum" : "maximum"}` : void 0}
+    aria-orientation={local.orientation}
+    aria-valuenow={value()[idx]}
+    aria-valuemin={idx === 0 ? local.min : value()[0]}
+    aria-valuemax={idx === 0 ? value()[1] : local.max}
+    aria-valuetext={local.getAriaValueText ? local.getAriaValueText(value()[idx]) : void 0}
+    aria-disabled={local.disabled || void 0}
+  />
+              </span>}
+          </For>
+        </span>
+      </div>
+    </TextFieldWrapper>;
+}
+function SingleSlider(props) {
+  const merged = mergeProps(
+    {
+      min: 0,
+      max: 100,
+      disabled: false,
+      variant: "continuous",
+      size: "medium",
+      color: "primary",
+      orientation: "horizontal"
+    },
+    props
+  );
+  const [local, rest] = splitProps(merged, [
+    "defaultValue",
+    "value",
+    "onChange",
+    "min",
+    "max",
+    "name",
+    "disabled",
+    "class",
+    "step",
+    "variant",
+    "valueField",
+    "withTicks",
+    "label",
+    "helperText",
+    "error",
+    "size",
+    "color",
+    "orientation",
+    "marks",
+    "range",
+    "getAriaValueText",
+    "aria-label",
+    "ref"
+  ]);
+  const singleDefault = typeof local.defaultValue === "number" ? local.defaultValue : void 0;
+  const singleValue = () => typeof local.value === "number" ? local.value : void 0;
+  const isVertical = () => local.orientation === "vertical";
+  const isControlled = typeof local.value === "number";
+  const isDiscrete = () => local.variant === "discrete";
+  const [valueState, setValueState] = createSignal(singleDefault ?? local.min);
+  const [isDragging, setIsDragging] = createSignal(false);
+  const [isActive, setIsActive] = createSignal(false);
+  const [isFocused, setIsFocused] = createSignal(false);
+  let containerEl;
+  let isPressed = false;
+  const value = () => isControlled ? singleValue() : valueState();
+  const updateValue = (next, event) => {
+    if (next < local.min || next > local.max) return;
+    if (!isControlled) setValueState(next);
+    local.onChange?.(event, next, props);
+  };
+  const offsetToValue = (absolute, containerSize) => rescale(absolute, [0, containerSize], [local.min, local.max], { step: local.step });
+  const onMouseMove = (event) => {
+    if (!isPressed || !containerEl) return;
+    const rect = containerEl.getBoundingClientRect();
+    const clientX = coordX(event);
+    const clientY = coordY(event);
+    const absolute = isVertical() ? rect.height - (clientY - rect.top) : clientX - rect.left;
+    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);
+    if (!isActive()) setIsActive(true);
+    if (value() === next) return;
+    if (!isDragging()) setIsDragging(true);
+    updateValue(next, event);
+  };
+  const removeListeners = () => {
+    if (isServer) return;
+    document.removeEventListener("mousemove", onMouseMove);
+    document.removeEventListener("mouseup", onMouseEnd);
+    document.removeEventListener("touchmove", onMouseMove);
+    document.removeEventListener("touchend", onMouseEnd);
+  };
+  const onMouseEnd = () => {
+    isPressed = false;
+    if (isDragging()) setIsDragging(false);
+    if (isActive()) setIsActive(false);
+    removeListeners();
+  };
+  const onMouseDown = (event) => {
+    if (local.disabled || event.button !== 0 || !containerEl) return;
+    isPressed = true;
+    const rect = containerEl.getBoundingClientRect();
+    const absolute = isVertical() ? rect.height - (event.clientY - rect.top) : event.clientX - rect.left;
+    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);
+    if (!isActive()) setIsActive(true);
+    updateValue(next, event);
+    document.addEventListener("mousemove", onMouseMove);
+    document.addEventListener("mouseup", onMouseEnd);
+  };
+  const onTouchStartNative = (event) => {
+    if (local.disabled || !containerEl) return;
+    isPressed = true;
+    const rect = containerEl.getBoundingClientRect();
+    const touch = event.changedTouches?.[0];
+    if (!touch) return;
+    const absolute = isVertical() ? rect.height - (touch.clientY - rect.top) : touch.clientX - rect.left;
+    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);
+    if (!isActive()) setIsActive(true);
+    updateValue(next, event);
+    document.addEventListener("touchmove", onMouseMove);
+    document.addEventListener("touchend", onMouseEnd);
+  };
+  onMount(() => {
+    if (!containerEl) return;
+    containerEl.addEventListener("touchstart", onTouchStartNative);
+    onCleanup(() => containerEl?.removeEventListener("touchstart", onTouchStartNative));
+  });
+  onCleanup(removeListeners);
+  const handleArrows = (event) => {
+    if (!isFocused() || local.disabled) return;
+    if (event.key === "ArrowLeft" || event.key === "ArrowDown") updateValue(value() - (local.step || 1), event);
+    if (event.key === "ArrowRight" || event.key === "ArrowUp") updateValue(value() + (local.step || 1), event);
+  };
+  const classes = () => cn("smwb-slider", local.class, {
+    "smwb-slider--disabled": local.disabled,
+    "smwb-slider--dragging": isDragging(),
+    "smwb-slider--discrete": isDiscrete(),
+    "smwb-slider--vertical": isVertical()
+  }, local.size !== "medium" && `smwb-slider_size-${local.size}`, local.color !== "primary" && `smwb-slider_color-${local.color}`);
+  const pct = () => `${toPercent(value(), local.min, local.max)}%`;
+  const markList = () => resolveMarks(local.marks, local.min, local.max, local.step);
+  const ticks = () => Array(Math.round(local.max / (local.step || 1)) + 1).fill(1);
+  return <TextFieldWrapper label={local.label} helperText={local.helperText} disabled={local.disabled} error={local.error} fullWidth shrink>
+      <div class="smwb-slider__container">
+        <span
+    onKeyDown={handleArrows}
+    ref={mergeRefs(local.ref, (el) => containerEl = el)}
+    onMouseDown={onMouseDown}
+    class={classes()}
+    tabindex={local.disabled ? -1 : 0}
+    onFocus={() => setIsFocused(true)}
+    onBlur={() => setIsFocused(false)}
+    {...rest}
+  >
+          <Show when={local.withTicks}>
+            <span class="smwb-slider__ticks" style={{ gap: `${local.step}` }}>
+              <For each={ticks()}>{() => <span class="smwb-slider__tick" />}</For>
+            </span>
+          </Show>
+          <Show when={markList().length > 0}>
+            <span class="smwb-slider__marks" aria-hidden="true">
+              <For each={markList()}>
+                {(m) => <span class="smwb-slider__mark" style={isVertical() ? { bottom: `${toPercent(m.value, local.min, local.max)}%` } : { left: `${toPercent(m.value, local.min, local.max)}%` }}>
+                    <Show when={m.label != null}>
+                      <span class="smwb-slider__mark-label">{m.label}</span>
+                    </Show>
+                  </span>}
+              </For>
+            </span>
+          </Show>
+          <span class="smwb-slider__rail" />
+          <span class="smwb-slider__track" style={isVertical() ? { height: pct() } : { width: pct() }} />
+          <span
+    class={cn("smwb-slider__thumb", { "smwb-slider__thumb--active": isActive(), "smwb-slider__thumb--discrete": isDiscrete() })}
+    style={isVertical() ? { bottom: pct() } : { left: pct() }}
+  >
+            <Show when={isDiscrete()}>
+              <span class="smwb-slider__thumb-tooltip">{Math.round(value())}</span>
+            </Show>
+            <input
+    data-testid="slider-input"
+    class="smwb-slider__input"
+    type="range"
+    min={local.min}
+    max={local.max}
+    name={local.name}
+    value={value()}
+    readonly
+    aria-label={local["aria-label"]}
+    aria-orientation={local.orientation}
+    aria-valuenow={value()}
+    aria-valuemin={local.min}
+    aria-valuemax={local.max}
+    aria-valuetext={local.getAriaValueText ? local.getAriaValueText(value()) : void 0}
+    aria-disabled={local.disabled || void 0}
+  />
+          </span>
+        </span>
+        <Show when={local.valueField && isDiscrete()}>
+          <TextField
+    type="number"
+    value={value()}
+    onChange={(event) => updateValue(+event.currentTarget.value, event)}
+    variant="filled"
+  />
+        </Show>
+      </div>
+    </TextFieldWrapper>;
+}
+function Slider(props) {
+  const isRangeMode = props.range === true || Array.isArray(props.value) || Array.isArray(props.defaultValue);
+  return <Show when={isRangeMode} fallback={<SingleSlider {...props} />}>
+      <RangeSlider {...props} />
+    </Show>;
+}
+var slider_default = Slider;
+export {
+  Slider,
+  slider_default as default
+};
+//# sourceMappingURL=slider.jsx.map

package/dist/headless/source/components/inputs/slider/slider.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/inputs/slider/slider.tsx"],"sourcesContent":["import { type JSX, For, Show, createSignal, mergeProps, onCleanup, onMount, splitProps } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { rescale, toPercent, coordX, coordY } from \"./utils\";\nimport { TextField, TextFieldWrapper } from \"../textField\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SliderValue = number | [number, number];\n\nexport interface SliderMark {\n  value: number;\n  label?: JSX.Element;\n}\n\nexport interface SliderProps extends Omit<JSX.HTMLAttributes<HTMLSpanElement>, \"onChange\"> {\n  value?: SliderValue;\n  onChange?: (event: Event, value: SliderValue, data: SliderProps) => void;\n  min?: number;\n  max?: number;\n  step?: number;\n  name?: string;\n  defaultValue?: SliderValue;\n  disabled?: boolean;\n  variant?: \"continuous\" | \"discrete\";\n  valueField?: boolean;\n  withTicks?: boolean;\n  label?: string;\n  helperText?: JSX.Element;\n  error?: boolean;\n  size?: \"small\" | \"medium\" | \"large\";\n  color?: \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n  /** Enables a two-thumb range slider (value becomes `[number, number]`). */\n  range?: boolean;\n  orientation?: \"horizontal\" | \"vertical\";\n  marks?: boolean | SliderMark[];\n  \"aria-label\"?: string;\n  getAriaValueText?: (value: number) => string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nfunction resolveMarks(marks: boolean | SliderMark[] | undefined, min: number, max: number, step?: number): SliderMark[] {\n  if (!marks) return [];\n  if (Array.isArray(marks)) return marks;\n  const s = step && step > 0 ? step : (max - min) / 10;\n  const result: SliderMark[] = [];\n  for (let v = min; v <= max + 1e-9; v += s) {\n    result.push({ value: Math.round(v * 1e6) / 1e6 });\n  }\n  return result;\n}\n\nfunction RangeSlider(props: SliderProps): JSX.Element {\n  const merged = mergeProps(\n    { min: 0, max: 100, disabled: false, size: \"medium\" as const, color: \"primary\" as const, orientation: \"horizontal\" as const },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"defaultValue\",\n    \"value\",\n    \"onChange\",\n    \"min\",\n    \"max\",\n    \"name\",\n    \"disabled\",\n    \"class\",\n    \"step\",\n    \"label\",\n    \"helperText\",\n    \"error\",\n    \"size\",\n    \"color\",\n    \"orientation\",\n    \"marks\",\n    \"getAriaValueText\",\n    \"aria-label\",\n    \"range\",\n    \"variant\",\n    \"valueField\",\n    \"withTicks\",\n    \"ref\",\n  ]);\n\n  const isVertical = (): boolean => local.orientation === \"vertical\";\n  const normalize = (v: SliderValue | undefined): [number, number] => {\n    const arr = Array.isArray(v) ? v : [local.min, local.max];\n    const lo = Math.min(arr[0] ?? local.min, arr[1] ?? local.max);\n    const hi = Math.max(arr[0] ?? local.min, arr[1] ?? local.max);\n    return [lo, hi];\n  };\n\n  const isControlled = local.value !== undefined;\n  const [valueState, setValueState] = createSignal<[number, number]>(normalize(local.defaultValue));\n  const value = (): [number, number] => (isControlled ? normalize(local.value) : valueState());\n\n  let containerEl: HTMLSpanElement | undefined;\n  let activeThumb: 0 | 1 = 0;\n  let isPressed = false;\n\n  const markList = (): SliderMark[] => resolveMarks(local.marks, local.min, local.max, local.step);\n\n  const positionToValue = (event: MouseEvent | TouchEvent): number => {\n    const rect = containerEl?.getBoundingClientRect();\n    if (!rect) return local.min;\n    if (isVertical()) {\n      const y = coordY(event) - rect.top;\n      return rescale(rect.height - y, [0, rect.height], [local.min, local.max], { step: local.step });\n    }\n    const x = coordX(event) - rect.left;\n    return rescale(x, [0, rect.width], [local.min, local.max], { step: local.step });\n  };\n\n  const commit = (next: [number, number], event: Event): void => {\n    const lo = Math.min(next[0], next[1]);\n    const hi = Math.max(next[0], next[1]);\n    const clamped: [number, number] = [Math.max(local.min, lo), Math.min(local.max, hi)];\n    if (!isControlled) setValueState(clamped);\n    local.onChange?.(event, clamped, props);\n  };\n\n  const moveThumb = (raw: number, event: Event): void => {\n    const current = value();\n    const next: [number, number] = [current[0], current[1]];\n    next[activeThumb] = Math.max(local.min, Math.min(local.max, raw));\n    commit(next, event);\n  };\n\n  const pickThumb = (raw: number): void => {\n    const current = value();\n    activeThumb = Math.abs(raw - current[0]) <= Math.abs(raw - current[1]) ? 0 : 1;\n  };\n\n  const onMouseMove = (event: MouseEvent | TouchEvent): void => {\n    if (!isPressed) return;\n    event.preventDefault();\n    moveThumb(positionToValue(event), event);\n  };\n  const onMouseEnd = (): void => {\n    isPressed = false;\n    // Registered as a body-scope onCleanup, which Solid also runs when the SSR\n    // root is disposed — guard the document access so it never runs server-side.\n    if (isServer) return;\n    document.removeEventListener(\"mousemove\", onMouseMove);\n    document.removeEventListener(\"mouseup\", onMouseEnd);\n    document.removeEventListener(\"touchmove\", onMouseMove);\n    document.removeEventListener(\"touchend\", onMouseEnd);\n  };\n  const onMouseDown: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    if (local.disabled || event.button !== 0) return;\n    const raw = positionToValue(event);\n    pickThumb(raw);\n    isPressed = true;\n    moveThumb(raw, event);\n    document.addEventListener(\"mousemove\", onMouseMove);\n    document.addEventListener(\"mouseup\", onMouseEnd);\n  };\n  const onTouchStartNative = (event: TouchEvent): void => {\n    if (local.disabled) return;\n    const raw = positionToValue(event);\n    pickThumb(raw);\n    isPressed = true;\n    moveThumb(raw, event);\n    document.addEventListener(\"touchmove\", onMouseMove);\n    document.addEventListener(\"touchend\", onMouseEnd);\n  };\n\n  onMount(() => {\n    if (!containerEl) return;\n    containerEl.addEventListener(\"touchstart\", onTouchStartNative);\n    onCleanup(() => containerEl?.removeEventListener(\"touchstart\", onTouchStartNative));\n  });\n  onCleanup(onMouseEnd);\n\n  const onThumbKeyDown = (idx: 0 | 1): JSX.EventHandler<HTMLInputElement, KeyboardEvent> => (event) => {\n    if (local.disabled) return;\n    const delta = local.step && local.step > 0 ? local.step : 1;\n    const current = value();\n    let next: number | null = null;\n    if (event.key === \"ArrowLeft\" || event.key === \"ArrowDown\") next = current[idx] - delta;\n    else if (event.key === \"ArrowRight\" || event.key === \"ArrowUp\") next = current[idx] + delta;\n    else if (event.key === \"Home\") next = local.min;\n    else if (event.key === \"End\") next = local.max;\n    if (next !== null) {\n      event.preventDefault();\n      activeThumb = idx;\n      moveThumb(next, event);\n    }\n  };\n\n  const classes = (): string =>\n    cn(\"smwb-slider\", \"smwb-slider--range\", local.class, {\n      \"smwb-slider--disabled\": local.disabled,\n      \"smwb-slider--vertical\": isVertical(),\n    }, local.size !== \"medium\" && `smwb-slider_size-${local.size}`, local.color !== \"primary\" && `smwb-slider_color-${local.color}`);\n\n  return (\n    <TextFieldWrapper label={local.label} helperText={local.helperText} disabled={local.disabled} error={local.error} fullWidth shrink>\n      <div class=\"smwb-slider__container\">\n        <span ref={mergeRefs(local.ref, (el) => (containerEl = el as HTMLSpanElement))} onMouseDown={onMouseDown} class={classes()} {...rest}>\n          <Show when={markList().length > 0}>\n            <span class=\"smwb-slider__marks\" aria-hidden=\"true\">\n              <For each={markList()}>\n                {(m) => (\n                  <span class=\"smwb-slider__mark\" style={isVertical() ? { bottom: `${toPercent(m.value, local.min, local.max)}%` } : { left: `${toPercent(m.value, local.min, local.max)}%` }}>\n                    <Show when={m.label != null}>\n                      <span class=\"smwb-slider__mark-label\">{m.label}</span>\n                    </Show>\n                  </span>\n                )}\n              </For>\n            </span>\n          </Show>\n          <span class=\"smwb-slider__rail\" />\n          <span\n            class=\"smwb-slider__track\"\n            style={(() => {\n              const p0 = toPercent(value()[0], local.min, local.max);\n              const p1 = toPercent(value()[1], local.min, local.max);\n              const startPct = `${Math.min(p0, p1)}%`;\n              const spanPct = `${Math.abs(p1 - p0)}%`;\n              return isVertical() ? { bottom: startPct, height: spanPct } : { left: startPct, width: spanPct };\n            })()}\n          />\n          <For each={[0, 1] as const}>\n            {(idx) => (\n              <span\n                class={cn(\"smwb-slider__thumb\", `smwb-slider__thumb--${idx === 0 ? \"start\" : \"end\"}`)}\n                style={isVertical() ? { bottom: `${toPercent(value()[idx], local.min, local.max)}%` } : { left: `${toPercent(value()[idx], local.min, local.max)}%` }}\n              >\n                <input\n                  data-testid={`slider-input-${idx}`}\n                  class=\"smwb-slider__input\"\n                  type=\"range\"\n                  min={local.min}\n                  max={local.max}\n                  step={local.step}\n                  name={local.name ? `${local.name}[${idx}]` : undefined}\n                  value={value()[idx]}\n                  disabled={local.disabled}\n                  onChange={() => undefined}\n                  onKeyDown={onThumbKeyDown(idx)}\n                  tabindex={local.disabled ? -1 : 0}\n                  aria-label={local[\"aria-label\"] ? `${local[\"aria-label\"]} ${idx === 0 ? \"minimum\" : \"maximum\"}` : undefined}\n                  aria-orientation={local.orientation}\n                  aria-valuenow={value()[idx]}\n                  aria-valuemin={idx === 0 ? local.min : value()[0]}\n                  aria-valuemax={idx === 0 ? value()[1] : local.max}\n                  aria-valuetext={local.getAriaValueText ? local.getAriaValueText(value()[idx]) : undefined}\n                  aria-disabled={local.disabled || undefined}\n                />\n              </span>\n            )}\n          </For>\n        </span>\n      </div>\n    </TextFieldWrapper>\n  );\n}\n\nfunction SingleSlider(props: SliderProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      min: 0,\n      max: 100,\n      disabled: false,\n      variant: \"continuous\" as const,\n      size: \"medium\" as const,\n      color: \"primary\" as const,\n      orientation: \"horizontal\" as const,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"defaultValue\",\n    \"value\",\n    \"onChange\",\n    \"min\",\n    \"max\",\n    \"name\",\n    \"disabled\",\n    \"class\",\n    \"step\",\n    \"variant\",\n    \"valueField\",\n    \"withTicks\",\n    \"label\",\n    \"helperText\",\n    \"error\",\n    \"size\",\n    \"color\",\n    \"orientation\",\n    \"marks\",\n    \"range\",\n    \"getAriaValueText\",\n    \"aria-label\",\n    \"ref\",\n  ]);\n\n  const singleDefault = typeof local.defaultValue === \"number\" ? local.defaultValue : undefined;\n  const singleValue = (): number | undefined => (typeof local.value === \"number\" ? local.value : undefined);\n  const isVertical = (): boolean => local.orientation === \"vertical\";\n  const isControlled = typeof local.value === \"number\";\n  const isDiscrete = (): boolean => local.variant === \"discrete\";\n\n  const [valueState, setValueState] = createSignal<number>(singleDefault ?? local.min);\n  const [isDragging, setIsDragging] = createSignal(false);\n  const [isActive, setIsActive] = createSignal(false);\n  const [isFocused, setIsFocused] = createSignal(false);\n\n  let containerEl: HTMLSpanElement | undefined;\n  let isPressed = false;\n  const value = (): number => (isControlled ? (singleValue() as number) : valueState());\n\n  const updateValue = (next: number, event: Event): void => {\n    if (next < local.min || next > local.max) return;\n    if (!isControlled) setValueState(next);\n    local.onChange?.(event, next, props);\n  };\n\n  const offsetToValue = (absolute: number, containerSize: number): number =>\n    rescale(absolute, [0, containerSize], [local.min, local.max], { step: local.step });\n\n  const onMouseMove = (event: MouseEvent | TouchEvent): void => {\n    if (!isPressed || !containerEl) return;\n    const rect = containerEl.getBoundingClientRect();\n    const clientX = coordX(event);\n    const clientY = coordY(event);\n    const absolute = isVertical() ? rect.height - (clientY - rect.top) : clientX - rect.left;\n    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);\n    if (!isActive()) setIsActive(true);\n    if (value() === next) return;\n    if (!isDragging()) setIsDragging(true);\n    updateValue(next, event);\n  };\n  const removeListeners = (): void => {\n    // Registered as a body-scope onCleanup, which Solid also runs when the SSR\n    // root is disposed — guard the document access so it never runs server-side.\n    if (isServer) return;\n    document.removeEventListener(\"mousemove\", onMouseMove);\n    document.removeEventListener(\"mouseup\", onMouseEnd);\n    document.removeEventListener(\"touchmove\", onMouseMove);\n    document.removeEventListener(\"touchend\", onMouseEnd);\n  };\n  const onMouseEnd = (): void => {\n    isPressed = false;\n    if (isDragging()) setIsDragging(false);\n    if (isActive()) setIsActive(false);\n    removeListeners();\n  };\n  const onMouseDown: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    if (local.disabled || event.button !== 0 || !containerEl) return;\n    isPressed = true;\n    const rect = containerEl.getBoundingClientRect();\n    const absolute = isVertical() ? rect.height - (event.clientY - rect.top) : event.clientX - rect.left;\n    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);\n    if (!isActive()) setIsActive(true);\n    updateValue(next, event);\n    document.addEventListener(\"mousemove\", onMouseMove);\n    document.addEventListener(\"mouseup\", onMouseEnd);\n  };\n  const onTouchStartNative = (event: TouchEvent): void => {\n    if (local.disabled || !containerEl) return;\n    isPressed = true;\n    const rect = containerEl.getBoundingClientRect();\n    const touch = event.changedTouches?.[0];\n    if (!touch) return;\n    const absolute = isVertical() ? rect.height - (touch.clientY - rect.top) : touch.clientX - rect.left;\n    const next = offsetToValue(absolute, isVertical() ? rect.height : rect.width);\n    if (!isActive()) setIsActive(true);\n    updateValue(next, event);\n    document.addEventListener(\"touchmove\", onMouseMove);\n    document.addEventListener(\"touchend\", onMouseEnd);\n  };\n\n  onMount(() => {\n    if (!containerEl) return;\n    containerEl.addEventListener(\"touchstart\", onTouchStartNative);\n    onCleanup(() => containerEl?.removeEventListener(\"touchstart\", onTouchStartNative));\n  });\n  onCleanup(removeListeners);\n\n  const handleArrows: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (!isFocused() || local.disabled) return;\n    if (event.key === \"ArrowLeft\" || event.key === \"ArrowDown\") updateValue(value() - (local.step || 1), event);\n    if (event.key === \"ArrowRight\" || event.key === \"ArrowUp\") updateValue(value() + (local.step || 1), event);\n  };\n\n  const classes = (): string =>\n    cn(\"smwb-slider\", local.class, {\n      \"smwb-slider--disabled\": local.disabled,\n      \"smwb-slider--dragging\": isDragging(),\n      \"smwb-slider--discrete\": isDiscrete(),\n      \"smwb-slider--vertical\": isVertical(),\n    }, local.size !== \"medium\" && `smwb-slider_size-${local.size}`, local.color !== \"primary\" && `smwb-slider_color-${local.color}`);\n\n  const pct = (): string => `${toPercent(value(), local.min, local.max)}%`;\n  const markList = (): SliderMark[] => resolveMarks(local.marks, local.min, local.max, local.step);\n  const ticks = (): number[] => Array(Math.round(local.max / (local.step || 1)) + 1).fill(1) as number[];\n\n  return (\n    <TextFieldWrapper label={local.label} helperText={local.helperText} disabled={local.disabled} error={local.error} fullWidth shrink>\n      <div class=\"smwb-slider__container\">\n        <span\n          onKeyDown={handleArrows}\n          ref={mergeRefs(local.ref, (el) => (containerEl = el as HTMLSpanElement))}\n          onMouseDown={onMouseDown}\n          class={classes()}\n          tabindex={local.disabled ? -1 : 0}\n          onFocus={() => setIsFocused(true)}\n          onBlur={() => setIsFocused(false)}\n          {...rest}\n        >\n          <Show when={local.withTicks}>\n            <span class=\"smwb-slider__ticks\" style={{ gap: `${local.step}` }}>\n              <For each={ticks()}>{() => <span class=\"smwb-slider__tick\" />}</For>\n            </span>\n          </Show>\n          <Show when={markList().length > 0}>\n            <span class=\"smwb-slider__marks\" aria-hidden=\"true\">\n              <For each={markList()}>\n                {(m) => (\n                  <span class=\"smwb-slider__mark\" style={isVertical() ? { bottom: `${toPercent(m.value, local.min, local.max)}%` } : { left: `${toPercent(m.value, local.min, local.max)}%` }}>\n                    <Show when={m.label != null}>\n                      <span class=\"smwb-slider__mark-label\">{m.label}</span>\n                    </Show>\n                  </span>\n                )}\n              </For>\n            </span>\n          </Show>\n          <span class=\"smwb-slider__rail\" />\n          <span class=\"smwb-slider__track\" style={isVertical() ? { height: pct() } : { width: pct() }} />\n          <span\n            class={cn(\"smwb-slider__thumb\", { \"smwb-slider__thumb--active\": isActive(), \"smwb-slider__thumb--discrete\": isDiscrete() })}\n            style={isVertical() ? { bottom: pct() } : { left: pct() }}\n          >\n            <Show when={isDiscrete()}>\n              <span class=\"smwb-slider__thumb-tooltip\">{Math.round(value())}</span>\n            </Show>\n            <input\n              data-testid=\"slider-input\"\n              class=\"smwb-slider__input\"\n              type=\"range\"\n              min={local.min}\n              max={local.max}\n              name={local.name}\n              value={value()}\n              readonly\n              aria-label={local[\"aria-label\"]}\n              aria-orientation={local.orientation}\n              aria-valuenow={value()}\n              aria-valuemin={local.min}\n              aria-valuemax={local.max}\n              aria-valuetext={local.getAriaValueText ? local.getAriaValueText(value()) : undefined}\n              aria-disabled={local.disabled || undefined}\n            />\n          </span>\n        </span>\n        <Show when={local.valueField && isDiscrete()}>\n          <TextField\n            type=\"number\"\n            value={value()}\n            onChange={(event) => updateValue(+event.currentTarget.value, event)}\n            variant=\"filled\"\n          />\n        </Show>\n      </div>\n    </TextFieldWrapper>\n  );\n}\n\nexport function Slider(props: SliderProps): JSX.Element {\n  const isRangeMode = props.range === true || Array.isArray(props.value) || Array.isArray(props.defaultValue);\n  return (\n    <Show when={isRangeMode} fallback={<SingleSlider {...props} />}>\n      <RangeSlider {...props} />\n    </Show>\n  );\n}\n\nexport default Slider;\n"],"mappings":"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","names":[],"file":"slider.jsx"}

package/dist/headless/source/components/inputs/slider/utils.js

@@ -0,0 +1,49 @@
+function toPercent(value, min, max) {
+  return (value - min) / (max - min) * 100;
+}
+function precision(number) {
+  return (`${number}`.split(".")[1] || "").length;
+}
+function clamp(value, min, max) {
+  return Math.max(min, Math.min(value, max));
+}
+function precisionRound(number, prec = 1) {
+  const factor = Math.pow(10, prec);
+  return Math.round(number * factor) / factor;
+}
+function decimatedClamp(val, min, max, step) {
+  if (step == null || step <= 0) {
+    return clamp(val, min, max);
+  }
+  const prec = precision(step);
+  const decimatedOffset = precisionRound(Math.round((val - min) / step) * step, prec);
+  const decimatedRange = precisionRound(Math.floor((max - min) / step) * step, prec);
+  return min + clamp(decimatedOffset, 0, decimatedRange);
+}
+function rescale(value, from, to, options = {}) {
+  const scaled = (value - from[0]) / (from[1] - from[0]) * (to[1] - to[0]) + to[0];
+  return decimatedClamp(scaled, to[0], to[1], options.step);
+}
+function coordX(event) {
+  if (event instanceof TouchEvent || "changedTouches" in event) {
+    return event.changedTouches[0]?.clientX ?? 0;
+  }
+  return event.clientX;
+}
+function coordY(event) {
+  if (event instanceof TouchEvent || "changedTouches" in event) {
+    return event.changedTouches[0]?.clientY ?? 0;
+  }
+  return event.clientY;
+}
+export {
+  clamp,
+  coordX,
+  coordY,
+  decimatedClamp,
+  precision,
+  precisionRound,
+  rescale,
+  toPercent
+};
+//# sourceMappingURL=utils.js.map

package/dist/headless/source/components/inputs/slider/utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/inputs/slider/utils.ts"],
+  "sourcesContent": ["export function toPercent(value: number, min: number, max: number): number {\n  return ((value - min) / (max - min)) * 100;\n}\n\nexport function precision(number: number): number {\n  return (`${number}`.split(\".\")[1] || \"\").length;\n}\n\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.max(min, Math.min(value, max));\n}\n\nexport function precisionRound(number: number, prec = 1): number {\n  const factor = Math.pow(10, prec);\n  return Math.round(number * factor) / factor;\n}\n\nexport function decimatedClamp(val: number, min: number, max: number, step?: number | undefined): number {\n  if (step == null || step <= 0) {\n    return clamp(val, min, max);\n  }\n  const prec = precision(step);\n  const decimatedOffset = precisionRound(Math.round((val - min) / step) * step, prec);\n  const decimatedRange = precisionRound(Math.floor((max - min) / step) * step, prec);\n  return min + clamp(decimatedOffset, 0, decimatedRange);\n}\n\nexport function rescale(value: number, from: [number, number], to: [number, number], options: { step?: number | undefined } = {}): number {\n  const scaled = ((value - from[0]) / (from[1] - from[0])) * (to[1] - to[0]) + to[0];\n  return decimatedClamp(scaled, to[0], to[1], options.step);\n}\n\nexport function coordX(event: MouseEvent | TouchEvent): number {\n  if (event instanceof TouchEvent || \"changedTouches\" in event) {\n    return (event as TouchEvent).changedTouches[0]?.clientX ?? 0;\n  }\n  return (event as MouseEvent).clientX;\n}\n\nexport function coordY(event: MouseEvent | TouchEvent): number {\n  if (event instanceof TouchEvent || \"changedTouches\" in event) {\n    return (event as TouchEvent).changedTouches[0]?.clientY ?? 0;\n  }\n  return (event as MouseEvent).clientY;\n}\n"],
+  "mappings": "AAAO,SAAS,UAAU,OAAe,KAAa,KAAqB;AACzE,UAAS,QAAQ,QAAQ,MAAM,OAAQ;AACzC;AAEO,SAAS,UAAU,QAAwB;AAChD,UAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,EAAE,CAAC,KAAK,IAAI;AAC3C;AAEO,SAAS,MAAM,OAAe,KAAa,KAAqB;AACrE,SAAO,KAAK,IAAI,KAAK,KAAK,IAAI,OAAO,GAAG,CAAC;AAC3C;AAEO,SAAS,eAAe,QAAgB,OAAO,GAAW;AAC/D,QAAM,SAAS,KAAK,IAAI,IAAI,IAAI;AAChC,SAAO,KAAK,MAAM,SAAS,MAAM,IAAI;AACvC;AAEO,SAAS,eAAe,KAAa,KAAa,KAAa,MAAmC;AACvG,MAAI,QAAQ,QAAQ,QAAQ,GAAG;AAC7B,WAAO,MAAM,KAAK,KAAK,GAAG;AAAA,EAC5B;AACA,QAAM,OAAO,UAAU,IAAI;AAC3B,QAAM,kBAAkB,eAAe,KAAK,OAAO,MAAM,OAAO,IAAI,IAAI,MAAM,IAAI;AAClF,QAAM,iBAAiB,eAAe,KAAK,OAAO,MAAM,OAAO,IAAI,IAAI,MAAM,IAAI;AACjF,SAAO,MAAM,MAAM,iBAAiB,GAAG,cAAc;AACvD;AAEO,SAAS,QAAQ,OAAe,MAAwB,IAAsB,UAAyC,CAAC,GAAW;AACxI,QAAM,UAAW,QAAQ,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,CAAC,MAAO,GAAG,CAAC,IAAI,GAAG,CAAC,KAAK,GAAG,CAAC;AACjF,SAAO,eAAe,QAAQ,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,QAAQ,IAAI;AAC1D;AAEO,SAAS,OAAO,OAAwC;AAC7D,MAAI,iBAAiB,cAAc,oBAAoB,OAAO;AAC5D,WAAQ,MAAqB,eAAe,CAAC,GAAG,WAAW;AAAA,EAC7D;AACA,SAAQ,MAAqB;AAC/B;AAEO,SAAS,OAAO,OAAwC;AAC7D,MAAI,iBAAiB,cAAc,oBAAoB,OAAO;AAC5D,WAAQ,MAAqB,eAAe,CAAC,GAAG,WAAW;AAAA,EAC7D;AACA,SAAQ,MAAqB;AAC/B;",
+  "names": []
+}

package/dist/headless/source/components/inputs/textField/index.js

@@ -0,0 +1,9 @@
+import { TextField } from "./textField";
+import { TextFieldWrapper } from "./textFieldWrapper";
+import { TextFieldAdornment } from "./textFieldAdornment";
+export {
+  TextField,
+  TextFieldAdornment,
+  TextFieldWrapper
+};
+//# sourceMappingURL=index.js.map

package/dist/headless/source/components/inputs/textField/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/inputs/textField/index.ts"],
+  "sourcesContent": ["export { TextField } from \"./textField\";\nexport type { TextFieldProps } from \"./textField\";\nexport { TextFieldWrapper } from \"./textFieldWrapper\";\nexport type { TextFieldWrapperProps } from \"./textFieldWrapper\";\nexport { TextFieldAdornment } from \"./textFieldAdornment\";\nexport type { TextFieldAdornmentProps } from \"./textFieldAdornment\";\nexport type { TextFieldVariant } from \"./types\";\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,SAAS,0BAA0B;",
+  "names": []
+}