@solibo/solibo-ui 1.0.27 → 1.1.0

package/dist/components/dropdown/index.js

@@ -1,11 +1,11 @@
 import { jsxs as p, Fragment as me, jsx as i } from "react/jsx-runtime";
 import { t as y } from "../../classix-DG18itHa.js";
-import ve, { Children as ge, isValidElement as x, useRef as L, useId as he, useState as Q, useEffect as z } from "react";
-import { Button as M } from "../button/index.js";
-import { i as _e } from "../../icons-BkaMeh-J.js";
-import { f as be, I as ye } from "../../index-DMGGDV9J.js";
+import ve, { Children as ge, isValidElement as x, useRef as L, useId as _e, useState as W, useEffect as G } from "react";
+import { Button as Q } from "../button/index.js";
+import { i as he } from "../../icons-Dm2kyF0g.js";
+import { f as be, I as ye } from "../../index-m3slpD7c.js";
 import { List as xe } from "../list/index.js";
-import { S as we, s as Ne, r as ee } from "../../index-BAxpgMzb.js";
+import { S as we, s as Ne, r as ee } from "../../index-DycOZMJl.js";
 import '../../assets/index37.css';function $(t) {
   return typeof t == "string" || typeof t == "number" ? String(t) : Array.isArray(t) ? t.map($).join(" ") : x(t) ? $(t.props.children) : "";
 }
@@ -21,11 +21,11 @@ function Ee(t) {
 function Ve(t) {
   return x(t) && t.type === we;
 }
-function A(t, s, r = !1) {
+function z(t, s, r = !1) {
   const l = [];
   return ge.forEach(t, (n) => {
     if (Ee(n))
-      l.push(...A(n.props.children, s, r));
+      l.push(...z(n.props.children, s, r));
     else if (Se(n)) {
       const a = $(n.props.children).trim(), f = n.props.value != null ? String(n.props.value) : a;
       l.push({
@@ -38,7 +38,7 @@ function A(t, s, r = !1) {
         text: a,
         value: f
       });
-    } else Ce(n) && l.push(...A(n.props.children, n.props.label, r || !!n.props.disabled));
+    } else Ce(n) && l.push(...z(n.props.children, n.props.label, r || !!n.props.disabled));
   }), l;
 }
 function Ie(t) {
@@ -58,7 +58,7 @@ function Be(t, s, r) {
   var l, n;
   return s != null ? String(s) : r != null ? String(r) : ((l = t.find((a) => a.selected)) == null ? void 0 : l.value) ?? ((n = t[0]) == null ? void 0 : n.value) ?? "";
 }
-function Pe(t) {
+function De(t) {
   if (Ve(t)) {
     const {
       children: s,
@@ -78,19 +78,19 @@ function Pe(t) {
     props: t.props
   };
 }
-const ke = "_combobox_vg3rv_3", De = "_dropdown_vg3rv_27", Re = "_empty_vg3rv_32", je = "_group_vg3rv_33", Fe = "_placeholder_vg3rv_34", We = "_filter_vg3rv_42", Qe = "_native_vg3rv_53", ze = "_option_vg3rv_63", Me = "_options_vg3rv_85", Ae = "_panel_vg3rv_109", Ge = "_selected_vg3rv_134", Ke = "_text_vg3rv_138", Oe = "_trigger_vg3rv_146", Te = "_minimal_vg3rv_183", qe = "_inline_vg3rv_238", He = "_label_vg3rv_270", o = {
-  combobox: ke,
+const Pe = "_combobox_vg3rv_3", ke = "_dropdown_vg3rv_27", Re = "_empty_vg3rv_32", je = "_group_vg3rv_33", Fe = "_placeholder_vg3rv_34", Me = "_filter_vg3rv_42", We = "_native_vg3rv_53", Ge = "_option_vg3rv_63", Qe = "_options_vg3rv_85", ze = "_panel_vg3rv_109", Ae = "_selected_vg3rv_134", Ke = "_text_vg3rv_138", Oe = "_trigger_vg3rv_146", Te = "_minimal_vg3rv_183", qe = "_inline_vg3rv_238", He = "_label_vg3rv_270", o = {
+  combobox: Pe,
   "combobox-input": "_combobox-input_vg3rv_12",
-  dropdown: De,
+  dropdown: ke,
   empty: Re,
   group: je,
   placeholder: Fe,
-  filter: We,
-  native: Qe,
-  option: ze,
-  options: Me,
-  panel: Ae,
-  selected: Ge,
+  filter: Me,
+  native: We,
+  option: Ge,
+  options: Qe,
+  panel: ze,
+  selected: Ae,
   text: Ke,
   trigger: Oe,
   minimal: Te,
@@ -100,7 +100,7 @@ const ke = "_combobox_vg3rv_3", De = "_dropdown_vg3rv_27", Re = "_empty_vg3rv_32
 };
 function te(t, s) {
   return {
-    "--icon-svg": _e(t).replace("currentColor", s)
+    "--icon-svg": he(t, s)
   };
 }
 const rt = ({
@@ -113,37 +113,37 @@ const rt = ({
   renderOption: f,
   searchPlaceholder: B = "Filter",
   selectedItems: ne,
-  variant: h = "default",
+  variant: _ = "default",
   ...re
 }) => {
-  const P = Pe(t), {
+  const D = De(t), {
     defaultValue: le,
-    onChange: k,
-    value: D,
+    onChange: P,
+    value: k,
     ...oe
-  } = P.props, w = Ne(oe), {
+  } = D.props, w = Ne(oe), {
     className: se,
     ...ie
-  } = w, G = L(null), K = L(null), N = he(), O = L(null), m = L(null), _ = A(P.children), b = D != null, R = Be(_, D, le), [j, F] = Q(() => R), [c, d] = Q(!1), [S, C] = Q(""), E = b ? String(D) : j, T = {
+  } = w, A = L(null), K = L(null), N = _e(), O = L(null), m = L(null), h = z(D.children), b = k != null, R = Be(h, k, le), [j, F] = W(() => R), [c, d] = W(!1), [S, C] = W(""), E = b ? String(k) : j, T = {
     default: ee("--colors-semantic-content-secondary"),
     white: ee("--color-white", "white")
-  }, q = h === "minimal" ? T.white : T.default, V = $e(_, E), ae = te("chevron", q), ce = te("search", q), H = Le(_, S), v = S.trim(), I = !!(r && l && v && l.isValid(v)), ue = a && h === "inline" ? be(a) : a, J = (e) => e ? (f == null ? void 0 : f({
+  }, q = _ === "minimal" ? T.white : T.default, V = $e(h, E), ae = te("CaretDown", q), ce = te("MagnifyingGlass", q), H = Le(h, S), v = S.trim(), I = !!(r && l && v && l.isValid(v)), ue = a && _ === "inline" ? be(a) : a, J = (e) => e ? (f == null ? void 0 : f({
     groupLabel: e.groupLabel,
     isSelected: e.value === E,
     label: e.label,
     text: e.text,
     value: e.value
   })) ?? e.label : "Select an option";
-  z(() => {
-    !b && !_.some((e) => e.value === j) && F(R);
-  }, [R, j, b, _]), z(() => {
+  G(() => {
+    !b && !h.some((e) => e.value === j) && F(R);
+  }, [R, j, b, h]), G(() => {
     var e;
     if (!c) {
       C("");
       return;
     }
     (e = m.current) == null || e.focus();
-  }, [c]), z(() => {
+  }, [c]), G(() => {
     if (!c)
       return;
     const e = (u) => {
@@ -155,10 +155,10 @@ const rt = ({
     };
   }, [c]);
   const de = (e) => {
-    b || F(e.target.value), k == null || k(e);
-  }, W = () => {
+    b || F(e.target.value), P == null || P(e);
+  }, M = () => {
     var e;
-    d(!1), r || (e = G.current) == null || e.focus();
+    d(!1), r || (e = A.current) == null || e.focus();
   }, U = () => {
     var e;
     C(""), d(!0), (e = m.current) == null || e.focus();
@@ -169,17 +169,17 @@ const rt = ({
     b || F(e);
     const u = O.current;
     if (!u) {
-      W();
+      M();
       return;
     }
     const g = (Z = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, "value")) == null ? void 0 : Z.set;
     g == null || g.call(u, e), u.dispatchEvent(new Event("change", {
       bubbles: !0
-    })), r ? U() : W();
+    })), r ? U() : M();
   }, fe = (e) => {
-    e.key === "Escape" && W(), e.key === "Enter" && e.target === m.current && I && (e.preventDefault(), X());
-  }, Y = /* @__PURE__ */ p("div", { className: y(o.dropdown, h === "inline" && o.inline, h === "minimal" && o.minimal, s), onKeyDown: fe, ref: K, ...re, children: [
-    /* @__PURE__ */ i("select", { ...ie, "aria-hidden": "true", className: y(o.native, se), onChange: de, ref: O, tabIndex: -1, value: E, children: P.children }),
+    e.key === "Escape" && M(), e.key === "Enter" && e.target === m.current && I && (e.preventDefault(), X());
+  }, Y = /* @__PURE__ */ p("div", { className: y(o.dropdown, _ === "inline" && o.inline, _ === "minimal" && o.minimal, s), onKeyDown: fe, ref: K, ...re, children: [
+    /* @__PURE__ */ i("select", { ...ie, "aria-hidden": "true", className: y(o.native, se), onChange: de, ref: O, tabIndex: -1, value: E, children: D.children }),
     r ? /* @__PURE__ */ p("div", { className: o.combobox, onClick: () => {
       var e;
       return (e = m.current) == null ? void 0 : e.focus();
@@ -188,23 +188,23 @@ const rt = ({
       /* @__PURE__ */ i("input", { "aria-autocomplete": "list", "aria-expanded": c, "aria-label": w["aria-label"] ?? a ?? B, className: o["combobox-input"], disabled: w.disabled, onChange: (e) => {
         C(e.target.value), d(!0);
       }, onClick: () => d(!0), onFocus: () => d(!0), placeholder: B || void 0, ref: m, role: "combobox", type: "text", value: S })
-    ] }) : /* @__PURE__ */ i(M, { "aria-expanded": c, "aria-haspopup": "dialog", "aria-labelledby": a ? `${N} ${N}-value` : void 0, className: y(o.trigger, (V == null ? void 0 : V.isPlaceholder) && o.placeholder), "data-open": c ? "true" : void 0, disabled: w.disabled, onClick: () => d((e) => !e), ref: G, style: ae, variant: "tertiary", children: /* @__PURE__ */ i("span", { className: o.text, id: `${N}-value`, children: J(V) }) }),
+    ] }) : /* @__PURE__ */ i(Q, { "aria-expanded": c, "aria-haspopup": "dialog", "aria-labelledby": a ? `${N} ${N}-value` : void 0, className: y(o.trigger, (V == null ? void 0 : V.isPlaceholder) && o.placeholder), "data-open": c ? "true" : void 0, disabled: w.disabled, onClick: () => d((e) => !e), ref: A, style: ae, variant: "tertiary", children: /* @__PURE__ */ i("span", { className: o.text, id: `${N}-value`, children: J(V) }) }),
     c && /* @__PURE__ */ p("div", { className: o.panel, children: [
-      !r && /* @__PURE__ */ i(ye, { "aria-label": "Filter", className: o.filter, icon: "search", onChange: (e) => C(e.target.value), placeholder: B, ref: m, style: ce, type: "search", value: S }),
+      !r && /* @__PURE__ */ i(ye, { "aria-label": "Filter", className: o.filter, icon: "MagnifyingGlass", onChange: (e) => C(e.target.value), placeholder: B, ref: m, style: ce, type: "search", value: S }),
       /* @__PURE__ */ p(xe, { "aria-label": "Dropdown", className: o.options, children: [
         H.map((e) => {
           const u = e.value === E;
-          return /* @__PURE__ */ i("li", { "data-component": "dropdown", children: /* @__PURE__ */ p(M, { "aria-label": u ? `${e.text}, selected` : e.text, className: y(o.option, u && o.selected), disabled: e.disabled, onClick: () => pe(e.value), variant: "tertiary", children: [
+          return /* @__PURE__ */ i("li", { "data-component": "dropdown", children: /* @__PURE__ */ p(Q, { "aria-label": u ? `${e.text}, selected` : e.text, className: y(o.option, u && o.selected), disabled: e.disabled, onClick: () => pe(e.value), variant: "tertiary", children: [
             /* @__PURE__ */ i("span", { className: o.text, children: J(e) }),
             e.groupLabel && /* @__PURE__ */ i("small", { className: o.group, children: e.groupLabel })
           ] }) }, `${e.groupLabel ?? "root"}-${e.value}`);
         }),
-        I && l && /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i(M, { "aria-label": $(l.render(v)) || v, className: o.option, onClick: X, variant: "tertiary", children: /* @__PURE__ */ i("span", { className: o.text, children: l.render(v) }) }) }),
+        I && l && /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i(Q, { "aria-label": $(l.render(v)) || v, className: o.option, onClick: X, variant: "tertiary", children: /* @__PURE__ */ i("span", { className: o.text, children: l.render(v) }) }) }),
         H.length === 0 && !I && /* @__PURE__ */ i("li", { className: o.empty, children: n })
       ] })
     ] })
   ] });
-  return a ? /* @__PURE__ */ p("div", { className: y(o.label, h === "inline" && o["inline-field"]), "data-component": "dropdown", children: [
+  return a ? /* @__PURE__ */ p("div", { className: y(o.label, _ === "inline" && o["inline-field"]), "data-component": "dropdown", children: [
     /* @__PURE__ */ i("span", { id: N, children: ue }),
     Y
   ] }) : Y;

package/dist/components/dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/dropdown/options.tsx","../../../src/components/dropdown/index.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\n\nimport { Select, type SelectProps } from '@/components/select';\n\ntype NativeSelectProps = Omit<React.ComponentPropsWithoutRef<'select'>, 'children' | 'multiple'> & {\n  children: React.ReactNode;\n  multiple?: false;\n};\n\ntype NativeSelectElement = React.ReactElement<NativeSelectProps, 'select'>;\ntype WrappedSelectElement = React.ReactElement<SelectProps, typeof Select>;\n\nexport type DropdownSelectElement = NativeSelectElement | WrappedSelectElement;\n\nexport type DropdownOption = {\n  disabled: boolean;\n  groupLabel?: string;\n  hidden: boolean;\n  isPlaceholder: boolean;\n  label: React.ReactNode;\n  selected: boolean;\n  text: string;\n  value: string;\n};\n\nexport type DropdownRenderOption = Pick<\n  DropdownOption,\n  'groupLabel' | 'label' | 'text' | 'value'\n> & {\n  isSelected: boolean;\n};\n\nexport function getNodeText(node: React.ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(getNodeText).join(' ');\n  if (isValidElement<{ children?: React.ReactNode }>(node)) return getNodeText(node.props.children);\n  return '';\n}\n\nfunction isOptionElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'option'>, 'option'> {\n  return isValidElement(node) && node.type === 'option';\n}\n\nfunction isOptGroupElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'optgroup'>, 'optgroup'> {\n  return isValidElement(node) && node.type === 'optgroup';\n}\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }, typeof React.Fragment> {\n  return isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction isWrappedSelectElement(node: React.ReactNode): node is WrappedSelectElement {\n  return isValidElement(node) && node.type === Select;\n}\n\nexport function extractOptions(\n  children: React.ReactNode,\n  groupLabel?: string,\n  groupDisabled = false\n): DropdownOption[] {\n  const options: DropdownOption[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      options.push(...extractOptions(child.props.children, groupLabel, groupDisabled));\n    } else if (isOptionElement(child)) {\n      const text = getNodeText(child.props.children).trim();\n      const value = child.props.value != null ? String(child.props.value) : text;\n      options.push({\n        disabled: groupDisabled || Boolean(child.props.disabled),\n        groupLabel,\n        hidden: Boolean(child.props.hidden),\n        isPlaceholder: Boolean(child.props.hidden && value === ''),\n        label: child.props.children,\n        selected: Boolean(child.props.selected),\n        text,\n        value,\n      });\n    } else if (isOptGroupElement(child)) {\n      options.push(\n        ...extractOptions(\n          child.props.children,\n          child.props.label,\n          groupDisabled || Boolean(child.props.disabled)\n        )\n      );\n    }\n  });\n\n  return options;\n}\n\nfunction buildWildcardMatcher(query: string) {\n  const trimmedQuery = query.trim();\n  if (!trimmedQuery) return null;\n\n  const wildcardQuery = /[*?]/.test(trimmedQuery) ? trimmedQuery : `*${trimmedQuery}*`;\n  const expression = [...wildcardQuery]\n    .map((character) => {\n      if (character === '*') return '.*';\n      if (character === '?') return '.';\n      return character.replace(/[|\\\\{}()[\\]^$+.,]/g, '\\\\$&');\n    })\n    .join('');\n\n  return new RegExp(`^${expression}$`, 'i');\n}\n\nexport function filterOptions(options: DropdownOption[], query: string) {\n  const matcher = buildWildcardMatcher(query);\n  const selectableOptions = options.filter((option) => !option.hidden && !option.isPlaceholder);\n  return matcher\n    ? selectableOptions.filter((option) =>\n        matcher.test([option.groupLabel, option.text, option.value].filter(Boolean).join(' '))\n      )\n    : selectableOptions;\n}\n\nexport function getDisplayOption(options: DropdownOption[], selectedValue: string) {\n  return (\n    options.find((option) => option.value === selectedValue) ??\n    options.find((option) => option.isPlaceholder) ??\n    options[0]\n  );\n}\n\nexport function getInitialValue(\n  options: DropdownOption[],\n  value?: NativeSelectProps['value'],\n  defaultValue?: NativeSelectProps['defaultValue']\n) {\n  if (value != null) return String(value);\n  if (defaultValue != null) return String(defaultValue);\n  return options.find((option) => option.selected)?.value ?? options[0]?.value ?? '';\n}\n\nexport function normalizeSelectElement(selectElement: DropdownSelectElement) {\n  if (isWrappedSelectElement(selectElement)) {\n    const { children, placeholder, ...props } = selectElement.props;\n    return {\n      children: (\n        <>\n          {placeholder && (\n            <option\n              hidden\n              value=''\n            >\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </>\n      ),\n      props,\n    };\n  }\n\n  return { children: selectElement.props.children, props: selectElement.props };\n}\n","import cx from 'classix';\nimport React, { useEffect, useId, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { type IconName, iconSVG } from '@/components/icon/icons';\nimport { Input } from '@/components/input';\nimport { List } from '@/components/list';\nimport { sanitizeSelectProps } from '@/components/select/sanitize-select-props';\nimport { resolveColor } from '@/utils/color';\nimport { formatInlineLabel } from '@/utils/text';\n\nimport {\n  type DropdownOption,\n  type DropdownRenderOption,\n  type DropdownSelectElement,\n  extractOptions,\n  filterOptions,\n  getDisplayOption,\n  getInitialValue,\n  getNodeText,\n  normalizeSelectElement,\n} from './options';\nimport styles from './styles.module.css';\n\nexport type { DropdownRenderOption } from './options';\n\nexport type DropdownCreateOption = {\n  isValid: (value: string) => boolean;\n  onCreate: (value: string) => void;\n  render: (value: string) => React.ReactNode;\n};\n\nexport type DropdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {\n  children: DropdownSelectElement;\n  combobox?: boolean;\n  createOption?: DropdownCreateOption;\n  emptyLabel?: string;\n  label?: string;\n  renderOption?: (option: DropdownRenderOption) => React.ReactNode;\n  searchPlaceholder?: string;\n  selectedItems?: React.ReactNode;\n  variant?: 'default' | 'inline' | 'minimal';\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n};\n\nfunction getIconWithVars(icon: IconName, color: string): withVars {\n  return {\n    '--icon-svg': iconSVG(icon).replace('currentColor', color),\n  };\n}\n\nexport const Dropdown = ({\n  children: selectElement,\n  className,\n  combobox = false,\n  createOption,\n  emptyLabel = 'No matches found',\n  label,\n  renderOption,\n  searchPlaceholder = 'Filter',\n  selectedItems,\n  variant = 'default',\n  ...props\n}: DropdownProps) => {\n  const normalizedSelect = normalizeSelectElement(selectElement);\n  const { defaultValue, onChange, value, ...restSelectProps } = normalizedSelect.props;\n  const selectProps = sanitizeSelectProps(restSelectProps);\n  const { className: selectClassName, ...nativeSelectProps } = selectProps;\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const labelId = useId();\n  const nativeSelectRef = useRef<HTMLSelectElement>(null);\n  const searchRef = useRef<HTMLInputElement>(null);\n  const options = extractOptions(normalizedSelect.children);\n  const isControlled = value != null;\n  const initialValue = getInitialValue(options, value, defaultValue);\n  const [internalValue, setInternalValue] = useState(() => initialValue);\n  const [isOpen, setIsOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const selectedValue = isControlled ? String(value) : internalValue;\n  const iconColors = {\n    default: resolveColor('--colors-semantic-content-secondary'),\n    white: resolveColor('--color-white', 'white'),\n  };\n  const dropdownIconColor = variant === 'minimal' ? iconColors.white : iconColors.default;\n  const displayOption = getDisplayOption(options, selectedValue);\n  const triggerWithVars = getIconWithVars('chevron', dropdownIconColor);\n  const filterWithVars = getIconWithVars('search', dropdownIconColor);\n  const filteredOptions = filterOptions(options, query);\n  const customValue = query.trim();\n  const canCreateOption = Boolean(\n    combobox && createOption && customValue && createOption.isValid(customValue)\n  );\n  const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n  const renderDropdownOption = (option: DropdownOption | undefined) => {\n    if (!option) return 'Select an option';\n\n    return (\n      renderOption?.({\n        groupLabel: option.groupLabel,\n        isSelected: option.value === selectedValue,\n        label: option.label,\n        text: option.text,\n        value: option.value,\n      }) ?? option.label\n    );\n  };\n\n  useEffect(() => {\n    if (!isControlled && !options.some((option) => option.value === internalValue)) {\n      setInternalValue(initialValue);\n    }\n  }, [initialValue, internalValue, isControlled, options]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      setQuery('');\n      return;\n    }\n\n    searchRef.current?.focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      if (!containerRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [isOpen]);\n\n  const handleNativeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!isControlled) {\n      setInternalValue(event.target.value);\n    }\n\n    onChange?.(event);\n  };\n\n  const closeMenu = () => {\n    setIsOpen(false);\n    if (!combobox) {\n      buttonRef.current?.focus();\n    }\n  };\n\n  const continueComboboxSelection = () => {\n    setQuery('');\n    setIsOpen(true);\n    searchRef.current?.focus();\n  };\n\n  const commitCustomValue = () => {\n    if (!createOption || !canCreateOption) return;\n\n    createOption.onCreate(customValue);\n    continueComboboxSelection();\n  };\n\n  const commitValue = (nextValue: string) => {\n    if (!isControlled) {\n      setInternalValue(nextValue);\n    }\n\n    const nativeSelect = nativeSelectRef.current;\n\n    if (!nativeSelect) {\n      closeMenu();\n      return;\n    }\n\n    const valueSetter = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')?.set;\n\n    valueSetter?.call(nativeSelect, nextValue);\n    nativeSelect.dispatchEvent(new Event('change', { bubbles: true }));\n    if (combobox) {\n      continueComboboxSelection();\n    } else {\n      closeMenu();\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape') {\n      closeMenu();\n    }\n\n    if (event.key === 'Enter' && event.target === searchRef.current && canCreateOption) {\n      event.preventDefault();\n      commitCustomValue();\n    }\n  };\n\n  const dropdown = (\n    <div\n      className={cx(\n        styles.dropdown,\n        variant === 'inline' && styles.inline,\n        variant === 'minimal' && styles.minimal,\n        className\n      )}\n      onKeyDown={handleKeyDown}\n      ref={containerRef}\n      {...props}\n    >\n      <select\n        {...nativeSelectProps}\n        aria-hidden='true'\n        className={cx(styles.native, selectClassName)}\n        onChange={handleNativeChange}\n        ref={nativeSelectRef}\n        tabIndex={-1}\n        value={selectedValue}\n      >\n        {normalizedSelect.children}\n      </select>\n      {combobox ? (\n        <div\n          className={styles.combobox}\n          onClick={() => searchRef.current?.focus()}\n        >\n          {selectedItems}\n          <input\n            aria-autocomplete='list'\n            aria-expanded={isOpen}\n            aria-label={selectProps['aria-label'] ?? label ?? searchPlaceholder}\n            className={styles['combobox-input']}\n            disabled={selectProps.disabled}\n            onChange={(event) => {\n              setQuery(event.target.value);\n              setIsOpen(true);\n            }}\n            onClick={() => setIsOpen(true)}\n            onFocus={() => setIsOpen(true)}\n            placeholder={searchPlaceholder || undefined}\n            ref={searchRef}\n            role='combobox'\n            type='text'\n            value={query}\n          />\n        </div>\n      ) : (\n        <Button\n          aria-expanded={isOpen}\n          aria-haspopup='dialog'\n          aria-labelledby={label ? `${labelId} ${labelId}-value` : undefined}\n          className={cx(styles.trigger, displayOption?.isPlaceholder && styles.placeholder)}\n          data-open={isOpen ? 'true' : undefined}\n          disabled={selectProps.disabled}\n          onClick={() => setIsOpen((currentValue) => !currentValue)}\n          ref={buttonRef}\n          style={triggerWithVars}\n          variant='tertiary'\n        >\n          <span\n            className={styles.text}\n            id={`${labelId}-value`}\n          >\n            {renderDropdownOption(displayOption)}\n          </span>\n        </Button>\n      )}\n      {isOpen && (\n        <div className={styles.panel}>\n          {!combobox && (\n            <Input\n              aria-label='Filter'\n              className={styles.filter}\n              icon='search'\n              onChange={(event) => setQuery(event.target.value)}\n              placeholder={searchPlaceholder}\n              ref={searchRef}\n              style={filterWithVars}\n              type='search'\n              value={query}\n            />\n          )}\n          <List\n            aria-label='Dropdown'\n            className={styles.options}\n          >\n            {filteredOptions.map((option) => {\n              const isSelected = option.value === selectedValue;\n\n              return (\n                <li key={`${option.groupLabel ?? 'root'}-${option.value}`}>\n                  <Button\n                    aria-label={isSelected ? `${option.text}, selected` : option.text}\n                    className={cx(styles.option, isSelected && styles.selected)}\n                    disabled={option.disabled}\n                    onClick={() => commitValue(option.value)}\n                    variant='tertiary'\n                  >\n                    <span className={styles.text}>{renderDropdownOption(option)}</span>\n                    {option.groupLabel && (\n                      <small className={styles.group}>{option.groupLabel}</small>\n                    )}\n                  </Button>\n                </li>\n              );\n            })}\n            {canCreateOption && createOption && (\n              <li>\n                <Button\n                  aria-label={getNodeText(createOption.render(customValue)) || customValue}\n                  className={styles.option}\n                  onClick={commitCustomValue}\n                  variant='tertiary'\n                >\n                  <span className={styles.text}>{createOption.render(customValue)}</span>\n                </Button>\n              </li>\n            )}\n            {filteredOptions.length === 0 && !canCreateOption && (\n              <li className={styles.empty}>{emptyLabel}</li>\n            )}\n          </List>\n        </div>\n      )}\n    </div>\n  );\n\n  return label ? (\n    <div className={cx(styles.label, variant === 'inline' && styles['inline-field'])}>\n      <span id={labelId}>{displayLabel}</span>\n      {dropdown}\n    </div>\n  ) : (\n    dropdown\n  );\n};\n"],"names":["getNodeText","node","String","Array","isArray","map","join","isValidElement","props","children","isOptionElement","type","isOptGroupElement","isFragmentElement","React","Fragment","isWrappedSelectElement","Select","extractOptions","groupLabel","groupDisabled","options","Children","forEach","child","push","text","trim","value","disabled","Boolean","hidden","isPlaceholder","label","selected","buildWildcardMatcher","query","trimmedQuery","expression","test","character","replace","RegExp","filterOptions","matcher","selectableOptions","filter","option","getDisplayOption","selectedValue","find","getInitialValue","defaultValue","normalizeSelectElement","selectElement","placeholder","jsxs","getIconWithVars","icon","color","iconSVG","Dropdown","className","combobox","createOption","emptyLabel","renderOption","searchPlaceholder","selectedItems","variant","normalizedSelect","onChange","restSelectProps","selectProps","sanitizeSelectProps","selectClassName","nativeSelectProps","buttonRef","useRef","containerRef","labelId","useId","nativeSelectRef","searchRef","isControlled","initialValue","internalValue","setInternalValue","useState","isOpen","setIsOpen","setQuery","iconColors","default","resolveColor","white","dropdownIconColor","displayOption","triggerWithVars","filterWithVars","filteredOptions","customValue","canCreateOption","isValid","displayLabel","formatInlineLabel","renderDropdownOption","isSelected","useEffect","some","current","focus","handlePointerDown","event","contains","target","document","addEventListener","removeEventListener","handleNativeChange","closeMenu","continueComboboxSelection","commitCustomValue","onCreate","commitValue","nextValue","nativeSelect","valueSetter","Object","getOwnPropertyDescriptor","HTMLSelectElement","prototype","set","call","dispatchEvent","Event","bubbles","handleKeyDown","key","preventDefault","dropdown","cx","styles","inline","minimal","jsx","native","undefined","Button","trigger","currentValue","panel","Input","List","group","render","length","empty"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/dropdown/options.tsx","../../../src/components/dropdown/index.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\n\nimport { Select, type SelectProps } from '@/components/select';\n\ntype NativeSelectProps = Omit<React.ComponentPropsWithoutRef<'select'>, 'children' | 'multiple'> & {\n  children: React.ReactNode;\n  multiple?: false;\n};\n\ntype NativeSelectElement = React.ReactElement<NativeSelectProps, 'select'>;\ntype WrappedSelectElement = React.ReactElement<SelectProps, typeof Select>;\n\nexport type DropdownSelectElement = NativeSelectElement | WrappedSelectElement;\n\nexport type DropdownOption = {\n  disabled: boolean;\n  groupLabel?: string;\n  hidden: boolean;\n  isPlaceholder: boolean;\n  label: React.ReactNode;\n  selected: boolean;\n  text: string;\n  value: string;\n};\n\nexport type DropdownRenderOption = Pick<\n  DropdownOption,\n  'groupLabel' | 'label' | 'text' | 'value'\n> & {\n  isSelected: boolean;\n};\n\nexport function getNodeText(node: React.ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(getNodeText).join(' ');\n  if (isValidElement<{ children?: React.ReactNode }>(node)) return getNodeText(node.props.children);\n  return '';\n}\n\nfunction isOptionElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'option'>, 'option'> {\n  return isValidElement(node) && node.type === 'option';\n}\n\nfunction isOptGroupElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'optgroup'>, 'optgroup'> {\n  return isValidElement(node) && node.type === 'optgroup';\n}\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }, typeof React.Fragment> {\n  return isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction isWrappedSelectElement(node: React.ReactNode): node is WrappedSelectElement {\n  return isValidElement(node) && node.type === Select;\n}\n\nexport function extractOptions(\n  children: React.ReactNode,\n  groupLabel?: string,\n  groupDisabled = false\n): DropdownOption[] {\n  const options: DropdownOption[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      options.push(...extractOptions(child.props.children, groupLabel, groupDisabled));\n    } else if (isOptionElement(child)) {\n      const text = getNodeText(child.props.children).trim();\n      const value = child.props.value != null ? String(child.props.value) : text;\n      options.push({\n        disabled: groupDisabled || Boolean(child.props.disabled),\n        groupLabel,\n        hidden: Boolean(child.props.hidden),\n        isPlaceholder: Boolean(child.props.hidden && value === ''),\n        label: child.props.children,\n        selected: Boolean(child.props.selected),\n        text,\n        value,\n      });\n    } else if (isOptGroupElement(child)) {\n      options.push(\n        ...extractOptions(\n          child.props.children,\n          child.props.label,\n          groupDisabled || Boolean(child.props.disabled)\n        )\n      );\n    }\n  });\n\n  return options;\n}\n\nfunction buildWildcardMatcher(query: string) {\n  const trimmedQuery = query.trim();\n  if (!trimmedQuery) return null;\n\n  const wildcardQuery = /[*?]/.test(trimmedQuery) ? trimmedQuery : `*${trimmedQuery}*`;\n  const expression = [...wildcardQuery]\n    .map((character) => {\n      if (character === '*') return '.*';\n      if (character === '?') return '.';\n      return character.replace(/[|\\\\{}()[\\]^$+.,]/g, '\\\\$&');\n    })\n    .join('');\n\n  return new RegExp(`^${expression}$`, 'i');\n}\n\nexport function filterOptions(options: DropdownOption[], query: string) {\n  const matcher = buildWildcardMatcher(query);\n  const selectableOptions = options.filter((option) => !option.hidden && !option.isPlaceholder);\n  return matcher\n    ? selectableOptions.filter((option) =>\n        matcher.test([option.groupLabel, option.text, option.value].filter(Boolean).join(' '))\n      )\n    : selectableOptions;\n}\n\nexport function getDisplayOption(options: DropdownOption[], selectedValue: string) {\n  return (\n    options.find((option) => option.value === selectedValue) ??\n    options.find((option) => option.isPlaceholder) ??\n    options[0]\n  );\n}\n\nexport function getInitialValue(\n  options: DropdownOption[],\n  value?: NativeSelectProps['value'],\n  defaultValue?: NativeSelectProps['defaultValue']\n) {\n  if (value != null) return String(value);\n  if (defaultValue != null) return String(defaultValue);\n  return options.find((option) => option.selected)?.value ?? options[0]?.value ?? '';\n}\n\nexport function normalizeSelectElement(selectElement: DropdownSelectElement) {\n  if (isWrappedSelectElement(selectElement)) {\n    const { children, placeholder, ...props } = selectElement.props;\n    return {\n      children: (\n        <>\n          {placeholder && (\n            <option\n              hidden\n              value=''\n            >\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </>\n      ),\n      props,\n    };\n  }\n\n  return { children: selectElement.props.children, props: selectElement.props };\n}\n","import cx from 'classix';\nimport React, { useEffect, useId, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { type IconName, iconSVG } from '@/components/icon/icons';\nimport { Input } from '@/components/input';\nimport { List } from '@/components/list';\nimport { sanitizeSelectProps } from '@/components/select/sanitize-select-props';\nimport { resolveColor } from '@/utils/color';\nimport { formatInlineLabel } from '@/utils/text';\n\nimport {\n  type DropdownOption,\n  type DropdownRenderOption,\n  type DropdownSelectElement,\n  extractOptions,\n  filterOptions,\n  getDisplayOption,\n  getInitialValue,\n  getNodeText,\n  normalizeSelectElement,\n} from './options';\nimport styles from './styles.module.css';\n\nexport type { DropdownRenderOption } from './options';\n\nexport type DropdownCreateOption = {\n  isValid: (value: string) => boolean;\n  onCreate: (value: string) => void;\n  render: (value: string) => React.ReactNode;\n};\n\nexport type DropdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {\n  children: DropdownSelectElement;\n  combobox?: boolean;\n  createOption?: DropdownCreateOption;\n  emptyLabel?: string;\n  label?: string;\n  renderOption?: (option: DropdownRenderOption) => React.ReactNode;\n  searchPlaceholder?: string;\n  selectedItems?: React.ReactNode;\n  variant?: 'default' | 'inline' | 'minimal';\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n};\n\nfunction getIconWithVars(icon: IconName, color: string): withVars {\n  return {\n    '--icon-svg': iconSVG(icon, color),\n  };\n}\n\nexport const Dropdown = ({\n  children: selectElement,\n  className,\n  combobox = false,\n  createOption,\n  emptyLabel = 'No matches found',\n  label,\n  renderOption,\n  searchPlaceholder = 'Filter',\n  selectedItems,\n  variant = 'default',\n  ...props\n}: DropdownProps) => {\n  const normalizedSelect = normalizeSelectElement(selectElement);\n  const { defaultValue, onChange, value, ...restSelectProps } = normalizedSelect.props;\n  const selectProps = sanitizeSelectProps(restSelectProps);\n  const { className: selectClassName, ...nativeSelectProps } = selectProps;\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const labelId = useId();\n  const nativeSelectRef = useRef<HTMLSelectElement>(null);\n  const searchRef = useRef<HTMLInputElement>(null);\n  const options = extractOptions(normalizedSelect.children);\n  const isControlled = value != null;\n  const initialValue = getInitialValue(options, value, defaultValue);\n  const [internalValue, setInternalValue] = useState(() => initialValue);\n  const [isOpen, setIsOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const selectedValue = isControlled ? String(value) : internalValue;\n  const iconColors = {\n    default: resolveColor('--colors-semantic-content-secondary'),\n    white: resolveColor('--color-white', 'white'),\n  };\n  const dropdownIconColor = variant === 'minimal' ? iconColors.white : iconColors.default;\n  const displayOption = getDisplayOption(options, selectedValue);\n  const triggerWithVars = getIconWithVars('CaretDown', dropdownIconColor);\n  const filterWithVars = getIconWithVars('MagnifyingGlass', dropdownIconColor);\n  const filteredOptions = filterOptions(options, query);\n  const customValue = query.trim();\n  const canCreateOption = Boolean(\n    combobox && createOption && customValue && createOption.isValid(customValue)\n  );\n  const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n  const renderDropdownOption = (option: DropdownOption | undefined) => {\n    if (!option) return 'Select an option';\n\n    return (\n      renderOption?.({\n        groupLabel: option.groupLabel,\n        isSelected: option.value === selectedValue,\n        label: option.label,\n        text: option.text,\n        value: option.value,\n      }) ?? option.label\n    );\n  };\n\n  useEffect(() => {\n    if (!isControlled && !options.some((option) => option.value === internalValue)) {\n      setInternalValue(initialValue);\n    }\n  }, [initialValue, internalValue, isControlled, options]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      setQuery('');\n      return;\n    }\n\n    searchRef.current?.focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      if (!containerRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [isOpen]);\n\n  const handleNativeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!isControlled) {\n      setInternalValue(event.target.value);\n    }\n\n    onChange?.(event);\n  };\n\n  const closeMenu = () => {\n    setIsOpen(false);\n    if (!combobox) {\n      buttonRef.current?.focus();\n    }\n  };\n\n  const continueComboboxSelection = () => {\n    setQuery('');\n    setIsOpen(true);\n    searchRef.current?.focus();\n  };\n\n  const commitCustomValue = () => {\n    if (!createOption || !canCreateOption) return;\n\n    createOption.onCreate(customValue);\n    continueComboboxSelection();\n  };\n\n  const commitValue = (nextValue: string) => {\n    if (!isControlled) {\n      setInternalValue(nextValue);\n    }\n\n    const nativeSelect = nativeSelectRef.current;\n\n    if (!nativeSelect) {\n      closeMenu();\n      return;\n    }\n\n    const valueSetter = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')?.set;\n\n    valueSetter?.call(nativeSelect, nextValue);\n    nativeSelect.dispatchEvent(new Event('change', { bubbles: true }));\n    if (combobox) {\n      continueComboboxSelection();\n    } else {\n      closeMenu();\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape') {\n      closeMenu();\n    }\n\n    if (event.key === 'Enter' && event.target === searchRef.current && canCreateOption) {\n      event.preventDefault();\n      commitCustomValue();\n    }\n  };\n\n  const dropdown = (\n    <div\n      className={cx(\n        styles.dropdown,\n        variant === 'inline' && styles.inline,\n        variant === 'minimal' && styles.minimal,\n        className\n      )}\n      onKeyDown={handleKeyDown}\n      ref={containerRef}\n      {...props}\n    >\n      <select\n        {...nativeSelectProps}\n        aria-hidden='true'\n        className={cx(styles.native, selectClassName)}\n        onChange={handleNativeChange}\n        ref={nativeSelectRef}\n        tabIndex={-1}\n        value={selectedValue}\n      >\n        {normalizedSelect.children}\n      </select>\n      {combobox ? (\n        <div\n          className={styles.combobox}\n          onClick={() => searchRef.current?.focus()}\n        >\n          {selectedItems}\n          <input\n            aria-autocomplete='list'\n            aria-expanded={isOpen}\n            aria-label={selectProps['aria-label'] ?? label ?? searchPlaceholder}\n            className={styles['combobox-input']}\n            disabled={selectProps.disabled}\n            onChange={(event) => {\n              setQuery(event.target.value);\n              setIsOpen(true);\n            }}\n            onClick={() => setIsOpen(true)}\n            onFocus={() => setIsOpen(true)}\n            placeholder={searchPlaceholder || undefined}\n            ref={searchRef}\n            role='combobox'\n            type='text'\n            value={query}\n          />\n        </div>\n      ) : (\n        <Button\n          aria-expanded={isOpen}\n          aria-haspopup='dialog'\n          aria-labelledby={label ? `${labelId} ${labelId}-value` : undefined}\n          className={cx(styles.trigger, displayOption?.isPlaceholder && styles.placeholder)}\n          data-open={isOpen ? 'true' : undefined}\n          disabled={selectProps.disabled}\n          onClick={() => setIsOpen((currentValue) => !currentValue)}\n          ref={buttonRef}\n          style={triggerWithVars}\n          variant='tertiary'\n        >\n          <span\n            className={styles.text}\n            id={`${labelId}-value`}\n          >\n            {renderDropdownOption(displayOption)}\n          </span>\n        </Button>\n      )}\n      {isOpen && (\n        <div className={styles.panel}>\n          {!combobox && (\n            <Input\n              aria-label='Filter'\n              className={styles.filter}\n              icon='MagnifyingGlass'\n              onChange={(event) => setQuery(event.target.value)}\n              placeholder={searchPlaceholder}\n              ref={searchRef}\n              style={filterWithVars}\n              type='search'\n              value={query}\n            />\n          )}\n          <List\n            aria-label='Dropdown'\n            className={styles.options}\n          >\n            {filteredOptions.map((option) => {\n              const isSelected = option.value === selectedValue;\n\n              return (\n                <li key={`${option.groupLabel ?? 'root'}-${option.value}`}>\n                  <Button\n                    aria-label={isSelected ? `${option.text}, selected` : option.text}\n                    className={cx(styles.option, isSelected && styles.selected)}\n                    disabled={option.disabled}\n                    onClick={() => commitValue(option.value)}\n                    variant='tertiary'\n                  >\n                    <span className={styles.text}>{renderDropdownOption(option)}</span>\n                    {option.groupLabel && (\n                      <small className={styles.group}>{option.groupLabel}</small>\n                    )}\n                  </Button>\n                </li>\n              );\n            })}\n            {canCreateOption && createOption && (\n              <li>\n                <Button\n                  aria-label={getNodeText(createOption.render(customValue)) || customValue}\n                  className={styles.option}\n                  onClick={commitCustomValue}\n                  variant='tertiary'\n                >\n                  <span className={styles.text}>{createOption.render(customValue)}</span>\n                </Button>\n              </li>\n            )}\n            {filteredOptions.length === 0 && !canCreateOption && (\n              <li className={styles.empty}>{emptyLabel}</li>\n            )}\n          </List>\n        </div>\n      )}\n    </div>\n  );\n\n  return label ? (\n    <div className={cx(styles.label, variant === 'inline' && styles['inline-field'])}>\n      <span id={labelId}>{displayLabel}</span>\n      {dropdown}\n    </div>\n  ) : (\n    dropdown\n  );\n};\n"],"names":["getNodeText","node","String","Array","isArray","map","join","isValidElement","props","children","isOptionElement","type","isOptGroupElement","isFragmentElement","React","Fragment","isWrappedSelectElement","Select","extractOptions","groupLabel","groupDisabled","options","Children","forEach","child","push","text","trim","value","disabled","Boolean","hidden","isPlaceholder","label","selected","buildWildcardMatcher","query","trimmedQuery","expression","test","character","replace","RegExp","filterOptions","matcher","selectableOptions","filter","option","getDisplayOption","selectedValue","find","getInitialValue","defaultValue","normalizeSelectElement","selectElement","placeholder","jsxs","getIconWithVars","icon","color","iconSVG","Dropdown","className","combobox","createOption","emptyLabel","renderOption","searchPlaceholder","selectedItems","variant","normalizedSelect","onChange","restSelectProps","selectProps","sanitizeSelectProps","selectClassName","nativeSelectProps","buttonRef","useRef","containerRef","labelId","useId","nativeSelectRef","searchRef","isControlled","initialValue","internalValue","setInternalValue","useState","isOpen","setIsOpen","setQuery","iconColors","default","resolveColor","white","dropdownIconColor","displayOption","triggerWithVars","filterWithVars","filteredOptions","customValue","canCreateOption","isValid","displayLabel","formatInlineLabel","renderDropdownOption","isSelected","useEffect","some","current","focus","handlePointerDown","event","contains","target","document","addEventListener","removeEventListener","handleNativeChange","closeMenu","continueComboboxSelection","commitCustomValue","onCreate","commitValue","nextValue","nativeSelect","valueSetter","Object","getOwnPropertyDescriptor","HTMLSelectElement","prototype","set","call","dispatchEvent","Event","bubbles","handleKeyDown","key","preventDefault","dropdown","cx","styles","inline","minimal","jsx","native","undefined","Button","trigger","currentValue","panel","Input","List","group","render","length","empty"],"mappings":"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"}

package/dist/components/dropzone/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index38.css');const i=require("react/jsx-runtime"),b=require("../../classix-5H4IWnMA.cjs"),F=require("react"),q=require("../button/index.cjs"),I=require("../icon/index.cjs"),R="_dropzone_1rpsf_1",T="_dragging_1rpsf_19",S="_minimal_1rpsf_23",g={dropzone:R,dragging:T,minimal:S},k=({accepts:D,label:m="Select files",maxFileSize:_,multiple:d=!1,onChange:n,onValidation:a,variant:p="default",...y})=>{const f=F.useRef(null),[x,l]=F.useState(!1),c=e=>{e.preventDefault(),e.stopPropagation()},v=e=>{const t=f.current;if(!t)return;const s=new DataTransfer;for(const r of e)s.items.add(r);t.files=s.files,n==null||n({target:t,currentTarget:t})},z=e=>{const{validFiles:t,emptyFiles:s,oversizedFiles:r}=e.reduce((u,o)=>(o.size===0?u.emptyFiles.push(o):_&&o.size>_?u.oversizedFiles.push(o):u.validFiles.push(o),u),{validFiles:[],emptyFiles:[],oversizedFiles:[]});return(s.length>0||r.length>0)&&(a==null||a(s,r)),t},j=e=>{c(e),l(!1);const t=Array.from(e.dataTransfer.files??[]),s=z(t);if(s.length===0)return;const r=d?s:s.slice(0,1);v(r)},h=e=>{const t=Array.from(e.target.files??[]),s=z(t);if(s.length===t.length){n==null||n(e);return}const r=d?s:s.slice(0,1);v(r)};return i.jsx("div",{className:b.t(g.dropzone,g[p],x&&g.dragging),onDragEnter:e=>{c(e),l(!0)},onDragOver:e=>{c(e),l(!0)},onDragLeave:e=>{c(e),l(!1)},onDrop:j,...y,"data-component":"dropzone",children:i.jsxs("label",{children:[i.jsx("input",{accept:D,"aria-label":m,hidden:!0,multiple:d,onChange:h,ref:f,type:"file"}),i.jsx(I.Icon,{name:"upload",size:p==="minimal"?"medium":"large"}),i.jsx("br",{}),p!=="minimal"&&i.jsx(q.Button,{onClick:()=>{var e;return(e=f.current)==null?void 0:e.click()},type:"button",children:m})]})})};exports.Dropzone=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index38.css');const i=require("react/jsx-runtime"),b=require("../../classix-5H4IWnMA.cjs"),F=require("react"),q=require("../button/index.cjs"),I=require("../icon/index.cjs"),R="_dropzone_1rpsf_1",S="_dragging_1rpsf_19",T="_minimal_1rpsf_23",g={dropzone:R,dragging:S,minimal:T},k=({accepts:D,label:m="Select files",maxFileSize:_,multiple:u=!1,onChange:n,onValidation:a,variant:p="default",...y})=>{const f=F.useRef(null),[x,o]=F.useState(!1),c=e=>{e.preventDefault(),e.stopPropagation()},v=e=>{const t=f.current;if(!t)return;const s=new DataTransfer;for(const r of e)s.items.add(r);t.files=s.files,n==null||n({target:t,currentTarget:t})},z=e=>{const{validFiles:t,emptyFiles:s,oversizedFiles:r}=e.reduce((d,l)=>(l.size===0?d.emptyFiles.push(l):_&&l.size>_?d.oversizedFiles.push(l):d.validFiles.push(l),d),{validFiles:[],emptyFiles:[],oversizedFiles:[]});return(s.length>0||r.length>0)&&(a==null||a(s,r)),t},j=e=>{c(e),o(!1);const t=Array.from(e.dataTransfer.files??[]),s=z(t);if(s.length===0)return;const r=u?s:s.slice(0,1);v(r)},h=e=>{const t=Array.from(e.target.files??[]),s=z(t);if(s.length===t.length){n==null||n(e);return}const r=u?s:s.slice(0,1);v(r)};return i.jsx("div",{className:b.t(g.dropzone,g[p],x&&g.dragging),onDragEnter:e=>{c(e),o(!0)},onDragOver:e=>{c(e),o(!0)},onDragLeave:e=>{c(e),o(!1)},onDrop:j,...y,"data-component":"dropzone",children:i.jsxs("label",{children:[i.jsx("input",{accept:D,"aria-label":m,hidden:!0,multiple:u,onChange:h,ref:f,type:"file"}),i.jsx(I.Icon,{name:"UploadSimple",size:p==="minimal"?"medium":"large"}),i.jsx("br",{}),p!=="minimal"&&i.jsx(q.Button,{onClick:()=>{var e;return(e=f.current)==null?void 0:e.click()},type:"button",children:m})]})})};exports.Dropzone=k;
 //# sourceMappingURL=index.cjs.map

package/dist/components/dropzone/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/dropzone/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type DropzoneProps = {\n  accepts?: string;\n  label: string;\n  maxFileSize?: number;\n  multiple?: boolean;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  onValidation?: (empty: File[], oversized: File[]) => void;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Dropzone = ({\n  accepts,\n  label = 'Select files',\n  maxFileSize,\n  multiple = false,\n  onChange,\n  onValidation,\n  variant = 'default',\n  ...props\n}: DropzoneProps) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const prevent = (e: React.DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  const updateInputFiles = (files: File[]) => {\n    const input = inputRef.current;\n    if (!input) return;\n\n    const dt = new DataTransfer();\n    for (const file of files) dt.items.add(file);\n\n    input.files = dt.files;\n\n    onChange?.({\n      target: input,\n      currentTarget: input,\n    } as React.ChangeEvent<HTMLInputElement>);\n  };\n\n  const getValidFiles = (files: File[]) => {\n    const { validFiles, emptyFiles, oversizedFiles } = files.reduce(\n      (acc, file) => {\n        if (file.size === 0) {\n          acc.emptyFiles.push(file);\n        } else if (maxFileSize && file.size > maxFileSize) {\n          acc.oversizedFiles.push(file);\n        } else {\n          acc.validFiles.push(file);\n        }\n\n        return acc;\n      },\n      {\n        validFiles: [] as File[],\n        emptyFiles: [] as File[],\n        oversizedFiles: [] as File[],\n      }\n    );\n\n    if (emptyFiles.length > 0 || oversizedFiles.length > 0) {\n      onValidation?.(emptyFiles, oversizedFiles);\n    }\n\n    return validFiles;\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    prevent(e);\n    setIsDragging(false);\n    const files = Array.from(e.dataTransfer.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === 0) return;\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n    const files = Array.from(e.target.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === files.length) {\n      onChange?.(e);\n      return;\n    }\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  return (\n    <div\n      className={cx(styles.dropzone, styles[variant], isDragging && styles.dragging)}\n      onDragEnter={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragOver={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragLeave={(e) => {\n        prevent(e);\n        setIsDragging(false);\n      }}\n      onDrop={handleDrop}\n      {...props}\n    >\n      <label>\n        <input\n          accept={accepts}\n          aria-label={label}\n          hidden\n          multiple={multiple}\n          onChange={handleInputChange}\n          ref={inputRef}\n          type='file'\n        />\n        <Icon\n          name='upload'\n          size={variant === 'minimal' ? 'medium' : 'large'}\n        />\n        <br />\n        {variant !== 'minimal' && (\n          <Button\n            onClick={() => inputRef.current?.click()}\n            type={'button'}\n          >\n            {label}\n          </Button>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Dropzone","accepts","label","maxFileSize","multiple","onChange","onValidation","variant","props","inputRef","useRef","isDragging","setIsDragging","useState","prevent","e","preventDefault","stopPropagation","updateInputFiles","files","input","current","dt","DataTransfer","file","items","add","target","currentTarget","getValidFiles","validFiles","emptyFiles","oversizedFiles","reduce","acc","size","push","length","handleDrop","Array","from","dataTransfer","selected","slice","handleInputChange","jsx","cx","styles","dropzone","dragging","Icon","Button","click"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/dropzone/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type DropzoneProps = {\n  accepts?: string;\n  label: string;\n  maxFileSize?: number;\n  multiple?: boolean;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  onValidation?: (empty: File[], oversized: File[]) => void;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Dropzone = ({\n  accepts,\n  label = 'Select files',\n  maxFileSize,\n  multiple = false,\n  onChange,\n  onValidation,\n  variant = 'default',\n  ...props\n}: DropzoneProps) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const prevent = (e: React.DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  const updateInputFiles = (files: File[]) => {\n    const input = inputRef.current;\n    if (!input) return;\n\n    const dt = new DataTransfer();\n    for (const file of files) dt.items.add(file);\n\n    input.files = dt.files;\n\n    onChange?.({\n      target: input,\n      currentTarget: input,\n    } as React.ChangeEvent<HTMLInputElement>);\n  };\n\n  const getValidFiles = (files: File[]) => {\n    const { validFiles, emptyFiles, oversizedFiles } = files.reduce(\n      (acc, file) => {\n        if (file.size === 0) {\n          acc.emptyFiles.push(file);\n        } else if (maxFileSize && file.size > maxFileSize) {\n          acc.oversizedFiles.push(file);\n        } else {\n          acc.validFiles.push(file);\n        }\n\n        return acc;\n      },\n      {\n        validFiles: [] as File[],\n        emptyFiles: [] as File[],\n        oversizedFiles: [] as File[],\n      }\n    );\n\n    if (emptyFiles.length > 0 || oversizedFiles.length > 0) {\n      onValidation?.(emptyFiles, oversizedFiles);\n    }\n\n    return validFiles;\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    prevent(e);\n    setIsDragging(false);\n    const files = Array.from(e.dataTransfer.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === 0) return;\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n    const files = Array.from(e.target.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === files.length) {\n      onChange?.(e);\n      return;\n    }\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  return (\n    <div\n      className={cx(styles.dropzone, styles[variant], isDragging && styles.dragging)}\n      onDragEnter={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragOver={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragLeave={(e) => {\n        prevent(e);\n        setIsDragging(false);\n      }}\n      onDrop={handleDrop}\n      {...props}\n    >\n      <label>\n        <input\n          accept={accepts}\n          aria-label={label}\n          hidden\n          multiple={multiple}\n          onChange={handleInputChange}\n          ref={inputRef}\n          type='file'\n        />\n        <Icon\n          name='UploadSimple'\n          size={variant === 'minimal' ? 'medium' : 'large'}\n        />\n        <br />\n        {variant !== 'minimal' && (\n          <Button\n            onClick={() => inputRef.current?.click()}\n            type={'button'}\n          >\n            {label}\n          </Button>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Dropzone","accepts","label","maxFileSize","multiple","onChange","onValidation","variant","props","inputRef","useRef","isDragging","setIsDragging","useState","prevent","e","preventDefault","stopPropagation","updateInputFiles","files","input","current","dt","DataTransfer","file","items","add","target","currentTarget","getValidFiles","validFiles","emptyFiles","oversizedFiles","reduce","acc","size","push","length","handleDrop","Array","from","dataTransfer","selected","slice","handleInputChange","jsx","cx","styles","dropzone","dragging","Icon","Button","click"],"mappings":"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"}

package/dist/components/dropzone/index.js

@@ -3,11 +3,11 @@ import { t as T } from "../../classix-DG18itHa.js";
 import { useRef as j, useState as k } from "react";
 import { Button as x } from "../button/index.js";
 import { Icon as A } from "../icon/index.js";
-import '../../assets/index38.css';const R = "_dropzone_1rpsf_1", w = "_dragging_1rpsf_19", B = "_minimal_1rpsf_23", m = {
+import '../../assets/index38.css';const R = "_dropzone_1rpsf_1", S = "_dragging_1rpsf_19", w = "_minimal_1rpsf_23", u = {
   dropzone: R,
-  dragging: w,
-  minimal: B
-}, S = ({
+  dragging: S,
+  minimal: w
+}, P = ({
   accepts: D,
   label: g = "Select files",
   maxFileSize: F,
@@ -17,10 +17,10 @@ import '../../assets/index38.css';const R = "_dropzone_1rpsf_1", w = "_dragging_
   variant: a = "default",
   ..._
 }) => {
-  const u = j(null), [y, o] = k(!1), c = (e) => {
+  const m = j(null), [y, o] = k(!1), p = (e) => {
     e.preventDefault(), e.stopPropagation();
   }, v = (e) => {
-    const s = u.current;
+    const s = m.current;
     if (!s) return;
     const r = new DataTransfer();
     for (const t of e) r.items.add(t);
@@ -33,14 +33,14 @@ import '../../assets/index38.css';const R = "_dropzone_1rpsf_1", w = "_dragging_
       validFiles: s,
       emptyFiles: r,
       oversizedFiles: t
-    } = e.reduce((p, n) => (n.size === 0 ? p.emptyFiles.push(n) : F && n.size > F ? p.oversizedFiles.push(n) : p.validFiles.push(n), p), {
+    } = e.reduce((c, n) => (n.size === 0 ? c.emptyFiles.push(n) : F && n.size > F ? c.oversizedFiles.push(n) : c.validFiles.push(n), c), {
       validFiles: [],
       emptyFiles: [],
       oversizedFiles: []
     });
     return (r.length > 0 || t.length > 0) && (f == null || f(r, t)), s;
   }, h = (e) => {
-    c(e), o(!1);
+    p(e), o(!1);
     const s = Array.from(e.dataTransfer.files ?? []), r = z(s);
     if (r.length === 0) return;
     const t = d ? r : r.slice(0, 1);
@@ -54,23 +54,23 @@ import '../../assets/index38.css';const R = "_dropzone_1rpsf_1", w = "_dragging_
     const t = d ? r : r.slice(0, 1);
     v(t);
   };
-  return /* @__PURE__ */ l("div", { className: T(m.dropzone, m[a], y && m.dragging), onDragEnter: (e) => {
-    c(e), o(!0);
+  return /* @__PURE__ */ l("div", { className: T(u.dropzone, u[a], y && u.dragging), onDragEnter: (e) => {
+    p(e), o(!0);
   }, onDragOver: (e) => {
-    c(e), o(!0);
+    p(e), o(!0);
   }, onDragLeave: (e) => {
-    c(e), o(!1);
+    p(e), o(!1);
   }, onDrop: h, ..._, "data-component": "dropzone", children: /* @__PURE__ */ b("label", { children: [
-    /* @__PURE__ */ l("input", { accept: D, "aria-label": g, hidden: !0, multiple: d, onChange: I, ref: u, type: "file" }),
-    /* @__PURE__ */ l(A, { name: "upload", size: a === "minimal" ? "medium" : "large" }),
+    /* @__PURE__ */ l("input", { accept: D, "aria-label": g, hidden: !0, multiple: d, onChange: I, ref: m, type: "file" }),
+    /* @__PURE__ */ l(A, { name: "UploadSimple", size: a === "minimal" ? "medium" : "large" }),
     /* @__PURE__ */ l("br", {}),
     a !== "minimal" && /* @__PURE__ */ l(x, { onClick: () => {
       var e;
-      return (e = u.current) == null ? void 0 : e.click();
+      return (e = m.current) == null ? void 0 : e.click();
     }, type: "button", children: g })
   ] }) });
 };
 export {
-  S as Dropzone
+  P as Dropzone
 };
 //# sourceMappingURL=index.js.map

package/dist/components/dropzone/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/dropzone/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type DropzoneProps = {\n  accepts?: string;\n  label: string;\n  maxFileSize?: number;\n  multiple?: boolean;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  onValidation?: (empty: File[], oversized: File[]) => void;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Dropzone = ({\n  accepts,\n  label = 'Select files',\n  maxFileSize,\n  multiple = false,\n  onChange,\n  onValidation,\n  variant = 'default',\n  ...props\n}: DropzoneProps) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const prevent = (e: React.DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  const updateInputFiles = (files: File[]) => {\n    const input = inputRef.current;\n    if (!input) return;\n\n    const dt = new DataTransfer();\n    for (const file of files) dt.items.add(file);\n\n    input.files = dt.files;\n\n    onChange?.({\n      target: input,\n      currentTarget: input,\n    } as React.ChangeEvent<HTMLInputElement>);\n  };\n\n  const getValidFiles = (files: File[]) => {\n    const { validFiles, emptyFiles, oversizedFiles } = files.reduce(\n      (acc, file) => {\n        if (file.size === 0) {\n          acc.emptyFiles.push(file);\n        } else if (maxFileSize && file.size > maxFileSize) {\n          acc.oversizedFiles.push(file);\n        } else {\n          acc.validFiles.push(file);\n        }\n\n        return acc;\n      },\n      {\n        validFiles: [] as File[],\n        emptyFiles: [] as File[],\n        oversizedFiles: [] as File[],\n      }\n    );\n\n    if (emptyFiles.length > 0 || oversizedFiles.length > 0) {\n      onValidation?.(emptyFiles, oversizedFiles);\n    }\n\n    return validFiles;\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    prevent(e);\n    setIsDragging(false);\n    const files = Array.from(e.dataTransfer.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === 0) return;\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n    const files = Array.from(e.target.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === files.length) {\n      onChange?.(e);\n      return;\n    }\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  return (\n    <div\n      className={cx(styles.dropzone, styles[variant], isDragging && styles.dragging)}\n      onDragEnter={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragOver={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragLeave={(e) => {\n        prevent(e);\n        setIsDragging(false);\n      }}\n      onDrop={handleDrop}\n      {...props}\n    >\n      <label>\n        <input\n          accept={accepts}\n          aria-label={label}\n          hidden\n          multiple={multiple}\n          onChange={handleInputChange}\n          ref={inputRef}\n          type='file'\n        />\n        <Icon\n          name='upload'\n          size={variant === 'minimal' ? 'medium' : 'large'}\n        />\n        <br />\n        {variant !== 'minimal' && (\n          <Button\n            onClick={() => inputRef.current?.click()}\n            type={'button'}\n          >\n            {label}\n          </Button>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Dropzone","accepts","label","maxFileSize","multiple","onChange","onValidation","variant","props","inputRef","useRef","isDragging","setIsDragging","useState","prevent","e","preventDefault","stopPropagation","updateInputFiles","files","input","current","dt","DataTransfer","file","items","add","target","currentTarget","getValidFiles","validFiles","emptyFiles","oversizedFiles","reduce","acc","size","push","length","handleDrop","Array","from","dataTransfer","selected","slice","handleInputChange","jsx","cx","styles","dropzone","dragging","Icon","Button","click"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/dropzone/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type DropzoneProps = {\n  accepts?: string;\n  label: string;\n  maxFileSize?: number;\n  multiple?: boolean;\n  onChange?: React.ChangeEventHandler<HTMLInputElement>;\n  onValidation?: (empty: File[], oversized: File[]) => void;\n  variant?: 'default' | 'minimal';\n};\n\nexport const Dropzone = ({\n  accepts,\n  label = 'Select files',\n  maxFileSize,\n  multiple = false,\n  onChange,\n  onValidation,\n  variant = 'default',\n  ...props\n}: DropzoneProps) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const prevent = (e: React.DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  const updateInputFiles = (files: File[]) => {\n    const input = inputRef.current;\n    if (!input) return;\n\n    const dt = new DataTransfer();\n    for (const file of files) dt.items.add(file);\n\n    input.files = dt.files;\n\n    onChange?.({\n      target: input,\n      currentTarget: input,\n    } as React.ChangeEvent<HTMLInputElement>);\n  };\n\n  const getValidFiles = (files: File[]) => {\n    const { validFiles, emptyFiles, oversizedFiles } = files.reduce(\n      (acc, file) => {\n        if (file.size === 0) {\n          acc.emptyFiles.push(file);\n        } else if (maxFileSize && file.size > maxFileSize) {\n          acc.oversizedFiles.push(file);\n        } else {\n          acc.validFiles.push(file);\n        }\n\n        return acc;\n      },\n      {\n        validFiles: [] as File[],\n        emptyFiles: [] as File[],\n        oversizedFiles: [] as File[],\n      }\n    );\n\n    if (emptyFiles.length > 0 || oversizedFiles.length > 0) {\n      onValidation?.(emptyFiles, oversizedFiles);\n    }\n\n    return validFiles;\n  };\n\n  const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n    prevent(e);\n    setIsDragging(false);\n    const files = Array.from(e.dataTransfer.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === 0) return;\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {\n    const files = Array.from(e.target.files ?? []);\n    const validFiles = getValidFiles(files);\n\n    if (validFiles.length === files.length) {\n      onChange?.(e);\n      return;\n    }\n\n    const selected = multiple ? validFiles : validFiles.slice(0, 1);\n    updateInputFiles(selected);\n  };\n\n  return (\n    <div\n      className={cx(styles.dropzone, styles[variant], isDragging && styles.dragging)}\n      onDragEnter={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragOver={(e) => {\n        prevent(e);\n        setIsDragging(true);\n      }}\n      onDragLeave={(e) => {\n        prevent(e);\n        setIsDragging(false);\n      }}\n      onDrop={handleDrop}\n      {...props}\n    >\n      <label>\n        <input\n          accept={accepts}\n          aria-label={label}\n          hidden\n          multiple={multiple}\n          onChange={handleInputChange}\n          ref={inputRef}\n          type='file'\n        />\n        <Icon\n          name='UploadSimple'\n          size={variant === 'minimal' ? 'medium' : 'large'}\n        />\n        <br />\n        {variant !== 'minimal' && (\n          <Button\n            onClick={() => inputRef.current?.click()}\n            type={'button'}\n          >\n            {label}\n          </Button>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Dropzone","accepts","label","maxFileSize","multiple","onChange","onValidation","variant","props","inputRef","useRef","isDragging","setIsDragging","useState","prevent","e","preventDefault","stopPropagation","updateInputFiles","files","input","current","dt","DataTransfer","file","items","add","target","currentTarget","getValidFiles","validFiles","emptyFiles","oversizedFiles","reduce","acc","size","push","length","handleDrop","Array","from","dataTransfer","selected","slice","handleInputChange","jsx","cx","styles","dropzone","dragging","Icon","Button","click"],"mappings":"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"}