@smwb/ui-solid 0.12.1 → 0.14.0

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

@@ -0,0 +1,319 @@
+import {
+  Show,
+  children,
+  createEffect,
+  createSignal,
+  mergeProps,
+  onMount,
+  splitProps,
+  untrack
+} from "solid-js";
+import { isServer } from "solid-js/web";
+import cn from "clsx";
+import { Icon } from "../../base/icon";
+import { callHandler } from "../../../primitives/callHandler";
+import { createControllableState } from "../../../primitives/createControllableState";
+import { createDropzone } from "../../../primitives/createDropzone";
+import { createId } from "../../../primitives/createId";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+import { filterAttachedFiles, isFileDrag } from "./composerFiles";
+import { resolveComposerKeyAction } from "./composerKeys";
+const defaultCounterAnnouncement = (remaining) => remaining >= 0 ? `${remaining} characters left` : `${-remaining} characters over the limit`;
+function stopMouseDown(event) {
+  event.preventDefault();
+}
+function isDrawn(resolved) {
+  if (Array.isArray(resolved)) return resolved.some(isDrawn);
+  return resolved != null && typeof resolved !== "boolean" && resolved !== "";
+}
+function Composer(props) {
+  const merged = mergeProps(
+    {
+      sendKey: "modEnter",
+      clearOnSend: true,
+      busy: false,
+      counterAnnouncement: defaultCounterAnnouncement,
+      minRows: 1,
+      maxRows: 8,
+      layout: "stacked",
+      multiple: true,
+      disabled: false,
+      readOnly: false,
+      sendLabel: "Send",
+      stopLabel: "Stop",
+      attachLabel: "Attach file"
+    },
+    props
+  );
+  const [local, rest] = splitProps(merged, [
+    "value",
+    "defaultValue",
+    "onValueChange",
+    "onSend",
+    "sendKey",
+    "clearOnSend",
+    "busy",
+    "onStop",
+    "placeholder",
+    "maxLength",
+    "counter",
+    "counterAnnouncement",
+    "minRows",
+    "maxRows",
+    "layout",
+    "toolbar",
+    "attachments",
+    "onAttach",
+    "accept",
+    "multiple",
+    "maxFiles",
+    "dropTarget",
+    "disabled",
+    "readOnly",
+    "autofocus",
+    "name",
+    "id",
+    "aria-label",
+    "aria-labelledby",
+    "aria-describedby",
+    "onKeyDown",
+    "onFocus",
+    "onBlur",
+    "inputRef",
+    "sendLabel",
+    "stopLabel",
+    "attachLabel",
+    "class",
+    "data-testid",
+    "ref",
+    // The root sets these too; its own handlers call the caller's first.
+    "onDragOver",
+    "onDragLeave",
+    "onDrop"
+  ]);
+  const [text, setText] = createControllableState({
+    value: () => local.value,
+    defaultValue: untrack(() => local.defaultValue) ?? "",
+    onChange: (next) => local.onValueChange?.(next)
+  });
+  const [focused, setFocused] = createSignal(false);
+  const generatedId = createId(void 0, "smwb-composer");
+  const textareaId = () => local.id ?? generatedId;
+  const counterId = () => `${textareaId()}-counter`;
+  let textareaEl;
+  const dropzone = createDropzone({
+    get accept() {
+      return local.accept;
+    },
+    get multiple() {
+      return local.multiple;
+    },
+    get disabled() {
+      return local.disabled;
+    },
+    // `maxFiles` is not passed on: the cut has to come after `accept`, see `filterAttachedFiles`.
+    onDrop: (files) => {
+      const attached = filterAttachedFiles(files, {
+        accept: local.accept,
+        multiple: local.multiple,
+        maxFiles: local.maxFiles
+      });
+      if (attached.length > 0) local.onAttach?.(attached);
+    }
+  });
+  const attachable = () => local.onAttach !== void 0;
+  const dropping = () => attachable() && local.dropTarget !== false;
+  const inputProps = () => dropzone.getInputProps();
+  const showCounter = () => local.counter ?? local.maxLength !== void 0;
+  const overLimit = () => local.maxLength !== void 0 && text().length > local.maxLength;
+  const canSend = () => !!local.onSend && text().trim() !== "" && !local.disabled && !local.readOnly && !local.busy && !overLimit();
+  const status = () => {
+    const max = local.maxLength;
+    if (!showCounter() || max === void 0) return "";
+    const remaining = max - text().length;
+    return remaining <= Math.max(10, Math.ceil(max * 0.1)) ? local.counterAnnouncement(remaining, max) : "";
+  };
+  const initialText = untrack(text);
+  const serverText = isServer && initialText.startsWith("\n") ? `
+${initialText}` : initialText;
+  createEffect(() => {
+    const next = text();
+    if (textareaEl && textareaEl.value !== next) textareaEl.value = next;
+  });
+  const send = () => {
+    if (!canSend()) return;
+    local.onSend?.(text().trim());
+    if (local.clearOnSend) setText("");
+  };
+  const onInput = (event) => {
+    const el = event.currentTarget;
+    setText(el.value);
+    if (el.value !== text()) el.value = text();
+  };
+  const onKeyDown = (event) => {
+    callHandler(local.onKeyDown, event);
+    if (event.defaultPrevented) return;
+    const action = resolveComposerKeyAction(event, local.sendKey);
+    if (action === "native") return;
+    event.preventDefault();
+    send();
+  };
+  const onFocus = (event) => {
+    callHandler(local.onFocus, event);
+    setFocused(true);
+  };
+  const onBlur = (event) => {
+    callHandler(local.onBlur, event);
+    setFocused(false);
+  };
+  const onActionClick = (event) => {
+    if (event.detail > 1) return;
+    if (local.busy) {
+      if (!local.disabled) local.onStop?.();
+      return;
+    }
+    send();
+  };
+  const onDragOver = (event) => {
+    callHandler(local.onDragOver, event);
+    if (dropping() && isFileDrag(event.dataTransfer)) dropzone.getRootProps().onDragOver(event);
+  };
+  const onDragLeave = (event) => {
+    callHandler(local.onDragLeave, event);
+    if (!dropping()) return;
+    if (event.relatedTarget instanceof Node && event.currentTarget.contains(event.relatedTarget)) return;
+    dropzone.getRootProps().onDragLeave();
+  };
+  const onDrop = (event) => {
+    callHandler(local.onDrop, event);
+    if (dropping() && isFileDrag(event.dataTransfer)) dropzone.getRootProps().onDrop(event);
+  };
+  const onFileChange = (event) => {
+    inputProps().onChange(event);
+    event.currentTarget.value = "";
+  };
+  onMount(() => {
+    if (local.autofocus) textareaEl?.focus();
+  });
+  const toolbar = children(() => local.toolbar);
+  const attachments = children(() => local.attachments);
+  const describedBy = () => [local["aria-describedby"], showCounter() ? counterId() : void 0].filter(Boolean).join(" ") || void 0;
+  return <div
+    {...rest}
+    ref={mergeRefs(local.ref)}
+    class={cn(
+      "smwb-composer",
+      `smwb-composer_${local.layout}`,
+      focused() && "smwb-composer_focused",
+      local.busy && "smwb-composer_busy",
+      local.disabled && "smwb-composer_disabled",
+      dropping() && dropzone.isDragActive() && "smwb-composer_drag-active",
+      overLimit() && "smwb-composer_over-limit",
+      local.class
+    )}
+    data-testid={local["data-testid"] ?? "composer"}
+    onDragOver={onDragOver}
+    onDragLeave={onDragLeave}
+    onDrop={onDrop}
+  >
+      <Show when={isDrawn(attachments())}>
+        <div class="smwb-composer__attachments" data-testid="composer-attachments">
+          {attachments()}
+        </div>
+      </Show>
+      <div
+    class="smwb-composer__field"
+    data-value={text()}
+    style={{
+      "--smwb-composer-min-rows": String(local.minRows),
+      "--smwb-composer-max-rows": String(Math.max(local.maxRows, local.minRows))
+    }}
+  >
+        <textarea
+    ref={mergeRefs(local.inputRef, (el) => textareaEl = el)}
+    class="smwb-composer__input"
+    id={textareaId()}
+    name={local.name}
+    rows={local.minRows}
+    placeholder={local.placeholder}
+    maxlength={local.maxLength}
+    disabled={local.disabled}
+    readonly={local.readOnly}
+    autofocus={local.autofocus}
+    aria-label={local["aria-label"]}
+    aria-labelledby={local["aria-labelledby"]}
+    aria-describedby={describedBy()}
+    aria-invalid={overLimit() || void 0}
+    data-testid="composer-input"
+    onInput={onInput}
+    onKeyDown={onKeyDown}
+    onFocus={onFocus}
+    onBlur={onBlur}
+  >
+          {serverText}
+        </textarea>
+      </div>
+      <Show when={attachable()}>
+        <button
+    type="button"
+    class="smwb-composer__icon-button smwb-composer__attach"
+    aria-label={local.attachLabel}
+    disabled={local.disabled}
+    data-testid="composer-attach"
+    onClick={() => dropzone.open()}
+  >
+          <Icon name="attach_file" size={20} />
+        </button>
+      </Show>
+      <Show when={isDrawn(toolbar())}>
+        <div class="smwb-composer__toolbar" data-testid="composer-toolbar">
+          {toolbar()}
+        </div>
+      </Show>
+      <Show when={showCounter()}>
+        <span
+    id={counterId()}
+    class={cn("smwb-composer__counter", overLimit() && "smwb-composer__counter_error")}
+    data-testid="composer-counter"
+  >
+          {local.maxLength !== void 0 ? `${text().length} / ${local.maxLength}` : text().length}
+        </span>
+      </Show>
+      <button
+    type="button"
+    class={cn("smwb-composer__icon-button", "smwb-composer__action", local.busy && "smwb-composer__action_stop")}
+    aria-label={local.busy ? local.stopLabel : local.sendLabel}
+    aria-disabled={!local.busy && !canSend() ? "true" : void 0}
+    disabled={local.disabled}
+    data-action={local.busy ? "stop" : "send"}
+    data-testid="composer-action"
+    onMouseDown={stopMouseDown}
+    onClick={onActionClick}
+  >
+        <Icon name={local.busy ? "stop" : "send"} size={20} />
+      </button>
+      <Show when={showCounter()}>
+        <span class="smwb-composer__status" role="status" data-testid="composer-status">
+          {status()}
+        </span>
+      </Show>
+      <Show when={attachable()}>
+        <input
+    ref={dropzone.inputRef}
+    type="file"
+    multiple={inputProps().multiple}
+    accept={inputProps().accept}
+    disabled={inputProps().disabled}
+    style={{ display: "none" }}
+    data-testid="composer-file-input"
+    onChange={onFileChange}
+  />
+      </Show>
+    </div>;
+}
+var composer_default = Composer;
+export {
+  Composer,
+  composer_default as default
+};
+//# sourceMappingURL=composer.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/inputs/composer/composer.tsx"],"sourcesContent":["import {\n  type JSX,\n  Show,\n  children,\n  createEffect,\n  createSignal,\n  mergeProps,\n  onMount,\n  splitProps,\n  untrack,\n} from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { callHandler } from \"../../../primitives/callHandler\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { createDropzone } from \"../../../primitives/createDropzone\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs } from \"../../../primitives/mergeRefs\";\nimport { filterAttachedFiles, isFileDrag } from \"./composerFiles\";\nimport { resolveComposerKeyAction } from \"./composerKeys\";\nimport type { ComposerSendKey } from \"./composerKeys\";\n\n/** Where the toolbar and the action sit: under the field (`stacked`) or in one row with it (`inline`). */\nexport type ComposerLayout = \"stacked\" | \"inline\";\n\ntype TextareaKeyEvent = KeyboardEvent & { currentTarget: HTMLTextAreaElement; target: Element };\ntype TextareaFocusEvent = FocusEvent & { currentTarget: HTMLTextAreaElement; target: Element };\ntype RootDragEvent = DragEvent & { currentTarget: HTMLDivElement; target: Element };\n\nexport interface ComposerProps extends Omit<\n  JSX.HTMLAttributes<HTMLDivElement>,\n  \"onChange\" | \"defaultValue\" | \"onKeyDown\" | \"onFocus\" | \"onBlur\" | \"children\"\n> {\n  /**\n   * Controlled text. The composer is controlled while this is not `undefined` (checked reactively); a parent that\n   * ignores `onValueChange` keeps the field showing this value.\n   */\n  value?: string | undefined;\n  /** Initial text while uncontrolled. Defaults to an empty string. */\n  defaultValue?: string | undefined;\n  /** Called on every text change: typing, a newline, and the clear after a send. Called in both modes. */\n  onValueChange?: ((value: string) => void) | undefined;\n  /**\n   * Called with the trimmed text when the user sends it: the send key (see `sendKey`) or a click on the action\n   * button. Nothing is called while sending is not allowed: no `onSend`, an empty or whitespace-only text, `disabled`,\n   * `readOnly`, `busy`, or a text over `maxLength`. Async work is shown with `busy`; the return value is ignored.\n   */\n  onSend?: ((text: string) => void) | undefined;\n  /**\n   * Which Enter sends. `\"modEnter\"` (default): Ctrl/⌘+Enter sends and Enter inserts a newline. `\"enter\"`: Enter sends,\n   * Shift+Enter inserts a newline, Ctrl/⌘+Enter sends too. An Enter that commits an IME composition never sends.\n   */\n  sendKey?: ComposerSendKey | undefined;\n  /**\n   * Clear the text after `onSend`: the composer's own state while uncontrolled, `onValueChange(\"\")` while controlled.\n   * Defaults to `true`.\n   */\n  clearOnSend?: boolean | undefined;\n  /**\n   * The agent is working: the action button turns into Stop and calls `onStop`, and the keys and the button do not\n   * send. The text stays editable. The composer never changes `busy` itself, the parent owns it.\n   */\n  busy?: boolean | undefined;\n  /**\n   * Called when Stop is pressed (click, Enter or Space on the button) while `busy` and not `disabled`. Without it the\n   * Stop button does nothing, so pass it whenever `busy` can be set.\n   */\n  onStop?: (() => void) | undefined;\n  /** Placeholder of the textarea. It is not a name for the field, set `aria-label` or `aria-labelledby` as well. */\n  placeholder?: string | undefined;\n  /**\n   * Hard limit on the text (the native `maxlength` of the textarea, counted in UTF-16 units, so an emoji is 2).\n   * Turns the counter on.\n   */\n  maxLength?: number | undefined;\n  /** Show the counter (`n / maxLength`, or `n` without `maxLength`). Defaults to `true` when `maxLength` is set. */\n  counter?: boolean | undefined;\n  /**\n   * Text for the polite status region that announces how many characters are left. It is spoken only near the limit\n   * (within the larger of 10 characters and 10% of `maxLength`) and when the text is over it, with a negative\n   * `remaining`. Defaults to \"N characters left\" / \"N characters over the limit\".\n   */\n  counterAnnouncement?: ((remaining: number, maxLength: number) => string) | undefined;\n  /** Height of the empty field in rows, and the `rows` of the textarea. Defaults to `1`. */\n  minRows?: number | undefined;\n  /** Rows the field grows to before it scrolls. Clamped to at least `minRows`. Defaults to `8`. */\n  maxRows?: number | undefined;\n  /**\n   * `\"stacked\"` (default): the field on top, a bar under it with the attach button, the toolbar, the counter and the\n   * action. `\"inline\"`: the attach button, the field, the counter and the action in one row, the toolbar (if any)\n   * in a row under it.\n   */\n  layout?: ComposerLayout | undefined;\n  /**\n   * Slot under the field for chips and selectors (agent, model, mode, …). Drawn in every state. It is a plain `div`,\n   * not `role=\"toolbar\"`: the content brings its own keyboard handling and disabled state.\n   */\n  toolbar?: JSX.Element;\n  /**\n   * Slot above the field for the app's file chips. The composer keeps no file state: the app lists what `onAttach`\n   * gave it here.\n   */\n  attachments?: JSX.Element;\n  /**\n   * Turns on the attach button, the hidden file input and the drop target (the whole composer). Called with the files\n   * of a pick or a drop that are left after `accept`, `multiple` and `maxFiles`, never with an empty list. Only a drag\n   * of files is taken: dragged text or a link still goes into the field.\n   */\n  onAttach?: ((files: File[]) => void) | undefined;\n  /**\n   * Accepted file types, as a record of mime type to extensions or a raw `accept` string (`image/*`, `.pdf`, an exact\n   * mime type). It sets the picker's filter, and the files of a pick or a drop that do not match are left out.\n   */\n  accept?: Record<string, string[]> | string | undefined;\n  /** Allow several files per pick or drop. When `false` the picker takes one and a drop keeps the first. Defaults to `true`. */\n  multiple?: boolean | undefined;\n  /** Files beyond this number are dropped from a pick or a drop (counted after `accept`). */\n  maxFiles?: number | undefined;\n  /**\n   * Whether `onAttach` also makes the composer a drop target for files. Set `false` when a parent already takes drops\n   * (a chat panel): the attach button and the picker stay, and a drop on the composer bubbles to the parent untouched.\n   * Defaults to `true`.\n   */\n  dropTarget?: boolean | undefined;\n  /**\n   * Disables the textarea, the attach button, the action button and the drop target. Toolbar content is the app's to\n   * disable.\n   */\n  disabled?: boolean | undefined;\n  /** The textarea is `readonly`: sending is unavailable, Stop still works. */\n  readOnly?: boolean | undefined;\n  /** Focus the textarea on mount. */\n  autofocus?: boolean | undefined;\n  /** Name of the textarea. */\n  name?: string | undefined;\n  /** Id of the textarea (the root keeps no id). Generated when not given. */\n  id?: string | undefined;\n  /** Accessible name of the textarea. Set this or `aria-labelledby`: a placeholder is not a name. */\n  \"aria-label\"?: string | undefined;\n  /** Id(s) of the element(s) that name the textarea. */\n  \"aria-labelledby\"?: string | undefined;\n  /** Id(s) that describe the textarea. They come first, the counter's id is appended. */\n  \"aria-describedby\"?: string | undefined;\n  /** Key handler of the textarea. It runs before the composer's own; if it calls `preventDefault()`, the composer does nothing for that key. */\n  onKeyDown?: JSX.EventHandlerUnion<HTMLTextAreaElement, KeyboardEvent> | undefined;\n  /** Focus handler of the textarea. */\n  onFocus?: JSX.EventHandlerUnion<HTMLTextAreaElement, FocusEvent> | undefined;\n  /** Blur handler of the textarea. */\n  onBlur?: JSX.EventHandlerUnion<HTMLTextAreaElement, FocusEvent> | undefined;\n  /** Ref of the textarea (the root takes the component's own `ref`). */\n  inputRef?: ((el: HTMLTextAreaElement) => void) | undefined;\n  /** Accessible name of the action button while it sends. Defaults to \"Send\". */\n  sendLabel?: string | undefined;\n  /** Accessible name of the action button while `busy`. Defaults to \"Stop\". */\n  stopLabel?: string | undefined;\n  /** Accessible name of the attach button. Defaults to \"Attach file\". */\n  attachLabel?: string | undefined;\n  /**\n   * Class name(s) for the root `<div>`. `style`, `ref`, `data-*` attributes and every other HTML attribute or event\n   * handler go to the root too; the root's drag handlers run after yours.\n   */\n  class?: string | undefined;\n  /** Test id of the root `<div>`. Defaults to `composer`; the parts inside have their own (`composer-input`, `composer-action`, …). */\n  \"data-testid\"?: string | undefined;\n}\n\nconst defaultCounterAnnouncement = (remaining: number): string =>\n  remaining >= 0 ? `${remaining} characters left` : `${-remaining} characters over the limit`;\n\nfunction stopMouseDown(event: MouseEvent): void {\n  // Keeps the focus in the textarea when the action button is clicked with a mouse.\n  event.preventDefault();\n}\n\n// Whether a resolved slot draws anything.\nfunction isDrawn(resolved: unknown): boolean {\n  if (Array.isArray(resolved)) return resolved.some(isDrawn);\n  return resolved != null && typeof resolved !== \"boolean\" && resolved !== \"\";\n}\n\n/**\n * A task input: a multi-line field that grows from `minRows` to `maxRows`, a `toolbar` slot under it for chip\n * selectors, a send button that becomes Stop while `busy`, keyboard send (Ctrl/⌘+Enter by default), an optional\n * attach button and drop target, and a character counter.\n *\n * ```tsx\n * <Composer aria-label=\"Task for the agent\" onSend={(text) => run(text)} busy={running()} onStop={cancel} />\n * ```\n */\nexport function Composer(props: ComposerProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      sendKey: \"modEnter\" as ComposerSendKey,\n      clearOnSend: true,\n      busy: false,\n      counterAnnouncement: defaultCounterAnnouncement as (remaining: number, maxLength: number) => string,\n      minRows: 1,\n      maxRows: 8,\n      layout: \"stacked\" as ComposerLayout,\n      multiple: true,\n      disabled: false,\n      readOnly: false,\n      sendLabel: \"Send\",\n      stopLabel: \"Stop\",\n      attachLabel: \"Attach file\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"value\",\n    \"defaultValue\",\n    \"onValueChange\",\n    \"onSend\",\n    \"sendKey\",\n    \"clearOnSend\",\n    \"busy\",\n    \"onStop\",\n    \"placeholder\",\n    \"maxLength\",\n    \"counter\",\n    \"counterAnnouncement\",\n    \"minRows\",\n    \"maxRows\",\n    \"layout\",\n    \"toolbar\",\n    \"attachments\",\n    \"onAttach\",\n    \"accept\",\n    \"multiple\",\n    \"maxFiles\",\n    \"dropTarget\",\n    \"disabled\",\n    \"readOnly\",\n    \"autofocus\",\n    \"name\",\n    \"id\",\n    \"aria-label\",\n    \"aria-labelledby\",\n    \"aria-describedby\",\n    \"onKeyDown\",\n    \"onFocus\",\n    \"onBlur\",\n    \"inputRef\",\n    \"sendLabel\",\n    \"stopLabel\",\n    \"attachLabel\",\n    \"class\",\n    \"data-testid\",\n    \"ref\",\n    // The root sets these too; its own handlers call the caller's first.\n    \"onDragOver\",\n    \"onDragLeave\",\n    \"onDrop\",\n  ]);\n\n  const [text, setText] = createControllableState<string>({\n    value: () => local.value,\n    defaultValue: untrack(() => local.defaultValue) ?? \"\",\n    onChange: (next) => local.onValueChange?.(next),\n  });\n  const [focused, setFocused] = createSignal(false);\n  // Generated once; a caller's id, which may come and go, takes precedence.\n  const generatedId = createId(undefined, \"smwb-composer\");\n  const textareaId = (): string => local.id ?? generatedId;\n  const counterId = (): string => `${textareaId()}-counter`;\n  let textareaEl: HTMLTextAreaElement | undefined;\n\n  const dropzone = createDropzone({\n    get accept() {\n      return local.accept;\n    },\n    get multiple() {\n      return local.multiple;\n    },\n    get disabled() {\n      return local.disabled;\n    },\n    // `maxFiles` is not passed on: the cut has to come after `accept`, see `filterAttachedFiles`.\n    onDrop: (files) => {\n      const attached = filterAttachedFiles(files, {\n        accept: local.accept,\n        multiple: local.multiple,\n        maxFiles: local.maxFiles,\n      });\n      if (attached.length > 0) local.onAttach?.(attached);\n    },\n  });\n  const attachable = (): boolean => local.onAttach !== undefined;\n  // `dropTarget={false}` keeps the attach button and the picker but hands drops to a parent that owns the target.\n  // Compared to `false` and not falsy-checked: an explicit `undefined` must keep the default `true`.\n  const dropping = (): boolean => attachable() && local.dropTarget !== false;\n  const inputProps = () => dropzone.getInputProps();\n\n  const showCounter = (): boolean => local.counter ?? local.maxLength !== undefined;\n  const overLimit = (): boolean => local.maxLength !== undefined && text().length > local.maxLength;\n  const canSend = (): boolean =>\n    !!local.onSend && text().trim() !== \"\" && !local.disabled && !local.readOnly && !local.busy && !overLimit();\n\n  const status = (): string => {\n    const max = local.maxLength;\n    if (!showCounter() || max === undefined) return \"\";\n    const remaining = max - text().length;\n    return remaining <= Math.max(10, Math.ceil(max * 0.1)) ? local.counterAnnouncement(remaining, max) : \"\";\n  };\n\n  // The text is the textarea's child, not a `value` binding: on the server a\n  // `value` prints as an attribute browsers ignore, and hydration skips the\n  // property write, so the field would come up empty. Later changes are written\n  // to the element directly (a property write is not gated by hydration).\n  // The server parser drops the first line feed after `<textarea>`, so a text that starts with one gets a second.\n  const initialText = untrack(text);\n  const serverText = isServer && initialText.startsWith(\"\\n\") ? `\\n${initialText}` : initialText;\n  createEffect(() => {\n    const next = text();\n    if (textareaEl && textareaEl.value !== next) textareaEl.value = next;\n  });\n\n  const send = (): void => {\n    if (!canSend()) return;\n    local.onSend?.(text().trim());\n    if (local.clearOnSend) setText(\"\");\n  };\n\n  const onInput = (event: InputEvent & { currentTarget: HTMLTextAreaElement }): void => {\n    const el = event.currentTarget;\n    setText(el.value);\n    // A controlled parent that ignores the edit keeps its text, as in React.\n    if (el.value !== text()) el.value = text();\n  };\n\n  const onKeyDown = (event: TextareaKeyEvent): void => {\n    callHandler(local.onKeyDown, event);\n    if (event.defaultPrevented) return;\n    const action = resolveComposerKeyAction(event, local.sendKey);\n    if (action === \"native\") return;\n    event.preventDefault();\n    send();\n  };\n\n  const onFocus = (event: TextareaFocusEvent): void => {\n    callHandler(local.onFocus, event);\n    setFocused(true);\n  };\n\n  const onBlur = (event: TextareaFocusEvent): void => {\n    callHandler(local.onBlur, event);\n    setFocused(false);\n  };\n\n  // One button in both states: its handler reads `busy` when pressed.\n  const onActionClick = (event: MouseEvent): void => {\n    // The second click of a double-click lands on the node the first one turned into the other action (Send into\n    // Stop once the parent sets `busy`). It is not a new press: keyboard activation has `detail` 0, a click 1.\n    if (event.detail > 1) return;\n    if (local.busy) {\n      if (!local.disabled) local.onStop?.();\n      return;\n    }\n    send();\n  };\n\n  // The drop target works only with `onAttach` unless `dropTarget` is off; the caller's handlers always run, first.\n  const onDragOver = (event: RootDragEvent): void => {\n    callHandler(local.onDragOver, event);\n    // Only a drag of files is the dropzone's. Text or a link keeps its default: the textarea inserts it.\n    if (dropping() && isFileDrag(event.dataTransfer)) dropzone.getRootProps().onDragOver(event);\n  };\n  const onDragLeave = (event: RootDragEvent): void => {\n    callHandler(local.onDragLeave, event);\n    if (!dropping()) return;\n    // A leave onto a descendant is not a leave: it would flicker the drag-active state over the toolbar chips.\n    if (event.relatedTarget instanceof Node && event.currentTarget.contains(event.relatedTarget)) return;\n    dropzone.getRootProps().onDragLeave();\n  };\n  const onDrop = (event: RootDragEvent): void => {\n    callHandler(local.onDrop, event);\n    if (dropping() && isFileDrag(event.dataTransfer)) dropzone.getRootProps().onDrop(event);\n  };\n\n  const onFileChange = (event: Event & { currentTarget: HTMLInputElement; target: Element }): void => {\n    inputProps().onChange(event);\n    // Lets the same file be picked again.\n    event.currentTarget.value = \"\";\n  };\n\n  // `autofocus` alone is not \"focus on mount\": Chromium ignores it on an element inserted after the page already has\n  // a focused element (a composer opened in a panel, or after a route change). The attribute stays for the server HTML.\n  onMount(() => {\n    if (local.autofocus) textareaEl?.focus();\n  });\n\n  // Read each slot once: markup passed as a prop is created anew on every read,\n  // and during hydration a copy the server never rendered has no DOM node.\n  const toolbar = children(() => local.toolbar);\n  const attachments = children(() => local.attachments);\n\n  const describedBy = (): string | undefined =>\n    [local[\"aria-describedby\"], showCounter() ? counterId() : undefined].filter(Boolean).join(\" \") || undefined;\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\n        \"smwb-composer\",\n        `smwb-composer_${local.layout}`,\n        focused() && \"smwb-composer_focused\",\n        local.busy && \"smwb-composer_busy\",\n        local.disabled && \"smwb-composer_disabled\",\n        dropping() && dropzone.isDragActive() && \"smwb-composer_drag-active\",\n        overLimit() && \"smwb-composer_over-limit\",\n        local.class\n      )}\n      data-testid={local[\"data-testid\"] ?? \"composer\"}\n      onDragOver={onDragOver}\n      onDragLeave={onDragLeave}\n      onDrop={onDrop}\n    >\n      <Show when={isDrawn(attachments())}>\n        <div class=\"smwb-composer__attachments\" data-testid=\"composer-attachments\">\n          {attachments()}\n        </div>\n      </Show>\n      <div\n        class=\"smwb-composer__field\"\n        data-value={text()}\n        style={{\n          \"--smwb-composer-min-rows\": String(local.minRows),\n          \"--smwb-composer-max-rows\": String(Math.max(local.maxRows, local.minRows)),\n        }}\n      >\n        <textarea\n          ref={mergeRefs(local.inputRef, (el) => (textareaEl = el))}\n          class=\"smwb-composer__input\"\n          id={textareaId()}\n          name={local.name}\n          rows={local.minRows}\n          placeholder={local.placeholder}\n          maxlength={local.maxLength}\n          disabled={local.disabled}\n          readonly={local.readOnly}\n          autofocus={local.autofocus}\n          aria-label={local[\"aria-label\"]}\n          aria-labelledby={local[\"aria-labelledby\"]}\n          aria-describedby={describedBy()}\n          aria-invalid={overLimit() || undefined}\n          data-testid=\"composer-input\"\n          onInput={onInput}\n          onKeyDown={onKeyDown}\n          onFocus={onFocus}\n          onBlur={onBlur}\n        >\n          {serverText}\n        </textarea>\n      </div>\n      <Show when={attachable()}>\n        <button\n          type=\"button\"\n          class=\"smwb-composer__icon-button smwb-composer__attach\"\n          aria-label={local.attachLabel}\n          disabled={local.disabled}\n          data-testid=\"composer-attach\"\n          onClick={() => dropzone.open()}\n        >\n          <Icon name=\"attach_file\" size={20} />\n        </button>\n      </Show>\n      <Show when={isDrawn(toolbar())}>\n        <div class=\"smwb-composer__toolbar\" data-testid=\"composer-toolbar\">\n          {toolbar()}\n        </div>\n      </Show>\n      <Show when={showCounter()}>\n        <span\n          id={counterId()}\n          class={cn(\"smwb-composer__counter\", overLimit() && \"smwb-composer__counter_error\")}\n          data-testid=\"composer-counter\"\n        >\n          {local.maxLength !== undefined ? `${text().length} / ${local.maxLength}` : text().length}\n        </span>\n      </Show>\n      <button\n        type=\"button\"\n        class={cn(\"smwb-composer__icon-button\", \"smwb-composer__action\", local.busy && \"smwb-composer__action_stop\")}\n        aria-label={local.busy ? local.stopLabel : local.sendLabel}\n        aria-disabled={!local.busy && !canSend() ? \"true\" : undefined}\n        disabled={local.disabled}\n        data-action={local.busy ? \"stop\" : \"send\"}\n        data-testid=\"composer-action\"\n        onMouseDown={stopMouseDown}\n        onClick={onActionClick}\n      >\n        <Icon name={local.busy ? \"stop\" : \"send\"} size={20} />\n      </button>\n      <Show when={showCounter()}>\n        <span class=\"smwb-composer__status\" role=\"status\" data-testid=\"composer-status\">\n          {status()}\n        </span>\n      </Show>\n      <Show when={attachable()}>\n        <input\n          ref={dropzone.inputRef}\n          type=\"file\"\n          multiple={inputProps().multiple}\n          accept={inputProps().accept}\n          disabled={inputProps().disabled}\n          style={{ display: \"none\" }}\n          data-testid=\"composer-file-input\"\n          onChange={onFileChange}\n        />\n      </Show>\n    </div>\n  );\n}\n\nexport default Composer;\n"],"mappings":"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","names":[],"file":"composer.jsx"}

package/dist/headless/source/components/inputs/composer/composerFiles.js

@@ -0,0 +1,27 @@
+function isFileDrag(data) {
+  if (!data) return false;
+  if (Array.from(data.types ?? []).includes("Files")) return true;
+  return (data.files?.length ?? 0) > 0;
+}
+function acceptTokens(accept) {
+  if (!accept) return [];
+  const tokens = typeof accept === "string" ? accept.split(",") : Object.entries(accept).flatMap(([mime, exts]) => [mime, ...exts]);
+  return tokens.map((token) => token.trim().toLowerCase()).filter(Boolean);
+}
+function matchesToken(file, token) {
+  if (token === "*/*") return true;
+  if (token.startsWith(".")) return file.name.toLowerCase().endsWith(token);
+  if (token.endsWith("/*")) return file.type.toLowerCase().startsWith(token.slice(0, -1));
+  return file.type.toLowerCase() === token;
+}
+function filterAttachedFiles(files, options) {
+  const tokens = acceptTokens(options.accept);
+  const accepted = tokens.length === 0 ? files : files.filter((file) => tokens.some((token) => matchesToken(file, token)));
+  const limit = options.multiple === false ? 1 : options.maxFiles && options.maxFiles > 0 ? options.maxFiles : void 0;
+  return limit === void 0 ? accepted : accepted.slice(0, limit);
+}
+export {
+  filterAttachedFiles,
+  isFileDrag
+};
+//# sourceMappingURL=composerFiles.js.map

package/dist/headless/source/components/inputs/composer/composerFiles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/inputs/composer/composerFiles.ts"],
+  "sourcesContent": ["/** Accepted file types as `Composer` takes them: a record of mime type to extensions, or a raw `accept` string. */\nexport type ComposerAccept = Record<string, string[]> | string;\n\n/** The part of a `DataTransfer` the drag guard reads. */\nexport interface ComposerDragData {\n  types?: ArrayLike<string> | null | undefined;\n  files?: ArrayLike<unknown> | null | undefined;\n}\n\n/** The options that decide which of the picked or dropped files `Composer` passes on. */\nexport interface ComposerFileOptions {\n  accept?: ComposerAccept | undefined;\n  multiple?: boolean | undefined;\n  maxFiles?: number | undefined;\n}\n\n/**\n * Whether a drag carries files. A text or link drag does not and stays with the browser (the textarea inserts it).\n * `dragover` exposes only `types`, and Firefox gives a `DOMStringList` there, hence `Array.from`; a `drop` has the\n * file list as well.\n */\nexport function isFileDrag(data: ComposerDragData | null | undefined): boolean {\n  if (!data) return false;\n  if (Array.from(data.types ?? []).includes(\"Files\")) return true;\n  return (data.files?.length ?? 0) > 0;\n}\n\nfunction acceptTokens(accept: ComposerAccept | undefined): string[] {\n  if (!accept) return [];\n  const tokens =\n    typeof accept === \"string\" ? accept.split(\",\") : Object.entries(accept).flatMap(([mime, exts]) => [mime, ...exts]);\n  return tokens.map((token) => token.trim().toLowerCase()).filter(Boolean);\n}\n\n// The same three forms as the `accept` attribute: `.ext`, `type/*` and an exact mime type.\nfunction matchesToken(file: File, token: string): boolean {\n  if (token === \"*/*\") return true;\n  if (token.startsWith(\".\")) return file.name.toLowerCase().endsWith(token);\n  if (token.endsWith(\"/*\")) return file.type.toLowerCase().startsWith(token.slice(0, -1));\n  return file.type.toLowerCase() === token;\n}\n\n/**\n * The files of a pick or a drop that `Composer` passes to `onAttach`: those that match `accept` (a drop is not\n * filtered by the browser, and the picker's \"All files\" choice lifts its filter), cut to one file when `multiple` is\n * `false`, then to `maxFiles`. The cut comes last, so the files it drops are the ones past the limit, not the ones\n * `accept` would have refused anyway.\n */\nexport function filterAttachedFiles(files: File[], options: ComposerFileOptions): File[] {\n  const tokens = acceptTokens(options.accept);\n  const accepted =\n    tokens.length === 0 ? files : files.filter((file) => tokens.some((token) => matchesToken(file, token)));\n  const limit =\n    options.multiple === false ? 1 : options.maxFiles && options.maxFiles > 0 ? options.maxFiles : undefined;\n  return limit === undefined ? accepted : accepted.slice(0, limit);\n}\n"],
+  "mappings": "AAqBO,SAAS,WAAW,MAAoD;AAC7E,MAAI,CAAC,KAAM,QAAO;AAClB,MAAI,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC,EAAE,SAAS,OAAO,EAAG,QAAO;AAC3D,UAAQ,KAAK,OAAO,UAAU,KAAK;AACrC;AAEA,SAAS,aAAa,QAA8C;AAClE,MAAI,CAAC,OAAQ,QAAO,CAAC;AACrB,QAAM,SACJ,OAAO,WAAW,WAAW,OAAO,MAAM,GAAG,IAAI,OAAO,QAAQ,MAAM,EAAE,QAAQ,CAAC,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC;AACnH,SAAO,OAAO,IAAI,CAAC,UAAU,MAAM,KAAK,EAAE,YAAY,CAAC,EAAE,OAAO,OAAO;AACzE;AAGA,SAAS,aAAa,MAAY,OAAwB;AACxD,MAAI,UAAU,MAAO,QAAO;AAC5B,MAAI,MAAM,WAAW,GAAG,EAAG,QAAO,KAAK,KAAK,YAAY,EAAE,SAAS,KAAK;AACxE,MAAI,MAAM,SAAS,IAAI,EAAG,QAAO,KAAK,KAAK,YAAY,EAAE,WAAW,MAAM,MAAM,GAAG,EAAE,CAAC;AACtF,SAAO,KAAK,KAAK,YAAY,MAAM;AACrC;AAQO,SAAS,oBAAoB,OAAe,SAAsC;AACvF,QAAM,SAAS,aAAa,QAAQ,MAAM;AAC1C,QAAM,WACJ,OAAO,WAAW,IAAI,QAAQ,MAAM,OAAO,CAAC,SAAS,OAAO,KAAK,CAAC,UAAU,aAAa,MAAM,KAAK,CAAC,CAAC;AACxG,QAAM,QACJ,QAAQ,aAAa,QAAQ,IAAI,QAAQ,YAAY,QAAQ,WAAW,IAAI,QAAQ,WAAW;AACjG,SAAO,UAAU,SAAY,WAAW,SAAS,MAAM,GAAG,KAAK;AACjE;",
+  "names": []
+}

package/dist/headless/source/components/inputs/composer/composerKeys.js

@@ -0,0 +1,11 @@
+function resolveComposerKeyAction(event, sendKey) {
+  if (event.isComposing || event.keyCode === 229) return "native";
+  if (event.key !== "Enter") return "native";
+  if (event.altKey || event.shiftKey) return "native";
+  if (event.ctrlKey || event.metaKey) return "send";
+  return sendKey === "enter" ? "send" : "native";
+}
+export {
+  resolveComposerKeyAction
+};
+//# sourceMappingURL=composerKeys.js.map

package/dist/headless/source/components/inputs/composer/composerKeys.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/inputs/composer/composerKeys.ts"],
+  "sourcesContent": ["/** Which Enter sends in a `Composer`: `\"modEnter\"` is Ctrl/\u2318+Enter, `\"enter\"` is a plain Enter. */\nexport type ComposerSendKey = \"modEnter\" | \"enter\";\n\n/**\n * What the composer does with a key press in its textarea:\n * - `\"send\"`: prevent the default and send, if sending is allowed;\n * - `\"native\"`: leave the key to the browser (a newline, IME commit, \u2026).\n */\nexport type ComposerKeyAction = \"send\" | \"native\";\n\n/** The part of a keyboard event the key map reads. */\nexport interface ComposerKeyEvent {\n  key: string;\n  shiftKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n  altKey: boolean;\n  /** Set by Chromium and Firefox while an IME composition is open. */\n  isComposing?: boolean | undefined;\n  /** Safari reports the commit Enter of a composition as keyCode 229 with `isComposing` false. */\n  keyCode?: number | undefined;\n}\n\n/**\n * The composer's keyboard map (Escape and every other key stay native).\n *\n * - IME composition: always native, so an Enter that commits a CJK candidate is not a send.\n * - Ctrl/\u2318+Enter (no Shift, no Alt): send in both modes.\n * - Enter alone: send with `sendKey=\"enter\"`, a native newline with `\"modEnter\"`.\n * - Shift+Enter and every other combination: native.\n */\nexport function resolveComposerKeyAction(event: ComposerKeyEvent, sendKey: ComposerSendKey): ComposerKeyAction {\n  if (event.isComposing || event.keyCode === 229) return \"native\";\n  if (event.key !== \"Enter\") return \"native\";\n  if (event.altKey || event.shiftKey) return \"native\";\n\n  if (event.ctrlKey || event.metaKey) return \"send\";\n  return sendKey === \"enter\" ? \"send\" : \"native\";\n}\n"],
+  "mappings": "AA+BO,SAAS,yBAAyB,OAAyB,SAA6C;AAC7G,MAAI,MAAM,eAAe,MAAM,YAAY,IAAK,QAAO;AACvD,MAAI,MAAM,QAAQ,QAAS,QAAO;AAClC,MAAI,MAAM,UAAU,MAAM,SAAU,QAAO;AAE3C,MAAI,MAAM,WAAW,MAAM,QAAS,QAAO;AAC3C,SAAO,YAAY,UAAU,SAAS;AACxC;",
+  "names": []
+}

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

@@ -0,0 +1,5 @@
+import { Composer } from "./composer";
+export {
+  Composer
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/inputs/composer/index.ts"],
+  "sourcesContent": ["export { Composer } from \"./composer\";\nexport type { ComposerProps, ComposerLayout } from \"./composer\";\nexport type { ComposerSendKey } from \"./composerKeys\";\n"],
+  "mappings": "AAAA,SAAS,gBAAgB;",
+  "names": []
+}

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

@@ -2,6 +2,7 @@ import { Show, children, createEffect, createMemo, createSignal, onCleanup, spli
 import { Portal, isServer } from "solid-js/web";
 import { buildFloatingMiddleware, resolvePlacement } from "../../../utils/floating";
 import { createFloating } from "../../../primitives/createFloating";
+import { isTopOverlayLayer } from "../../../primitives/overlayLayer";
 import { ClickAwayListener } from "../../clickAwayListener";
 import { TextField } from "../textField";
 import { DataPickerHeader } from "./dataPickerHeader";
@@ -132,6 +133,18 @@ function DatePicker(props) {
     if (raf !== void 0) cancelAnimationFrame(raf);
     if (timer !== void 0) clearTimeout(timer);
   });
+  createEffect(() => {
+    if (!shouldOpen()) return;
+    const onKeyDown = (event) => {
+      const panel = calendarEl;
+      if (event.key !== "Escape" || !panel || !isTopOverlayLayer(panel)) return;
+      setIsOpen(false);
+      const active = document.activeElement;
+      if (!active || active === document.body || panel.contains(active)) anchorEl?.focus();
+    };
+    document.addEventListener("keydown", onKeyDown);
+    onCleanup(() => document.removeEventListener("keydown", onKeyDown));
+  });
   const view = () => {
     switch (openView()) {
       case OpenView.months:

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/inputs/datePicker/datePicker.tsx"],"sourcesContent":["import { type JSX, Show, children, 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 { TextField, type TextFieldProps } from \"../textField\";\nimport { DataPickerHeader } from \"./dataPickerHeader\";\nimport { DataPickerDays } from \"./dataPickerDays\";\nimport { DatePickerList } from \"./datePickerList\";\nimport { DataPickerInput } from \"./dataPickerInput\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { OpenView } from \"./openView\";\nimport {\n  type WeekStart,\n  getDisplayDate,\n  getMonths,\n  getYears,\n  isValidDate,\n  setMonth,\n  setYear,\n} from \"./dateUtils\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport { OpenView } from \"./openView\";\n\nexport interface DatePickerProps\n  extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\" | \"ref\" | \"onToggle\"> {\n  showDaysOutsideMonth?: boolean | undefined;\n  disablePast?: boolean | undefined;\n  disableFuture?: boolean | undefined;\n  /** Earliest selectable date (inclusive). */\n  minDate?: Date | undefined;\n  /** Latest selectable date (inclusive). */\n  maxDate?: Date | undefined;\n  /** Predicate to disable arbitrary days. */\n  isDateDisabled?: ((day: Date) => boolean) | undefined;\n  weekStartsOn?: WeekStart | undefined;\n  /** BCP-47 locale for calendar labels (day/month/year names). */\n  locale?: string | undefined;\n  /** Input format pattern with tokens dd, MM, yyyy, e.g. \"dd/MM/yyyy\". */\n  format?: string | undefined;\n  /** Enables date-range selection. */\n  range?: boolean | undefined;\n  /** Controlled range value `[start, end]`. */\n  rangeValue?: [Date | undefined, Date | undefined] | undefined;\n  /** Called when the range changes. */\n  onRangeChange?: ((range: [Date | undefined, Date | undefined]) => void) | undefined;\n  placement?: Placement | undefined;\n  disableCalendar?: boolean | undefined;\n  label?: string | undefined;\n  /** Accessible label for the calendar popup dialog. */\n  calendarAriaLabel?: string | undefined;\n  value?: Date | string | undefined;\n  calendarIcon?: JSX.Element;\n  onChange?: ((event?: Event, value?: Date, data?: DatePickerProps) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date, data?: DatePickerProps) => void) | undefined;\n  ref?: Ref<HTMLInputElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function DatePicker(props: DatePickerProps): 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    \"range\",\n    \"rangeValue\",\n    \"onRangeChange\",\n    \"calendarIcon\",\n    \"onBlur\",\n    \"ref\",\n  ]);\n\n  // The range field draws the calendar icon itself, unless the calendar is off:\n  // read it once, and only then (the single field hands it to its input).\n  const rangeIcon = children(() => (local.range && !local.disableCalendar ? local.calendarIcon : undefined));\n\n  const value = (): Date | undefined => (local.value === undefined ? undefined : new Date(local.value));\n  const isRangeControlled = (): boolean => local.rangeValue !== undefined;\n  const [rangeState, setRangeState] = createSignal<[Date | undefined, Date | undefined]>([undefined, undefined]);\n  const currentRange = (): [Date | undefined, Date | undefined] =>\n    isRangeControlled() && local.rangeValue ? local.rangeValue : rangeState();\n\n  const initialValue = value();\n  const [viewValue, setViewValue] = createSignal<Date>(isValidDate(initialValue) ? initialValue : new Date());\n  const [openView, setOpenView] = createSignal<OpenView>(OpenView.days);\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  let anchorEl: HTMLElement | undefined;\n  let calendarEl: 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) ? v : new Date());\n  });\n\n  const weekStartsOn = (): WeekStart => local.weekStartsOn ?? 1;\n\n  const onViewValueChange = (v: Date): void => {\n    setViewValue(v);\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 onChange = (event?: Event, date?: Date): void => {\n    if (local.range) {\n      if (!date) return;\n      const [start, end] = currentRange();\n      let next: [Date | undefined, Date | undefined];\n      if (!start || (start && end)) {\n        next = [date, undefined];\n      } else {\n        next = isValidDate(start) && date.getTime() < start.getTime() ? [date, start] : [start, date];\n      }\n      if (!isRangeControlled()) setRangeState(next);\n      local.onRangeChange?.(next);\n      if (next[0] && next[1]) setIsOpen(false);\n      return;\n    }\n    local.onChange?.(event, date, props);\n    setIsOpen(false);\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 (calendarEl?.contains(target) || anchorEl?.contains(target)) return;\n    setIsOpen(false);\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={onChange}\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            range={local.range}\n            rangeStart={currentRange()[0]}\n            rangeEnd={currentRange()[1]}\n          />\n        );\n    }\n  };\n\n  const rangeDisplay = (): string =>\n    local.range && (currentRange()[0] || currentRange()[1])\n      ? `${getDisplayDate(currentRange()[0], local.format)} – ${getDisplayDate(currentRange()[1], local.format)}`\n      : \"\";\n\n  const anchorRef = mergeRefs(local.ref, floating.setReference, (el) => (anchorEl = el as HTMLElement));\n\n  return (\n    <>\n      <Show\n        when={local.range}\n        fallback={\n          <DataPickerInput\n            ref={anchorRef}\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        }\n      >\n        <TextField\n          ref={anchorRef}\n          value={rangeDisplay()}\n          readOnly\n          onChange={() => undefined}\n          disabled={Boolean(local.disabled)}\n          {...(local.format ? { placeholder: `${local.format} – ${local.format}` } : {})}\n          endAdornment={\n            <Show when={!local.disableCalendar}>\n              <DatePickerIconButton\n                edge=\"end\"\n                onClick={onToggle}\n                disabled={Boolean(local.disabled)}\n                data-testid=\"date-picker-icon-button\"\n              >\n                <Show when={rangeIcon()} fallback={<Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}>\n                  {rangeIcon()}\n                </Show>\n              </DatePickerIconButton>\n            </Show>\n          }\n          {...rest}\n        />\n      </Show>\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) => (calendarEl = el as HTMLElement))}\n              class=\"smwb-date-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-picker\"\n              data-smwb-overlay-layer\n              role=\"dialog\"\n              aria-modal=\"false\"\n              aria-label={local.calendarAriaLabel ?? \"Choose date\"}\n            >\n              <div class=\"smwb-date-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-picker__body\">{view()}</div>\n              </div>\n            </div>\n          </ClickAwayListener>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"mappings":"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","names":["OpenView"],"file":"datePicker.jsx"}
+{"version":3,"sources":["../../../../../../src/components/inputs/datePicker/datePicker.tsx"],"sourcesContent":["import { type JSX, Show, children, 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 { isTopOverlayLayer } from \"../../../primitives/overlayLayer\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { TextField, type TextFieldProps } from \"../textField\";\nimport { DataPickerHeader } from \"./dataPickerHeader\";\nimport { DataPickerDays } from \"./dataPickerDays\";\nimport { DatePickerList } from \"./datePickerList\";\nimport { DataPickerInput } from \"./dataPickerInput\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { OpenView } from \"./openView\";\nimport {\n  type WeekStart,\n  getDisplayDate,\n  getMonths,\n  getYears,\n  isValidDate,\n  setMonth,\n  setYear,\n} from \"./dateUtils\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport { OpenView } from \"./openView\";\n\nexport interface DatePickerProps\n  extends Omit<TextFieldProps, \"onBlur\" | \"onChange\" | \"value\" | \"defaultValue\" | \"ref\" | \"onToggle\"> {\n  showDaysOutsideMonth?: boolean | undefined;\n  disablePast?: boolean | undefined;\n  disableFuture?: boolean | undefined;\n  /** Earliest selectable date (inclusive). */\n  minDate?: Date | undefined;\n  /** Latest selectable date (inclusive). */\n  maxDate?: Date | undefined;\n  /** Predicate to disable arbitrary days. */\n  isDateDisabled?: ((day: Date) => boolean) | undefined;\n  weekStartsOn?: WeekStart | undefined;\n  /** BCP-47 locale for calendar labels (day/month/year names). */\n  locale?: string | undefined;\n  /** Input format pattern with tokens dd, MM, yyyy, e.g. \"dd/MM/yyyy\". */\n  format?: string | undefined;\n  /** Enables date-range selection. */\n  range?: boolean | undefined;\n  /** Controlled range value `[start, end]`. */\n  rangeValue?: [Date | undefined, Date | undefined] | undefined;\n  /** Called when the range changes. */\n  onRangeChange?: ((range: [Date | undefined, Date | undefined]) => void) | undefined;\n  placement?: Placement | undefined;\n  disableCalendar?: boolean | undefined;\n  label?: string | undefined;\n  /** Accessible label for the calendar popup dialog. */\n  calendarAriaLabel?: string | undefined;\n  value?: Date | string | undefined;\n  calendarIcon?: JSX.Element;\n  onChange?: ((event?: Event, value?: Date, data?: DatePickerProps) => void) | undefined;\n  onBlur?: ((event?: FocusEvent, value?: Date, data?: DatePickerProps) => void) | undefined;\n  ref?: Ref<HTMLInputElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function DatePicker(props: DatePickerProps): 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    \"range\",\n    \"rangeValue\",\n    \"onRangeChange\",\n    \"calendarIcon\",\n    \"onBlur\",\n    \"ref\",\n  ]);\n\n  // The range field draws the calendar icon itself, unless the calendar is off:\n  // read it once, and only then (the single field hands it to its input).\n  const rangeIcon = children(() => (local.range && !local.disableCalendar ? local.calendarIcon : undefined));\n\n  const value = (): Date | undefined => (local.value === undefined ? undefined : new Date(local.value));\n  const isRangeControlled = (): boolean => local.rangeValue !== undefined;\n  const [rangeState, setRangeState] = createSignal<[Date | undefined, Date | undefined]>([undefined, undefined]);\n  const currentRange = (): [Date | undefined, Date | undefined] =>\n    isRangeControlled() && local.rangeValue ? local.rangeValue : rangeState();\n\n  const initialValue = value();\n  const [viewValue, setViewValue] = createSignal<Date>(isValidDate(initialValue) ? initialValue : new Date());\n  const [openView, setOpenView] = createSignal<OpenView>(OpenView.days);\n  const [isOpen, setIsOpen] = createSignal(false);\n\n  let anchorEl: HTMLElement | undefined;\n  let calendarEl: 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) ? v : new Date());\n  });\n\n  const weekStartsOn = (): WeekStart => local.weekStartsOn ?? 1;\n\n  const onViewValueChange = (v: Date): void => {\n    setViewValue(v);\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 onChange = (event?: Event, date?: Date): void => {\n    if (local.range) {\n      if (!date) return;\n      const [start, end] = currentRange();\n      let next: [Date | undefined, Date | undefined];\n      if (!start || (start && end)) {\n        next = [date, undefined];\n      } else {\n        next = isValidDate(start) && date.getTime() < start.getTime() ? [date, start] : [start, date];\n      }\n      if (!isRangeControlled()) setRangeState(next);\n      local.onRangeChange?.(next);\n      if (next[0] && next[1]) setIsOpen(false);\n      return;\n    }\n    local.onChange?.(event, date, props);\n    setIsOpen(false);\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 (calendarEl?.contains(target) || anchorEl?.contains(target)) return;\n    setIsOpen(false);\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  // Escape closes the panel while it is the topmost overlay layer, so the next one\n  // reaches a Modal or Sheet around the picker. Focus left in the panel (or on\n  // <body> after a click there) goes back to the input rather than being lost.\n  createEffect(() => {\n    if (!shouldOpen()) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      const panel = calendarEl;\n      if (event.key !== \"Escape\" || !panel || !isTopOverlayLayer(panel)) return;\n      setIsOpen(false);\n      const active = document.activeElement;\n      if (!active || active === document.body || panel.contains(active)) anchorEl?.focus();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\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={onChange}\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            range={local.range}\n            rangeStart={currentRange()[0]}\n            rangeEnd={currentRange()[1]}\n          />\n        );\n    }\n  };\n\n  const rangeDisplay = (): string =>\n    local.range && (currentRange()[0] || currentRange()[1])\n      ? `${getDisplayDate(currentRange()[0], local.format)} – ${getDisplayDate(currentRange()[1], local.format)}`\n      : \"\";\n\n  const anchorRef = mergeRefs(local.ref, floating.setReference, (el) => (anchorEl = el as HTMLElement));\n\n  return (\n    <>\n      <Show\n        when={local.range}\n        fallback={\n          <DataPickerInput\n            ref={anchorRef}\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        }\n      >\n        <TextField\n          ref={anchorRef}\n          value={rangeDisplay()}\n          readOnly\n          onChange={() => undefined}\n          disabled={Boolean(local.disabled)}\n          {...(local.format ? { placeholder: `${local.format} – ${local.format}` } : {})}\n          endAdornment={\n            <Show when={!local.disableCalendar}>\n              <DatePickerIconButton\n                edge=\"end\"\n                onClick={onToggle}\n                disabled={Boolean(local.disabled)}\n                data-testid=\"date-picker-icon-button\"\n              >\n                <Show when={rangeIcon()} fallback={<Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}>\n                  {rangeIcon()}\n                </Show>\n              </DatePickerIconButton>\n            </Show>\n          }\n          {...rest}\n        />\n      </Show>\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) => (calendarEl = el as HTMLElement))}\n              class=\"smwb-date-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-picker\"\n              data-smwb-overlay-layer\n              role=\"dialog\"\n              aria-modal=\"false\"\n              aria-label={local.calendarAriaLabel ?? \"Choose date\"}\n            >\n              <div class=\"smwb-date-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-picker__body\">{view()}</div>\n              </div>\n            </div>\n          </ClickAwayListener>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport default DatePicker;\n"],"mappings":"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","names":["OpenView"],"file":"datePicker.jsx"}

package/dist/headless/source/components/inputs/datePicker/datePickerActionLabel.jsx

@@ -16,6 +16,9 @@ function DatePickerActionLabel(props) {
   const switchClasses = () => cn("smwb-date-picker__switch", {
     "smwb-date-picker__switch--hidden": local.hiddenSwitches
   });
+  const onLabelClick = () => {
+    if (!local.disabled) local.onLabelClick?.();
+  };
   return <div class="smwb-date-picker__action">
       <div class={switchClasses()}>
         <DatePickerIconButton size="small" onClick={local.disabled ? void 0 : local.onLeftIconClick}>
@@ -28,7 +31,7 @@ function DatePickerActionLabel(props) {
       "smwb-date-picker__action-label--active": local.active
     })}
     data-testid={local.dataToggleId}
-    onClick={local.disabled ? void 0 : local.onLabelClick}
+    onClick={onLabelClick}
   >
         <span class="smwb-date-picker__action-text">{local.label}</span>
         <Icon name="arrow_drop_down" weight={500} size={20} />

package/dist/headless/source/components/inputs/datePicker/datePickerActionLabel.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/inputs/datePicker/datePickerActionLabel.tsx"],"sourcesContent":["import { type JSX, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { Icon } from \"../../base/icon\";\n\nexport interface ActionLabelProps {\n  label: string;\n  onLeftIconClick?: (() => void) | undefined;\n  onRightIconClick?: (() => void) | undefined;\n  onLabelClick?: (() => void) | undefined;\n  disabled?: boolean | undefined;\n  active?: boolean | undefined;\n  hiddenSwitches?: boolean | undefined;\n  dataToggleId?: string | undefined;\n}\n\nexport function DatePickerActionLabel(props: ActionLabelProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"label\",\n    \"onLeftIconClick\",\n    \"onRightIconClick\",\n    \"onLabelClick\",\n    \"disabled\",\n    \"active\",\n    \"hiddenSwitches\",\n    \"dataToggleId\",\n  ]);\n\n  const switchClasses = (): string =>\n    cn(\"smwb-date-picker__switch\", {\n      \"smwb-date-picker__switch--hidden\": local.hiddenSwitches,\n    });\n\n  return (\n    <div class=\"smwb-date-picker__action\">\n      <div class={switchClasses()}>\n        <DatePickerIconButton size=\"small\" onClick={local.disabled ? undefined : local.onLeftIconClick}>\n          <Icon name=\"keyboard_arrow_left\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n      <div\n        class={cn(\"smwb-date-picker__action-label\", {\n          \"smwb-date-picker__action-label--disabled\": local.disabled,\n          \"smwb-date-picker__action-label--active\": local.active,\n        })}\n        data-testid={local.dataToggleId}\n        onClick={local.disabled ? undefined : local.onLabelClick}\n      >\n        <span class=\"smwb-date-picker__action-text\">{local.label}</span>\n        <Icon name=\"arrow_drop_down\" weight={500} size={20} />\n      </div>\n      <div class={switchClasses()}>\n        <DatePickerIconButton size=\"small\" onClick={local.disabled ? undefined : local.onRightIconClick}>\n          <Icon name=\"keyboard_arrow_right\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n    </div>\n  );\n}\n\nexport default DatePickerActionLabel;\n"],"mappings":"AAAA,SAAmB,kBAAkB;AACrC,OAAO,QAAQ;AACf,SAAS,4BAA4B;AACrC,SAAS,YAAY;AAad,SAAS,sBAAsB,OAAsC;AAC1E,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MACpB,GAAG,4BAA4B;AAAA,IAC7B,oCAAoC,MAAM;AAAA,EAC5C,CAAC;AAEH,SACE,CAAC,IAAI,MAAM,2BAA2B;AAAA,MACpC,CAAC,IAAI,OAAO,cAAc,GAAG;AAAA,QAC3B,CAAC,qBAAqB,KAAK,QAAQ,SAAS,MAAM,WAAW,SAAY,MAAM,iBAAiB;AAAA,UAC9F,CAAC,KAAK,KAAK,sBAAsB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,QAC5D,EAFC,qBAEsB;AAAA,MACzB,EAJC,IAIK;AAAA,MACN,CAAC;AAAA,IACC,OAAO,GAAG,kCAAkC;AAAA,MAC1C,4CAA4C,MAAM;AAAA,MAClD,0CAA0C,MAAM;AAAA,IAClD,CAAC;AAAA,IACD,aAAa,MAAM;AAAA,IACnB,SAAS,MAAM,WAAW,SAAY,MAAM;AAAA,GAC7C;AAAA,QACC,CAAC,KAAK,MAAM,iCAAiC,MAAM,MAAM,EAAxD,KAA+D;AAAA,QAChE,CAAC,KAAK,KAAK,kBAAkB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,MACxD,EAVC,IAUK;AAAA,MACN,CAAC,IAAI,OAAO,cAAc,GAAG;AAAA,QAC3B,CAAC,qBAAqB,KAAK,QAAQ,SAAS,MAAM,WAAW,SAAY,MAAM,kBAAkB;AAAA,UAC/F,CAAC,KAAK,KAAK,uBAAuB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,QAC7D,EAFC,qBAEsB;AAAA,MACzB,EAJC,IAIK;AAAA,IACR,EAtBC;AAwBL;AAEA,IAAO,gCAAQ;","names":[],"file":"datePickerActionLabel.jsx"}
+{"version":3,"sources":["../../../../../../src/components/inputs/datePicker/datePickerActionLabel.tsx"],"sourcesContent":["import { type JSX, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { Icon } from \"../../base/icon\";\n\nexport interface ActionLabelProps {\n  label: string;\n  onLeftIconClick?: (() => void) | undefined;\n  onRightIconClick?: (() => void) | undefined;\n  onLabelClick?: (() => void) | undefined;\n  disabled?: boolean | undefined;\n  active?: boolean | undefined;\n  hiddenSwitches?: boolean | undefined;\n  dataToggleId?: string | undefined;\n}\n\nexport function DatePickerActionLabel(props: ActionLabelProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"label\",\n    \"onLeftIconClick\",\n    \"onRightIconClick\",\n    \"onLabelClick\",\n    \"disabled\",\n    \"active\",\n    \"hiddenSwitches\",\n    \"dataToggleId\",\n  ]);\n\n  const switchClasses = (): string =>\n    cn(\"smwb-date-picker__switch\", {\n      \"smwb-date-picker__switch--hidden\": local.hiddenSwitches,\n    });\n\n  // Solid binds event handlers once, so the label's handler is always attached\n  // and checks `disabled` itself: the header disables one label while the other\n  // one's view is open. (The icon buttons spread their props, which follow.)\n  const onLabelClick = (): void => {\n    if (!local.disabled) local.onLabelClick?.();\n  };\n\n  return (\n    <div class=\"smwb-date-picker__action\">\n      <div class={switchClasses()}>\n        <DatePickerIconButton size=\"small\" onClick={local.disabled ? undefined : local.onLeftIconClick}>\n          <Icon name=\"keyboard_arrow_left\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n      <div\n        class={cn(\"smwb-date-picker__action-label\", {\n          \"smwb-date-picker__action-label--disabled\": local.disabled,\n          \"smwb-date-picker__action-label--active\": local.active,\n        })}\n        data-testid={local.dataToggleId}\n        onClick={onLabelClick}\n      >\n        <span class=\"smwb-date-picker__action-text\">{local.label}</span>\n        <Icon name=\"arrow_drop_down\" weight={500} size={20} />\n      </div>\n      <div class={switchClasses()}>\n        <DatePickerIconButton size=\"small\" onClick={local.disabled ? undefined : local.onRightIconClick}>\n          <Icon name=\"keyboard_arrow_right\" weight={500} size={24} />\n        </DatePickerIconButton>\n      </div>\n    </div>\n  );\n}\n\nexport default DatePickerActionLabel;\n"],"mappings":"AAAA,SAAmB,kBAAkB;AACrC,OAAO,QAAQ;AACf,SAAS,4BAA4B;AACrC,SAAS,YAAY;AAad,SAAS,sBAAsB,OAAsC;AAC1E,QAAM,CAAC,KAAK,IAAI,WAAW,OAAO;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,MACpB,GAAG,4BAA4B;AAAA,IAC7B,oCAAoC,MAAM;AAAA,EAC5C,CAAC;AAKH,QAAM,eAAe,MAAY;AAC/B,QAAI,CAAC,MAAM,SAAU,OAAM,eAAe;AAAA,EAC5C;AAEA,SACE,CAAC,IAAI,MAAM,2BAA2B;AAAA,MACpC,CAAC,IAAI,OAAO,cAAc,GAAG;AAAA,QAC3B,CAAC,qBAAqB,KAAK,QAAQ,SAAS,MAAM,WAAW,SAAY,MAAM,iBAAiB;AAAA,UAC9F,CAAC,KAAK,KAAK,sBAAsB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,QAC5D,EAFC,qBAEsB;AAAA,MACzB,EAJC,IAIK;AAAA,MACN,CAAC;AAAA,IACC,OAAO,GAAG,kCAAkC;AAAA,MAC1C,4CAA4C,MAAM;AAAA,MAClD,0CAA0C,MAAM;AAAA,IAClD,CAAC;AAAA,IACD,aAAa,MAAM;AAAA,IACnB,SAAS;AAAA,GACV;AAAA,QACC,CAAC,KAAK,MAAM,iCAAiC,MAAM,MAAM,EAAxD,KAA+D;AAAA,QAChE,CAAC,KAAK,KAAK,kBAAkB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,MACxD,EAVC,IAUK;AAAA,MACN,CAAC,IAAI,OAAO,cAAc,GAAG;AAAA,QAC3B,CAAC,qBAAqB,KAAK,QAAQ,SAAS,MAAM,WAAW,SAAY,MAAM,kBAAkB;AAAA,UAC/F,CAAC,KAAK,KAAK,uBAAuB,QAAQ,KAAK,MAAM,IAAI,EAAE;AAAA,QAC7D,EAFC,qBAEsB;AAAA,MACzB,EAJC,IAIK;AAAA,IACR,EAtBC;AAwBL;AAEA,IAAO,gCAAQ;","names":[],"file":"datePickerActionLabel.jsx"}