@smwb/ui-solid 0.1.0

package/dist/headless/components/inputs/selectField/selectField.js

@@ -0,0 +1,248 @@
+import { createComponent as i, addEventListener as Y, use as S, insert as f, effect as k, memo as V, setAttribute as v, className as Z, template as M, delegateEvents as ee } from "solid-js/web";
+import { splitProps as te, createSignal as A, createMemo as re, createEffect as H, Show as x, For as ne } from "solid-js";
+import $ from "clsx";
+import { DropdownMenu as le } from "./dropdownMenu.js";
+import { mergeRefs as ae } from "../../../primitives/mergeRefs.js";
+import { TextFieldWrapper as se } from "../textField/textFieldWrapper.js";
+import { Chip as ie } from "../../dataDisplay/chip/chip.js";
+import { Icon as R } from "../../base/icon/icon.js";
+var W = /* @__PURE__ */ M("<span class=smwb-select-field__values>"), oe = /* @__PURE__ */ M("<span class=smwb-select-field__search><span class=smwb-select-field__search-text></span><input class=smwb-select-field__search-input type=text data-testid=search-input>"), ue = /* @__PURE__ */ M("<span role=button aria-haspopup=listbox data-testid=select-field><span class=smwb-select-field__search-wrapper></span><span class=smwb-select-field__actions>");
+function T(g) {
+  g.preventDefault(), g.stopPropagation();
+}
+function be(g) {
+  const [e] = te(g, ["class", "value", "defaultValue", "onChange", "disabled", "readOnly", "name", "multiple", "menuMaxHeight", "menuMiddleware", "menuNoItemsMessage", "menuContainer", "search", "chips", "isFocused", "error", "items", "label", "variant", "fullWidth", "helperText", "onSearch", "resetSearch", "isLoading", "inline", "endAdornment", "hideSelectArrowIcon", "optionRenderer", "clearable", "creatable", "onCreate", "virtualized", "itemHeight", "aria-label", "id", "ref"]), I = () => e.variant ?? "outlined", [o, m] = A(!1), [z, N] = A(e.defaultValue), [h, b] = A(""), P = e.value != null;
+  let p, w, D;
+  const u = () => P ? e.value : z(), y = () => !!e.isFocused || o(), _ = re(() => {
+    const t = u();
+    if (Array.isArray(t)) return e.items.filter((l) => t.includes(l.value));
+    if (t == null || t === "") return [];
+    const n = e.items.find((l) => l.value === t);
+    return n ? [n] : [];
+  }), C = (t, n) => {
+    e.onChange?.(t, {
+      ...g,
+      value: n,
+      name: e.name || void 0
+    }), N(n);
+  }, j = (t) => {
+    t.button === 0 && (t.preventDefault(), p?.focus(), m(!o()));
+  }, B = () => {
+    m(!1), p?.focus();
+  }, K = () => {
+    e.search === !0 && D?.focus();
+  }, U = (t) => {
+    !e.readOnly && [" ", "ArrowUp", "ArrowDown", "Enter"].includes(t.key) && (t.preventDefault(), m(!o()));
+  };
+  H(() => {
+    (!y() || e.search === "menu" && !o()) && (b(""), e.resetSearch?.());
+  }), H(() => {
+    u(), w && (w.scrollLeft = w.scrollWidth);
+  });
+  const q = (t, n) => {
+    let l;
+    if (e.multiple) {
+      const c = u();
+      l = (Array.isArray(c) ? c : [c].filter(Boolean)).slice();
+      const a = l.findIndex((s) => s === n.value);
+      a === -1 ? l.push(n.value) : l.splice(a, 1);
+    } else
+      l = u() === n.value ? "" : n.value;
+    h() && b(""), e.multiple || (m(!1), p?.focus()), C(t, l);
+  }, E = (t) => {
+    b(t.currentTarget.value), e.onSearch?.(t), o() || m(!0);
+  }, G = (t) => (n) => {
+    const l = u();
+    Array.isArray(l) && C(n, l.filter((c) => t !== c));
+  }, J = (t) => {
+    C(t, []);
+  }, Q = () => {
+    if (e.onSearch) return e.items;
+    const t = h();
+    return t ? e.items.filter((n) => n.text.search(new RegExp(t, "i")) !== -1) : e.items;
+  }, X = () => {
+    const t = h();
+    if (e.creatable && t && !e.items.some((n) => n.text.toLowerCase() === t.toLowerCase()))
+      return {
+        text: `Создать "${t}"`,
+        onCreate: (n) => {
+          e.onCreate?.(t, n), b(""), m(!1);
+        }
+      };
+  };
+  return [i(se, {
+    get label() {
+      return e.label;
+    },
+    get helperText() {
+      return e.helperText;
+    },
+    get variant() {
+      return I();
+    },
+    get disabled() {
+      return e.disabled;
+    },
+    get class() {
+      return e.class;
+    },
+    get error() {
+      return e.error;
+    },
+    get fullWidth() {
+      return e.fullWidth;
+    },
+    get isFilledState() {
+      return !!_().length || !!h();
+    },
+    get isFocused() {
+      return y();
+    },
+    get inline() {
+      return e.inline;
+    },
+    get children() {
+      var t = ue(), n = t.firstChild, l = n.nextSibling;
+      t.$$keydown = U, t.addEventListener("focus", K), Y(t, "mousedown", e.disabled || e.readOnly ? void 0 : j, !0);
+      var c = ae(e.ref, (r) => p = r);
+      return typeof c == "function" && S(c, t), S((r) => w = r, n), f(n, i(x, {
+        get when() {
+          return e.chips;
+        },
+        get fallback() {
+          return (() => {
+            var r = W();
+            return f(r, () => _().map((a) => a.text).join(", ")), r;
+          })();
+        },
+        get children() {
+          var r = W();
+          return f(r, i(ne, {
+            get each() {
+              return _();
+            },
+            children: (a) => i(ie, {
+              get label() {
+                return a.text;
+              },
+              get onDelete() {
+                return G(a.value);
+              },
+              onDeleteMouseDown: T
+            })
+          })), r;
+        }
+      }), null), f(n, i(x, {
+        get when() {
+          return V(() => !!(e.search && typeof e.search == "boolean"))() && !e.readOnly;
+        },
+        get children() {
+          var r = oe(), a = r.firstChild, s = a.nextSibling;
+          return f(a, h), s.$$keydown = (d) => d.stopPropagation(), s.$$mousedown = (d) => {
+            d.stopPropagation(), m(!0);
+          }, s.$$input = E, S((d) => D = d, s), k(() => s.value = h()), r;
+        }
+      }), null), f(l, i(x, {
+        get when() {
+          return V(() => !!(Array.isArray(u()) && u().length > 0 || e.clearable && _().length > 0))() && !e.disabled;
+        },
+        get children() {
+          return i(R, {
+            name: "close",
+            size: 20,
+            onClick: J,
+            onMouseDown: T,
+            get class() {
+              return $("smwb-select-field__icon", "smwb-select-field__icon--close");
+            },
+            "aria-label": "Clear selection",
+            role: "button"
+          });
+        }
+      }), null), f(l, () => e.endAdornment, null), f(l, i(x, {
+        get when() {
+          return !e.hideSelectArrowIcon;
+        },
+        get children() {
+          return i(R, {
+            name: "arrow_drop_down",
+            get class() {
+              return $("smwb-select-field__icon", "smwb-select-field__icon--arrow", {
+                "smwb-select-field__icon--opened": o(),
+                "smwb-select-field__icon--focused": y(),
+                "smwb-select-field__icon--error": e.error
+              });
+            }
+          });
+        }
+      }), null), k((r) => {
+        var a = e.id, s = $("smwb-select-field", e.class, {
+          "smwb-select-field--filled": I() === "filled" && e.label,
+          "smwb-select-field--disabled": e.disabled,
+          "smwb-select-field--search": e.search,
+          "smwb-select-field--inline": e.inline
+        }), d = e.disabled ? void 0 : 0, F = o(), O = e.disabled || void 0, L = e["aria-label"];
+        return a !== r.e && v(t, "id", r.e = a), s !== r.t && Z(t, r.t = s), d !== r.a && v(t, "tabindex", r.a = d), F !== r.o && v(t, "aria-expanded", r.o = F), O !== r.i && v(t, "aria-disabled", r.i = O), L !== r.n && v(t, "aria-label", r.n = L), r;
+      }, {
+        e: void 0,
+        t: void 0,
+        a: void 0,
+        o: void 0,
+        i: void 0,
+        n: void 0
+      }), t;
+    }
+  }), i(le, {
+    anchorElement: () => p ?? null,
+    get menuMaxHeight() {
+      return e.menuMaxHeight;
+    },
+    get menuMiddleware() {
+      return e.menuMiddleware;
+    },
+    get search() {
+      return e.search === "menu";
+    },
+    onSearchInputChange: E,
+    get optionRenderer() {
+      return e.optionRenderer;
+    },
+    get items() {
+      return Q();
+    },
+    get searchValue() {
+      return h();
+    },
+    get isOpen() {
+      return o();
+    },
+    onClose: B,
+    onItemClick: q,
+    get value() {
+      return u();
+    },
+    get isLoading() {
+      return e.isLoading;
+    },
+    get menuNoItemsMessage() {
+      return e.menuNoItemsMessage;
+    },
+    get container() {
+      return e.menuContainer;
+    },
+    get virtualized() {
+      return e.virtualized;
+    },
+    get itemHeight() {
+      return e.itemHeight;
+    },
+    get createOption() {
+      return X();
+    }
+  })];
+}
+ee(["mousedown", "keydown", "input"]);
+export {
+  be as SelectField
+};
+//# sourceMappingURL=selectField.js.map

package/dist/headless/components/inputs/selectField/selectField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectField.js","sources":["../../../../../src/components/inputs/selectField/selectField.tsx"],"sourcesContent":["import { type JSX, For, Show, createEffect, createMemo, createSignal, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { DropdownMenu, type DropdownItem, type DropdownItemProps } from \"./dropdownMenu\";\nimport { Chip } from \"../../dataDisplay/chip\";\nimport { TextFieldWrapper } from \"../textField\";\nimport { Icon } from \"../../base/icon\";\nimport type { MenuItemProps } from \"../../navigation/menu\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\ntype SelectEvent = Event & { currentTarget: Element; target: Element };\ntype SearchEvent = Event & { currentTarget: HTMLInputElement };\ntype SelectValue = null | string | number | (string | number | undefined | null)[];\n\nexport type OnSelectChange = (e: SelectEvent, data: SelectFieldProps) => void;\n\nexport interface SelectFieldProps {\n  class?: string;\n  value?: SelectValue | undefined;\n  defaultValue?: null | string | number | (string | number)[];\n  onChange?: OnSelectChange;\n  disabled?: boolean;\n  readOnly?: boolean;\n  name?: string | undefined;\n  multiple?: boolean;\n  menuMaxHeight?: number;\n  menuMiddleware?: DropdownItemProps[\"menuMiddleware\"];\n  menuNoItemsMessage?: JSX.Element;\n  menuContainer?: HTMLElement;\n  search?: true | false | \"menu\";\n  chips?: boolean;\n  isFocused?: boolean;\n  error?: boolean;\n  items: DropdownItem[];\n  label?: string;\n  variant?: \"outlined\" | \"filled\";\n  fullWidth?: boolean;\n  helperText?: JSX.Element;\n  onSearch?: (e: SearchEvent) => void;\n  isLoading?: boolean;\n  resetSearch?: () => void;\n  inline?: boolean;\n  endAdornment?: JSX.Element;\n  hideSelectArrowIcon?: boolean;\n  optionRenderer?: (args: MenuItemProps) => JSX.Element;\n  clearable?: boolean;\n  creatable?: boolean;\n  onCreate?: (inputValue: string, event: SelectEvent) => void;\n  virtualized?: boolean;\n  itemHeight?: number;\n  \"aria-label\"?: string;\n  id?: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nfunction stopEvent(event: Event): void {\n  event.preventDefault();\n  event.stopPropagation();\n}\n\nexport function SelectField(props: SelectFieldProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"class\",\n    \"value\",\n    \"defaultValue\",\n    \"onChange\",\n    \"disabled\",\n    \"readOnly\",\n    \"name\",\n    \"multiple\",\n    \"menuMaxHeight\",\n    \"menuMiddleware\",\n    \"menuNoItemsMessage\",\n    \"menuContainer\",\n    \"search\",\n    \"chips\",\n    \"isFocused\",\n    \"error\",\n    \"items\",\n    \"label\",\n    \"variant\",\n    \"fullWidth\",\n    \"helperText\",\n    \"onSearch\",\n    \"resetSearch\",\n    \"isLoading\",\n    \"inline\",\n    \"endAdornment\",\n    \"hideSelectArrowIcon\",\n    \"optionRenderer\",\n    \"clearable\",\n    \"creatable\",\n    \"onCreate\",\n    \"virtualized\",\n    \"itemHeight\",\n    \"aria-label\",\n    \"id\",\n    \"ref\",\n  ]);\n\n  const variant = (): \"outlined\" | \"filled\" => local.variant ?? \"outlined\";\n  const [isOpen, setIsOpen] = createSignal(false);\n  const [valueState, setValueState] = createSignal<SelectValue | undefined>(local.defaultValue);\n  const [searchValue, setSearchValue] = createSignal(\"\");\n\n  const isControlled = local.value != null;\n  let anchorEl: HTMLSpanElement | undefined;\n  let searchWrapperEl: HTMLSpanElement | undefined;\n  let searchInputEl: HTMLInputElement | undefined;\n\n  const value = (): SelectValue | undefined => (isControlled ? local.value : valueState());\n  const isFocused = (): boolean => !!local.isFocused || isOpen();\n\n  // Selection is derived from the current value — no effect-driven sync.\n  const selectedItems = createMemo<DropdownItem[]>(() => {\n    const v = value();\n    if (Array.isArray(v)) return local.items.filter((item) => v.includes(item.value));\n    if (v === undefined || v === null || v === \"\") return [];\n    const item = local.items.find((i) => i.value === v);\n    return item ? [item] : [];\n  });\n\n  const updateValue = (event: SelectEvent, next: SelectValue | undefined): void => {\n    local.onChange?.(event, { ...props, value: next, name: local.name || undefined });\n    setValueState(next);\n  };\n\n  const onMouseDown: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    if (event.button !== 0) return;\n    event.preventDefault();\n    anchorEl?.focus();\n    setIsOpen(!isOpen());\n  };\n\n  const onClose = (): void => {\n    setIsOpen(false);\n    anchorEl?.focus();\n  };\n\n  const onFocus = (): void => {\n    if (local.search === true) searchInputEl?.focus();\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (!local.readOnly && [\" \", \"ArrowUp\", \"ArrowDown\", \"Enter\"].includes(event.key)) {\n      event.preventDefault();\n      setIsOpen(!isOpen());\n    }\n  };\n\n  // Reset search text when the field loses focus / menu closes.\n  createEffect(() => {\n    if (!isFocused() || (local.search === \"menu\" && !isOpen())) {\n      setSearchValue(\"\");\n      local.resetSearch?.();\n    }\n  });\n\n  // Keep the multi-value scroller pinned to the end.\n  createEffect(() => {\n    value();\n    if (searchWrapperEl) searchWrapperEl.scrollLeft = searchWrapperEl.scrollWidth;\n  });\n\n  const onItemClick = (event: SelectEvent, item: DropdownItem): void => {\n    let next: SelectValue | undefined;\n    if (local.multiple) {\n      const current = value();\n      const valueArray = (Array.isArray(current) ? current : [current].filter(Boolean)) as Array<string | number | undefined | null>;\n      next = valueArray.slice();\n      const idx = next.findIndex((el) => el === item.value);\n      if (idx === -1) next.push(item.value);\n      else next.splice(idx, 1);\n    } else {\n      next = value() === item.value ? \"\" : item.value;\n    }\n    if (searchValue()) setSearchValue(\"\");\n    if (!local.multiple) {\n      setIsOpen(false);\n      anchorEl?.focus();\n    }\n    updateValue(event, next);\n  };\n\n  const onSearchInputChange = (event: SearchEvent): void => {\n    setSearchValue(event.currentTarget.value);\n    local.onSearch?.(event);\n    if (!isOpen()) setIsOpen(true);\n  };\n\n  const onDeleteChip = (currentValue: string | number | undefined | null) => (event: SelectEvent): void => {\n    const current = value();\n    if (Array.isArray(current)) {\n      updateValue(event, current.filter((v) => currentValue !== v));\n    }\n  };\n\n  const onResetSelected: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    updateValue(event, []);\n  };\n\n  const filteredItems = (): DropdownItem[] => {\n    if (local.onSearch) return local.items;\n    const sv = searchValue();\n    if (sv) return local.items.filter((el) => el.text.search(new RegExp(sv, \"i\")) !== -1);\n    return local.items;\n  };\n\n  const createOption = (): DropdownItemProps[\"createOption\"] => {\n    const sv = searchValue();\n    if (local.creatable && sv && !local.items.some((i) => i.text.toLowerCase() === sv.toLowerCase())) {\n      return {\n        text: `Создать \"${sv}\"`,\n        onCreate: (event) => {\n          local.onCreate?.(sv, event);\n          setSearchValue(\"\");\n          setIsOpen(false);\n        },\n      };\n    }\n    return undefined;\n  };\n\n  return (\n    <>\n      <TextFieldWrapper\n        label={local.label}\n        helperText={local.helperText}\n        variant={variant()}\n        disabled={local.disabled}\n        class={local.class}\n        error={local.error}\n        fullWidth={local.fullWidth}\n        isFilledState={!!selectedItems().length || !!searchValue()}\n        isFocused={isFocused()}\n        inline={local.inline}\n      >\n        <span\n          ref={mergeRefs(local.ref, (el) => (anchorEl = el as HTMLSpanElement))}\n          id={local.id}\n          class={cn(\"smwb-select-field\", local.class, {\n            \"smwb-select-field--filled\": variant() === \"filled\" && local.label,\n            \"smwb-select-field--disabled\": local.disabled,\n            \"smwb-select-field--search\": local.search,\n            \"smwb-select-field--inline\": local.inline,\n          })}\n          tabindex={local.disabled ? undefined : 0}\n          role=\"button\"\n          aria-haspopup=\"listbox\"\n          aria-expanded={isOpen()}\n          aria-disabled={local.disabled || undefined}\n          aria-label={local[\"aria-label\"]}\n          onMouseDown={local.disabled || local.readOnly ? undefined : onMouseDown}\n          onFocus={onFocus}\n          onKeyDown={onKeyDown}\n          data-testid=\"select-field\"\n        >\n          <span class=\"smwb-select-field__search-wrapper\" ref={(el) => (searchWrapperEl = el)}>\n            <Show\n              when={local.chips}\n              fallback={<span class=\"smwb-select-field__values\">{selectedItems().map((el) => el.text).join(\", \")}</span>}\n            >\n              <span class=\"smwb-select-field__values\">\n                <For each={selectedItems()}>\n                  {(item) => (\n                    <Chip label={item.text} onDelete={onDeleteChip(item.value)} onDeleteMouseDown={stopEvent} />\n                  )}\n                </For>\n              </span>\n            </Show>\n            <Show when={local.search && typeof local.search === \"boolean\" && !local.readOnly}>\n              <span class=\"smwb-select-field__search\">\n                <span class=\"smwb-select-field__search-text\">{searchValue()}</span>\n                <input\n                  class=\"smwb-select-field__search-input\"\n                  ref={(el) => (searchInputEl = el)}\n                  type=\"text\"\n                  value={searchValue()}\n                  onInput={onSearchInputChange}\n                  onMouseDown={(event) => {\n                    event.stopPropagation();\n                    setIsOpen(true);\n                  }}\n                  onKeyDown={(event) => event.stopPropagation()}\n                  data-testid=\"search-input\"\n                />\n              </span>\n            </Show>\n          </span>\n          <span class=\"smwb-select-field__actions\">\n            <Show\n              when={\n                ((Array.isArray(value()) && (value() as unknown[]).length > 0) ||\n                  (local.clearable && selectedItems().length > 0)) &&\n                !local.disabled\n              }\n            >\n              <Icon\n                name=\"close\"\n                size={20}\n                onClick={onResetSelected}\n                onMouseDown={stopEvent}\n                class={cn(\"smwb-select-field__icon\", \"smwb-select-field__icon--close\")}\n                aria-label=\"Clear selection\"\n                role=\"button\"\n              />\n            </Show>\n            {local.endAdornment}\n            <Show when={!local.hideSelectArrowIcon}>\n              <Icon\n                name=\"arrow_drop_down\"\n                class={cn(\"smwb-select-field__icon\", \"smwb-select-field__icon--arrow\", {\n                  \"smwb-select-field__icon--opened\": isOpen(),\n                  \"smwb-select-field__icon--focused\": isFocused(),\n                  \"smwb-select-field__icon--error\": local.error,\n                })}\n              />\n            </Show>\n          </span>\n        </span>\n      </TextFieldWrapper>\n      <DropdownMenu\n        anchorElement={() => anchorEl ?? null}\n        menuMaxHeight={local.menuMaxHeight}\n        menuMiddleware={local.menuMiddleware}\n        search={local.search === \"menu\"}\n        onSearchInputChange={onSearchInputChange}\n        optionRenderer={local.optionRenderer}\n        items={filteredItems()}\n        searchValue={searchValue()}\n        isOpen={isOpen()}\n        onClose={onClose}\n        onItemClick={onItemClick}\n        value={value()}\n        isLoading={local.isLoading}\n        menuNoItemsMessage={local.menuNoItemsMessage}\n        container={local.menuContainer}\n        virtualized={local.virtualized}\n        itemHeight={local.itemHeight}\n        createOption={createOption()}\n      />\n    </>\n  );\n}\n\nexport default SelectField;\n"],"names":["stopEvent","event","preventDefault","stopPropagation","SelectField","props","local","splitProps","variant","isOpen","setIsOpen","createSignal","valueState","setValueState","defaultValue","searchValue","setSearchValue","isControlled","value","anchorEl","searchWrapperEl","searchInputEl","isFocused","selectedItems","createMemo","v","Array","isArray","items","filter","item","includes","find","i","updateValue","next","onChange","name","undefined","onMouseDown","button","focus","onClose","onFocus","search","onKeyDown","readOnly","key","createEffect","resetSearch","scrollLeft","scrollWidth","onItemClick","multiple","current","Boolean","slice","idx","findIndex","el","push","splice","onSearchInputChange","currentTarget","onSearch","onDeleteChip","currentValue","onResetSelected","filteredItems","sv","text","RegExp","createOption","creatable","some","toLowerCase","onCreate","_$createComponent","TextFieldWrapper","label","helperText","disabled","class","error","fullWidth","isFilledState","length","inline","children","_el$","_tmpl$3","_el$2","firstChild","_el$7","nextSibling","$$keydown","addEventListener","_$addEventListener","_ref$","mergeRefs","ref","_$use","_$insert","Show","when","chips","fallback","_el$8","_tmpl$","map","join","_el$3","For","each","Chip","onDelete","onDeleteMouseDown","_$memo","_el$4","_tmpl$2","_el$5","_el$6","$$mousedown","$$input","_$effect","clearable","Icon","size","onClick","cn","role","endAdornment","hideSelectArrowIcon","_p$","_v$","id","_v$2","_v$3","_v$4","_v$5","_v$6","e","_$setAttribute","t","_$className","a","o","n","DropdownMenu","anchorElement","menuMaxHeight","menuMiddleware","optionRenderer","isLoading","menuNoItemsMessage","container","menuContainer","virtualized","itemHeight","_$delegateEvents"],"mappings":"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"}

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

@@ -0,0 +1,357 @@
+import { createComponent as c, use as ce, spread as ve, mergeProps as he, insert as x, effect as R, style as K, addEventListener as Ae, setAttribute as l, className as be, setStyleProperty as Te, memo as Me, template as V, delegateEvents as Ve } from "solid-js/web";
+import { Show as P, mergeProps as fe, splitProps as ge, createSignal as Z, onMount as we, onCleanup as re, For as ne } from "solid-js";
+import ae from "clsx";
+import { toPercent as M, coordY as xe, rescale as se, coordX as _e } from "./utils.js";
+import { mergeRefs as pe } from "../../../primitives/mergeRefs.js";
+import { TextFieldWrapper as ye } from "../textField/textFieldWrapper.js";
+import { TextField as Ce } from "../textField/textField.js";
+var ke = /* @__PURE__ */ V("<span class=smwb-slider__marks aria-hidden=true>"), Se = /* @__PURE__ */ V("<div class=smwb-slider__container><span><span class=smwb-slider__rail></span><span class=smwb-slider__track>"), $e = /* @__PURE__ */ V("<span class=smwb-slider__mark-label>"), Ee = /* @__PURE__ */ V("<span class=smwb-slider__mark>"), ze = /* @__PURE__ */ V("<span><input class=smwb-slider__input type=range>"), De = /* @__PURE__ */ V("<span class=smwb-slider__ticks>"), Pe = /* @__PURE__ */ V("<span class=smwb-slider__thumb-tooltip>"), Re = /* @__PURE__ */ V("<div class=smwb-slider__container><span><span class=smwb-slider__rail></span><span class=smwb-slider__track></span><span><input data-testid=slider-input class=smwb-slider__input type=range readonly>"), Fe = /* @__PURE__ */ V("<span class=smwb-slider__tick>");
+function Le(v, C, e, F) {
+  if (!v) return [];
+  if (Array.isArray(v)) return v;
+  const E = F && F > 0 ? F : (e - C) / 10, B = [];
+  for (let d = C; d <= e + 1e-9; d += E)
+    B.push({
+      value: Math.round(d * 1e6) / 1e6
+    });
+  return B;
+}
+function Be(v) {
+  const C = fe({
+    min: 0,
+    max: 100,
+    disabled: !1,
+    size: "medium",
+    color: "primary",
+    orientation: "horizontal"
+  }, v), [e, F] = ge(C, ["defaultValue", "value", "onChange", "min", "max", "name", "disabled", "class", "step", "label", "helperText", "error", "size", "color", "orientation", "marks", "getAriaValueText", "aria-label", "range", "variant", "valueField", "withTicks", "ref"]), E = () => e.orientation === "vertical", B = (a) => {
+    const n = Array.isArray(a) ? a : [e.min, e.max], m = Math.min(n[0] ?? e.min, n[1] ?? e.max), b = Math.max(n[0] ?? e.min, n[1] ?? e.max);
+    return [m, b];
+  }, d = e.value !== void 0, [ee, W] = Z(B(e.defaultValue)), g = () => d ? B(e.value) : ee();
+  let X, Y = 0, I = !1;
+  const S = () => Le(e.marks, e.min, e.max, e.step), z = (a) => {
+    const n = X?.getBoundingClientRect();
+    if (!n) return e.min;
+    if (E()) {
+      const b = xe(a) - n.top;
+      return se(n.height - b, [0, n.height], [e.min, e.max], {
+        step: e.step
+      });
+    }
+    const m = _e(a) - n.left;
+    return se(m, [0, n.width], [e.min, e.max], {
+      step: e.step
+    });
+  }, ie = (a, n) => {
+    const m = Math.min(a[0], a[1]), b = Math.max(a[0], a[1]), w = [Math.max(e.min, m), Math.min(e.max, b)];
+    d || W(w), e.onChange?.(n, w, v);
+  }, N = (a, n) => {
+    const m = g(), b = [m[0], m[1]];
+    b[Y] = Math.max(e.min, Math.min(e.max, a)), ie(b, n);
+  }, _ = (a) => {
+    const n = g();
+    Y = Math.abs(a - n[0]) <= Math.abs(a - n[1]) ? 0 : 1;
+  }, L = (a) => {
+    I && (a.preventDefault(), N(z(a), a));
+  }, h = () => {
+    I = !1, document.removeEventListener("mousemove", L), document.removeEventListener("mouseup", h), document.removeEventListener("touchmove", L), document.removeEventListener("touchend", h);
+  }, D = (a) => {
+    if (e.disabled || a.button !== 0) return;
+    const n = z(a);
+    _(n), I = !0, N(n, a), document.addEventListener("mousemove", L), document.addEventListener("mouseup", h);
+  }, U = (a) => {
+    if (e.disabled) return;
+    const n = z(a);
+    _(n), I = !0, N(n, a), document.addEventListener("touchmove", L), document.addEventListener("touchend", h);
+  };
+  we(() => {
+    X && (X.addEventListener("touchstart", U), re(() => X?.removeEventListener("touchstart", U)));
+  }), re(h);
+  const H = (a) => (n) => {
+    if (e.disabled) return;
+    const m = e.step && e.step > 0 ? e.step : 1, b = g();
+    let w = null;
+    n.key === "ArrowLeft" || n.key === "ArrowDown" ? w = b[a] - m : n.key === "ArrowRight" || n.key === "ArrowUp" ? w = b[a] + m : n.key === "Home" ? w = e.min : n.key === "End" && (w = e.max), w !== null && (n.preventDefault(), Y = a, N(w, n));
+  }, te = () => ae("smwb-slider", "smwb-slider--range", e.class, {
+    "smwb-slider--disabled": e.disabled,
+    "smwb-slider--vertical": E()
+  }, e.size !== "medium" && `smwb-slider_size-${e.size}`, e.color !== "primary" && `smwb-slider_color-${e.color}`);
+  return c(ye, {
+    get label() {
+      return e.label;
+    },
+    get helperText() {
+      return e.helperText;
+    },
+    get disabled() {
+      return e.disabled;
+    },
+    get error() {
+      return e.error;
+    },
+    fullWidth: !0,
+    shrink: !0,
+    get children() {
+      var a = Se(), n = a.firstChild, m = n.firstChild, b = m.nextSibling;
+      n.$$mousedown = D;
+      var w = pe(e.ref, (o) => X = o);
+      return typeof w == "function" && ce(w, n), ve(n, he({
+        get class() {
+          return te();
+        }
+      }, F), !1, !0), x(n, c(P, {
+        get when() {
+          return S().length > 0;
+        },
+        get children() {
+          var o = ke();
+          return x(o, c(ne, {
+            get each() {
+              return S();
+            },
+            children: (f) => (() => {
+              var s = Ee();
+              return x(s, c(P, {
+                get when() {
+                  return f.label != null;
+                },
+                get children() {
+                  var t = $e();
+                  return x(t, () => f.label), t;
+                }
+              })), R((t) => K(s, E() ? {
+                bottom: `${M(f.value, e.min, e.max)}%`
+              } : {
+                left: `${M(f.value, e.min, e.max)}%`
+              }, t)), s;
+            })()
+          })), o;
+        }
+      }), m), x(n, c(ne, {
+        each: [0, 1],
+        children: (o) => (() => {
+          var f = ze(), s = f.firstChild;
+          return Ae(s, "keydown", H(o), !0), s.addEventListener("change", () => {
+          }), l(s, "data-testid", `slider-input-${o}`), R((t) => {
+            var i = ae("smwb-slider__thumb", `smwb-slider__thumb--${o === 0 ? "start" : "end"}`), p = E() ? {
+              bottom: `${M(g()[o], e.min, e.max)}%`
+            } : {
+              left: `${M(g()[o], e.min, e.max)}%`
+            }, y = e.min, k = e.max, u = e.step, j = e.name ? `${e.name}[${o}]` : void 0, r = e.disabled, $ = e.disabled ? -1 : 0, A = e["aria-label"] ? `${e["aria-label"]} ${o === 0 ? "minimum" : "maximum"}` : void 0, T = e.orientation, q = g()[o], G = o === 0 ? e.min : g()[0], J = o === 0 ? g()[1] : e.max, O = e.getAriaValueText ? e.getAriaValueText(g()[o]) : void 0, Q = e.disabled || void 0;
+            return i !== t.e && be(f, t.e = i), t.t = K(f, p, t.t), y !== t.a && l(s, "min", t.a = y), k !== t.o && l(s, "max", t.o = k), u !== t.i && l(s, "step", t.i = u), j !== t.n && l(s, "name", t.n = j), r !== t.s && (s.disabled = t.s = r), $ !== t.h && l(s, "tabindex", t.h = $), A !== t.r && l(s, "aria-label", t.r = A), T !== t.d && l(s, "aria-orientation", t.d = T), q !== t.l && l(s, "aria-valuenow", t.l = q), G !== t.u && l(s, "aria-valuemin", t.u = G), J !== t.c && l(s, "aria-valuemax", t.c = J), O !== t.w && l(s, "aria-valuetext", t.w = O), Q !== t.m && l(s, "aria-disabled", t.m = Q), t;
+          }, {
+            e: void 0,
+            t: void 0,
+            a: void 0,
+            o: void 0,
+            i: void 0,
+            n: void 0,
+            s: void 0,
+            h: void 0,
+            r: void 0,
+            d: void 0,
+            l: void 0,
+            u: void 0,
+            c: void 0,
+            w: void 0,
+            m: void 0
+          }), R(() => s.value = g()[o]), f;
+        })()
+      }), null), R((o) => K(b, (() => {
+        const f = M(g()[0], e.min, e.max), s = M(g()[1], e.min, e.max), t = `${Math.min(f, s)}%`, i = `${Math.abs(s - f)}%`;
+        return E() ? {
+          bottom: t,
+          height: i
+        } : {
+          left: t,
+          width: i
+        };
+      })(), o)), a;
+    }
+  });
+}
+function Xe(v) {
+  const C = fe({
+    min: 0,
+    max: 100,
+    disabled: !1,
+    variant: "continuous",
+    size: "medium",
+    color: "primary",
+    orientation: "horizontal"
+  }, v), [e, F] = ge(C, ["defaultValue", "value", "onChange", "min", "max", "name", "disabled", "class", "step", "variant", "valueField", "withTicks", "label", "helperText", "error", "size", "color", "orientation", "marks", "range", "getAriaValueText", "aria-label", "ref"]), E = typeof e.defaultValue == "number" ? e.defaultValue : void 0, B = () => typeof e.value == "number" ? e.value : void 0, d = () => e.orientation === "vertical", ee = typeof e.value == "number", W = () => e.variant === "discrete", [g, X] = Z(E ?? e.min), [Y, I] = Z(!1), [S, z] = Z(!1), [ie, N] = Z(!1);
+  let _, L = !1;
+  const h = () => ee ? B() : g(), D = (t, i) => {
+    t < e.min || t > e.max || (ee || X(t), e.onChange?.(i, t, v));
+  }, U = (t, i) => se(t, [0, i], [e.min, e.max], {
+    step: e.step
+  }), H = (t) => {
+    if (!L || !_) return;
+    const i = _.getBoundingClientRect(), p = _e(t), y = xe(t), k = d() ? i.height - (y - i.top) : p - i.left, u = U(k, d() ? i.height : i.width);
+    S() || z(!0), h() !== u && (Y() || I(!0), D(u, t));
+  }, te = () => {
+    document.removeEventListener("mousemove", H), document.removeEventListener("mouseup", a), document.removeEventListener("touchmove", H), document.removeEventListener("touchend", a);
+  }, a = () => {
+    L = !1, Y() && I(!1), S() && z(!1), te();
+  }, n = (t) => {
+    if (e.disabled || t.button !== 0 || !_) return;
+    L = !0;
+    const i = _.getBoundingClientRect(), p = d() ? i.height - (t.clientY - i.top) : t.clientX - i.left, y = U(p, d() ? i.height : i.width);
+    S() || z(!0), D(y, t), document.addEventListener("mousemove", H), document.addEventListener("mouseup", a);
+  }, m = (t) => {
+    if (e.disabled || !_) return;
+    L = !0;
+    const i = _.getBoundingClientRect(), p = t.changedTouches?.[0];
+    if (!p) return;
+    const y = d() ? i.height - (p.clientY - i.top) : p.clientX - i.left, k = U(y, d() ? i.height : i.width);
+    S() || z(!0), D(k, t), document.addEventListener("touchmove", H), document.addEventListener("touchend", a);
+  };
+  we(() => {
+    _ && (_.addEventListener("touchstart", m), re(() => _?.removeEventListener("touchstart", m)));
+  }), re(te);
+  const b = (t) => {
+    !ie() || e.disabled || ((t.key === "ArrowLeft" || t.key === "ArrowDown") && D(h() - (e.step || 1), t), (t.key === "ArrowRight" || t.key === "ArrowUp") && D(h() + (e.step || 1), t));
+  }, w = () => ae("smwb-slider", e.class, {
+    "smwb-slider--disabled": e.disabled,
+    "smwb-slider--dragging": Y(),
+    "smwb-slider--discrete": W(),
+    "smwb-slider--vertical": d()
+  }, e.size !== "medium" && `smwb-slider_size-${e.size}`, e.color !== "primary" && `smwb-slider_color-${e.color}`), o = () => `${M(h(), e.min, e.max)}%`, f = () => Le(e.marks, e.min, e.max, e.step), s = () => Array(Math.round(e.max / (e.step || 1)) + 1).fill(1);
+  return c(ye, {
+    get label() {
+      return e.label;
+    },
+    get helperText() {
+      return e.helperText;
+    },
+    get disabled() {
+      return e.disabled;
+    },
+    get error() {
+      return e.error;
+    },
+    fullWidth: !0,
+    shrink: !0,
+    get children() {
+      var t = Re(), i = t.firstChild, p = i.firstChild, y = p.nextSibling, k = y.nextSibling, u = k.firstChild;
+      i.addEventListener("blur", () => N(!1)), i.addEventListener("focus", () => N(!0)), i.$$mousedown = n;
+      var j = pe(e.ref, (r) => _ = r);
+      return typeof j == "function" && ce(j, i), i.$$keydown = b, ve(i, he({
+        get class() {
+          return w();
+        },
+        get tabindex() {
+          return e.disabled ? -1 : 0;
+        }
+      }, F), !1, !0), x(i, c(P, {
+        get when() {
+          return e.withTicks;
+        },
+        get children() {
+          var r = De();
+          return x(r, c(ne, {
+            get each() {
+              return s();
+            },
+            children: () => Fe()
+          })), R(($) => Te(r, "gap", `${e.step}`)), r;
+        }
+      }), p), x(i, c(P, {
+        get when() {
+          return f().length > 0;
+        },
+        get children() {
+          var r = ke();
+          return x(r, c(ne, {
+            get each() {
+              return f();
+            },
+            children: ($) => (() => {
+              var A = Ee();
+              return x(A, c(P, {
+                get when() {
+                  return $.label != null;
+                },
+                get children() {
+                  var T = $e();
+                  return x(T, () => $.label), T;
+                }
+              })), R((T) => K(A, d() ? {
+                bottom: `${M($.value, e.min, e.max)}%`
+              } : {
+                left: `${M($.value, e.min, e.max)}%`
+              }, T)), A;
+            })()
+          })), r;
+        }
+      }), p), x(k, c(P, {
+        get when() {
+          return W();
+        },
+        get children() {
+          var r = Pe();
+          return x(r, () => Math.round(h())), r;
+        }
+      }), u), x(t, c(P, {
+        get when() {
+          return Me(() => !!e.valueField)() && W();
+        },
+        get children() {
+          return c(Ce, {
+            type: "number",
+            get value() {
+              return h();
+            },
+            onChange: (r) => D(+r.currentTarget.value, r),
+            variant: "filled"
+          });
+        }
+      }), null), R((r) => {
+        var $ = d() ? {
+          height: o()
+        } : {
+          width: o()
+        }, A = ae("smwb-slider__thumb", {
+          "smwb-slider__thumb--active": S(),
+          "smwb-slider__thumb--discrete": W()
+        }), T = d() ? {
+          bottom: o()
+        } : {
+          left: o()
+        }, q = e.min, G = e.max, J = e.name, O = e["aria-label"], Q = e.orientation, oe = h(), le = e.min, ue = e.max, de = e.getAriaValueText ? e.getAriaValueText(h()) : void 0, me = e.disabled || void 0;
+        return r.e = K(y, $, r.e), A !== r.t && be(k, r.t = A), r.a = K(k, T, r.a), q !== r.o && l(u, "min", r.o = q), G !== r.i && l(u, "max", r.i = G), J !== r.n && l(u, "name", r.n = J), O !== r.s && l(u, "aria-label", r.s = O), Q !== r.h && l(u, "aria-orientation", r.h = Q), oe !== r.r && l(u, "aria-valuenow", r.r = oe), le !== r.d && l(u, "aria-valuemin", r.d = le), ue !== r.l && l(u, "aria-valuemax", r.l = ue), de !== r.u && l(u, "aria-valuetext", r.u = de), me !== r.c && l(u, "aria-disabled", r.c = me), r;
+      }, {
+        e: void 0,
+        t: void 0,
+        a: void 0,
+        o: void 0,
+        i: void 0,
+        n: void 0,
+        s: void 0,
+        h: void 0,
+        r: void 0,
+        d: void 0,
+        l: void 0,
+        u: void 0,
+        c: void 0
+      }), R(() => u.value = h()), t;
+    }
+  });
+}
+function je(v) {
+  const C = v.range === !0 || Array.isArray(v.value) || Array.isArray(v.defaultValue);
+  return c(P, {
+    when: C,
+    get fallback() {
+      return c(Xe, v);
+    },
+    get children() {
+      return c(Be, v);
+    }
+  });
+}
+Ve(["mousedown", "keydown"]);
+export {
+  je as Slider
+};
+//# sourceMappingURL=slider.js.map