@smwb/ui-solid 0.8.0 → 0.9.0

package/dist/source/components/inputs/dateTimePicker/dateTimePicker.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/inputs/dateTimePicker/dateTimePicker.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, createMemo, createSignal, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } 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={(isServer ? undefined : document.body) as Node}>\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"],"mappings":"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","names":[],"file":"dateTimePicker.jsx"}
+{"version":3,"sources":["../../../../../src/components/inputs/dateTimePicker/dateTimePicker.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, createMemo, createSignal, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } 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={(isServer ? undefined : document.body) as Node}>\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              data-smwb-overlay-layer\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"],"mappings":"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","names":[],"file":"dateTimePicker.jsx"}

package/dist/source/components/inputs/selectField/dropdownMenu.jsx

@@ -68,6 +68,7 @@ function DropdownMenu(props) {
     anchorElement={props.anchorElement()}
     middleware={props.menuMiddleware}
     style={menuStyle()}
+    data-smwb-overlay-layer
   >
         <Show when={props.search}>
           <li class="smwb-select-field__menu-search">

package/dist/source/components/inputs/selectField/dropdownMenu.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/inputs/selectField/dropdownMenu.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createEffect, createSignal, onCleanup } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport type { Middleware } from \"@floating-ui/dom\";\nimport { Menu, MenuDivider, MenuItem } from \"../../navigation/menu\";\nimport { TextField } from \"../textField\";\nimport { ProgressIndicator } from \"../../feedBack/progressIndicator\";\nimport { createVirtualList } from \"../../../primitives/createVirtualList\";\n\nexport interface DropdownItem {\n  key?: string | number;\n  text: string;\n  value: string | number | undefined | null;\n  helperText?: string;\n  disabled?: boolean;\n  /** Optional group label; consecutive items sharing it get a group header. */\n  group?: string;\n}\n\ntype SearchEvent = Event & { currentTarget: HTMLInputElement };\ntype ItemEvent = Event & { currentTarget: Element; target: Element };\n\nexport interface DropdownItemProps {\n  menuMaxHeight?: number | undefined;\n  menuMiddleware?: Middleware[] | undefined;\n  menuNoItemsMessage?: JSX.Element;\n  search?: boolean | undefined;\n  onSearchInputChange?: ((event: SearchEvent) => void) | undefined;\n  items: DropdownItem[];\n  searchValue?: string | number | undefined;\n  isOpen: boolean;\n  onClose: () => void;\n  anchorElement: Accessor<HTMLElement | null>;\n  value?: undefined | null | string | number | (undefined | null | string | number)[];\n  onItemClick: (event: ItemEvent, item: DropdownItem) => void;\n  isLoading?: boolean | undefined;\n  optionRenderer?: ((args: import(\"../../navigation/menu\").MenuItemProps) => JSX.Element) | undefined;\n  container?: HTMLElement | undefined;\n  createOption?: { text: JSX.Element; onCreate: (event: ItemEvent) => void } | undefined;\n  virtualized?: boolean | undefined;\n  itemHeight?: number | undefined;\n}\n\ntype Row = { kind: \"group\"; group?: string | undefined } | { kind: \"item\"; item: DropdownItem };\n\nexport function DropdownMenu(props: DropdownItemProps): JSX.Element {\n  const valueArray = (): Array<string | number | undefined | null> =>\n    Array.isArray(props.value) ? props.value : [props.value];\n  const hasGroups = (): boolean => props.items.some((i) => !!i.group);\n  const itemHeight = (): number => props.itemHeight ?? 40;\n  const viewportHeight = (): number => props.menuMaxHeight || 240;\n  const useVirtual = (): boolean => !!props.virtualized && !hasGroups() && !props.isLoading && props.items.length > 0;\n\n  const virtual = createVirtualList({\n    itemCount: () => (useVirtual() ? props.items.length : 0),\n    itemHeight,\n    viewportHeight,\n  });\n\n  const [menuMinWidth, setMenuMinWidth] = createSignal<number>();\n\n  createEffect(() => {\n    const anchor = props.anchorElement();\n    if (props.isOpen && anchor) setMenuMinWidth(anchor.clientWidth);\n  });\n\n  createEffect(() => {\n    if (!props.isOpen) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") props.onClose();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const toRows = (list: DropdownItem[]): Row[] => {\n    const out: Row[] = [];\n    let lastGroup: string | undefined;\n    for (const el of list) {\n      if (hasGroups() && el.group !== lastGroup) {\n        lastGroup = el.group;\n        out.push({ kind: \"group\", group: el.group });\n      }\n      out.push({ kind: \"item\", item: el });\n    }\n    return out;\n  };\n\n  const renderItem = (el: DropdownItem): JSX.Element => (\n    <MenuItem\n      value={el.value}\n      disabled={el.disabled}\n      selected={!!valueArray().find((v) => v === el.value)}\n      onClick={(e) => {\n        if (!el.disabled) props.onItemClick(e as ItemEvent, el);\n      }}\n      optionRenderer={props.optionRenderer}\n    >\n      {el.text}\n      <Show when={el.helperText}>\n        <span class=\"smwb-select-field__option__helper-text\">{el.helperText}</span>\n      </Show>\n    </MenuItem>\n  );\n\n  const renderRow = (row: Row): JSX.Element =>\n    row.kind === \"group\" ? (\n      <li class=\"smwb-select-field__group-label\" role=\"presentation\">\n        {row.group}\n      </li>\n    ) : (\n      renderItem(row.item)\n    );\n\n  const menuStyle = (): JSX.CSSProperties => ({\n    ...(menuMinWidth() ? { \"min-width\": `${menuMinWidth()}px` } : {}),\n    ...(props.menuMaxHeight ? { \"max-height\": `${props.menuMaxHeight}px`, \"overflow-y\": \"auto\" } : {}),\n  });\n\n  return (\n    <Portal mount={(isServer ? undefined : (props.container ?? document.body)) as Node}>\n      <Menu\n        isOpen={props.isOpen}\n        onClose={() => props.onClose()}\n        anchorElement={props.anchorElement()}\n        middleware={props.menuMiddleware}\n        style={menuStyle()}\n      >\n        <Show when={props.search}>\n          <li class=\"smwb-select-field__menu-search\">\n            <TextField\n              class=\"smwb-select-field__menu-search-input\"\n              type=\"text\"\n              placeholder=\"Найти...\"\n              value={props.searchValue}\n              onChange={(e) => props.onSearchInputChange?.(e as SearchEvent)}\n              fullWidth\n            />\n          </li>\n          <MenuDivider />\n        </Show>\n\n        <Show when={props.isLoading}>\n          <div class=\"smwb-select-field__menu-loading\">\n            <ProgressIndicator type=\"indeterminate\" variant=\"circular\" class=\"smwb-select-field__menu__loader\" />\n          </div>\n        </Show>\n\n        <Show when={!props.isLoading}>\n          <Show\n            when={useVirtual()}\n            fallback={\n              <Show\n                when={props.items.length > 0}\n                fallback={\n                  <Show when={!props.createOption}>\n                    <li class=\"smwb-select-field__empty-items\">{props.menuNoItemsMessage || \"Опций не найдено.\"}</li>\n                  </Show>\n                }\n              >\n                <For each={toRows(props.items)}>{(row) => renderRow(row)}</For>\n              </Show>\n            }\n          >\n            <li role=\"presentation\" class=\"smwb-select-field__virtual-viewport\">\n              <div\n                class=\"smwb-select-field__virtual-scroller\"\n                style={{ \"max-height\": `${viewportHeight()}px`, \"overflow-y\": \"auto\" }}\n                onScroll={virtual.onScroll}\n              >\n                <div style={{ height: `${virtual.totalHeight()}px`, position: \"relative\" }}>\n                  <ul\n                    role=\"presentation\"\n                    class=\"smwb-select-field__virtual-list\"\n                    style={{ transform: `translateY(${virtual.offsetY()}px)`, \"list-style\": \"none\", margin: \"0\", padding: \"0\" }}\n                  >\n                    <For each={props.items.slice(virtual.startIndex(), virtual.endIndex())}>{(el) => renderItem(el)}</For>\n                  </ul>\n                </div>\n              </div>\n            </li>\n          </Show>\n        </Show>\n\n        <Show when={props.createOption}>\n          {(createOption) => (\n            <MenuItem\n              value=\"__create__\"\n              onClick={(e) => createOption().onCreate(e as ItemEvent)}\n              class=\"smwb-select-field__create-option\"\n            >\n              {createOption().text}\n            </MenuItem>\n          )}\n        </Show>\n      </Menu>\n    </Portal>\n  );\n}\n\nexport default DropdownMenu;\n"],"mappings":"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","names":[],"file":"dropdownMenu.jsx"}
+{"version":3,"sources":["../../../../../src/components/inputs/selectField/dropdownMenu.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createEffect, createSignal, onCleanup } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport type { Middleware } from \"@floating-ui/dom\";\nimport { Menu, MenuDivider, MenuItem } from \"../../navigation/menu\";\nimport { TextField } from \"../textField\";\nimport { ProgressIndicator } from \"../../feedBack/progressIndicator\";\nimport { createVirtualList } from \"../../../primitives/createVirtualList\";\n\nexport interface DropdownItem {\n  key?: string | number;\n  text: string;\n  value: string | number | undefined | null;\n  helperText?: string;\n  disabled?: boolean;\n  /** Optional group label; consecutive items sharing it get a group header. */\n  group?: string;\n}\n\ntype SearchEvent = Event & { currentTarget: HTMLInputElement };\ntype ItemEvent = Event & { currentTarget: Element; target: Element };\n\nexport interface DropdownItemProps {\n  menuMaxHeight?: number | undefined;\n  menuMiddleware?: Middleware[] | undefined;\n  menuNoItemsMessage?: JSX.Element;\n  search?: boolean | undefined;\n  onSearchInputChange?: ((event: SearchEvent) => void) | undefined;\n  items: DropdownItem[];\n  searchValue?: string | number | undefined;\n  isOpen: boolean;\n  onClose: () => void;\n  anchorElement: Accessor<HTMLElement | null>;\n  value?: undefined | null | string | number | (undefined | null | string | number)[];\n  onItemClick: (event: ItemEvent, item: DropdownItem) => void;\n  isLoading?: boolean | undefined;\n  optionRenderer?: ((args: import(\"../../navigation/menu\").MenuItemProps) => JSX.Element) | undefined;\n  container?: HTMLElement | undefined;\n  createOption?: { text: JSX.Element; onCreate: (event: ItemEvent) => void } | undefined;\n  virtualized?: boolean | undefined;\n  itemHeight?: number | undefined;\n}\n\ntype Row = { kind: \"group\"; group?: string | undefined } | { kind: \"item\"; item: DropdownItem };\n\nexport function DropdownMenu(props: DropdownItemProps): JSX.Element {\n  const valueArray = (): Array<string | number | undefined | null> =>\n    Array.isArray(props.value) ? props.value : [props.value];\n  const hasGroups = (): boolean => props.items.some((i) => !!i.group);\n  const itemHeight = (): number => props.itemHeight ?? 40;\n  const viewportHeight = (): number => props.menuMaxHeight || 240;\n  const useVirtual = (): boolean => !!props.virtualized && !hasGroups() && !props.isLoading && props.items.length > 0;\n\n  const virtual = createVirtualList({\n    itemCount: () => (useVirtual() ? props.items.length : 0),\n    itemHeight,\n    viewportHeight,\n  });\n\n  const [menuMinWidth, setMenuMinWidth] = createSignal<number>();\n\n  createEffect(() => {\n    const anchor = props.anchorElement();\n    if (props.isOpen && anchor) setMenuMinWidth(anchor.clientWidth);\n  });\n\n  createEffect(() => {\n    if (!props.isOpen) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") props.onClose();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const toRows = (list: DropdownItem[]): Row[] => {\n    const out: Row[] = [];\n    let lastGroup: string | undefined;\n    for (const el of list) {\n      if (hasGroups() && el.group !== lastGroup) {\n        lastGroup = el.group;\n        out.push({ kind: \"group\", group: el.group });\n      }\n      out.push({ kind: \"item\", item: el });\n    }\n    return out;\n  };\n\n  const renderItem = (el: DropdownItem): JSX.Element => (\n    <MenuItem\n      value={el.value}\n      disabled={el.disabled}\n      selected={!!valueArray().find((v) => v === el.value)}\n      onClick={(e) => {\n        if (!el.disabled) props.onItemClick(e as ItemEvent, el);\n      }}\n      optionRenderer={props.optionRenderer}\n    >\n      {el.text}\n      <Show when={el.helperText}>\n        <span class=\"smwb-select-field__option__helper-text\">{el.helperText}</span>\n      </Show>\n    </MenuItem>\n  );\n\n  const renderRow = (row: Row): JSX.Element =>\n    row.kind === \"group\" ? (\n      <li class=\"smwb-select-field__group-label\" role=\"presentation\">\n        {row.group}\n      </li>\n    ) : (\n      renderItem(row.item)\n    );\n\n  const menuStyle = (): JSX.CSSProperties => ({\n    ...(menuMinWidth() ? { \"min-width\": `${menuMinWidth()}px` } : {}),\n    ...(props.menuMaxHeight ? { \"max-height\": `${props.menuMaxHeight}px`, \"overflow-y\": \"auto\" } : {}),\n  });\n\n  return (\n    <Portal mount={(isServer ? undefined : (props.container ?? document.body)) as Node}>\n      <Menu\n        isOpen={props.isOpen}\n        onClose={() => props.onClose()}\n        anchorElement={props.anchorElement()}\n        middleware={props.menuMiddleware}\n        style={menuStyle()}\n        data-smwb-overlay-layer\n      >\n        <Show when={props.search}>\n          <li class=\"smwb-select-field__menu-search\">\n            <TextField\n              class=\"smwb-select-field__menu-search-input\"\n              type=\"text\"\n              placeholder=\"Найти...\"\n              value={props.searchValue}\n              onChange={(e) => props.onSearchInputChange?.(e as SearchEvent)}\n              fullWidth\n            />\n          </li>\n          <MenuDivider />\n        </Show>\n\n        <Show when={props.isLoading}>\n          <div class=\"smwb-select-field__menu-loading\">\n            <ProgressIndicator type=\"indeterminate\" variant=\"circular\" class=\"smwb-select-field__menu__loader\" />\n          </div>\n        </Show>\n\n        <Show when={!props.isLoading}>\n          <Show\n            when={useVirtual()}\n            fallback={\n              <Show\n                when={props.items.length > 0}\n                fallback={\n                  <Show when={!props.createOption}>\n                    <li class=\"smwb-select-field__empty-items\">{props.menuNoItemsMessage || \"Опций не найдено.\"}</li>\n                  </Show>\n                }\n              >\n                <For each={toRows(props.items)}>{(row) => renderRow(row)}</For>\n              </Show>\n            }\n          >\n            <li role=\"presentation\" class=\"smwb-select-field__virtual-viewport\">\n              <div\n                class=\"smwb-select-field__virtual-scroller\"\n                style={{ \"max-height\": `${viewportHeight()}px`, \"overflow-y\": \"auto\" }}\n                onScroll={virtual.onScroll}\n              >\n                <div style={{ height: `${virtual.totalHeight()}px`, position: \"relative\" }}>\n                  <ul\n                    role=\"presentation\"\n                    class=\"smwb-select-field__virtual-list\"\n                    style={{ transform: `translateY(${virtual.offsetY()}px)`, \"list-style\": \"none\", margin: \"0\", padding: \"0\" }}\n                  >\n                    <For each={props.items.slice(virtual.startIndex(), virtual.endIndex())}>{(el) => renderItem(el)}</For>\n                  </ul>\n                </div>\n              </div>\n            </li>\n          </Show>\n        </Show>\n\n        <Show when={props.createOption}>\n          {(createOption) => (\n            <MenuItem\n              value=\"__create__\"\n              onClick={(e) => createOption().onCreate(e as ItemEvent)}\n              class=\"smwb-select-field__create-option\"\n            >\n              {createOption().text}\n            </MenuItem>\n          )}\n        </Show>\n      </Menu>\n    </Portal>\n  );\n}\n\nexport default DropdownMenu;\n"],"mappings":"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","names":[],"file":"dropdownMenu.jsx"}

package/dist/source/components/inputs/timePicker/timePicker.jsx

@@ -87,6 +87,7 @@ function TimePicker(props) {
     class="smwb-date-picker smwb-time-picker"
     style={{ ...floating.floatingStyles(), transition: `opacity ${FADE_MS}ms ease-in-out`, opacity: shown() ? 1 : 0 }}
     data-testid="time-picker"
+    data-smwb-overlay-layer
     role="dialog"
     aria-modal="false"
     aria-label={local.clockAriaLabel ?? "Choose time"}

package/dist/source/components/inputs/timePicker/timePicker.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/inputs/timePicker/timePicker.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/timePicker/timePicker.entry.less\";\nimport { type JSX, Show, createEffect, createSignal, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport { buildFloatingMiddleware, type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { TimePickerInput } from \"./timePickerInput\";\nimport { TimePickerColumns } from \"./timePickerColumns\";\nimport { isValidTimeDate } from \"./timeUtils\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport type { TextFieldProps } from \"../textField\";\n\nexport interface TimePickerProps\n  extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\" | \"ref\" | \"onToggle\"> {\n  /** Time format pattern with tokens HH, mm, ss, e.g. \"HH:mm\" or \"HH:mm:ss\". */\n  format?: string | undefined;\n  placement?: Placement | undefined;\n  disableClock?: boolean | undefined;\n  label?: string | undefined;\n  clockAriaLabel?: string | undefined;\n  value?: Date | string | undefined;\n  clockIcon?: JSX.Element;\n  onChange?: ((event?: Event, value?: Date, data?: TimePickerProps) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date, data?: TimePickerProps) => void) | undefined;\n  ref?: Ref<HTMLInputElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function TimePicker(props: TimePickerProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"placement\",\n    \"disabled\",\n    \"disableClock\",\n    \"clockAriaLabel\",\n    \"format\",\n    \"onBlur\",\n    \"ref\",\n  ]);\n\n  const value = (): Date | undefined => (local.value === undefined ? undefined : new Date(local.value));\n  const [viewValue, setViewValue] = createSignal<Date>(isValidTimeDate(value()) ? (value() as Date) : new Date());\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  let anchorEl: HTMLElement | undefined;\n  let clockEl: HTMLElement | undefined;\n\n  const resolved = () => 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(isValidTimeDate(v) ? v : new Date());\n  });\n\n  const shouldOpen = (): boolean => isOpen() && !local.disabled && !local.disableClock;\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 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 (clockEl?.contains(target) || anchorEl?.contains(target)) return;\n    setIsOpen(false);\n  };\n\n  const onTimeChange = (next: Date): void => {\n    setViewValue(next);\n    local.onChange?.(undefined, next, props);\n  };\n\n  return (\n    <>\n      <TimePickerInput\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        disableClock={local.disableClock}\n        format={local.format}\n        {...rest}\n      />\n      <Show when={mounted()}>\n        <Portal mount={(isServer ? undefined : document.body) as Node}>\n          <ClickAwayListener onClickAway={onClickAway}>\n            <div\n              ref={mergeRefs(floating.setFloating, (el) => (clockEl = el as HTMLElement))}\n              class=\"smwb-date-picker smwb-time-picker\"\n              style={{ ...floating.floatingStyles(), transition: `opacity ${FADE_MS}ms ease-in-out`, opacity: shown() ? 1 : 0 }}\n              data-testid=\"time-picker\"\n              role=\"dialog\"\n              aria-modal=\"false\"\n              aria-label={local.clockAriaLabel ?? \"Choose time\"}\n            >\n              <div class=\"smwb-date-picker__inner\">\n                <TimePickerColumns\n                  value={viewValue()}\n                  format={local.format}\n                  onChange={onTimeChange}\n                  onComplete={() => {\n                    setIsOpen(false);\n                  }}\n                />\n              </div>\n            </div>\n          </ClickAwayListener>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport default TimePicker;\n"],"mappings":"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","names":[],"file":"timePicker.jsx"}
+{"version":3,"sources":["../../../../../src/components/inputs/timePicker/timePicker.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/timePicker/timePicker.entry.less\";\nimport { type JSX, Show, createEffect, createSignal, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport { buildFloatingMiddleware, type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { TimePickerInput } from \"./timePickerInput\";\nimport { TimePickerColumns } from \"./timePickerColumns\";\nimport { isValidTimeDate } from \"./timeUtils\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport type { TextFieldProps } from \"../textField\";\n\nexport interface TimePickerProps\n  extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\" | \"ref\" | \"onToggle\"> {\n  /** Time format pattern with tokens HH, mm, ss, e.g. \"HH:mm\" or \"HH:mm:ss\". */\n  format?: string | undefined;\n  placement?: Placement | undefined;\n  disableClock?: boolean | undefined;\n  label?: string | undefined;\n  clockAriaLabel?: string | undefined;\n  value?: Date | string | undefined;\n  clockIcon?: JSX.Element;\n  onChange?: ((event?: Event, value?: Date, data?: TimePickerProps) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date, data?: TimePickerProps) => void) | undefined;\n  ref?: Ref<HTMLInputElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function TimePicker(props: TimePickerProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"placement\",\n    \"disabled\",\n    \"disableClock\",\n    \"clockAriaLabel\",\n    \"format\",\n    \"onBlur\",\n    \"ref\",\n  ]);\n\n  const value = (): Date | undefined => (local.value === undefined ? undefined : new Date(local.value));\n  const [viewValue, setViewValue] = createSignal<Date>(isValidTimeDate(value()) ? (value() as Date) : new Date());\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  let anchorEl: HTMLElement | undefined;\n  let clockEl: HTMLElement | undefined;\n\n  const resolved = () => 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(isValidTimeDate(v) ? v : new Date());\n  });\n\n  const shouldOpen = (): boolean => isOpen() && !local.disabled && !local.disableClock;\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 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 (clockEl?.contains(target) || anchorEl?.contains(target)) return;\n    setIsOpen(false);\n  };\n\n  const onTimeChange = (next: Date): void => {\n    setViewValue(next);\n    local.onChange?.(undefined, next, props);\n  };\n\n  return (\n    <>\n      <TimePickerInput\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        disableClock={local.disableClock}\n        format={local.format}\n        {...rest}\n      />\n      <Show when={mounted()}>\n        <Portal mount={(isServer ? undefined : document.body) as Node}>\n          <ClickAwayListener onClickAway={onClickAway}>\n            <div\n              ref={mergeRefs(floating.setFloating, (el) => (clockEl = el as HTMLElement))}\n              class=\"smwb-date-picker smwb-time-picker\"\n              style={{ ...floating.floatingStyles(), transition: `opacity ${FADE_MS}ms ease-in-out`, opacity: shown() ? 1 : 0 }}\n              data-testid=\"time-picker\"\n              data-smwb-overlay-layer\n              role=\"dialog\"\n              aria-modal=\"false\"\n              aria-label={local.clockAriaLabel ?? \"Choose time\"}\n            >\n              <div class=\"smwb-date-picker__inner\">\n                <TimePickerColumns\n                  value={viewValue()}\n                  format={local.format}\n                  onChange={onTimeChange}\n                  onComplete={() => {\n                    setIsOpen(false);\n                  }}\n                />\n              </div>\n            </div>\n          </ClickAwayListener>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport default TimePicker;\n"],"mappings":"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","names":[],"file":"timePicker.jsx"}

package/dist/source/components/layout/sheet/sheet.jsx

@@ -6,6 +6,7 @@ import { Button } from "../../inputs/button";
 import { Icon } from "../../base/icon";
 import { ClickAwayListener } from "../../clickAwayListener";
 import { createCssTransition } from "../../../primitives/createCssTransition";
+import { isTopOverlayLayer } from "../../../primitives/overlayLayer";
 import { mergeRefs } from "../../../primitives/mergeRefs";
 const isVerticalAxis = (placement) => placement === "bottom" || placement === "top";
 function SheetBlock(props) {
@@ -203,6 +204,7 @@ function Sheet(props) {
     "ref"
   ]);
   const [mode, setMode] = createSignal(null);
+  let wrapperEl;
   const outer = createCssTransition({
     in: () => local.isOpen,
     timeout: { enter: 70, exit: 70 },
@@ -212,7 +214,7 @@ function Sheet(props) {
   createEffect(() => {
     if (!local.isOpen || !local.closeOnEsc || !local.onClose) return;
     const onKeyDown = (event) => {
-      if (event.key === "Escape") local.onClose?.();
+      if (event.key === "Escape" && isTopOverlayLayer(wrapperEl)) local.onClose?.();
     };
     document.addEventListener("keydown", onKeyDown);
     onCleanup(() => document.removeEventListener("keydown", onKeyDown));
@@ -241,13 +243,21 @@ function Sheet(props) {
       <Portal mount={isServer ? void 0 : document.body}>
         <Show
     when={local.variant === "default"}
-    fallback={<div class={cn("smwb-sheet__overlay", "smwb-dark", `smwb-${local.placement}`, `smwb-sheet_${local.variant}`, outer.classes())}>
+    fallback={<div
+      ref={(el) => wrapperEl = el}
+      data-smwb-overlay-layer
+      class={cn("smwb-sheet__overlay", "smwb-dark", `smwb-${local.placement}`, `smwb-sheet_${local.variant}`, outer.classes())}
+    >
               <ClickAwayListener onClickAway={() => !local.disableOutsideClick && handleClose()}>
                 {block()}
               </ClickAwayListener>
             </div>}
   >
-          <div class={cn(local.disableOutsideClick ? "smwb-sheet__overlay" : "smwb-sheet__default", outer.classes())}>
+          <div
+    ref={(el) => wrapperEl = el}
+    data-smwb-overlay-layer
+    class={cn(local.disableOutsideClick ? "smwb-sheet__overlay" : "smwb-sheet__default", outer.classes())}
+  >
             {block()}
           </div>
         </Show>

package/dist/source/components/layout/sheet/sheet.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/layout/sheet/sheet.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/sheet/sheet.entry.less\";\nimport { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { createCssTransition } from \"../../../primitives/createCssTransition\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface SheetProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onResize\"> {\n  placement?: \"top\" | \"bottom\" | \"right\" | \"left\";\n  isOpen: boolean;\n  onClose?: (() => void) | undefined;\n  variant?: \"default\" | \"modal\";\n  withSizeToggle?: boolean;\n  /** Hide built-in header actions; onClose still handles Esc and backdrop. */\n  hideHeaderActions?: boolean;\n  reverseHeaderActions?: boolean;\n  size?: string;\n  disableOutsideClick?: boolean;\n  /** Close the sheet when Escape is pressed. */\n  closeOnEsc?: boolean;\n  /** Allow drag-to-resize (mobile bottom-sheet style). Off by default. */\n  resizable?: boolean;\n  /** Minimum size in px while resizing (default 80). */\n  minSize?: number;\n  /** Maximum size in px while resizing (default: viewport dimension). */\n  maxSize?: number;\n  /** Step in px for keyboard resizing (default 24). */\n  resizeStep?: number;\n  /** Accessible label for the resize handle. */\n  resizeHandleAriaLabel?: string;\n  /** Called with the new size in px while/after resizing. */\n  onResize?: (size: number) => void;\n  \"aria-label\"?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\ntype Mode = \"small\" | \"expanded\" | null;\n\nconst isVerticalAxis = (placement: SheetProps[\"placement\"]): boolean => placement === \"bottom\" || placement === \"top\";\n\ninterface SheetBlockProps extends ParentProps<SheetProps> {\n  mode: Mode;\n  handleSizeButton: () => void;\n  handleClose: () => void;\n}\n\nfunction SheetBlock(props: SheetBlockProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      size: \"60%\",\n      withSizeToggle: true,\n      hideHeaderActions: false,\n      reverseHeaderActions: false,\n      resizable: false,\n      minSize: 80,\n      resizeStep: 24,\n      resizeHandleAriaLabel: \"Resize sheet\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"placement\",\n    \"class\",\n    \"mode\",\n    \"size\",\n    \"variant\",\n    \"onClose\",\n    \"withSizeToggle\",\n    \"hideHeaderActions\",\n    \"reverseHeaderActions\",\n    \"resizable\",\n    \"minSize\",\n    \"maxSize\",\n    \"resizeStep\",\n    \"resizeHandleAriaLabel\",\n    \"onResize\",\n    \"style\",\n    \"handleClose\",\n    \"handleSizeButton\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  let rootEl: HTMLDivElement | undefined;\n  const [dragSize, setDragSize] = createSignal<number | null>(null);\n  const vertical = (): boolean => isVerticalAxis(local.placement);\n\n  const inner = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 120, exit: 120 },\n    classNames: { enterDone: \"smwb-sheet_entered\" },\n    appear: true,\n  });\n\n  const clamp = (px: number): number => {\n    const viewport = vertical() ? window.innerHeight : window.innerWidth;\n    const max = local.maxSize ?? viewport;\n    return Math.max(local.minSize, Math.min(max, px));\n  };\n\n  const currentSizePx = (): number => {\n    const rect = rootEl?.getBoundingClientRect();\n    if (!rect) return local.minSize;\n    return vertical() ? rect.height : rect.width;\n  };\n\n  const applySize = (px: number): void => {\n    const next = clamp(px);\n    setDragSize(next);\n    local.onResize?.(next);\n  };\n\n  let drag: { start: number; size: number } | null = null;\n\n  const onPointerDown = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    event.preventDefault();\n    drag = { start: vertical() ? event.clientY : event.clientX, size: currentSizePx() };\n    try {\n      event.currentTarget.setPointerCapture?.(event.pointerId);\n    } catch {\n      /* best-effort */\n    }\n  };\n\n  const onPointerMove = (event: PointerEvent): void => {\n    if (!drag) return;\n    const pos = vertical() ? event.clientY : event.clientX;\n    const delta = pos - drag.start;\n    const grow = local.placement === \"bottom\" || local.placement === \"right\" ? -delta : delta;\n    applySize(drag.size + grow);\n  };\n\n  const endDrag = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    drag = null;\n    if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n      event.currentTarget.releasePointerCapture?.(event.pointerId);\n    }\n  };\n\n  const onHandleKeyDown: JSX.EventHandler<HTMLDivElement, KeyboardEvent> = (event) => {\n    const base = dragSize() ?? currentSizePx();\n    const max = local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth);\n    const incKey =\n      local.placement === \"bottom\" ? \"ArrowUp\" : local.placement === \"top\" ? \"ArrowDown\" : local.placement === \"left\" ? \"ArrowRight\" : \"ArrowLeft\";\n    const decKey =\n      local.placement === \"bottom\" ? \"ArrowDown\" : local.placement === \"top\" ? \"ArrowUp\" : local.placement === \"left\" ? \"ArrowLeft\" : \"ArrowRight\";\n    if (event.key === incKey) {\n      event.preventDefault();\n      applySize(base + local.resizeStep);\n    } else if (event.key === decKey) {\n      event.preventDefault();\n      applySize(base - local.resizeStep);\n    } else if (event.key === \"Home\") {\n      event.preventDefault();\n      applySize(local.minSize);\n    } else if (event.key === \"End\") {\n      event.preventDefault();\n      applySize(max);\n    }\n  };\n\n  createEffect(() => {\n    if (!local.isOpen) {\n      setDragSize(null);\n      return;\n    }\n    rootEl?.focus();\n  });\n\n  const showActions = (): boolean => !local.hideHeaderActions && (!!local.onClose || local.withSizeToggle);\n  const actionNodes = (): JSX.Element[] => {\n    const nodes: JSX.Element[] = [];\n    if (local.withSizeToggle) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleSizeButton}>\n          <Icon name=\"open_in_full\" />\n        </Button>\n      );\n    }\n    if (local.onClose) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleClose}>\n          <Icon name=\"close\" />\n        </Button>\n      );\n    }\n    if (local.reverseHeaderActions) nodes.reverse();\n    return nodes;\n  };\n\n  const sizeStyle = (): JSX.CSSProperties => {\n    if (local.resizable && dragSize() !== null) {\n      const px = `${dragSize()}px`;\n      return { ...(vertical() ? { height: px } : { width: px }), transition: \"none\" };\n    }\n    return {};\n  };\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref, (el) => (rootEl = el as HTMLDivElement))}\n      data-testid=\"sheet\"\n      tabindex={-1}\n      role=\"dialog\"\n      aria-modal={local.variant === \"modal\" || undefined}\n      class={cn(\"smwb-sheet\", local.class, `smwb-sheet_${local.variant}`, `smwb-${local.placement}`, inner.classes(), {\n        \"smwb-expanded\": local.mode === \"expanded\",\n        \"smwb-small\": local.mode === \"small\",\n        \"smwb-sheet_resizable\": local.resizable,\n      })}\n      style={{\n        \"--sizeProp\": local.size,\n        ...sizeStyle(),\n        ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      }}\n    >\n      <Show when={local.resizable}>\n        <div\n          class=\"smwb-sheet__drag-handle\"\n          data-testid=\"sheet-drag-handle\"\n          role=\"separator\"\n          tabindex={0}\n          aria-orientation={vertical() ? \"horizontal\" : \"vertical\"}\n          aria-label={local.resizeHandleAriaLabel}\n          aria-valuemin={local.minSize}\n          aria-valuemax={Math.round(local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth))}\n          aria-valuenow={Math.round(dragSize() ?? currentSizePx())}\n          onPointerDown={onPointerDown}\n          onPointerMove={onPointerMove}\n          onPointerUp={endDrag}\n          onPointerCancel={endDrag}\n          onKeyDown={onHandleKeyDown}\n        >\n          <span class=\"smwb-sheet__drag-handle-bar\" />\n        </div>\n      </Show>\n      <Show when={showActions()}>\n        <div class=\"smwb-sheet__header\">{actionNodes()}</div>\n      </Show>\n      <Show when={local.isOpen && local.mode !== \"small\"}>\n        <div class=\"smwb-sheet__inner\">{local.children}</div>\n      </Show>\n    </div>\n  );\n}\n\nexport function Sheet(props: ParentProps<SheetProps>): JSX.Element {\n  const merged = mergeProps({ variant: \"default\" as const, placement: \"bottom\" as const, closeOnEsc: true }, props);\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"onClose\",\n    \"variant\",\n    \"children\",\n    \"placement\",\n    \"disableOutsideClick\",\n    \"closeOnEsc\",\n    \"ref\",\n  ]);\n\n  const [mode, setMode] = createSignal<Mode>(null);\n\n  const outer = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 70, exit: 70 },\n    classNames: { enterDone: \"smwb-entered\" },\n    appear: true,\n  });\n\n  createEffect(() => {\n    if (!local.isOpen || !local.closeOnEsc || !local.onClose) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") local.onClose?.();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const handleSizeButton = (): void => {\n    setMode((prev) => (prev === \"expanded\" ? \"small\" : prev === null ? \"expanded\" : null));\n  };\n  const handleClose = (): void => {\n    local.onClose?.();\n    setMode(null);\n  };\n\n  const block = (): JSX.Element => (\n    <SheetBlock\n      {...rest}\n      ref={local.ref}\n      isOpen={local.isOpen}\n      onClose={local.onClose}\n      handleSizeButton={handleSizeButton}\n      handleClose={handleClose}\n      mode={mode()}\n      placement={local.placement}\n      variant={local.variant}\n    >\n      {local.children}\n    </SheetBlock>\n  );\n\n  return (\n    <Show when={outer.mounted()}>\n      <Portal mount={(isServer ? undefined : document.body) as Node}>\n        <Show\n          when={local.variant === \"default\"}\n          fallback={\n            <div class={cn(\"smwb-sheet__overlay\", \"smwb-dark\", `smwb-${local.placement}`, `smwb-sheet_${local.variant}`, outer.classes())}>\n              <ClickAwayListener onClickAway={() => !local.disableOutsideClick && handleClose()}>\n                {block()}\n              </ClickAwayListener>\n            </div>\n          }\n        >\n          <div class={cn(local.disableOutsideClick ? \"smwb-sheet__overlay\" : \"smwb-sheet__default\", outer.classes())}>\n            {block()}\n          </div>\n        </Show>\n      </Portal>\n    </Show>\n  );\n}\n\nexport default Sheet;\n"],"mappings":"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","names":[],"file":"sheet.jsx"}
+{"version":3,"sources":["../../../../../src/components/layout/sheet/sheet.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/sheet/sheet.entry.less\";\nimport { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport { Portal, isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { createCssTransition } from \"../../../primitives/createCssTransition\";\nimport { isTopOverlayLayer } from \"../../../primitives/overlayLayer\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface SheetProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onResize\"> {\n  placement?: \"top\" | \"bottom\" | \"right\" | \"left\";\n  isOpen: boolean;\n  onClose?: (() => void) | undefined;\n  variant?: \"default\" | \"modal\";\n  withSizeToggle?: boolean;\n  /** Hide built-in header actions; onClose still handles Esc and backdrop. */\n  hideHeaderActions?: boolean;\n  reverseHeaderActions?: boolean;\n  size?: string;\n  disableOutsideClick?: boolean;\n  /** Close the sheet when Escape is pressed. */\n  closeOnEsc?: boolean;\n  /** Allow drag-to-resize (mobile bottom-sheet style). Off by default. */\n  resizable?: boolean;\n  /** Minimum size in px while resizing (default 80). */\n  minSize?: number;\n  /** Maximum size in px while resizing (default: viewport dimension). */\n  maxSize?: number;\n  /** Step in px for keyboard resizing (default 24). */\n  resizeStep?: number;\n  /** Accessible label for the resize handle. */\n  resizeHandleAriaLabel?: string;\n  /** Called with the new size in px while/after resizing. */\n  onResize?: (size: number) => void;\n  \"aria-label\"?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\ntype Mode = \"small\" | \"expanded\" | null;\n\nconst isVerticalAxis = (placement: SheetProps[\"placement\"]): boolean => placement === \"bottom\" || placement === \"top\";\n\ninterface SheetBlockProps extends ParentProps<SheetProps> {\n  mode: Mode;\n  handleSizeButton: () => void;\n  handleClose: () => void;\n}\n\nfunction SheetBlock(props: SheetBlockProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      size: \"60%\",\n      withSizeToggle: true,\n      hideHeaderActions: false,\n      reverseHeaderActions: false,\n      resizable: false,\n      minSize: 80,\n      resizeStep: 24,\n      resizeHandleAriaLabel: \"Resize sheet\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"placement\",\n    \"class\",\n    \"mode\",\n    \"size\",\n    \"variant\",\n    \"onClose\",\n    \"withSizeToggle\",\n    \"hideHeaderActions\",\n    \"reverseHeaderActions\",\n    \"resizable\",\n    \"minSize\",\n    \"maxSize\",\n    \"resizeStep\",\n    \"resizeHandleAriaLabel\",\n    \"onResize\",\n    \"style\",\n    \"handleClose\",\n    \"handleSizeButton\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  let rootEl: HTMLDivElement | undefined;\n  const [dragSize, setDragSize] = createSignal<number | null>(null);\n  const vertical = (): boolean => isVerticalAxis(local.placement);\n\n  const inner = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 120, exit: 120 },\n    classNames: { enterDone: \"smwb-sheet_entered\" },\n    appear: true,\n  });\n\n  const clamp = (px: number): number => {\n    const viewport = vertical() ? window.innerHeight : window.innerWidth;\n    const max = local.maxSize ?? viewport;\n    return Math.max(local.minSize, Math.min(max, px));\n  };\n\n  const currentSizePx = (): number => {\n    const rect = rootEl?.getBoundingClientRect();\n    if (!rect) return local.minSize;\n    return vertical() ? rect.height : rect.width;\n  };\n\n  const applySize = (px: number): void => {\n    const next = clamp(px);\n    setDragSize(next);\n    local.onResize?.(next);\n  };\n\n  let drag: { start: number; size: number } | null = null;\n\n  const onPointerDown = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    event.preventDefault();\n    drag = { start: vertical() ? event.clientY : event.clientX, size: currentSizePx() };\n    try {\n      event.currentTarget.setPointerCapture?.(event.pointerId);\n    } catch {\n      /* best-effort */\n    }\n  };\n\n  const onPointerMove = (event: PointerEvent): void => {\n    if (!drag) return;\n    const pos = vertical() ? event.clientY : event.clientX;\n    const delta = pos - drag.start;\n    const grow = local.placement === \"bottom\" || local.placement === \"right\" ? -delta : delta;\n    applySize(drag.size + grow);\n  };\n\n  const endDrag = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    drag = null;\n    if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n      event.currentTarget.releasePointerCapture?.(event.pointerId);\n    }\n  };\n\n  const onHandleKeyDown: JSX.EventHandler<HTMLDivElement, KeyboardEvent> = (event) => {\n    const base = dragSize() ?? currentSizePx();\n    const max = local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth);\n    const incKey =\n      local.placement === \"bottom\" ? \"ArrowUp\" : local.placement === \"top\" ? \"ArrowDown\" : local.placement === \"left\" ? \"ArrowRight\" : \"ArrowLeft\";\n    const decKey =\n      local.placement === \"bottom\" ? \"ArrowDown\" : local.placement === \"top\" ? \"ArrowUp\" : local.placement === \"left\" ? \"ArrowLeft\" : \"ArrowRight\";\n    if (event.key === incKey) {\n      event.preventDefault();\n      applySize(base + local.resizeStep);\n    } else if (event.key === decKey) {\n      event.preventDefault();\n      applySize(base - local.resizeStep);\n    } else if (event.key === \"Home\") {\n      event.preventDefault();\n      applySize(local.minSize);\n    } else if (event.key === \"End\") {\n      event.preventDefault();\n      applySize(max);\n    }\n  };\n\n  createEffect(() => {\n    if (!local.isOpen) {\n      setDragSize(null);\n      return;\n    }\n    rootEl?.focus();\n  });\n\n  const showActions = (): boolean => !local.hideHeaderActions && (!!local.onClose || local.withSizeToggle);\n  const actionNodes = (): JSX.Element[] => {\n    const nodes: JSX.Element[] = [];\n    if (local.withSizeToggle) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleSizeButton}>\n          <Icon name=\"open_in_full\" />\n        </Button>\n      );\n    }\n    if (local.onClose) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleClose}>\n          <Icon name=\"close\" />\n        </Button>\n      );\n    }\n    if (local.reverseHeaderActions) nodes.reverse();\n    return nodes;\n  };\n\n  const sizeStyle = (): JSX.CSSProperties => {\n    if (local.resizable && dragSize() !== null) {\n      const px = `${dragSize()}px`;\n      return { ...(vertical() ? { height: px } : { width: px }), transition: \"none\" };\n    }\n    return {};\n  };\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref, (el) => (rootEl = el as HTMLDivElement))}\n      data-testid=\"sheet\"\n      tabindex={-1}\n      role=\"dialog\"\n      aria-modal={local.variant === \"modal\" || undefined}\n      class={cn(\"smwb-sheet\", local.class, `smwb-sheet_${local.variant}`, `smwb-${local.placement}`, inner.classes(), {\n        \"smwb-expanded\": local.mode === \"expanded\",\n        \"smwb-small\": local.mode === \"small\",\n        \"smwb-sheet_resizable\": local.resizable,\n      })}\n      style={{\n        \"--sizeProp\": local.size,\n        ...sizeStyle(),\n        ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      }}\n    >\n      <Show when={local.resizable}>\n        <div\n          class=\"smwb-sheet__drag-handle\"\n          data-testid=\"sheet-drag-handle\"\n          role=\"separator\"\n          tabindex={0}\n          aria-orientation={vertical() ? \"horizontal\" : \"vertical\"}\n          aria-label={local.resizeHandleAriaLabel}\n          aria-valuemin={local.minSize}\n          aria-valuemax={Math.round(local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth))}\n          aria-valuenow={Math.round(dragSize() ?? currentSizePx())}\n          onPointerDown={onPointerDown}\n          onPointerMove={onPointerMove}\n          onPointerUp={endDrag}\n          onPointerCancel={endDrag}\n          onKeyDown={onHandleKeyDown}\n        >\n          <span class=\"smwb-sheet__drag-handle-bar\" />\n        </div>\n      </Show>\n      <Show when={showActions()}>\n        <div class=\"smwb-sheet__header\">{actionNodes()}</div>\n      </Show>\n      <Show when={local.isOpen && local.mode !== \"small\"}>\n        <div class=\"smwb-sheet__inner\">{local.children}</div>\n      </Show>\n    </div>\n  );\n}\n\nexport function Sheet(props: ParentProps<SheetProps>): JSX.Element {\n  const merged = mergeProps({ variant: \"default\" as const, placement: \"bottom\" as const, closeOnEsc: true }, props);\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"onClose\",\n    \"variant\",\n    \"children\",\n    \"placement\",\n    \"disableOutsideClick\",\n    \"closeOnEsc\",\n    \"ref\",\n  ]);\n\n  const [mode, setMode] = createSignal<Mode>(null);\n  let wrapperEl: HTMLDivElement | undefined;\n\n  const outer = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 70, exit: 70 },\n    classNames: { enterDone: \"smwb-entered\" },\n    appear: true,\n  });\n\n  createEffect(() => {\n    if (!local.isOpen || !local.closeOnEsc || !local.onClose) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      // Only the topmost overlay layer reacts to Escape.\n      if (event.key === \"Escape\" && isTopOverlayLayer(wrapperEl)) local.onClose?.();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const handleSizeButton = (): void => {\n    setMode((prev) => (prev === \"expanded\" ? \"small\" : prev === null ? \"expanded\" : null));\n  };\n  const handleClose = (): void => {\n    local.onClose?.();\n    setMode(null);\n  };\n\n  const block = (): JSX.Element => (\n    <SheetBlock\n      {...rest}\n      ref={local.ref}\n      isOpen={local.isOpen}\n      onClose={local.onClose}\n      handleSizeButton={handleSizeButton}\n      handleClose={handleClose}\n      mode={mode()}\n      placement={local.placement}\n      variant={local.variant}\n    >\n      {local.children}\n    </SheetBlock>\n  );\n\n  return (\n    <Show when={outer.mounted()}>\n      <Portal mount={(isServer ? undefined : document.body) as Node}>\n        <Show\n          when={local.variant === \"default\"}\n          fallback={\n            <div\n              ref={(el) => (wrapperEl = el)}\n              data-smwb-overlay-layer\n              class={cn(\"smwb-sheet__overlay\", \"smwb-dark\", `smwb-${local.placement}`, `smwb-sheet_${local.variant}`, outer.classes())}\n            >\n              <ClickAwayListener onClickAway={() => !local.disableOutsideClick && handleClose()}>\n                {block()}\n              </ClickAwayListener>\n            </div>\n          }\n        >\n          <div\n            ref={(el) => (wrapperEl = el)}\n            data-smwb-overlay-layer\n            class={cn(local.disableOutsideClick ? \"smwb-sheet__overlay\" : \"smwb-sheet__default\", outer.classes())}\n          >\n            {block()}\n          </div>\n        </Show>\n      </Portal>\n    </Show>\n  );\n}\n\nexport default Sheet;\n"],"mappings":"AAAA,OAAO;AACP,SAAqC,MAAM,cAAc,cAAc,YAAY,WAAW,kBAAkB;AAChH,SAAS,QAAQ,gBAAgB;AACjC,OAAO,QAAQ;AACf,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,yBAAyB;AAClC,SAAS,2BAA2B;AACpC,SAAS,yBAAyB;AAClC,SAAS,iBAA2B;AAiCpC,MAAM,iBAAiB,CAAC,cAAgD,cAAc,YAAY,cAAc;AAQhH,SAAS,WAAW,OAAqC;AACvD,QAAM,SAAS;AAAA,IACb;AAAA,MACE,MAAM;AAAA,MACN,gBAAgB;AAAA,MAChB,mBAAmB;AAAA,MACnB,sBAAsB;AAAA,MACtB,WAAW;AAAA,MACX,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,uBAAuB;AAAA,IACzB;AAAA,IACA;AAAA,EACF;AACA,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI;AACJ,QAAM,CAAC,UAAU,WAAW,IAAI,aAA4B,IAAI;AAChE,QAAM,WAAW,MAAe,eAAe,MAAM,SAAS;AAE9D,QAAM,QAAQ,oBAAoB;AAAA,IAChC,IAAI,MAAM,MAAM;AAAA,IAChB,SAAS,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,IACjC,YAAY,EAAE,WAAW,qBAAqB;AAAA,IAC9C,QAAQ;AAAA,EACV,CAAC;AAED,QAAM,QAAQ,CAAC,OAAuB;AACpC,UAAM,WAAW,SAAS,IAAI,OAAO,cAAc,OAAO;AAC1D,UAAM,MAAM,MAAM,WAAW;AAC7B,WAAO,KAAK,IAAI,MAAM,SAAS,KAAK,IAAI,KAAK,EAAE,CAAC;AAAA,EAClD;AAEA,QAAM,gBAAgB,MAAc;AAClC,UAAM,OAAO,QAAQ,sBAAsB;AAC3C,QAAI,CAAC,KAAM,QAAO,MAAM;AACxB,WAAO,SAAS,IAAI,KAAK,SAAS,KAAK;AAAA,EACzC;AAEA,QAAM,YAAY,CAAC,OAAqB;AACtC,UAAM,OAAO,MAAM,EAAE;AACrB,gBAAY,IAAI;AAChB,UAAM,WAAW,IAAI;AAAA,EACvB;AAEA,MAAI,OAA+C;AAEnD,QAAM,gBAAgB,CAAC,UAAkE;AACvF,UAAM,eAAe;AACrB,WAAO,EAAE,OAAO,SAAS,IAAI,MAAM,UAAU,MAAM,SAAS,MAAM,cAAc,EAAE;AAClF,QAAI;AACF,YAAM,cAAc,oBAAoB,MAAM,SAAS;AAAA,IACzD,QAAQ;AAAA,IAER;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,UAA8B;AACnD,QAAI,CAAC,KAAM;AACX,UAAM,MAAM,SAAS,IAAI,MAAM,UAAU,MAAM;AAC/C,UAAM,QAAQ,MAAM,KAAK;AACzB,UAAM,OAAO,MAAM,cAAc,YAAY,MAAM,cAAc,UAAU,CAAC,QAAQ;AACpF,cAAU,KAAK,OAAO,IAAI;AAAA,EAC5B;AAEA,QAAM,UAAU,CAAC,UAAkE;AACjF,WAAO;AACP,QAAI,MAAM,cAAc,oBAAoB,MAAM,SAAS,GAAG;AAC5D,YAAM,cAAc,wBAAwB,MAAM,SAAS;AAAA,IAC7D;AAAA,EACF;AAEA,QAAM,kBAAmE,CAAC,UAAU;AAClF,UAAM,OAAO,SAAS,KAAK,cAAc;AACzC,UAAM,MAAM,MAAM,YAAY,SAAS,IAAI,OAAO,cAAc,OAAO;AACvE,UAAM,SACJ,MAAM,cAAc,WAAW,YAAY,MAAM,cAAc,QAAQ,cAAc,MAAM,cAAc,SAAS,eAAe;AACnI,UAAM,SACJ,MAAM,cAAc,WAAW,cAAc,MAAM,cAAc,QAAQ,YAAY,MAAM,cAAc,SAAS,cAAc;AAClI,QAAI,MAAM,QAAQ,QAAQ;AACxB,YAAM,eAAe;AACrB,gBAAU,OAAO,MAAM,UAAU;AAAA,IACnC,WAAW,MAAM,QAAQ,QAAQ;AAC/B,YAAM,eAAe;AACrB,gBAAU,OAAO,MAAM,UAAU;AAAA,IACnC,WAAW,MAAM,QAAQ,QAAQ;AAC/B,YAAM,eAAe;AACrB,gBAAU,MAAM,OAAO;AAAA,IACzB,WAAW,MAAM,QAAQ,OAAO;AAC9B,YAAM,eAAe;AACrB,gBAAU,GAAG;AAAA,IACf;AAAA,EACF;AAEA,eAAa,MAAM;AACjB,QAAI,CAAC,MAAM,QAAQ;AACjB,kBAAY,IAAI;AAChB;AAAA,IACF;AACA,YAAQ,MAAM;AAAA,EAChB,CAAC;AAED,QAAM,cAAc,MAAe,CAAC,MAAM,sBAAsB,CAAC,CAAC,MAAM,WAAW,MAAM;AACzF,QAAM,cAAc,MAAqB;AACvC,UAAM,QAAuB,CAAC;AAC9B,QAAI,MAAM,gBAAgB;AACxB,YAAM;AAAA,QACJ,CAAC,OAAO,QAAQ,WAAW,KAAK,QAAQ,SAAS,MAAM,kBAAkB;AAAA,UACvE,CAAC,KAAK,KAAK,eAAe,EAAE;AAAA,QAC9B,EAFC;AAAA,MAGH;AAAA,IACF;AACA,QAAI,MAAM,SAAS;AACjB,YAAM;AAAA,QACJ,CAAC,OAAO,QAAQ,WAAW,KAAK,QAAQ,SAAS,MAAM,aAAa;AAAA,UAClE,CAAC,KAAK,KAAK,QAAQ,EAAE;AAAA,QACvB,EAFC;AAAA,MAGH;AAAA,IACF;AACA,QAAI,MAAM,qBAAsB,OAAM,QAAQ;AAC9C,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,MAAyB;AACzC,QAAI,MAAM,aAAa,SAAS,MAAM,MAAM;AAC1C,YAAM,KAAK,GAAG,SAAS,CAAC;AACxB,aAAO,EAAE,GAAI,SAAS,IAAI,EAAE,QAAQ,GAAG,IAAI,EAAE,OAAO,GAAG,GAAI,YAAY,OAAO;AAAA,IAChF;AACA,WAAO,CAAC;AAAA,EACV;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,KAAK,CAAC,OAAQ,SAAS,EAAqB;AAAA,IACjE,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,KAAK;AAAA,IACL,YAAY,MAAM,YAAY,WAAW;AAAA,IACzC,OAAO,GAAG,cAAc,MAAM,OAAO,cAAc,MAAM,OAAO,IAAI,QAAQ,MAAM,SAAS,IAAI,MAAM,QAAQ,GAAG;AAAA,MAC9G,iBAAiB,MAAM,SAAS;AAAA,MAChC,cAAc,MAAM,SAAS;AAAA,MAC7B,wBAAwB,MAAM;AAAA,IAChC,CAAC;AAAA,IACD,OAAO;AAAA,MACL,cAAc,MAAM;AAAA,MACpB,GAAG,UAAU;AAAA,MACb,GAAI,OAAO,MAAM,UAAU,YAAY,MAAM,QAAQ,MAAM,QAAQ,CAAC;AAAA,IACtE;AAAA,GACD;AAAA,MACC,CAAC,KAAK,MAAM,MAAM,WAAW;AAAA,QAC3B,CAAC;AAAA,IACC,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,UAAU;AAAA,IACV,kBAAkB,SAAS,IAAI,eAAe;AAAA,IAC9C,YAAY,MAAM;AAAA,IAClB,eAAe,MAAM;AAAA,IACrB,eAAe,KAAK,MAAM,MAAM,YAAY,SAAS,IAAI,OAAO,cAAc,OAAO,WAAW;AAAA,IAChG,eAAe,KAAK,MAAM,SAAS,KAAK,cAAc,CAAC;AAAA,IACvD,eAAe;AAAA,IACf,eAAe;AAAA,IACf,aAAa;AAAA,IACb,iBAAiB;AAAA,IACjB,WAAW;AAAA,GACZ;AAAA,UACC,CAAC,KAAK,MAAM,8BAA8B,EAAE;AAAA,QAC9C,EAjBC,IAiBK;AAAA,MACR,EAnBC,KAmBM;AAAA,MACP,CAAC,KAAK,MAAM,YAAY,GAAG;AAAA,QACzB,CAAC,IAAI,MAAM,sBAAsB,YAAY,EAAE,EAA9C,IAAoD;AAAA,MACvD,EAFC,KAEM;AAAA,MACP,CAAC,KAAK,MAAM,MAAM,UAAU,MAAM,SAAS,SAAS;AAAA,QAClD,CAAC,IAAI,MAAM,qBAAqB,MAAM,SAAS,EAA9C,IAAoD;AAAA,MACvD,EAFC,KAEM;AAAA,IACT,EA5CC;AA8CL;AAEO,SAAS,MAAM,OAA6C;AACjE,QAAM,SAAS,WAAW,EAAE,SAAS,WAAoB,WAAW,UAAmB,YAAY,KAAK,GAAG,KAAK;AAChH,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,CAAC,MAAM,OAAO,IAAI,aAAmB,IAAI;AAC/C,MAAI;AAEJ,QAAM,QAAQ,oBAAoB;AAAA,IAChC,IAAI,MAAM,MAAM;AAAA,IAChB,SAAS,EAAE,OAAO,IAAI,MAAM,GAAG;AAAA,IAC/B,YAAY,EAAE,WAAW,eAAe;AAAA,IACxC,QAAQ;AAAA,EACV,CAAC;AAED,eAAa,MAAM;AACjB,QAAI,CAAC,MAAM,UAAU,CAAC,MAAM,cAAc,CAAC,MAAM,QAAS;AAC1D,UAAM,YAAY,CAAC,UAA+B;AAEhD,UAAI,MAAM,QAAQ,YAAY,kBAAkB,SAAS,EAAG,OAAM,UAAU;AAAA,IAC9E;AACA,aAAS,iBAAiB,WAAW,SAAS;AAC9C,cAAU,MAAM,SAAS,oBAAoB,WAAW,SAAS,CAAC;AAAA,EACpE,CAAC;AAED,QAAM,mBAAmB,MAAY;AACnC,YAAQ,CAAC,SAAU,SAAS,aAAa,UAAU,SAAS,OAAO,aAAa,IAAK;AAAA,EACvF;AACA,QAAM,cAAc,MAAY;AAC9B,UAAM,UAAU;AAChB,YAAQ,IAAI;AAAA,EACd;AAEA,QAAM,QAAQ,MACZ,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,MAAM;AAAA,IACX,QAAQ,MAAM;AAAA,IACd,SAAS,MAAM;AAAA,IACf,kBAAkB;AAAA,IAClB,aAAa;AAAA,IACb,MAAM,KAAK;AAAA,IACX,WAAW,MAAM;AAAA,IACjB,SAAS,MAAM;AAAA,GAChB;AAAA,OACE,MAAM,SAAS;AAAA,IAClB,EAZC;AAeH,SACE,CAAC,KAAK,MAAM,MAAM,QAAQ,GAAG;AAAA,MAC3B,CAAC,OAAO,OAAQ,WAAW,SAAY,SAAS,MAAe;AAAA,QAC7D,CAAC;AAAA,IACC,MAAM,MAAM,YAAY;AAAA,IACxB,UACE,CAAC;AAAA,MACC,KAAK,CAAC,OAAQ,YAAY;AAAA,MAC1B;AAAA,MACA,OAAO,GAAG,uBAAuB,aAAa,QAAQ,MAAM,SAAS,IAAI,cAAc,MAAM,OAAO,IAAI,MAAM,QAAQ,CAAC;AAAA,KACxH;AAAA,cACC,CAAC,kBAAkB,aAAa,MAAM,CAAC,MAAM,uBAAuB,YAAY,GAAG;AAAA,iBAChF,MAAM,EAAE;AAAA,cACX,EAFC,kBAEmB;AAAA,YACtB,EARC;AAAA,GAUJ;AAAA,UACC,CAAC;AAAA,IACC,KAAK,CAAC,OAAQ,YAAY;AAAA,IAC1B;AAAA,IACA,OAAO,GAAG,MAAM,sBAAsB,wBAAwB,uBAAuB,MAAM,QAAQ,CAAC;AAAA,GACrG;AAAA,aACE,MAAM,EAAE;AAAA,UACX,EANC,IAMK;AAAA,QACR,EArBC,KAqBM;AAAA,MACT,EAvBC,OAuBQ;AAAA,IACX,EAzBC;AA2BL;AAEA,IAAO,gBAAQ;","names":[],"file":"sheet.jsx"}

package/dist/source/icons/all.js

@@ -0,0 +1,11 @@
+import * as icons from "./svg";
+import { registerIcons } from "./registry";
+function registerAllIcons() {
+  registerIcons(icons);
+}
+var all_default = registerAllIcons;
+export {
+  all_default as default,
+  registerAllIcons
+};
+//# sourceMappingURL=all.js.map

package/dist/source/icons/all.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/icons/all.ts"],
+  "sourcesContent": ["import * as icons from \"./svg\";\nimport { registerIcons } from \"./registry\";\n\n/**\n * Registers the **entire** smwb icon set.\n *\n * Importing this module pulls every icon into the bundle \u2014 that is the point of\n * a separate entry point. Use it in Storybook, docs, an icon picker, or a small\n * internal app; in a product bundle prefer registering only what you render:\n *\n * ```ts\n * import { add, close, search } from \"@smwb/ui-solid/icons\";\n * registerIcons([add, close, search]);\n * ```\n */\nexport function registerAllIcons(): void {\n  registerIcons(icons);\n}\n\nexport default registerAllIcons;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AACvB,SAAS,qBAAqB;AAcvB,SAAS,mBAAyB;AACvC,gBAAc,KAAK;AACrB;AAEA,IAAO,cAAQ;",
+  "names": []
+}