@smwb/ui-solid 0.1.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"dateTimePicker.js","sources":["../../../../../src/components/inputs/dateTimePicker/dateTimePicker.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, createMemo, createSignal, onCleanup, splitProps } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { buildFloatingMiddleware, type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport type { TextFieldProps } from \"../textField\";\nimport { DataPickerHeader } from \"../datePicker/dataPickerHeader\";\nimport { DataPickerDays } from \"../datePicker/dataPickerDays\";\nimport { DatePickerList } from \"../datePicker/datePickerList\";\nimport { type WeekStart, getMonths, getYears, isValidDate, setMonth, setYear } from \"../datePicker/dateUtils\";\nimport { OpenView } from \"../datePicker/openView\";\nimport { TimePickerColumns } from \"../timePicker/timePickerColumns\";\nimport { DEFAULT_TIME_FORMAT, isValidTimeDate, mergeDate, mergeTime } from \"../timePicker/timeUtils\";\nimport { DateTimePickerInput } from \"./dateTimePickerInput\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface DateTimePickerProps\n  extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\" | \"ref\" | \"onToggle\"> {\n  showDaysOutsideMonth?: boolean | undefined;\n  disablePast?: boolean | undefined;\n  disableFuture?: boolean | undefined;\n  minDate?: Date | undefined;\n  maxDate?: Date | undefined;\n  isDateDisabled?: ((day: Date) => boolean) | undefined;\n  weekStartsOn?: WeekStart | undefined;\n  locale?: string | undefined;\n  /** Input format with tokens dd, MM, yyyy, HH, mm, ss, e.g. \"dd/MM/yyyy HH:mm\". */\n  format?: string | undefined;\n  /** Time portion format when using the clock columns. Defaults to \"HH:mm\". */\n  timeFormat?: string | undefined;\n  placement?: Placement | undefined;\n  disableCalendar?: boolean | undefined;\n  label?: string | undefined;\n  calendarAriaLabel?: string | undefined;\n  value?: Date | string | undefined;\n  calendarIcon?: JSX.Element;\n  onChange?: ((event?: Event, value?: Date, data?: DateTimePickerProps) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date, data?: DateTimePickerProps) => void) | undefined;\n  ref?: Ref<HTMLInputElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function DateTimePicker(props: DateTimePickerProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"showDaysOutsideMonth\",\n    \"disablePast\",\n    \"disableFuture\",\n    \"weekStartsOn\",\n    \"placement\",\n    \"disabled\",\n    \"disableCalendar\",\n    \"calendarAriaLabel\",\n    \"minDate\",\n    \"maxDate\",\n    \"isDateDisabled\",\n    \"locale\",\n    \"format\",\n    \"timeFormat\",\n    \"calendarIcon\",\n    \"onBlur\",\n    \"ref\",\n  ]);\n\n  const value = (): Date | undefined => (local.value === undefined ? undefined : new Date(local.value));\n\n  const initialValue = value();\n  const [viewValue, setViewValue] = createSignal<Date>(\n    isValidDate(initialValue) || isValidTimeDate(initialValue) ? initialValue : new Date()\n  );\n  const [openView, setOpenView] = createSignal<OpenView>(OpenView.days);\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  let anchorEl: HTMLElement | undefined;\n  let popupEl: HTMLElement | undefined;\n\n  const resolved = (): ReturnType<typeof resolvePlacement> => resolvePlacement(local.placement ?? \"bottom-start\");\n  const floating = createFloating({\n    placement: () => resolved().placement,\n    middleware: () => buildFloatingMiddleware(resolved()),\n  });\n\n  createEffect(() => {\n    if (local.disabled) return;\n    const v = value();\n    setViewValue(isValidDate(v) || isValidTimeDate(v) ? v : new Date());\n  });\n\n  const weekStartsOn = (): WeekStart => local.weekStartsOn ?? 1;\n\n  const onViewValueChange = (next: Date): void => {\n    setViewValue(next);\n  };\n\n  const onMonthLabelClick = (): void => {\n    setOpenView(openView() === OpenView.months ? OpenView.days : OpenView.months);\n  };\n\n  const onYearLabelClick = (): void => {\n    setOpenView(openView() === OpenView.years ? OpenView.days : OpenView.years);\n  };\n\n  const onMonthChange = (month: number): void => {\n    setViewValue(setMonth(viewValue(), month));\n    setOpenView(OpenView.days);\n  };\n\n  const onYearChange = (year: number): void => {\n    setViewValue(setYear(viewValue(), year));\n    setOpenView(OpenView.days);\n  };\n\n  const emitChange = (next: Date): void => {\n    setViewValue(next);\n    local.onChange?.(undefined, next, props);\n  };\n\n  const onDateChange = (_event?: Event, date?: Date): void => {\n    if (!date) return;\n    const v = value();\n    const timeSource = isValidTimeDate(v) ? v : viewValue();\n    emitChange(mergeDate(date, timeSource));\n  };\n\n  const onTimeChange = (timeDate: Date): void => {\n    const v = value();\n    const dateSource = isValidDate(v) ? v : viewValue();\n    emitChange(mergeTime(dateSource, timeDate));\n  };\n\n  const onToggle = (): void => {\n    if (!local.disabled) setIsOpen((prev) => !prev);\n  };\n\n  const onClickAway = (event: MouseEvent | TouchEvent): void => {\n    const target = event.target as HTMLElement;\n    if (popupEl?.contains(target) || anchorEl?.contains(target)) return;\n    setIsOpen(false);\n  };\n\n  const resolvedTimeFormat = (): string => {\n    if (local.timeFormat) return local.timeFormat;\n    if (local.format?.includes(\"HH:mm:ss\")) return \"HH:mm:ss\";\n    return DEFAULT_TIME_FORMAT;\n  };\n\n  const months = createMemo(() => getMonths(local.locale));\n  const years = getYears(new Date().getFullYear(), 100);\n\n  const shouldOpen = (): boolean => isOpen() && !local.disabled && !local.disableCalendar;\n  const [mounted, setMounted] = createSignal(shouldOpen());\n  const [shown, setShown] = createSignal(false);\n  let raf: number | undefined;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n\n  createEffect(() => {\n    if (shouldOpen()) {\n      if (timer !== undefined) clearTimeout(timer);\n      setMounted(true);\n      raf = requestAnimationFrame(() => setShown(true));\n    } else {\n      setShown(false);\n      if (mounted()) timer = setTimeout(() => setMounted(false), FADE_MS);\n    }\n  });\n  onCleanup(() => {\n    if (raf !== undefined) cancelAnimationFrame(raf);\n    if (timer !== undefined) clearTimeout(timer);\n  });\n\n  const view = (): JSX.Element => {\n    switch (openView()) {\n      case OpenView.months:\n        return <DatePickerList value={viewValue().getMonth()} items={months()} onChange={onMonthChange} />;\n      case OpenView.years:\n        return <DatePickerList value={viewValue().getFullYear()} items={years} onChange={onYearChange} />;\n      default:\n        return (\n          <DataPickerDays\n            viewValue={viewValue()}\n            value={value()}\n            showDaysOutsideMonth={local.showDaysOutsideMonth}\n            onChange={onDateChange}\n            disablePast={local.disablePast}\n            disableFuture={local.disableFuture}\n            weekStartsOn={weekStartsOn()}\n            minDate={local.minDate}\n            maxDate={local.maxDate}\n            isDateDisabled={local.isDateDisabled}\n            locale={local.locale}\n          />\n        );\n    }\n  };\n\n  return (\n    <>\n      <DateTimePickerInput\n        ref={mergeRefs(local.ref, floating.setReference, (el) => (anchorEl = el as HTMLElement))}\n        value={local.value}\n        onChange={local.onChange}\n        onBlur={local.onBlur}\n        onToggle={onToggle}\n        disabled={local.disabled}\n        disableCalendar={local.disableCalendar}\n        format={local.format}\n        calendarIcon={local.calendarIcon}\n        {...rest}\n      />\n      <Show when={mounted()}>\n        <Portal mount={document.body}>\n          <ClickAwayListener onClickAway={onClickAway}>\n            <div\n              ref={mergeRefs(floating.setFloating, (el) => (popupEl = el as HTMLElement))}\n              class=\"smwb-date-picker smwb-date-time-picker\"\n              style={{\n                ...floating.floatingStyles(),\n                transition: `opacity ${FADE_MS}ms ease-in-out`,\n                opacity: shown() ? 1 : 0,\n              }}\n              data-testid=\"date-time-picker\"\n              role=\"dialog\"\n              aria-modal=\"false\"\n              aria-label={local.calendarAriaLabel ?? \"Choose date and time\"}\n            >\n              <div class=\"smwb-date-picker__inner smwb-date-time-picker__inner\">\n                <DataPickerHeader\n                  viewValue={viewValue()}\n                  locale={local.locale}\n                  openView={openView()}\n                  onChange={onViewValueChange}\n                  onMonthLabelClick={onMonthLabelClick}\n                  onYearLabelClick={onYearLabelClick}\n                />\n                <div class=\"smwb-date-time-picker__content\">\n                  <div class=\"smwb-date-picker__body smwb-date-time-picker__body\">{view()}</div>\n                  <TimePickerColumns value={viewValue()} format={resolvedTimeFormat()} onChange={onTimeChange} />\n                </div>\n              </div>\n            </div>\n          </ClickAwayListener>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport default DateTimePicker;\n"],"names":["FADE_MS","DateTimePicker","props","local","rest","splitProps","value","undefined","Date","initialValue","viewValue","setViewValue","createSignal","isValidDate","isValidTimeDate","openView","setOpenView","OpenView","days","isOpen","setIsOpen","anchorEl","popupEl","resolved","resolvePlacement","placement","floating","createFloating","middleware","buildFloatingMiddleware","createEffect","disabled","v","weekStartsOn","onViewValueChange","next","onMonthLabelClick","months","onYearLabelClick","years","onMonthChange","month","setMonth","onYearChange","year","setYear","emitChange","onChange","onDateChange","_event","date","timeSource","mergeDate","onTimeChange","timeDate","dateSource","mergeTime","onToggle","prev","onClickAway","event","target","contains","resolvedTimeFormat","timeFormat","format","includes","DEFAULT_TIME_FORMAT","createMemo","getMonths","locale","getYears","getFullYear","shouldOpen","disableCalendar","mounted","setMounted","shown","setShown","raf","timer","clearTimeout","requestAnimationFrame","setTimeout","onCleanup","cancelAnimationFrame","view","_$createComponent","DatePickerList","getMonth","items","DataPickerDays","showDaysOutsideMonth","disablePast","disableFuture","minDate","maxDate","isDateDisabled","DateTimePickerInput","_$mergeProps","ref","r$","_ref$","mergeRefs","setReference","el","onBlur","calendarIcon","Show","when","children","Portal","mount","document","body","ClickAwayListener","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","_ref$2","setFloating","_$use","_$insert","DataPickerHeader","TimePickerColumns","_$effect","_p$","_v$","floatingStyles","opacity","_v$2","calendarAriaLabel","e","_$style","t","_$setAttribute"],"mappings":"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"}

package/dist/headless/components/inputs/dateTimePicker/dateTimePickerInput.js

@@ -0,0 +1,80 @@
+import { createComponent as n, mergeProps as u } from "solid-js/web";
+import { splitProps as d, Show as a } from "solid-js";
+import { DatePickerIconButton as c } from "../datePicker/datePickerIconButton.js";
+import { createDateTimeInput as g } from "./useDateTimeInput.js";
+import { mergeRefs as m } from "../../../primitives/mergeRefs.js";
+import { TextField as p } from "../textField/textField.js";
+import { Icon as f } from "../../base/icon/icon.js";
+function s(t) {
+  t.stopPropagation();
+}
+function P(t) {
+  const [e, l] = d(t, ["value", "onChange", "onBlur", "onToggle", "disabled", "disableCalendar", "calendarIcon", "format", "ref"]), r = g({
+    value: e.value,
+    onChange: e.onChange,
+    onBlur: e.onBlur,
+    format: e.format
+  });
+  return n(p, u({
+    ref(i) {
+      var o = m(e.ref, r.ref);
+      typeof o == "function" && o(i);
+    },
+    get value() {
+      return r.value();
+    },
+    get onChange() {
+      return r.onInput;
+    },
+    get onBlur() {
+      return r.onBlur;
+    },
+    get placeholder() {
+      return r.placeholder();
+    },
+    type: "tel",
+    get endAdornment() {
+      return n(a, {
+        get when() {
+          return !e.disableCalendar;
+        },
+        get children() {
+          return n(c, {
+            edge: "end",
+            onClick: () => e.onToggle(),
+            onMouseDown: s,
+            get disabled() {
+              return !!e.disabled;
+            },
+            "data-testid": "date-time-picker-icon-button",
+            get children() {
+              return n(a, {
+                get when() {
+                  return e.calendarIcon;
+                },
+                get fallback() {
+                  return n(f, {
+                    name: "event",
+                    fill: 1,
+                    weight: 500,
+                    size: 24
+                  });
+                },
+                get children() {
+                  return e.calendarIcon;
+                }
+              });
+            }
+          });
+        }
+      });
+    },
+    get disabled() {
+      return !!e.disabled;
+    }
+  }, l));
+}
+export {
+  P as DateTimePickerInput
+};
+//# sourceMappingURL=dateTimePickerInput.js.map

package/dist/headless/components/inputs/dateTimePicker/dateTimePickerInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dateTimePickerInput.js","sources":["../../../../../src/components/inputs/dateTimePicker/dateTimePickerInput.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport { TextField } from \"../textField\";\nimport { DatePickerIconButton } from \"../datePicker/datePickerIconButton\";\nimport { createDateTimeInput } from \"./useDateTimeInput\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport type { DateTimePickerProps } from \"./dateTimePicker\";\n\nexport interface DateTimePickerInputProps extends Omit<DateTimePickerProps, \"placement\" | \"onToggle\"> {\n  onToggle: () => void;\n  ref?: Ref<HTMLInputElement>;\n}\n\nfunction stopPropagation(event: Event): void {\n  event.stopPropagation();\n}\n\nexport function DateTimePickerInput(props: DateTimePickerInputProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"onBlur\",\n    \"onToggle\",\n    \"disabled\",\n    \"disableCalendar\",\n    \"calendarIcon\",\n    \"format\",\n    \"ref\",\n  ]);\n\n  const masked = createDateTimeInput({\n    value: local.value,\n    onChange: local.onChange,\n    onBlur: local.onBlur,\n    format: local.format,\n  });\n\n  return (\n    <TextField\n      ref={mergeRefs(local.ref, masked.ref)}\n      value={masked.value()}\n      onChange={masked.onInput}\n      onBlur={masked.onBlur}\n      placeholder={masked.placeholder()}\n      type=\"tel\"\n      endAdornment={\n        <Show when={!local.disableCalendar}>\n          <DatePickerIconButton\n            edge=\"end\"\n            onClick={() => local.onToggle()}\n            onMouseDown={stopPropagation}\n            disabled={Boolean(local.disabled)}\n            data-testid=\"date-time-picker-icon-button\"\n          >\n            <Show when={local.calendarIcon} fallback={<Icon name=\"event\" fill={1} weight={500} size={24} />}>\n              {local.calendarIcon}\n            </Show>\n          </DatePickerIconButton>\n        </Show>\n      }\n      disabled={Boolean(local.disabled)}\n      {...rest}\n    />\n  );\n}\n\nexport default DateTimePickerInput;\n"],"names":["stopPropagation","event","DateTimePickerInput","props","local","rest","splitProps","masked","createDateTimeInput","value","onChange","onBlur","format","_$createComponent","TextField","_$mergeProps","ref","r$","_ref$","mergeRefs","onInput","placeholder","type","endAdornment","Show","when","disableCalendar","children","DatePickerIconButton","edge","onClick","onToggle","onMouseDown","disabled","Boolean","calendarIcon","fallback","Icon","name","fill","weight","size"],"mappings":";;;;;;;AAaA,SAASA,EAAgBC,GAAoB;AAC3CA,EAAAA,EAAMD,gBAAAA;AACR;AAEO,SAASE,EAAoBC,GAA8C;AAChF,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CACtC,SACA,YACA,UACA,YACA,YACA,mBACA,gBACA,UACA,KAAK,CACN,GAEKI,IAASC,EAAoB;AAAA,IACjCC,OAAOL,EAAMK;AAAAA,IACbC,UAAUN,EAAMM;AAAAA,IAChBC,QAAQP,EAAMO;AAAAA,IACdC,QAAQR,EAAMQ;AAAAA,EAAAA,CACf;AAED,SAAAC,EACGC,GAASC,EAAA;AAAA,IAAAC,IAAAC,GAAA;AAAA,UAAAC,IACHC,EAAUf,EAAMY,KAAKT,EAAOS,GAAG;AAAC,aAAAE,KAAA,cAAAA,EAAAD,CAAA;AAAA,IAAA;AAAA,IAAA,IACrCR,QAAK;AAAA,aAAEF,EAAOE,MAAAA;AAAAA,IAAO;AAAA,IAAA,IACrBC,WAAQ;AAAA,aAAEH,EAAOa;AAAAA,IAAO;AAAA,IAAA,IACxBT,SAAM;AAAA,aAAEJ,EAAOI;AAAAA,IAAM;AAAA,IAAA,IACrBU,cAAW;AAAA,aAAEd,EAAOc,YAAAA;AAAAA,IAAa;AAAA,IACjCC,MAAI;AAAA,IAAA,IACJC,eAAY;AAAA,aAAAV,EACTW,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAE,CAACrB,EAAMsB;AAAAA,QAAe;AAAA,QAAA,IAAAC,WAAA;AAAA,iBAAAd,EAC/Be,GAAoB;AAAA,YACnBC,MAAI;AAAA,YACJC,SAASA,MAAM1B,EAAM2B,SAAAA;AAAAA,YACrBC,aAAahC;AAAAA,YAAe,IAC5BiC,WAAQ;AAAA,qBAAEC,EAAQ9B,EAAM6B;AAAAA,YAAS;AAAA,YAAA,eAAA;AAAA,YAAA,IAAAN,WAAA;AAAA,qBAAAd,EAGhCW,GAAI;AAAA,gBAAA,IAACC,OAAI;AAAA,yBAAErB,EAAM+B;AAAAA,gBAAY;AAAA,gBAAA,IAAEC,WAAQ;AAAA,yBAAAvB,EAAGwB,GAAI;AAAA,oBAACC,MAAI;AAAA,oBAASC,MAAM;AAAA,oBAAGC,QAAQ;AAAA,oBAAKC,MAAM;AAAA,kBAAA,CAAE;AAAA,gBAAA;AAAA,gBAAA,IAAAd,WAAA;AAAA,yBACxFvB,EAAM+B;AAAAA,gBAAY;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAK3BF,WAAQ;AAAA,aAAEC,EAAQ9B,EAAM6B;AAAAA,IAAS;AAAA,EAAA,GAC7B5B,CAAI,CAAA;AAGd;"}

package/dist/headless/components/inputs/dateTimePicker/useDateTimeInput.js

@@ -0,0 +1,53 @@
+import { createSignal as d, createEffect as D } from "solid-js";
+import { getCurrentFormatDate as s, maskedDateFormatter as v } from "../datePicker/dateUtils.js";
+import { formatDateTimeByPattern as h, isDateTimePatternMatch as m, parseDateTimeByPattern as y } from "./dateTimeFormat.js";
+import { createMaskedInput as T } from "../../../primitives/createMaskedInput.js";
+const B = /[a-zA-Z]/g;
+function a(t, n) {
+  return !t || Object.prototype.toString.call(t) !== "[object Date]" || isNaN(t) ? "" : n ? h(t, n) : new Intl.DateTimeFormat(void 0, {
+    day: "2-digit",
+    month: "2-digit",
+    year: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+    hour12: !1
+  }).format(t);
+}
+function c(t) {
+  return t || `${s()} HH:mm`;
+}
+function C(t) {
+  return c(t).replace(B, "_");
+}
+function f(t, n) {
+  const r = y(t, n);
+  return r || new Date(Number.NaN);
+}
+function M(t) {
+  const n = () => c(t.format), [r, i] = d(a(t.value, t.format)), l = () => v(C(t.format));
+  let o;
+  D(() => {
+    const e = t.value;
+    e !== o && (o = e, i(a(e, t.format)));
+  });
+  const u = T({ value: r, onChange: (e) => {
+    i(e), t.onChange && (m(e, n()) ? t.onChange(void 0, f(e, n())) : e === "" && t.onChange(void 0));
+  }, format: (e) => l()(e) }), g = () => {
+    if (!t.onBlur) return;
+    const e = o;
+    e instanceof Date && m(a(e, t.format), n()) ? t.onBlur(void 0, e) : typeof e == "string" && m(e, n()) ? t.onBlur(void 0, f(e, n())) : (e === void 0 || e === "") && t.onBlur(void 0), i(a(t.value, t.format));
+  };
+  return {
+    value: r,
+    onInput: u.onInput,
+    onBlur: g,
+    ref: u.ref,
+    placeholder: () => n().toLowerCase()
+  };
+}
+export {
+  M as createDateTimeInput,
+  c as getCurrentDateTimeFormat,
+  a as getDisplayDateTime
+};
+//# sourceMappingURL=useDateTimeInput.js.map

package/dist/headless/components/inputs/dateTimePicker/useDateTimeInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDateTimeInput.js","sources":["../../../../../src/components/inputs/dateTimePicker/useDateTimeInput.ts"],"sourcesContent":["import { type Accessor, createEffect, createSignal } from \"solid-js\";\nimport { getCurrentFormatDate, maskedDateFormatter } from \"../datePicker/dateUtils\";\nimport { formatDateTimeByPattern, isDateTimePatternMatch, parseDateTimeByPattern } from \"./dateTimeFormat\";\nimport { createMaskedInput } from \"../../../primitives/createMaskedInput\";\n\nexport interface CreateDateTimeInputProps {\n  value?: Date | string | undefined;\n  onChange?: ((event?: Event, value?: Date) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date) => void) | undefined;\n  format?: string | undefined;\n}\n\nexport interface DateTimeInputState {\n  value: Accessor<string>;\n  onInput: (event: InputEvent & { currentTarget: HTMLInputElement; target: Element }) => void;\n  onBlur: () => void;\n  ref: (el: HTMLInputElement) => void;\n  placeholder: Accessor<string>;\n}\n\nconst MASK_TOKEN_REGEXP = /[a-zA-Z]/g;\n\nexport function getDisplayDateTime(date: unknown, format?: string): string {\n  if (!date || Object.prototype.toString.call(date) !== \"[object Date]\" || isNaN(date as number)) {\n    return \"\";\n  }\n\n  if (format) {\n    return formatDateTimeByPattern(date as Date, format);\n  }\n\n  return new Intl.DateTimeFormat(undefined, {\n    day: \"2-digit\",\n    month: \"2-digit\",\n    year: \"numeric\",\n    hour: \"2-digit\",\n    minute: \"2-digit\",\n    hour12: false,\n  }).format(date as Date);\n}\n\nexport function getCurrentDateTimeFormat(format?: string): string {\n  if (format) {\n    return format;\n  }\n\n  return `${getCurrentFormatDate()} HH:mm`;\n}\n\nfunction getDateTimeMaskFormat(format?: string): string {\n  return getCurrentDateTimeFormat(format).replace(MASK_TOKEN_REGEXP, \"_\");\n}\n\nfunction getDateTimeByFormat(value: string, format: string): Date {\n  const parsed = parseDateTimeByPattern(value, format);\n\n  if (!parsed) {\n    return new Date(Number.NaN);\n  }\n\n  return parsed;\n}\n\n/** Solid port of useDateTimeInput — masked text input bound to a Date value. */\nexport function createDateTimeInput(props: CreateDateTimeInputProps): DateTimeInputState {\n  const currentFormat = (): string => getCurrentDateTimeFormat(props.format);\n  const [displayedValue, setDisplayedValue] = createSignal(getDisplayDateTime(props.value, props.format));\n  const formatter = (): ((value: string) => string) => maskedDateFormatter(getDateTimeMaskFormat(props.format));\n\n  let prevValue: Date | string | undefined;\n\n  createEffect(() => {\n    const v = props.value;\n    if (v !== prevValue) {\n      prevValue = v;\n      setDisplayedValue(getDisplayDateTime(v, props.format));\n    }\n  });\n\n  const onChange = (value: string): void => {\n    setDisplayedValue(value);\n    if (!props.onChange) return;\n    if (isDateTimePatternMatch(value, currentFormat())) {\n      props.onChange(undefined, getDateTimeByFormat(value, currentFormat()));\n    } else if (value === \"\") {\n      props.onChange(undefined);\n    }\n  };\n\n  const masked = createMaskedInput({ value: displayedValue, onChange, format: (v) => formatter()(v) });\n\n  const onBlur = (): void => {\n    if (!props.onBlur) return;\n    const prev = prevValue;\n    if (prev instanceof Date && isDateTimePatternMatch(getDisplayDateTime(prev, props.format), currentFormat())) {\n      props.onBlur(undefined, prev);\n    } else if (typeof prev === \"string\" && isDateTimePatternMatch(prev, currentFormat())) {\n      props.onBlur(undefined, getDateTimeByFormat(prev, currentFormat()));\n    } else if (prev === undefined || prev === \"\") {\n      props.onBlur(undefined);\n    }\n    setDisplayedValue(getDisplayDateTime(props.value, props.format));\n  };\n\n  return {\n    value: displayedValue,\n    onInput: masked.onInput,\n    onBlur,\n    ref: masked.ref,\n    placeholder: () => currentFormat().toLowerCase(),\n  };\n}\n"],"names":["MASK_TOKEN_REGEXP","getDisplayDateTime","date","format","formatDateTimeByPattern","getCurrentDateTimeFormat","getCurrentFormatDate","getDateTimeMaskFormat","getDateTimeByFormat","value","parsed","parseDateTimeByPattern","createDateTimeInput","props","currentFormat","displayedValue","setDisplayedValue","createSignal","formatter","maskedDateFormatter","prevValue","createEffect","v","masked","createMaskedInput","isDateTimePatternMatch","onBlur","prev"],"mappings":";;;;AAoBA,MAAMA,IAAoB;AAEnB,SAASC,EAAmBC,GAAeC,GAAyB;AACzE,SAAI,CAACD,KAAQ,OAAO,UAAU,SAAS,KAAKA,CAAI,MAAM,mBAAmB,MAAMA,CAAc,IACpF,KAGLC,IACKC,EAAwBF,GAAcC,CAAM,IAG9C,IAAI,KAAK,eAAe,QAAW;AAAA,IACxC,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,IACN,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,EAAA,CACT,EAAE,OAAOD,CAAY;AACxB;AAEO,SAASG,EAAyBF,GAAyB;AAChE,SAAIA,KAIG,GAAGG,GAAsB;AAClC;AAEA,SAASC,EAAsBJ,GAAyB;AACtD,SAAOE,EAAyBF,CAAM,EAAE,QAAQH,GAAmB,GAAG;AACxE;AAEA,SAASQ,EAAoBC,GAAeN,GAAsB;AAChE,QAAMO,IAASC,EAAuBF,GAAON,CAAM;AAEnD,SAAKO,KACI,IAAI,KAAK,OAAO,GAAG;AAI9B;AAGO,SAASE,EAAoBC,GAAqD;AACvF,QAAMC,IAAgB,MAAcT,EAAyBQ,EAAM,MAAM,GACnE,CAACE,GAAgBC,CAAiB,IAAIC,EAAahB,EAAmBY,EAAM,OAAOA,EAAM,MAAM,CAAC,GAChGK,IAAY,MAAmCC,EAAoBZ,EAAsBM,EAAM,MAAM,CAAC;AAE5G,MAAIO;AAEJ,EAAAC,EAAa,MAAM;AACjB,UAAMC,IAAIT,EAAM;AAChB,IAAIS,MAAMF,MACRA,IAAYE,GACZN,EAAkBf,EAAmBqB,GAAGT,EAAM,MAAM,CAAC;AAAA,EAEzD,CAAC;AAYD,QAAMU,IAASC,EAAkB,EAAE,OAAOT,GAAgB,UAVzC,CAACN,MAAwB;AAExC,IADAO,EAAkBP,CAAK,GAClBI,EAAM,aACPY,EAAuBhB,GAAOK,EAAA,CAAe,IAC/CD,EAAM,SAAS,QAAWL,EAAoBC,GAAOK,EAAA,CAAe,CAAC,IAC5DL,MAAU,MACnBI,EAAM,SAAS,MAAS;AAAA,EAE5B,GAEoE,QAAQ,CAACS,MAAMJ,IAAYI,CAAC,GAAG,GAE7FI,IAAS,MAAY;AACzB,QAAI,CAACb,EAAM,OAAQ;AACnB,UAAMc,IAAOP;AACb,IAAIO,aAAgB,QAAQF,EAAuBxB,EAAmB0B,GAAMd,EAAM,MAAM,GAAGC,EAAA,CAAe,IACxGD,EAAM,OAAO,QAAWc,CAAI,IACnB,OAAOA,KAAS,YAAYF,EAAuBE,GAAMb,EAAA,CAAe,IACjFD,EAAM,OAAO,QAAWL,EAAoBmB,GAAMb,EAAA,CAAe,CAAC,KACzDa,MAAS,UAAaA,MAAS,OACxCd,EAAM,OAAO,MAAS,GAExBG,EAAkBf,EAAmBY,EAAM,OAAOA,EAAM,MAAM,CAAC;AAAA,EACjE;AAEA,SAAO;AAAA,IACL,OAAOE;AAAA,IACP,SAASQ,EAAO;AAAA,IAChB,QAAAG;AAAA,IACA,KAAKH,EAAO;AAAA,IACZ,aAAa,MAAMT,EAAA,EAAgB,YAAA;AAAA,EAAY;AAEnD;"}

package/dist/headless/components/inputs/fileDrop/countPreview.js

@@ -0,0 +1,24 @@
+import { insert as i, createComponent as l, effect as n, className as o, template as m } from "solid-js/web";
+import a from "clsx";
+import { FloatingButton as f } from "../floatingButton/floatingButton.js";
+import { Icon as s } from "../../base/icon/icon.js";
+var c = /* @__PURE__ */ m("<div><div class=smwb-file-drop__preview-count>");
+function p(e) {
+  return (() => {
+    var t = c(), r = t.firstChild;
+    return i(t, l(f, {
+      onClick: () => e.handleRemoveAll(),
+      class: "smwb-file-drop__preview-button",
+      get children() {
+        return l(s, {
+          name: "delete",
+          size: 28
+        });
+      }
+    }), r), i(r, () => `${e.text ? e.text : "uploaded files:"} ${e.filesLength}`), n(() => o(t, a("smwb-file-drop__preview", e.previewClassName))), t;
+  })();
+}
+export {
+  p as CountPreview
+};
+//# sourceMappingURL=countPreview.js.map

package/dist/headless/components/inputs/fileDrop/countPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"countPreview.js","sources":["../../../../../src/components/inputs/fileDrop/countPreview.tsx"],"sourcesContent":["import { type JSX } from \"solid-js\";\nimport cn from \"clsx\";\nimport { FloatingButton } from \"../floatingButton\";\nimport { Icon } from \"../../base/icon\";\n\nexport interface CountPreviewProps {\n  previewClassName?: string | undefined;\n  text?: string | undefined;\n  filesLength: number;\n  handleRemoveAll: () => void;\n}\n\nexport function CountPreview(props: CountPreviewProps): JSX.Element {\n  return (\n    <div class={cn(\"smwb-file-drop__preview\", props.previewClassName)}>\n      <FloatingButton onClick={() => props.handleRemoveAll()} class=\"smwb-file-drop__preview-button\">\n        <Icon name=\"delete\" size={28} />\n      </FloatingButton>\n      <div class=\"smwb-file-drop__preview-count\">{`${props.text ? props.text : \"uploaded files:\"} ${props.filesLength}`}</div>\n    </div>\n  );\n}\n\nexport default CountPreview;\n"],"names":["CountPreview","props","_el$","_tmpl$","_el$2","firstChild","_$insert","_$createComponent","FloatingButton","onClick","handleRemoveAll","children","Icon","name","size","text","filesLength","_$effect","_$className","cn","previewClassName"],"mappings":";;;;;AAYO,SAASA,EAAaC,GAAuC;AAClE,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,WAAAA,EAAAJ,GAAAK,EAEKC,GAAc;AAAA,MAACC,SAASA,MAAMR,EAAMS,gBAAAA;AAAAA,MAAiB,OAAA;AAAA,MAAA,IAAAC,WAAA;AAAA,eAAAJ,EACnDK,GAAI;AAAA,UAACC,MAAI;AAAA,UAAUC,MAAM;AAAA,QAAA,CAAE;AAAA,MAAA;AAAA,IAAA,CAAA,GAAAV,CAAA,GAAAE,EAAAF,GAAA,MAEc,GAAGH,EAAMc,OAAOd,EAAMc,OAAO,iBAAiB,IAAId,EAAMe,WAAW,EAAE,GAAAC,EAAA,MAAAC,EAAAhB,GAJvGiB,EAAG,2BAA2BlB,EAAMmB,gBAAgB,CAAC,CAAA,GAAAlB;AAAAA,EAAA,GAAA;AAOrE;"}

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

@@ -0,0 +1,83 @@
+import { use as u, insert as i, createComponent as a, spread as g, mergeProps as b, effect as C, className as h, template as n } from "solid-js/web";
+import { mergeProps as z, splitProps as P, createSignal as S, Show as v } from "solid-js";
+import y from "clsx";
+import { PreviewWrapper as D } from "./previewWrapper.js";
+import { createDropzone as I } from "../../../primitives/createDropzone.js";
+import { mergeRefs as R } from "../../../primitives/mergeRefs.js";
+var x = /* @__PURE__ */ n("<span class=smwb-file-drop__error role=alert>"), N = /* @__PURE__ */ n("<div data-testid=file-drop>"), F = /* @__PURE__ */ n("<div class=smwb-file-drop__input role=button><div class=smwb-file-drop__input-text></div><input>");
+function q(c) {
+  const w = z({
+    previewCols: 3,
+    galleryItemSize: 100,
+    label: ""
+  }, c), [e, _] = P(w, ["preview", "previewCols", "galleryItemSize", "onDrop", "label", "class", "previewClassName", "disabled", "error", "ref"]), [p, d] = S([]), l = I({
+    ..._,
+    disabled: e.disabled,
+    onDrop: (r) => {
+      d((o) => [...o, ...r]), e.onDrop(r);
+    }
+  }), $ = () => {
+    d([]);
+  };
+  return (() => {
+    var r = N(), o = R(e.ref);
+    return typeof o == "function" && u(o, r), i(r, a(v, {
+      get when() {
+        return p().length > 0;
+      },
+      get fallback() {
+        return (() => {
+          var t = F(), m = t.firstChild, s = m.nextSibling;
+          g(t, b({
+            get tabindex() {
+              return e.disabled ? -1 : 0;
+            },
+            get "aria-disabled"() {
+              return e.disabled || void 0;
+            },
+            get "aria-label"() {
+              return e.label || "Upload files";
+            }
+          }, () => l.getRootProps()), !1, !0), i(m, () => e.label);
+          var f = l.inputRef;
+          return typeof f == "function" ? u(f, s) : l.inputRef = s, g(s, b(() => l.getInputProps()), !1, !1), t;
+        })();
+      },
+      get children() {
+        return a(D, {
+          get preview() {
+            return e.preview;
+          },
+          get files() {
+            return p();
+          },
+          handleRemoveAll: $,
+          get previewCols() {
+            return e.previewCols;
+          },
+          get galleryItemSize() {
+            return e.galleryItemSize;
+          },
+          get previewClassName() {
+            return e.previewClassName;
+          }
+        });
+      }
+    }), null), i(r, a(v, {
+      get when() {
+        return e.error;
+      },
+      get children() {
+        var t = x();
+        return i(t, () => e.error), t;
+      }
+    }), null), C(() => h(r, y("smwb-file-drop", {
+      "smwb-disabled": e.disabled,
+      "smwb-error": !!e.error
+    }, e.class))), r;
+  })();
+}
+export {
+  q as FileDrop
+};
+//# sourceMappingURL=fileDrop.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"fileDrop.js","sources":["../../../../../src/components/inputs/fileDrop/fileDrop.tsx"],"sourcesContent":["import { type JSX, Show, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { PreviewWrapper } from \"./previewWrapper\";\nimport { createDropzone, type DropzoneOptions } from \"../../../primitives/createDropzone\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface FileUploadProps extends DropzoneOptions {\n  preview?: boolean;\n  previewCols?: number;\n  galleryItemSize?: number;\n  onDrop: (files: File[]) => void;\n  label?: string;\n  class?: string;\n  previewClassName?: string;\n  disabled?: boolean;\n  /** Validation message rendered below the drop zone. */\n  error?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function FileDrop(props: FileUploadProps): JSX.Element {\n  const merged = mergeProps({ previewCols: 3, galleryItemSize: 100, label: \"\" }, props);\n  const [local, dropzoneOptions] = splitProps(merged, [\n    \"preview\",\n    \"previewCols\",\n    \"galleryItemSize\",\n    \"onDrop\",\n    \"label\",\n    \"class\",\n    \"previewClassName\",\n    \"disabled\",\n    \"error\",\n    \"ref\",\n  ]);\n\n  const [files, setFiles] = createSignal<File[]>([]);\n\n  const dropzone = createDropzone({\n    ...dropzoneOptions,\n    disabled: local.disabled,\n    onDrop: (accepted) => {\n      setFiles((prev) => [...prev, ...accepted]);\n      local.onDrop(accepted);\n    },\n  });\n\n  const handleRemoveAll = (): void => {\n    setFiles([]);\n  };\n\n  return (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-file-drop\", { \"smwb-disabled\": local.disabled, \"smwb-error\": !!local.error }, local.class)}\n      data-testid=\"file-drop\"\n    >\n      <Show\n        when={files().length > 0}\n        fallback={\n          <div\n            class=\"smwb-file-drop__input\"\n            role=\"button\"\n            tabindex={local.disabled ? -1 : 0}\n            aria-disabled={local.disabled || undefined}\n            aria-label={local.label || \"Upload files\"}\n            {...dropzone.getRootProps()}\n          >\n            <div class=\"smwb-file-drop__input-text\">{local.label}</div>\n            <input ref={dropzone.inputRef} {...dropzone.getInputProps()} />\n          </div>\n        }\n      >\n        <PreviewWrapper\n          preview={local.preview}\n          files={files()}\n          handleRemoveAll={handleRemoveAll}\n          previewCols={local.previewCols}\n          galleryItemSize={local.galleryItemSize}\n          previewClassName={local.previewClassName}\n        />\n      </Show>\n      <Show when={local.error}>\n        <span class=\"smwb-file-drop__error\" role=\"alert\">\n          {local.error}\n        </span>\n      </Show>\n    </div>\n  );\n}\n\nexport default FileDrop;\n"],"names":["FileDrop","props","merged","mergeProps","previewCols","galleryItemSize","label","local","dropzoneOptions","splitProps","files","setFiles","createSignal","dropzone","createDropzone","disabled","onDrop","accepted","prev","handleRemoveAll","_el$","_tmpl$2","_ref$","mergeRefs","ref","_$use","_$insert","_$createComponent","Show","when","length","fallback","_el$3","_tmpl$3","_el$4","firstChild","_el$5","nextSibling","_$spread","_$mergeProps","tabindex","undefined","getRootProps","_ref$2","inputRef","getInputProps","children","PreviewWrapper","preview","previewClassName","error","_el$2","_tmpl$","_$effect","_$className","cn","class"],"mappings":"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"}

package/dist/headless/components/inputs/fileDrop/preview.js

@@ -0,0 +1,70 @@
+import { insert as i, createComponent as r, effect as n, setStyleProperty as p, className as c, template as s } from "solid-js/web";
+import { mergeProps as g, For as w, Show as u } from "solid-js";
+import f from "clsx";
+import { isImageFile as v } from "./utils.js";
+import { FloatingButton as _ } from "../floatingButton/floatingButton.js";
+import { Icon as d } from "../../base/icon/icon.js";
+import { ImagesList as h } from "../../dataDisplay/imagesList/imagesList.js";
+import { ImagesListItem as b } from "../../dataDisplay/imagesList/imagesListItem/imagesListItem.js";
+var y = /* @__PURE__ */ s("<div>"), I = /* @__PURE__ */ s("<div class=smwb-file-drop__preview-gallery-file>");
+function x(a) {
+  const e = g({
+    previewCols: 3,
+    galleryItemSize: 100
+  }, a);
+  return (() => {
+    var t = y();
+    return i(t, r(_, {
+      onClick: () => e.handleRemoveAll(),
+      class: "smwb-file-drop__preview-button",
+      get children() {
+        return r(d, {
+          name: "delete",
+          size: 28
+        });
+      }
+    }), null), i(t, r(h, {
+      class: "smwb-file-drop__preview-gallery",
+      get cols() {
+        return e.previewCols;
+      },
+      get rowsHeight() {
+        return e.galleryItemSize;
+      },
+      get children() {
+        return r(w, {
+          get each() {
+            return e.files;
+          },
+          children: (l) => {
+            const m = v(l) ? URL.createObjectURL(l) : null;
+            return r(u, {
+              when: m,
+              get fallback() {
+                return (() => {
+                  var o = I();
+                  return i(o, () => l.name), n((C) => p(o, "width", `${e.galleryItemSize - 4}px`)), o;
+                })();
+              },
+              get children() {
+                return r(b, {
+                  class: "smwb-file-drop__preview-gallery-image",
+                  src: m,
+                  rows: 1,
+                  cols: 1,
+                  get itemBarContent() {
+                    return l.name;
+                  }
+                });
+              }
+            });
+          }
+        });
+      }
+    }), null), n(() => c(t, f("smwb-file-drop__preview", e.previewClassName))), t;
+  })();
+}
+export {
+  x as Preview
+};
+//# sourceMappingURL=preview.js.map

package/dist/headless/components/inputs/fileDrop/preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview.js","sources":["../../../../../src/components/inputs/fileDrop/preview.tsx"],"sourcesContent":["import { type JSX, For, Show, mergeProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { FloatingButton } from \"../floatingButton\";\nimport { Icon } from \"../../base/icon\";\nimport { ImagesList, ImagesListItem } from \"../../dataDisplay/imagesList\";\nimport { isImageFile } from \"./utils\";\n\nexport interface PreviewProps {\n  previewCols?: number | undefined;\n  galleryItemSize?: number | undefined;\n  previewClassName?: string | undefined;\n  files: File[];\n  handleRemoveAll: () => void;\n}\n\nexport function Preview(rawProps: PreviewProps): JSX.Element {\n  const props = mergeProps({ previewCols: 3, galleryItemSize: 100 }, rawProps);\n  return (\n    <div class={cn(\"smwb-file-drop__preview\", props.previewClassName)}>\n      <FloatingButton onClick={() => props.handleRemoveAll()} class=\"smwb-file-drop__preview-button\">\n        <Icon name=\"delete\" size={28} />\n      </FloatingButton>\n      <ImagesList class=\"smwb-file-drop__preview-gallery\" cols={props.previewCols} rowsHeight={props.galleryItemSize}>\n        <For each={props.files}>\n          {(file) => {\n            const src = isImageFile(file) ? URL.createObjectURL(file) : null;\n            return (\n              <Show\n                when={src}\n                fallback={\n                  <div class=\"smwb-file-drop__preview-gallery-file\" style={{ width: `${props.galleryItemSize - 4}px` }}>\n                    {file.name}\n                  </div>\n                }\n              >\n                <ImagesListItem\n                  class=\"smwb-file-drop__preview-gallery-image\"\n                  src={src as string}\n                  rows={1}\n                  cols={1}\n                  itemBarContent={file.name}\n                />\n              </Show>\n            );\n          }}\n        </For>\n      </ImagesList>\n    </div>\n  );\n}\n\nexport default Preview;\n"],"names":["Preview","rawProps","props","mergeProps","previewCols","galleryItemSize","_el$","_tmpl$","_$insert","_$createComponent","FloatingButton","onClick","handleRemoveAll","children","Icon","name","size","ImagesList","cols","rowsHeight","For","each","files","file","src","isImageFile","URL","createObjectURL","Show","when","fallback","_el$2","_tmpl$2","_$effect","_$p","_$setStyleProperty","ImagesListItem","rows","itemBarContent","_$className","cn","previewClassName"],"mappings":";;;;;;;;;AAeO,SAASA,EAAQC,GAAqC;AAC3D,QAAMC,IAAQC,EAAW;AAAA,IAAEC,aAAa;AAAA,IAAGC,iBAAiB;AAAA,EAAA,GAAOJ,CAAQ;AAC3E,UAAA,MAAA;AAAA,QAAAK,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAc;AAAA,MAACC,SAASA,MAAMT,EAAMU,gBAAAA;AAAAA,MAAiB,OAAA;AAAA,MAAA,IAAAC,WAAA;AAAA,eAAAJ,EACnDK,GAAI;AAAA,UAACC,MAAI;AAAA,UAAUC,MAAM;AAAA,QAAA,CAAE;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAR,EAAAF,GAAAG,EAE7BQ,GAAU;AAAA,MAAA,OAAA;AAAA,MAAA,IAAyCC,OAAI;AAAA,eAAEhB,EAAME;AAAAA,MAAW;AAAA,MAAA,IAAEe,aAAU;AAAA,eAAEjB,EAAMG;AAAAA,MAAe;AAAA,MAAA,IAAAQ,WAAA;AAAA,eAAAJ,EAC3GW,GAAG;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEnB,EAAMoB;AAAAA,UAAK;AAAA,UAAAT,UAClBU,CAAAA,MAAS;AACT,kBAAMC,IAAMC,EAAYF,CAAI,IAAIG,IAAIC,gBAAgBJ,CAAI,IAAI;AAC5D,mBAAAd,EACGmB,GAAI;AAAA,cACHC,MAAML;AAAAA,cAAG,IACTM,WAAQ;AAAA,wBAAA,MAAA;AAAA,sBAAAC,IAAAC,EAAAA;AAAAxB,yBAAAA,EAAAuB,GAAA,MAEHR,EAAKR,IAAI,GAAAkB,EAAAC,CAAAA,MAAAC,EAAAJ,GAAA,SADsD,GAAG7B,EAAMG,kBAAkB,CAAC,IAAI,CAAA,GAAA0B;AAAAA,gBAAA,GAAA;AAAA,cAAA;AAAA,cAAA,IAAAlB,WAAA;AAAA,uBAAAJ,EAKnG2B,GAAc;AAAA,kBAAA,OAAA;AAAA,kBAEbZ,KAAAA;AAAAA,kBACAa,MAAM;AAAA,kBACNnB,MAAM;AAAA,kBAAC,IACPoB,iBAAc;AAAA,2BAAEf,EAAKR;AAAAA,kBAAI;AAAA,gBAAA,CAAA;AAAA,cAAA;AAAA,YAAA,CAAA;AAAA,UAIjC;AAAA,QAAA,CAAC;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAkB,EAAA,MAAAM,EAAAjC,GA1BKkC,EAAG,2BAA2BtC,EAAMuC,gBAAgB,CAAC,CAAA,GAAAnC;AAAAA,EAAA,GAAA;AA+BrE;"}

package/dist/headless/components/inputs/fileDrop/previewWrapper.js

@@ -0,0 +1,47 @@
+import { createComponent as r } from "solid-js/web";
+import { Show as t } from "solid-js";
+import { Preview as l } from "./preview.js";
+import { CountPreview as n } from "./countPreview.js";
+function u(e) {
+  return r(t, {
+    get when() {
+      return e.preview;
+    },
+    get fallback() {
+      return r(n, {
+        get filesLength() {
+          return e.files.length;
+        },
+        get handleRemoveAll() {
+          return e.handleRemoveAll;
+        },
+        get previewClassName() {
+          return e.previewClassName;
+        }
+      });
+    },
+    get children() {
+      return r(l, {
+        get files() {
+          return e.files;
+        },
+        get handleRemoveAll() {
+          return e.handleRemoveAll;
+        },
+        get previewCols() {
+          return e.previewCols;
+        },
+        get galleryItemSize() {
+          return e.galleryItemSize;
+        },
+        get previewClassName() {
+          return e.previewClassName;
+        }
+      });
+    }
+  });
+}
+export {
+  u as PreviewWrapper
+};
+//# sourceMappingURL=previewWrapper.js.map

package/dist/headless/components/inputs/fileDrop/previewWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"previewWrapper.js","sources":["../../../../../src/components/inputs/fileDrop/previewWrapper.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport { Preview } from \"./preview\";\nimport { CountPreview } from \"./countPreview\";\n\nexport interface PreviewWrapperProps {\n  preview?: boolean | undefined;\n  files: File[];\n  handleRemoveAll: () => void;\n  previewCols?: number | undefined;\n  galleryItemSize?: number | undefined;\n  previewClassName?: string | undefined;\n}\n\nexport function PreviewWrapper(props: PreviewWrapperProps): JSX.Element {\n  return (\n    <Show\n      when={props.preview}\n      fallback={\n        <CountPreview\n          filesLength={props.files.length}\n          handleRemoveAll={props.handleRemoveAll}\n          previewClassName={props.previewClassName}\n        />\n      }\n    >\n      <Preview\n        files={props.files}\n        handleRemoveAll={props.handleRemoveAll}\n        previewCols={props.previewCols}\n        galleryItemSize={props.galleryItemSize}\n        previewClassName={props.previewClassName}\n      />\n    </Show>\n  );\n}\n\nexport default PreviewWrapper;\n"],"names":["PreviewWrapper","props","_$createComponent","Show","when","preview","fallback","CountPreview","filesLength","files","length","handleRemoveAll","previewClassName","children","Preview","previewCols","galleryItemSize"],"mappings":";;;;AAaO,SAASA,EAAeC,GAAyC;AACtE,SAAAC,EACGC,GAAI;AAAA,IAAA,IACHC,OAAI;AAAA,aAAEH,EAAMI;AAAAA,IAAO;AAAA,IAAA,IACnBC,WAAQ;AAAA,aAAAJ,EACLK,GAAY;AAAA,QAAA,IACXC,cAAW;AAAA,iBAAEP,EAAMQ,MAAMC;AAAAA,QAAM;AAAA,QAAA,IAC/BC,kBAAe;AAAA,iBAAEV,EAAMU;AAAAA,QAAe;AAAA,QAAA,IACtCC,mBAAgB;AAAA,iBAAEX,EAAMW;AAAAA,QAAgB;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAAAC,WAAA;AAAA,aAAAX,EAI3CY,GAAO;AAAA,QAAA,IACNL,QAAK;AAAA,iBAAER,EAAMQ;AAAAA,QAAK;AAAA,QAAA,IAClBE,kBAAe;AAAA,iBAAEV,EAAMU;AAAAA,QAAe;AAAA,QAAA,IACtCI,cAAW;AAAA,iBAAEd,EAAMc;AAAAA,QAAW;AAAA,QAAA,IAC9BC,kBAAe;AAAA,iBAAEf,EAAMe;AAAAA,QAAe;AAAA,QAAA,IACtCJ,mBAAgB;AAAA,iBAAEX,EAAMW;AAAAA,QAAgB;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA;AAIhD;"}

package/dist/headless/components/inputs/fileDrop/utils.js

@@ -0,0 +1,7 @@
+function t(e) {
+  return /^image\/(png|jpeg)$/.test(e.type);
+}
+export {
+  t as isImageFile
+};
+//# sourceMappingURL=utils.js.map

package/dist/headless/components/inputs/fileDrop/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../../../src/components/inputs/fileDrop/utils.ts"],"sourcesContent":["export function isImageFile(file: File): boolean {\n  return /^image\\/(png|jpeg)$/.test(file.type);\n}\n"],"names":["isImageFile","file"],"mappings":"AAAO,SAASA,EAAYC,GAAqB;AAC/C,SAAO,sBAAsB,KAAKA,EAAK,IAAI;AAC7C;"}

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

@@ -0,0 +1,46 @@
+import { use as f, spread as u, mergeProps as m, insert as s, createComponent as _, effect as $, className as C, template as v, delegateEvents as w } from "solid-js/web";
+import { splitProps as h, Show as k } from "solid-js";
+import b from "clsx";
+import { createDropzone as P } from "../../../primitives/createDropzone.js";
+import { mergeRefs as R } from "../../../primitives/mergeRefs.js";
+var S = /* @__PURE__ */ v("<span class=smwb-file-input__error role=alert>"), y = /* @__PURE__ */ v("<div data-testid=file-input><button type=button></button><input>");
+function A(g) {
+  const [e, i] = h(g, ["label", "onClick", "onFilesSelected", "class", "buttonClassName", "disabled", "error", "ref"]), l = P({
+    ...i,
+    disabled: e.disabled,
+    onDropAccepted: (r, o) => {
+      e.onFilesSelected?.(r), i.onDropAccepted?.(r, o);
+    }
+  });
+  return (() => {
+    var r = y(), o = r.firstChild, n = o.nextSibling, a = R(e.ref);
+    typeof a == "function" && f(a, r), u(r, m({
+      get class() {
+        return b("smwb-file-input", {
+          "smwb-disabled": e.disabled
+        }, e.class);
+      }
+    }, () => l.getRootProps()), !1, !0), o.$$click = (t) => e.onClick?.(t), s(o, () => e.label);
+    var p = l.inputRef;
+    return typeof p == "function" ? f(p, n) : l.inputRef = n, u(n, m(() => l.getInputProps()), !1, !1), s(r, _(k, {
+      get when() {
+        return e.error;
+      },
+      get children() {
+        var t = S();
+        return s(t, () => e.error), t;
+      }
+    }), null), $((t) => {
+      var d = b(e.buttonClassName), c = e.disabled;
+      return d !== t.e && C(o, t.e = d), c !== t.t && (o.disabled = t.t = c), t;
+    }, {
+      e: void 0,
+      t: void 0
+    }), r;
+  })();
+}
+w(["click"]);
+export {
+  A as FileInput
+};
+//# sourceMappingURL=fileInput.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"fileInput.js","sources":["../../../../../src/components/inputs/fileInput/fileInput.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { createDropzone, type DropzoneOptions } from \"../../../primitives/createDropzone\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface FileInputProps extends DropzoneOptions {\n  label?: string;\n  class?: string;\n  buttonClassName?: string;\n  disabled?: boolean;\n  /** Validation message shown below the control. */\n  error?: string;\n  /** Fired with the accepted files when the user picks them. */\n  onFilesSelected?: (files: File[]) => void;\n  onClick?: (e: MouseEvent & { currentTarget: HTMLButtonElement; target: Element }) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function FileInput(props: FileInputProps): JSX.Element {\n  const [local, dropzoneOptions] = splitProps(props, [\n    \"label\",\n    \"onClick\",\n    \"onFilesSelected\",\n    \"class\",\n    \"buttonClassName\",\n    \"disabled\",\n    \"error\",\n    \"ref\",\n  ]);\n\n  const dropzone = createDropzone({\n    ...dropzoneOptions,\n    disabled: local.disabled,\n    onDropAccepted: (accepted, event) => {\n      local.onFilesSelected?.(accepted);\n      dropzoneOptions.onDropAccepted?.(accepted, event);\n    },\n  });\n\n  return (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-file-input\", { \"smwb-disabled\": local.disabled }, local.class)}\n      data-testid=\"file-input\"\n      {...dropzone.getRootProps()}\n    >\n      <button type=\"button\" class={cn(local.buttonClassName)} disabled={local.disabled} onClick={(e) => local.onClick?.(e)}>\n        {local.label}\n      </button>\n      <input ref={dropzone.inputRef} {...dropzone.getInputProps()} />\n      <Show when={local.error}>\n        <span class=\"smwb-file-input__error\" role=\"alert\">\n          {local.error}\n        </span>\n      </Show>\n    </div>\n  );\n}\n\nexport default FileInput;\n"],"names":["FileInput","props","local","dropzoneOptions","splitProps","dropzone","createDropzone","disabled","onDropAccepted","accepted","event","onFilesSelected","_el$","_tmpl$2","_el$2","firstChild","_el$3","nextSibling","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","getRootProps","$$click","e","onClick","_$insert","label","_ref$2","inputRef","getInputProps","_$createComponent","Show","when","error","children","_el$4","_tmpl$","_$effect","_p$","_v$","buttonClassName","_v$2","_$className","t","undefined","_$delegateEvents"],"mappings":";;;;;;AAkBO,SAASA,EAAUC,GAAoC;AAC5D,QAAM,CAACC,GAAOC,CAAe,IAAIC,EAAWH,GAAO,CACjD,SACA,WACA,mBACA,SACA,mBACA,YACA,SACA,KAAK,CACN,GAEKI,IAAWC,EAAe;AAAA,IAC9B,GAAGH;AAAAA,IACHI,UAAUL,EAAMK;AAAAA,IAChBC,gBAAgBA,CAACC,GAAUC,MAAU;AACnCR,MAAAA,EAAMS,kBAAkBF,CAAQ,GAChCN,EAAgBK,iBAAiBC,GAAUC,CAAK;AAAA,IAClD;AAAA,EAAA,CACD;AAED,UAAA,MAAA;AAAA,QAAAE,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAG,aAAAC,IAESC,EAAUjB,EAAMkB,GAAG;AAAC,WAAAF,KAAA,cAAAG,EAAAH,GAAAN,CAAA,GAAAU,EAAAV,GAAAW,EAAA;AAAA,MAAA,IAAA,QAAA;AAAA,eAClBC,EAAG,mBAAmB;AAAA,UAAE,iBAAiBtB,EAAMK;AAAAA,QAAAA,GAAYL,EAAMuB,KAAK;AAAA,MAAC;AAAA,IAAA,GAAA,MAE1EpB,EAASqB,cAAc,GAAA,IAAA,EAAA,GAAAZ,EAAAa,UAEiEC,CAAAA,MAAM1B,EAAM2B,UAAUD,CAAC,GAACE,EAAAhB,GAAA,MACjHZ,EAAM6B,KAAK;AAAA,QAAAC,IAEF3B,EAAS4B;AAAQ,kBAAAD,KAAA,aAAAX,EAAAW,GAAAhB,CAAA,IAAjBX,EAAS4B,WAAQjB,GAAAM,EAAAN,GAAAO,QAAMlB,EAAS6B,eAAe,GAAA,IAAA,EAAA,GAAAJ,EAAAlB,GAAAuB,EAC1DC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEnC,EAAMoC;AAAAA,MAAK;AAAA,MAAA,IAAAC,WAAA;AAAA,YAAAC,IAAAC,EAAAA;AAAAX,eAAAA,EAAAU,GAAA,MAElBtC,EAAMoC,KAAK,GAAAE;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAE,EAAAC,CAAAA,MAAA;AAAA,UAAAC,IANapB,EAAGtB,EAAM2C,eAAe,GAACC,IAAY5C,EAAMK;AAAQqC,aAAAA,MAAAD,EAAAf,KAAAmB,EAAAjC,GAAA6B,EAAAf,IAAAgB,CAAA,GAAAE,MAAAH,EAAAK,MAAAlC,EAAAP,WAAAoC,EAAAK,IAAAF,IAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAf,GAAAqB;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA,GAAArC;AAAAA,EAAA,GAAA;AAWtF;AAEyBsC,EAAA,CAAA,OAAA,CAAA;"}

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

@@ -0,0 +1,33 @@
+import { use as p, spread as c, mergeProps as f, insert as n, createComponent as u, template as b } from "solid-js/web";
+import { mergeProps as g, splitProps as $ } from "solid-js";
+import d from "clsx";
+import { mergeRefs as v } from "../../../primitives/mergeRefs.js";
+import { Ripple as w } from "../../base/ripple/ripple.js";
+var P = /* @__PURE__ */ b("<button>");
+function D(s) {
+  const i = g({
+    variant: "default",
+    size: "medium",
+    color: "primary",
+    type: "button"
+  }, s), [e, l] = $(i, ["children", "class", "variant", "size", "color", "ref"]);
+  let o;
+  const m = (r) => {
+    o?.onRipple(r);
+  };
+  return (() => {
+    var r = P(), t = v(e.ref);
+    return typeof t == "function" && p(t, r), c(r, f(l, {
+      get class() {
+        return d("smwb-fab", `smwb-${e.variant}`, `smwb-${e.size}`, `smwb-fab_color-${e.color}`, e.class);
+      },
+      onPointerDown: m
+    }), !1, !0), n(r, () => e.children, null), n(r, u(w, {
+      actionRef: (a) => o = a
+    }), null), r;
+  })();
+}
+export {
+  D as FloatingButton
+};
+//# sourceMappingURL=floatingButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"floatingButton.js","sources":["../../../../../src/components/inputs/floatingButton/floatingButton.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type FloatingButtonColor = \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport interface FloatingButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {\n  variant?: \"extended\" | \"default\";\n  size?: \"small\" | \"medium\" | \"large\";\n  /** Semantic color. Resolves through the shared `--smui-*Color*` tokens. */\n  color?: FloatingButtonColor;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport function FloatingButton(props: ParentProps<FloatingButtonProps>): JSX.Element {\n  const merged = mergeProps(\n    { variant: \"default\" as const, size: \"medium\" as const, color: \"primary\" as FloatingButtonColor, type: \"button\" as const },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\"children\", \"class\", \"variant\", \"size\", \"color\", \"ref\"]);\n\n  let rippleActions: RippleActionsRef | undefined;\n\n  const onPointerDown = (event: PointerEvent): void => {\n    rippleActions?.onRipple(event);\n  };\n\n  return (\n    <button\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-fab\", `smwb-${local.variant}`, `smwb-${local.size}`, `smwb-fab_color-${local.color}`, local.class)}\n      onPointerDown={onPointerDown}\n    >\n      {local.children}\n      <Ripple actionRef={(actions) => (rippleActions = actions)} />\n    </button>\n  );\n}\n\nexport default FloatingButton;\n"],"names":["FloatingButton","props","merged","mergeProps","variant","size","color","type","local","rest","splitProps","rippleActions","onPointerDown","event","onRipple","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$insert","children","_$createComponent","Ripple","actionRef","actions"],"mappings":";;;;;;AAeO,SAASA,EAAeC,GAAsD;AACnF,QAAMC,IAASC,EACb;AAAA,IAAEC,SAAS;AAAA,IAAoBC,MAAM;AAAA,IAAmBC,OAAO;AAAA,IAAkCC,MAAM;AAAA,EAAA,GACvGN,CACF,GACM,CAACO,GAAOC,CAAI,IAAIC,EAAWR,GAAQ,CAAC,YAAY,SAAS,WAAW,QAAQ,SAAS,KAAK,CAAC;AAEjG,MAAIS;AAEJ,QAAMC,IAAgBA,CAACC,MAA8B;AACnDF,IAAAA,GAAeG,SAASD,CAAK;AAAA,EAC/B;AAEA,UAAA,MAAA;AAAA,QAAAE,IAAAC,EAAAA,GAAAC,IAGSC,EAAUV,EAAMW,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBb,GAAI;AAAA,MAAA,IAAA,QAAA;AAAA,eAEDc,EAAG,YAAY,QAAQf,EAAMJ,OAAO,IAAI,QAAQI,EAAMH,IAAI,IAAI,kBAAkBG,EAAMF,KAAK,IAAIE,EAAMgB,KAAK;AAAA,MAAC;AAAA,MAAA,eACnGZ;AAAAA,IAAAA,CAAa,GAAA,IAAA,EAAA,GAAAa,EAAAV,GAAA,MAE3BP,EAAMkB,UAAQ,IAAA,GAAAD,EAAAV,GAAAY,EACdC,GAAM;AAAA,MAACC,WAAYC,OAAanB,IAAgBmB;AAAAA,IAAAA,CAAQ,GAAA,IAAA,GAAAf;AAAAA,EAAA,GAAA;AAG/D;"}