@planningcenter/tapestry 3.8.0-qa-1049.1 → 3.8.0

package/dist/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport Icon from \"@utilities/Icon\"\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type SelectHTMLAttributes, useRef } from \"react\"\n\nimport { SelectNative } from \"./SelectNative\"\nimport { SelectPopover } from \"./SelectPopover\"\n\n// ---------------------------------------------------------------------------\n// Shared types\n// ---------------------------------------------------------------------------\n\nexport type SelectSize = \"lg\" | \"md\"\n\n/**\n * String-labelled option variant. Valid in both native (`complex={false}`)\n * and complex (`complex={true}`) modes. The `label` doubles as the type-ahead\n * search target.\n */\nexport interface SelectOptionWithTextLabel {\n  /** Arbitrary `data-*` attributes are forwarded to the rendered option. */\n  [key: `data-${string}`]: boolean | number | string | undefined\n  /** Whether this option is non-interactive. */\n  disabled?: boolean\n  divider?: never\n  /** Displayed as the option content and used for type-ahead matching. */\n  label: string\n  textValue?: never\n  /** Unique identifier for the option. */\n  value: string\n}\n\n/**\n * Rich-content option variant. The popover (`complex={true}`) renders the\n * `label` node directly; the native `<select>` (`complex={false}`) falls back\n * to `textValue` for the visible text. Requires a plain-text `textValue` so\n * type-ahead matching, screen reader announcements, and the native fallback\n * all have something stable to use.\n */\nexport interface SelectOptionWithNodeLabel {\n  /** Arbitrary `data-*` attributes are forwarded to the rendered option. */\n  [key: `data-${string}`]: boolean | number | string | undefined\n  /** Whether this option is non-interactive. */\n  disabled?: boolean\n  divider?: never\n  /**\n   * Option content. Rendered as JSX in complex mode; in native mode, the\n   * visible text comes from `textValue` instead.\n   */\n  label: React.ReactNode\n  /**\n   * Plain-text fallback for type-ahead matching, screen reader\n   * announcements, and the native `<select>`'s visible option text when\n   * `label` is a React node.\n   */\n  textValue: string\n  /** Unique identifier for the option. */\n  value: string\n}\n\n/**\n * Visual-separator option variant. Renders a divider line between options\n * (or between groups of options). Carries no value of its own.\n */\nexport interface SelectOptionDivider {\n  disabled?: never\n  /** Renders a visual separator between options. */\n  divider: true\n  label?: never\n  textValue?: never\n  value?: never\n}\n\nexport type SelectOption =\n  | SelectOptionDivider\n  | SelectOptionWithNodeLabel\n  | SelectOptionWithTextLabel\n\n/**\n * A group entry in `Select`'s `options` array. Renders a heading above its\n * `options` and nests them visually beneath it.\n */\nexport interface SelectOptionsGroup {\n  /**\n   * Whether all options in this group are non-interactive. Disables every\n   * nested option regardless of its own `disabled` flag.\n   */\n  disabled?: boolean\n  /** Visible heading displayed above the group's options. */\n  label: string\n  /** The selectable options nested under this group. */\n  options: SelectOption[]\n}\n\nexport type SelectItem = SelectOption | SelectOptionsGroup\n\n// ---------------------------------------------------------------------------\n// Select component props\n// ---------------------------------------------------------------------------\n\ninterface SelectBaseProps {\n  /**\n   * When true, renders as a popover listbox instead of a native `<select>`.\n   * Enables rich content in options (icons, descriptions).\n   */\n  complex?: boolean\n  /**\n   * Helper text displayed below the select. Styled as error text when\n   * `invalid`. Defaults to `\"Please select an option\"` when `invalid` is true\n   * and no description is provided.\n   */\n  description?: string\n  /**\n   * Whether the select is in an invalid state. Shows the default description\n   * if none is provided.\n   */\n  invalid?: boolean\n  /** A flat or mixed array of options and option groups. */\n  options: SelectItem[]\n  /** Placeholder text shown when no option is selected. Defaults to `\"Select an option\"`. */\n  placeholder?: string\n  /** The size of the select. */\n  size?: SelectSize\n}\n\ninterface SelectWithVisibleLabel extends SelectBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel?: false\n  /**\n   * The label text for the select. Required unless `aria-label` or\n   * `aria-labelledby` is provided.\n   */\n  label: string\n}\n\ninterface SelectWithHiddenLabel extends SelectBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel: true\n  /** The label text for the select. Must be a string when hidden. */\n  label: string\n}\n\ninterface SelectWithAriaLabel extends SelectBaseProps {\n  /** Accessible label for the select. Use when no visible label exists. */\n  \"aria-label\": string\n  hideLabel?: never\n  label?: never\n}\n\ninterface SelectWithAriaLabelledBy extends SelectBaseProps {\n  /**\n   * ID of an external label element. Use instead of `label` when a visible\n   * label exists elsewhere on the page.\n   */\n  \"aria-labelledby\": string\n  hideLabel?: never\n  label?: never\n}\n\nexport type SelectProps =\n  | SelectWithAriaLabel\n  | SelectWithAriaLabelledBy\n  | SelectWithHiddenLabel\n  | SelectWithVisibleLabel\n\ntype BaseSelectElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectProps | \"multiple\" | \"size\"\n>\n\nexport type NativeSelectElementProps = BaseSelectElementProps &\n  SelectProps & {\n    complex?: false\n  }\n\nexport type ComplexSelectElementProps = BaseSelectElementProps &\n  SelectProps & {\n    complex: true\n  }\n\nexport type SelectElementProps =\n  | NativeSelectElementProps\n  | ComplexSelectElementProps\n\nfunction normalizeSelectValue(\n  value:\n    | NativeSelectElementProps[\"defaultValue\"]\n    | NativeSelectElementProps[\"value\"]\n    | ComplexSelectElementProps[\"defaultValue\"]\n    | ComplexSelectElementProps[\"value\"]\n) {\n  if (value === undefined || value === null) return undefined\n  if (Array.isArray(value)) return value[0]\n  return String(value)\n}\n\n// ---------------------------------------------------------------------------\n// Select (public)\n// ---------------------------------------------------------------------------\n\n/**\n * A select component for choosing a single value from a list of options.\n * By default renders a native `<select>`; set `complex` to render a popover\n * listbox that supports rich option content (icons, descriptions). Supports\n * option groups, dividers, invalid state, and `lg`/`md` sizing.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-select--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const Select = forwardRef<HTMLSelectElement, SelectElementProps>(\n  function Select(props: SelectElementProps, ref) {\n    const {\n      \"aria-label\": userAriaLabel,\n      \"aria-labelledby\": userAriaLabelledBy,\n      className,\n      complex,\n      defaultValue,\n      description,\n      hideLabel,\n      id,\n      invalid,\n      label,\n      onChange,\n      options,\n      placeholder,\n      required,\n      size,\n      value,\n      ...restProps\n    } = props\n\n    const triggerRef = useRef<HTMLButtonElement>(null)\n    const stableId = useId()\n    const controlId = id || `tds-select-${stableId}`\n    const labelId = `${controlId}-label`\n    const resolvedDescription =\n      description || (invalid ? \"Please select an option\" : undefined)\n    const descriptionId = resolvedDescription\n      ? `${controlId}-description`\n      : undefined\n    const computedClassName = classNames(\n      \"tds-select\",\n      {\n        \"tds-select--invalid\": invalid,\n        \"tds-select--lg\": size === \"lg\",\n        \"tds-select--required\": required,\n      },\n      className\n    )\n\n    const normalizedDefaultValue = normalizeSelectValue(defaultValue)\n    const normalizedValue = normalizeSelectValue(value)\n\n    const computedDefaultValue =\n      normalizedDefaultValue === undefined && normalizedValue === undefined\n        ? \"\"\n        : normalizedDefaultValue\n    const effectivePlaceholder =\n      normalizedDefaultValue !== undefined && normalizedDefaultValue !== \"\"\n        ? null\n        : placeholder || \"Select an option\"\n    const showLabel = !!label && !hideLabel\n    const computedAriaLabel = userAriaLabel ?? (hideLabel ? label : undefined)\n    const computedAriaLabelledBy =\n      userAriaLabelledBy ??\n      (computedAriaLabel || !showLabel ? undefined : labelId)\n\n    const sharedControlProps = {\n      ...restProps,\n      \"aria-describedby\": descriptionId,\n      \"aria-label\": computedAriaLabel,\n      \"aria-labelledby\": computedAriaLabelledBy,\n      defaultValue: computedDefaultValue,\n      invalid,\n      options,\n      placeholder: effectivePlaceholder,\n      required,\n      value: normalizedValue,\n    }\n\n    const handleComplexLabelClick = () => triggerRef.current?.focus()\n\n    const SelectComponent = complex ? SelectPopover : SelectNative\n\n    return (\n      <div className={computedClassName}>\n        {showLabel &&\n          (complex ? (\n            // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions -- mirrors native label click-to-focus; keyboard users interact with the combobox directly\n            <div\n              className=\"tds-select-label\"\n              id={labelId}\n              onClick={handleComplexLabelClick}\n            >\n              {label}\n            </div>\n          ) : (\n            <label htmlFor={controlId} id={labelId}>\n              {label}\n            </label>\n          ))}\n        <SelectComponent\n          {...sharedControlProps}\n          ref={ref}\n          id={controlId}\n          onChange={onChange}\n          {...(complex && { triggerRef })}\n        />\n        {resolvedDescription && descriptionId && (\n          <p className=\"tds-select-description\" id={descriptionId}>\n            <Icon\n              aria-hidden\n              className=\"tds-select-description-invalid-icon\"\n              symbol=\"general#exclamation-triangle\"\n            />\n            {resolvedDescription}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\n\nSelect.displayName = \"Select\"\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport Icon from \"@utilities/Icon\"\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type SelectHTMLAttributes, useRef } from \"react\"\n\nimport { SelectNative } from \"./SelectNative\"\nimport { SelectPopover } from \"./SelectPopover\"\n\n// ---------------------------------------------------------------------------\n// Shared types\n// ---------------------------------------------------------------------------\n\nexport type SelectSize = \"lg\" | \"md\"\n\n/**\n * String-labelled option variant. Valid in both native (`complex={false}`)\n * and complex (`complex={true}`) modes. The `label` doubles as the type-ahead\n * search target.\n */\nexport interface SelectOptionWithTextLabel {\n  /** Arbitrary `data-*` attributes are forwarded to the rendered option. */\n  [key: `data-${string}`]: boolean | number | string | undefined\n  /** Whether this option is non-interactive. */\n  disabled?: boolean\n  divider?: never\n  /** Displayed as the option content and used for type-ahead matching. */\n  label: string\n  textValue?: never\n  /** Unique identifier for the option. */\n  value: string\n}\n\n/**\n * Rich-content option variant. The popover (`complex={true}`) renders the\n * `label` node directly; the native `<select>` (`complex={false}`) falls back\n * to `textValue` for the visible text. Requires a plain-text `textValue` so\n * type-ahead matching, screen reader announcements, and the native fallback\n * all have something stable to use.\n */\nexport interface SelectOptionWithNodeLabel {\n  /** Arbitrary `data-*` attributes are forwarded to the rendered option. */\n  [key: `data-${string}`]: boolean | number | string | undefined\n  /** Whether this option is non-interactive. */\n  disabled?: boolean\n  divider?: never\n  /**\n   * Option content. Rendered as JSX in complex mode; in native mode, the\n   * visible text comes from `textValue` instead.\n   */\n  label: React.ReactNode\n  /**\n   * Plain-text fallback for type-ahead matching, screen reader\n   * announcements, and the native `<select>`'s visible option text when\n   * `label` is a React node.\n   */\n  textValue: string\n  /** Unique identifier for the option. */\n  value: string\n}\n\n/**\n * Visual-separator option variant. Renders a divider line between options\n * (or between groups of options). Carries no value of its own.\n */\nexport interface SelectOptionDivider {\n  disabled?: never\n  /** Renders a visual separator between options. */\n  divider: true\n  label?: never\n  textValue?: never\n  value?: never\n}\n\nexport type SelectOption =\n  | SelectOptionDivider\n  | SelectOptionWithNodeLabel\n  | SelectOptionWithTextLabel\n\n/**\n * A group entry in `Select`'s `options` array. Renders a heading above its\n * `options` and nests them visually beneath it.\n */\nexport interface SelectOptionsGroup {\n  /**\n   * Whether all options in this group are non-interactive. Disables every\n   * nested option regardless of its own `disabled` flag.\n   */\n  disabled?: boolean\n  /** Visible heading displayed above the group's options. */\n  label: string\n  /** The selectable options nested under this group. */\n  options: SelectOption[]\n}\n\nexport type SelectItem = SelectOption | SelectOptionsGroup\n\n// ---------------------------------------------------------------------------\n// Select component props\n// ---------------------------------------------------------------------------\n\ninterface SelectBaseProps {\n  /**\n   * When true, renders as a popover listbox instead of a native `<select>`.\n   * Enables rich content in options (icons, descriptions).\n   */\n  complex?: boolean\n  /**\n   * Helper text displayed below the select. Styled as error text when\n   * `invalid`. Defaults to `\"Please select an option\"` when `invalid` is true\n   * and no description is provided.\n   */\n  description?: React.ReactNode\n  /**\n   * Whether the select is in an invalid state. Shows the default description\n   * if none is provided.\n   */\n  invalid?: boolean\n  /** A flat or mixed array of options and option groups. */\n  options: SelectItem[]\n  /** Placeholder text shown when no option is selected. Defaults to `\"Select an option\"`. */\n  placeholder?: string\n  /** The size of the select. */\n  size?: SelectSize\n}\n\ninterface SelectWithVisibleLabel extends SelectBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel?: false\n  /**\n   * The label text for the select. Required unless `aria-label` or\n   * `aria-labelledby` is provided.\n   */\n  label: string\n}\n\ninterface SelectWithHiddenLabel extends SelectBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel: true\n  /** The label text for the select. Must be a string when hidden. */\n  label: string\n}\n\ninterface SelectWithAriaLabel extends SelectBaseProps {\n  /** Accessible label for the select. Use when no visible label exists. */\n  \"aria-label\": string\n  hideLabel?: never\n  label?: never\n}\n\ninterface SelectWithAriaLabelledBy extends SelectBaseProps {\n  /**\n   * ID of an external label element. Use instead of `label` when a visible\n   * label exists elsewhere on the page.\n   */\n  \"aria-labelledby\": string\n  hideLabel?: never\n  label?: never\n}\n\nexport type SelectProps =\n  | SelectWithAriaLabel\n  | SelectWithAriaLabelledBy\n  | SelectWithHiddenLabel\n  | SelectWithVisibleLabel\n\ntype BaseSelectElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectProps | \"multiple\" | \"size\"\n>\n\nexport type NativeSelectElementProps = BaseSelectElementProps &\n  SelectProps & {\n    complex?: false\n  }\n\nexport type ComplexSelectElementProps = BaseSelectElementProps &\n  SelectProps & {\n    complex: true\n  }\n\nexport type SelectElementProps =\n  | NativeSelectElementProps\n  | ComplexSelectElementProps\n\nfunction normalizeSelectValue(\n  value:\n    | NativeSelectElementProps[\"defaultValue\"]\n    | NativeSelectElementProps[\"value\"]\n    | ComplexSelectElementProps[\"defaultValue\"]\n    | ComplexSelectElementProps[\"value\"]\n) {\n  if (value === undefined || value === null) return undefined\n  if (Array.isArray(value)) return value[0]\n  return String(value)\n}\n\n// ---------------------------------------------------------------------------\n// Select (public)\n// ---------------------------------------------------------------------------\n\n/**\n * A select component for choosing a single value from a list of options.\n * By default renders a native `<select>`; set `complex` to render a popover\n * listbox that supports rich option content (icons, descriptions). Supports\n * option groups, dividers, invalid state, and `lg`/`md` sizing.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-select--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const Select = forwardRef<HTMLSelectElement, SelectElementProps>(\n  function Select(props: SelectElementProps, ref) {\n    const {\n      \"aria-label\": userAriaLabel,\n      \"aria-labelledby\": userAriaLabelledBy,\n      className,\n      complex,\n      defaultValue,\n      description,\n      hideLabel,\n      id,\n      invalid,\n      label,\n      onChange,\n      options,\n      placeholder,\n      required,\n      size,\n      value,\n      ...restProps\n    } = props\n\n    const triggerRef = useRef<HTMLButtonElement>(null)\n    const stableId = useId()\n    const controlId = id || `tds-select-${stableId}`\n    const labelId = `${controlId}-label`\n    const resolvedDescription =\n      description || (invalid ? \"Please select an option\" : undefined)\n    const descriptionId = resolvedDescription\n      ? `${controlId}-description`\n      : undefined\n    const computedClassName = classNames(\n      \"tds-select\",\n      {\n        \"tds-select--invalid\": invalid,\n        \"tds-select--lg\": size === \"lg\",\n        \"tds-select--required\": required,\n      },\n      className\n    )\n\n    const normalizedDefaultValue = normalizeSelectValue(defaultValue)\n    const normalizedValue = normalizeSelectValue(value)\n\n    const computedDefaultValue =\n      normalizedDefaultValue === undefined && normalizedValue === undefined\n        ? \"\"\n        : normalizedDefaultValue\n    const effectivePlaceholder =\n      normalizedDefaultValue !== undefined && normalizedDefaultValue !== \"\"\n        ? null\n        : placeholder || \"Select an option\"\n    const showLabel = !!label && !hideLabel\n    const computedAriaLabel = userAriaLabel ?? (hideLabel ? label : undefined)\n    const computedAriaLabelledBy =\n      userAriaLabelledBy ??\n      (computedAriaLabel || !showLabel ? undefined : labelId)\n\n    const sharedControlProps = {\n      ...restProps,\n      \"aria-describedby\": descriptionId,\n      \"aria-label\": computedAriaLabel,\n      \"aria-labelledby\": computedAriaLabelledBy,\n      defaultValue: computedDefaultValue,\n      invalid,\n      options,\n      placeholder: effectivePlaceholder,\n      required,\n      value: normalizedValue,\n    }\n\n    const handleComplexLabelClick = () => triggerRef.current?.focus()\n\n    const SelectComponent = complex ? SelectPopover : SelectNative\n\n    return (\n      <div className={computedClassName}>\n        {showLabel &&\n          (complex ? (\n            // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions -- mirrors native label click-to-focus; keyboard users interact with the combobox directly\n            <div\n              className=\"tds-select-label\"\n              id={labelId}\n              onClick={handleComplexLabelClick}\n            >\n              {label}\n            </div>\n          ) : (\n            <label htmlFor={controlId} id={labelId}>\n              {label}\n            </label>\n          ))}\n        <SelectComponent\n          {...sharedControlProps}\n          ref={ref}\n          id={controlId}\n          onChange={onChange}\n          {...(complex && { triggerRef })}\n        />\n        {resolvedDescription && descriptionId && (\n          <p className=\"tds-select-description\" id={descriptionId}>\n            <Icon\n              aria-hidden\n              className=\"tds-select-description-invalid-icon\"\n              symbol=\"general#exclamation-triangle\"\n            />\n            {resolvedDescription}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\n\nSelect.displayName = \"Select\"\n"],"names":[],"mappings":"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"}

package/dist/components/select/SelectNative.js

@@ -1,4 +1,4 @@
-import React__default, { forwardRef, useState, useEffect } from 'react';
+import React, { forwardRef, useState, useEffect } from 'react';
 import { SelectOptions } from './SelectOptions.js';
 
 // ---------------------------------------------------------------------------
@@ -32,11 +32,11 @@ const SelectNative = forwardRef(function SelectNative({ invalid, options, placeh
             setIsCustom(true);
         }
     }, []);
-    return (React__default.createElement("select", { ...restProps, "aria-invalid": invalid ? "true" : undefined, ref: ref },
-        isCustom && (React__default.createElement("button", null,
-            React__default.createElement("selectedcontent", null))),
-        placeholder && (React__default.createElement("option", { key: `__placeholder__${placeholder}`, disabled: true, hidden: true, value: "" }, placeholder)),
-        React__default.createElement(SelectOptions, { items: options, supportsBaseSelect: isCustom })));
+    return (React.createElement("select", { ...restProps, "aria-invalid": invalid ? "true" : undefined, ref: ref },
+        isCustom && (React.createElement("button", null,
+            React.createElement("selectedcontent", null))),
+        placeholder && (React.createElement("option", { key: `__placeholder__${placeholder}`, disabled: true, hidden: true, value: "" }, placeholder)),
+        React.createElement(SelectOptions, { items: options, supportsBaseSelect: isCustom })));
 });
 SelectNative.displayName = "SelectNative";
 

package/dist/components/select/SelectNative.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectNative.js","sources":["../../../src/components/select/SelectNative.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  type SelectHTMLAttributes,\n  useEffect,\n  useState,\n} from \"react\"\n\nimport type { SelectItem } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\n// ---------------------------------------------------------------------------\n// base-select feature detection (cached)\n// ---------------------------------------------------------------------------\n\nlet _supportsBaseSelect: boolean | null = null\n\nfunction supportsBaseSelect(): boolean {\n  if (_supportsBaseSelect === null) {\n    _supportsBaseSelect =\n      typeof CSS !== \"undefined\" &&\n      typeof CSS.supports === \"function\" &&\n      CSS.supports(\"appearance\", \"base-select\")\n  }\n  return _supportsBaseSelect\n}\n\n// ---------------------------------------------------------------------------\n// JSX augmentation for <selectedcontent>\n// ---------------------------------------------------------------------------\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      selectedcontent: React.DetailedHTMLProps<\n        React.HTMLAttributes<HTMLElement>,\n        HTMLElement\n      >\n    }\n  }\n}\n\n// ---------------------------------------------------------------------------\n// SelectNative\n// ---------------------------------------------------------------------------\n\nexport interface SelectNativeProps {\n  /** Triggers invalid state (maps to aria-invalid). */\n  invalid?: boolean\n  /** Options to render inside the select. */\n  options: SelectItem[]\n  /** Placeholder text rendered as a disabled hidden option. `null` suppresses the option. */\n  placeholder: string | null\n}\n\nexport type SelectNativeElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectNativeProps | \"multiple\"\n> &\n  SelectNativeProps\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The native `<select>` implementation used by `Select` when `complex` is\n * not set. Renders a real `<select>` element so the browser handles\n * keyboard, type-ahead, and mobile UI natively. When the browser supports\n * `appearance: base-select`, it upgrades to a customizable trigger.\n *\n * @internal\n */\nexport const SelectNative = forwardRef<\n  HTMLSelectElement,\n  SelectNativeElementProps\n>(function SelectNative(\n  { invalid, options, placeholder, ...restProps }: SelectNativeElementProps,\n  ref\n) {\n  // Keep first render deterministic for SSR/hydration, then detect support on mount.\n  const [isCustom, setIsCustom] = useState(false)\n\n  useEffect(() => {\n    if (supportsBaseSelect()) {\n      setIsCustom(true)\n    }\n  }, [])\n\n  return (\n    <select\n      {...restProps}\n      aria-invalid={invalid ? \"true\" : undefined}\n      ref={ref}\n    >\n      {isCustom && (\n        <button>\n          <selectedcontent />\n        </button>\n      )}\n      {placeholder && (\n        <option key={`__placeholder__${placeholder}`} disabled hidden value=\"\">\n          {placeholder}\n        </option>\n      )}\n      <SelectOptions items={options} supportsBaseSelect={isCustom} />\n    </select>\n  )\n})\n\nSelectNative.displayName = \"SelectNative\"\n"],"names":["React"],"mappings":";;;AAUA;AACA;AACA;AAEA,IAAI,mBAAmB,GAAmB,IAAI;AAE9C,SAAS,kBAAkB,GAAA;AACzB,IAAA,IAAI,mBAAmB,KAAK,IAAI,EAAE;QAChC,mBAAmB;YACjB,OAAO,GAAG,KAAK,WAAW;AAC1B,gBAAA,OAAO,GAAG,CAAC,QAAQ,KAAK,UAAU;AAClC,gBAAA,GAAG,CAAC,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC;IAC7C;AACA,IAAA,OAAO,mBAAmB;AAC5B;AAqCA;;;;;;;;;AASG;MACU,YAAY,GAAG,UAAU,CAGpC,SAAS,YAAY,CACrB,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAA4B,EACzE,GAAG,EAAA;;IAGH,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAE/C,SAAS,CAAC,MAAK;QACb,IAAI,kBAAkB,EAAE,EAAE;YACxB,WAAW,CAAC,IAAI,CAAC;QACnB;IACF,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GACM,SAAS,EAAA,cAAA,EACC,OAAO,GAAG,MAAM,GAAG,SAAS,EAC1C,GAAG,EAAE,GAAG,EAAA;AAEP,QAAA,QAAQ,KACPA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA;AACE,YAAAA,cAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,IAAA,CAAmB,CACZ,CACV;AACA,QAAA,WAAW,KACVA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,GAAG,EAAE,CAAA,eAAA,EAAkB,WAAW,CAAA,CAAE,EAAE,QAAQ,EAAA,IAAA,EAAC,MAAM,QAAC,KAAK,EAAC,EAAE,EAAA,EACnE,WAAW,CACL,CACV;AACD,QAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAA,CAAI,CACxD;AAEb,CAAC;AAED,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}
+{"version":3,"file":"SelectNative.js","sources":["../../../src/components/select/SelectNative.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  type SelectHTMLAttributes,\n  useEffect,\n  useState,\n} from \"react\"\n\nimport type { SelectItem } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\n// ---------------------------------------------------------------------------\n// base-select feature detection (cached)\n// ---------------------------------------------------------------------------\n\nlet _supportsBaseSelect: boolean | null = null\n\nfunction supportsBaseSelect(): boolean {\n  if (_supportsBaseSelect === null) {\n    _supportsBaseSelect =\n      typeof CSS !== \"undefined\" &&\n      typeof CSS.supports === \"function\" &&\n      CSS.supports(\"appearance\", \"base-select\")\n  }\n  return _supportsBaseSelect\n}\n\n// ---------------------------------------------------------------------------\n// JSX augmentation for <selectedcontent>\n// ---------------------------------------------------------------------------\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      selectedcontent: React.DetailedHTMLProps<\n        React.HTMLAttributes<HTMLElement>,\n        HTMLElement\n      >\n    }\n  }\n}\n\n// ---------------------------------------------------------------------------\n// SelectNative\n// ---------------------------------------------------------------------------\n\nexport interface SelectNativeProps {\n  /** Triggers invalid state (maps to aria-invalid). */\n  invalid?: boolean\n  /** Options to render inside the select. */\n  options: SelectItem[]\n  /** Placeholder text rendered as a disabled hidden option. `null` suppresses the option. */\n  placeholder: string | null\n}\n\nexport type SelectNativeElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectNativeProps | \"multiple\"\n> &\n  SelectNativeProps\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The native `<select>` implementation used by `Select` when `complex` is\n * not set. Renders a real `<select>` element so the browser handles\n * keyboard, type-ahead, and mobile UI natively. When the browser supports\n * `appearance: base-select`, it upgrades to a customizable trigger.\n *\n * @internal\n */\nexport const SelectNative = forwardRef<\n  HTMLSelectElement,\n  SelectNativeElementProps\n>(function SelectNative(\n  { invalid, options, placeholder, ...restProps }: SelectNativeElementProps,\n  ref\n) {\n  // Keep first render deterministic for SSR/hydration, then detect support on mount.\n  const [isCustom, setIsCustom] = useState(false)\n\n  useEffect(() => {\n    if (supportsBaseSelect()) {\n      setIsCustom(true)\n    }\n  }, [])\n\n  return (\n    <select\n      {...restProps}\n      aria-invalid={invalid ? \"true\" : undefined}\n      ref={ref}\n    >\n      {isCustom && (\n        <button>\n          <selectedcontent />\n        </button>\n      )}\n      {placeholder && (\n        <option key={`__placeholder__${placeholder}`} disabled hidden value=\"\">\n          {placeholder}\n        </option>\n      )}\n      <SelectOptions items={options} supportsBaseSelect={isCustom} />\n    </select>\n  )\n})\n\nSelectNative.displayName = \"SelectNative\"\n"],"names":[],"mappings":";;;AAUA;AACA;AACA;AAEA,IAAI,mBAAmB,GAAmB,IAAI;AAE9C,SAAS,kBAAkB,GAAA;AACzB,IAAA,IAAI,mBAAmB,KAAK,IAAI,EAAE;QAChC,mBAAmB;YACjB,OAAO,GAAG,KAAK,WAAW;AAC1B,gBAAA,OAAO,GAAG,CAAC,QAAQ,KAAK,UAAU;AAClC,gBAAA,GAAG,CAAC,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC;IAC7C;AACA,IAAA,OAAO,mBAAmB;AAC5B;AAqCA;;;;;;;;;AASG;MACU,YAAY,GAAG,UAAU,CAGpC,SAAS,YAAY,CACrB,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,SAAS,EAA4B,EACzE,GAAG,EAAA;;IAGH,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAE/C,SAAS,CAAC,MAAK;QACb,IAAI,kBAAkB,EAAE,EAAE;YACxB,WAAW,CAAC,IAAI,CAAC;QACnB;IACF,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GACM,SAAS,EAAA,cAAA,EACC,OAAO,GAAG,MAAM,GAAG,SAAS,EAC1C,GAAG,EAAE,GAAG,EAAA;AAEP,QAAA,QAAQ,KACP,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA;AACE,YAAA,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,IAAA,CAAmB,CACZ,CACV;AACA,QAAA,WAAW,KACV,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,GAAG,EAAE,CAAA,eAAA,EAAkB,WAAW,CAAA,CAAE,EAAE,QAAQ,EAAA,IAAA,EAAC,MAAM,QAAC,KAAK,EAAC,EAAE,EAAA,EACnE,WAAW,CACL,CACV;AACD,QAAA,KAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAAA,CAAI,CACxD;AAEb,CAAC;AAED,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}

package/dist/components/select/SelectOptions.js

@@ -1,5 +1,5 @@
 import { getDataAttributes } from '../../utilities/selectUtils.js';
-import React__default from 'react';
+import React from 'react';
 
 function isGroup(item) {
     return "options" in item;
@@ -10,25 +10,25 @@ function getOptionLabel(option) {
     return option.textValue ?? option.value ?? "";
 }
 function Option({ option }) {
-    return (React__default.createElement("option", { ...getDataAttributes(option), disabled: option.disabled, value: option.value }, getOptionLabel(option)));
+    return (React.createElement("option", { ...getDataAttributes(option), disabled: option.disabled, value: option.value }, getOptionLabel(option)));
 }
 function SelectOptions({ items, supportsBaseSelect = false, }) {
     return items.map((item, index) => {
         if (isGroup(item)) {
-            return (React__default.createElement("optgroup", { key: `${item.label}-${index}`, disabled: item.disabled, label: item.label },
-                supportsBaseSelect && (React__default.createElement("legend", null,
-                    React__default.createElement("span", null, item.label))),
+            return (React.createElement("optgroup", { key: `${item.label}-${index}`, disabled: item.disabled, label: item.label },
+                supportsBaseSelect && (React.createElement("legend", null,
+                    React.createElement("span", null, item.label))),
                 item.options.map((opt, optIndex) => {
                     if (opt.divider) {
-                        return React__default.createElement("hr", { key: `divider-${optIndex}` });
+                        return React.createElement("hr", { key: `divider-${optIndex}` });
                     }
-                    return React__default.createElement(Option, { key: opt.value ?? `opt-${optIndex}`, option: opt });
+                    return React.createElement(Option, { key: opt.value ?? `opt-${optIndex}`, option: opt });
                 })));
         }
         if (item.divider) {
-            return React__default.createElement("hr", { key: `divider-${index}` });
+            return React.createElement("hr", { key: `divider-${index}` });
         }
-        return React__default.createElement(Option, { key: item.value ?? `opt-${index}`, option: item });
+        return React.createElement(Option, { key: item.value ?? `opt-${index}`, option: item });
     });
 }
 

package/dist/components/select/SelectOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectOptions.js","sources":["../../../src/components/select/SelectOptions.tsx"],"sourcesContent":["import { getDataAttributes } from \"@utilities/selectUtils\"\nimport React from \"react\"\n\nimport type {\n  SelectItem,\n  SelectOptionsGroup,\n  SelectOptionWithNodeLabel,\n  SelectOptionWithTextLabel,\n} from \"./Select\"\n\ninterface OptionProps {\n  option: SelectOptionWithNodeLabel | SelectOptionWithTextLabel\n}\n\ninterface SelectOptionsProps {\n  items: SelectItem[]\n  supportsBaseSelect?: boolean\n}\n\nfunction isGroup(item: SelectItem): item is SelectOptionsGroup {\n  return \"options\" in item\n}\n\nfunction getOptionLabel(option: {\n  label: React.ReactNode\n  textValue?: string\n  value?: string\n}): string {\n  if (typeof option.label === \"string\") return option.label\n  return option.textValue ?? option.value ?? \"\"\n}\n\nfunction Option({ option }: OptionProps) {\n  return (\n    <option\n      {...getDataAttributes(option)}\n      disabled={option.disabled}\n      value={option.value}\n    >\n      {getOptionLabel(option)}\n    </option>\n  )\n}\n\nexport function SelectOptions({\n  items,\n  supportsBaseSelect = false,\n}: SelectOptionsProps): React.ReactNode {\n  return items.map((item, index) => {\n    if (isGroup(item)) {\n      return (\n        <optgroup\n          key={`${item.label}-${index}`}\n          disabled={item.disabled}\n          label={item.label}\n        >\n          {supportsBaseSelect && (\n            <legend>\n              <span>{item.label}</span>\n            </legend>\n          )}\n          {item.options.map((opt, optIndex) => {\n            if (opt.divider) {\n              return <hr key={`divider-${optIndex}`} />\n            }\n            return <Option key={opt.value ?? `opt-${optIndex}`} option={opt} />\n          })}\n        </optgroup>\n      )\n    }\n\n    if (item.divider) {\n      return <hr key={`divider-${index}`} />\n    }\n\n    return <Option key={item.value ?? `opt-${index}`} option={item} />\n  })\n}\n"],"names":["React"],"mappings":";;;AAmBA,SAAS,OAAO,CAAC,IAAgB,EAAA;IAC/B,OAAO,SAAS,IAAI,IAAI;AAC1B;AAEA,SAAS,cAAc,CAAC,MAIvB,EAAA;AACC,IAAA,IAAI,OAAO,MAAM,CAAC,KAAK,KAAK,QAAQ;QAAE,OAAO,MAAM,CAAC,KAAK;IACzD,OAAO,MAAM,CAAC,SAAS,IAAI,MAAM,CAAC,KAAK,IAAI,EAAE;AAC/C;AAEA,SAAS,MAAM,CAAC,EAAE,MAAM,EAAe,EAAA;IACrC,QACEA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GACM,iBAAiB,CAAC,MAAM,CAAC,EAC7B,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,EAAA,EAElB,cAAc,CAAC,MAAM,CAAC,CAChB;AAEb;AAEM,SAAU,aAAa,CAAC,EAC5B,KAAK,EACL,kBAAkB,GAAG,KAAK,GACP,EAAA;IACnB,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC/B,QAAA,IAAI,OAAO,CAAC,IAAI,CAAC,EAAE;YACjB,QACEA,2CACE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA;AAEhB,gBAAA,kBAAkB,KACjBA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA;AACE,oBAAAA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAAO,IAAI,CAAC,KAAK,CAAQ,CAClB,CACV;gBACA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,KAAI;AAClC,oBAAA,IAAI,GAAG,CAAC,OAAO,EAAE;AACf,wBAAA,OAAOA,qCAAI,GAAG,EAAE,WAAW,QAAQ,CAAA,CAAE,GAAI;oBAC3C;AACA,oBAAA,OAAOA,6BAAC,MAAM,EAAA,EAAC,GAAG,EAAE,GAAG,CAAC,KAAK,IAAI,CAAA,IAAA,EAAO,QAAQ,CAAA,CAAE,EAAE,MAAM,EAAE,GAAG,GAAI;gBACrE,CAAC,CAAC,CACO;QAEf;AAEA,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,OAAOA,qCAAI,GAAG,EAAE,WAAW,KAAK,CAAA,CAAE,GAAI;QACxC;AAEA,QAAA,OAAOA,6BAAC,MAAM,EAAA,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,IAAI,CAAA,IAAA,EAAO,KAAK,CAAA,CAAE,EAAE,MAAM,EAAE,IAAI,GAAI;AACpE,IAAA,CAAC,CAAC;AACJ;;;;"}
+{"version":3,"file":"SelectOptions.js","sources":["../../../src/components/select/SelectOptions.tsx"],"sourcesContent":["import { getDataAttributes } from \"@utilities/selectUtils\"\nimport React from \"react\"\n\nimport type {\n  SelectItem,\n  SelectOptionsGroup,\n  SelectOptionWithNodeLabel,\n  SelectOptionWithTextLabel,\n} from \"./Select\"\n\ninterface OptionProps {\n  option: SelectOptionWithNodeLabel | SelectOptionWithTextLabel\n}\n\ninterface SelectOptionsProps {\n  items: SelectItem[]\n  supportsBaseSelect?: boolean\n}\n\nfunction isGroup(item: SelectItem): item is SelectOptionsGroup {\n  return \"options\" in item\n}\n\nfunction getOptionLabel(option: {\n  label: React.ReactNode\n  textValue?: string\n  value?: string\n}): string {\n  if (typeof option.label === \"string\") return option.label\n  return option.textValue ?? option.value ?? \"\"\n}\n\nfunction Option({ option }: OptionProps) {\n  return (\n    <option\n      {...getDataAttributes(option)}\n      disabled={option.disabled}\n      value={option.value}\n    >\n      {getOptionLabel(option)}\n    </option>\n  )\n}\n\nexport function SelectOptions({\n  items,\n  supportsBaseSelect = false,\n}: SelectOptionsProps): React.ReactNode {\n  return items.map((item, index) => {\n    if (isGroup(item)) {\n      return (\n        <optgroup\n          key={`${item.label}-${index}`}\n          disabled={item.disabled}\n          label={item.label}\n        >\n          {supportsBaseSelect && (\n            <legend>\n              <span>{item.label}</span>\n            </legend>\n          )}\n          {item.options.map((opt, optIndex) => {\n            if (opt.divider) {\n              return <hr key={`divider-${optIndex}`} />\n            }\n            return <Option key={opt.value ?? `opt-${optIndex}`} option={opt} />\n          })}\n        </optgroup>\n      )\n    }\n\n    if (item.divider) {\n      return <hr key={`divider-${index}`} />\n    }\n\n    return <Option key={item.value ?? `opt-${index}`} option={item} />\n  })\n}\n"],"names":[],"mappings":";;;AAmBA,SAAS,OAAO,CAAC,IAAgB,EAAA;IAC/B,OAAO,SAAS,IAAI,IAAI;AAC1B;AAEA,SAAS,cAAc,CAAC,MAIvB,EAAA;AACC,IAAA,IAAI,OAAO,MAAM,CAAC,KAAK,KAAK,QAAQ;QAAE,OAAO,MAAM,CAAC,KAAK;IACzD,OAAO,MAAM,CAAC,SAAS,IAAI,MAAM,CAAC,KAAK,IAAI,EAAE;AAC/C;AAEA,SAAS,MAAM,CAAC,EAAE,MAAM,EAAe,EAAA;IACrC,QACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GACM,iBAAiB,CAAC,MAAM,CAAC,EAC7B,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,EAAA,EAElB,cAAc,CAAC,MAAM,CAAC,CAChB;AAEb;AAEM,SAAU,aAAa,CAAC,EAC5B,KAAK,EACL,kBAAkB,GAAG,KAAK,GACP,EAAA;IACnB,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC/B,QAAA,IAAI,OAAO,CAAC,IAAI,CAAC,EAAE;YACjB,QACE,kCACE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA;AAEhB,gBAAA,kBAAkB,KACjB,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAA;AACE,oBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAAO,IAAI,CAAC,KAAK,CAAQ,CAClB,CACV;gBACA,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,KAAI;AAClC,oBAAA,IAAI,GAAG,CAAC,OAAO,EAAE;AACf,wBAAA,OAAO,4BAAI,GAAG,EAAE,WAAW,QAAQ,CAAA,CAAE,GAAI;oBAC3C;AACA,oBAAA,OAAO,oBAAC,MAAM,EAAA,EAAC,GAAG,EAAE,GAAG,CAAC,KAAK,IAAI,CAAA,IAAA,EAAO,QAAQ,CAAA,CAAE,EAAE,MAAM,EAAE,GAAG,GAAI;gBACrE,CAAC,CAAC,CACO;QAEf;AAEA,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,OAAO,4BAAI,GAAG,EAAE,WAAW,KAAK,CAAA,CAAE,GAAI;QACxC;AAEA,QAAA,OAAO,oBAAC,MAAM,EAAA,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,IAAI,CAAA,IAAA,EAAO,KAAK,CAAA,CAAE,EAAE,MAAM,EAAE,IAAI,GAAI;AACpE,IAAA,CAAC,CAAC;AACJ;;;;"}

package/dist/components/select/SelectPopover.js

@@ -1,12 +1,12 @@
 import { getComboboxActionFromKey, ComboboxAction, getUpdatedIndex } from '../../utilities/keyboardUtils.js';
 import { normalizeOptions, getSelectableOptionsFromSegments, getIndexByLetter, getDataAttributes } from '../../utilities/selectUtils.js';
 import { useId } from '../../utilities/useId.js';
-import React__default, { forwardRef, useState, useMemo, useRef, useCallback, useEffect } from 'react';
+import React, { forwardRef, useState, useMemo, useRef, useCallback, useEffect } from 'react';
 import { SelectOptions } from './SelectOptions.js';
 
-const Group = ({ children, disabled, id, label, }) => (React__default.createElement("ul", { "aria-disabled": disabled || undefined, "aria-labelledby": id, role: "group" },
-    React__default.createElement("li", { id: id, role: "presentation" },
-        React__default.createElement("span", null, label)),
+const Group = ({ children, disabled, id, label, }) => (React.createElement("ul", { "aria-disabled": disabled || undefined, "aria-labelledby": id, role: "group" },
+    React.createElement("li", { id: id, role: "presentation" },
+        React.createElement("span", null, label)),
     children));
 function renderListSegments(segments, baseId, renderItem) {
     let flatIndex = 0;
@@ -14,9 +14,9 @@ function renderListSegments(segments, baseId, renderItem) {
         const startIndex = flatIndex;
         flatIndex += segment.options.length;
         if (segment.type === "group") {
-            return (React__default.createElement(Group, { key: `${segment.label}-${segmentIndex}`, disabled: segment.disabled, id: `${baseId}-group-${segmentIndex}`, label: segment.label }, segment.options.map((opt, i) => renderItem(opt, startIndex + i))));
+            return (React.createElement(Group, { key: `${segment.label}-${segmentIndex}`, disabled: segment.disabled, id: `${baseId}-group-${segmentIndex}`, label: segment.label }, segment.options.map((opt, i) => renderItem(opt, startIndex + i))));
         }
-        return (React__default.createElement("ul", { key: `options-${segmentIndex}`, role: "presentation" }, segment.options.map((opt, i) => renderItem(opt, startIndex + i))));
+        return (React.createElement("ul", { key: `options-${segmentIndex}`, role: "presentation" }, segment.options.map((opt, i) => renderItem(opt, startIndex + i))));
     });
 }
 /**
@@ -229,19 +229,19 @@ const SelectPopover = forwardRef(({ "aria-describedby": ariaDescribedBy, "aria-l
     const renderListOption = (option, index) => {
         const { disabled, divider, label, value } = option;
         if (divider)
-            return React__default.createElement("li", { key: index, role: "separator" });
+            return React.createElement("li", { key: index, role: "separator" });
         return (
         // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard events are handled on the combobox button
-        React__default.createElement("li", { key: value, ...getDataAttributes(option), "aria-disabled": disabled || undefined, "aria-selected": value === selectedValue, className: value === activeOption?.value
+        React.createElement("li", { key: value, ...getDataAttributes(option), "aria-disabled": disabled || undefined, "aria-selected": value === selectedValue, className: value === activeOption?.value
                 ? "tds-select-option--active"
                 : undefined, id: `${baseId}-option-${value}`, onClick: disabled ? undefined : () => commitSelection(value), role: "option" }, label));
     };
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("button", { ref: resolvedTriggerRef, popovertarget: baseId, "aria-activedescendant": activeOptionId, "aria-controls": baseId, "aria-describedby": ariaDescribedBy, "aria-disabled": disabled ? "true" : undefined, "aria-expanded": isOpen, "aria-haspopup": "listbox", "aria-invalid": invalid ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-required": required ? "true" : undefined, disabled: disabled, onBlur: handleButtonBlur, onClick: handleButtonClick, onFocus: handleButtonFocus, onKeyDown: handleKeyDown, role: "combobox", type: "button" }, selectedOption ? selectedOption.label : placeholder),
-        React__default.createElement("div", { ref: popoverRef, popover: "", id: baseId, role: "listbox", "aria-describedby": ariaDescribedBy, "aria-invalid": invalid ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-required": required ? "true" : undefined }, renderListSegments(segments, baseId, renderListOption)),
-        React__default.createElement("select", { ...props, ref: setHiddenSelectRef, "aria-hidden": true, className: "tds-select-hidden-select", disabled: disabled, id: `${baseId}-control`, onChange: handleHiddenSelectChange, required: required, tabIndex: -1, value: selectedValue ?? "" },
-            React__default.createElement("option", { value: "" }),
-            React__default.createElement(SelectOptions, { items: options }))));
+    return (React.createElement(React.Fragment, null,
+        React.createElement("button", { ref: resolvedTriggerRef, popovertarget: baseId, "aria-activedescendant": activeOptionId, "aria-controls": baseId, "aria-describedby": ariaDescribedBy, "aria-disabled": disabled ? "true" : undefined, "aria-expanded": isOpen, "aria-haspopup": "listbox", "aria-invalid": invalid ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-required": required ? "true" : undefined, disabled: disabled, onBlur: handleButtonBlur, onClick: handleButtonClick, onFocus: handleButtonFocus, onKeyDown: handleKeyDown, role: "combobox", type: "button" }, selectedOption ? selectedOption.label : placeholder),
+        React.createElement("div", { ref: popoverRef, popover: "", id: baseId, role: "listbox", "aria-describedby": ariaDescribedBy, "aria-invalid": invalid ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-required": required ? "true" : undefined }, renderListSegments(segments, baseId, renderListOption)),
+        React.createElement("select", { ...props, ref: setHiddenSelectRef, "aria-hidden": true, className: "tds-select-hidden-select", disabled: disabled, id: `${baseId}-control`, onChange: handleHiddenSelectChange, required: required, tabIndex: -1, value: selectedValue ?? "" },
+            React.createElement("option", { value: "" }),
+            React.createElement(SelectOptions, { items: options }))));
 });
 SelectPopover.displayName = "SelectPopover";
 

package/dist/components/select/SelectPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPopover.js","sources":["../../../src/components/select/SelectPopover.tsx"],"sourcesContent":["import {\n  ComboboxAction,\n  getComboboxActionFromKey,\n  getUpdatedIndex,\n} from \"@utilities/keyboardUtils\"\nimport {\n  getDataAttributes,\n  getIndexByLetter,\n  getSelectableOptionsFromSegments,\n  normalizeOptions,\n  type Segment,\n} from \"@utilities/selectUtils\"\nimport { useId } from \"@utilities/useId\"\nimport React, {\n  forwardRef,\n  type SelectHTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\"\n\nimport type { SelectItem, SelectOption } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\ninterface ToggleEvent extends Event {\n  newState: \"closed\" | \"open\"\n  oldState: \"closed\" | \"open\"\n}\n\nexport interface SelectPopoverProps {\n  \"aria-describedby\"?: string\n  \"aria-label\"?: string\n  \"aria-labelledby\"?: string\n  defaultValue?: string\n  disabled?: boolean\n  id?: string\n  invalid?: boolean\n  /** A flat or mixed array of options and option groups. */\n  options: SelectItem[]\n  /** Placeholder text shown in the trigger button when no option is selected. `null` suppresses the placeholder. */\n  placeholder: string | null\n  required?: boolean\n  triggerRef?: React.RefObject<HTMLButtonElement>\n  value?: string\n}\n\nexport type SelectPopoverElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectPopoverProps | \"multiple\"\n> &\n  SelectPopoverProps\n\nconst Group = ({\n  children,\n  disabled,\n  id,\n  label,\n}: {\n  children: React.ReactNode\n  disabled?: boolean\n  id: string\n  label: string\n}) => (\n  <ul aria-disabled={disabled || undefined} aria-labelledby={id} role=\"group\">\n    <li id={id} role=\"presentation\">\n      <span>{label}</span>\n    </li>\n    {children}\n  </ul>\n)\n\nfunction renderListSegments(\n  segments: Segment[],\n  baseId: string,\n  renderItem: (option: SelectOption, index: number) => React.ReactNode\n) {\n  let flatIndex = 0\n\n  return segments.map((segment, segmentIndex) => {\n    const startIndex = flatIndex\n    flatIndex += segment.options.length\n\n    if (segment.type === \"group\") {\n      return (\n        <Group\n          key={`${segment.label}-${segmentIndex}`}\n          disabled={segment.disabled}\n          id={`${baseId}-group-${segmentIndex}`}\n          label={segment.label}\n        >\n          {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n        </Group>\n      )\n    }\n\n    return (\n      <ul key={`options-${segmentIndex}`} role=\"presentation\">\n        {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n      </ul>\n    )\n  })\n}\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The popover listbox implementation used by `Select` when `complex` is\n * true. Renders a button trigger and a custom listbox that supports rich\n * option content (icons, descriptions) along with keyboard navigation,\n * type-ahead, and option groups.\n *\n * @internal\n */\nexport const SelectPopover = forwardRef<\n  HTMLSelectElement,\n  SelectPopoverElementProps\n>(\n  (\n    {\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      defaultValue,\n      disabled,\n      id,\n      invalid,\n      onBlur,\n      onChange,\n      onClick,\n      onFocus,\n      options,\n      placeholder,\n      required,\n      triggerRef,\n      value,\n      ...props\n    }: SelectPopoverElementProps,\n    ref\n  ) => {\n    const stableId = useId()\n    const baseId = id || `tds-select-popover-${stableId}`\n\n    const [isOpen, setIsOpen] = useState(false)\n    const [uncontrolledValue, setUncontrolledValue] = useState<string | null>(\n      defaultValue ?? null\n    )\n    const [activeIndex, setActiveIndex] = useState(-1)\n\n    const isControlled = value !== undefined\n    const selectedValue = isControlled ? (value ?? null) : uncontrolledValue\n\n    const { allOptions, segments } = useMemo(() => {\n      const segments = normalizeOptions(options)\n      const allOptions = getSelectableOptionsFromSegments(segments)\n      return { allOptions, segments }\n    }, [options])\n\n    const selectedOption = allOptions.find((opt) => opt.value === selectedValue)\n\n    const activeOption = activeIndex >= 0 ? allOptions[activeIndex] : undefined\n    const activeOptionId = activeOption\n      ? `${baseId}-option-${activeOption.value}`\n      : undefined\n\n    const popoverRef = useRef<HTMLDivElement>(null)\n    const internalTriggerRef = useRef<HTMLButtonElement | null>(null)\n    const resolvedTriggerRef = triggerRef ?? internalTriggerRef\n    const hiddenSelectRef = useRef<HTMLSelectElement | null>(null)\n    const pendingChangeValueRef = useRef<string | null>(null)\n    const searchStringRef = useRef(\"\")\n    const searchTimeoutRef = useRef<ReturnType<typeof setTimeout>>()\n\n    const setHiddenSelectRef = useCallback(\n      (element: HTMLSelectElement | null) => {\n        hiddenSelectRef.current = element\n        if (typeof ref === \"function\") {\n          ref(element)\n        } else if (ref) {\n          ref.current = element\n        }\n      },\n      [ref]\n    )\n\n    useEffect(() => {\n      const popoverEl = popoverRef.current\n      if (!popoverEl) return\n\n      const handleToggle = (e: Event) => {\n        const newIsOpen = (e as ToggleEvent).newState === \"open\"\n        setIsOpen(newIsOpen)\n\n        if (newIsOpen) {\n          const index = allOptions.findIndex(\n            (opt) => opt.value === selectedValue && !opt.disabled\n          )\n          if (index >= 0) {\n            setActiveIndex(index)\n          } else {\n            // Find first non-disabled option\n            const firstEnabledIndexOrFirstIndex = Math.max(\n              allOptions.findIndex((opt) => !opt.disabled),\n              0\n            )\n            setActiveIndex(firstEnabledIndexOrFirstIndex)\n          }\n        } else {\n          setActiveIndex(-1)\n        }\n      }\n\n      popoverEl.addEventListener(\"toggle\", handleToggle)\n      return () => popoverEl.removeEventListener(\"toggle\", handleToggle)\n    }, [allOptions, selectedValue])\n\n    useEffect(() => {\n      if (activeOptionId) {\n        document\n          .getElementById(activeOptionId)\n          ?.scrollIntoView({ behavior: \"instant\", block: \"center\" })\n      }\n    }, [activeOptionId])\n\n    useEffect(\n      () => () => {\n        clearTimeout(searchTimeoutRef.current)\n      },\n      []\n    )\n\n    const openPopover = () =>\n      popoverRef.current?.showPopover({ source: resolvedTriggerRef.current! })\n\n    const closePopover = () => popoverRef.current?.hidePopover()\n\n    const commitSelection = useCallback(\n      (nextValue: string) => {\n        if (nextValue === selectedValue) {\n          closePopover()\n          return\n        }\n\n        if (!isControlled) {\n          setUncontrolledValue(nextValue)\n        }\n\n        const hiddenEl = hiddenSelectRef.current\n        if (hiddenEl) {\n          pendingChangeValueRef.current = nextValue\n          hiddenEl.value = nextValue\n          hiddenEl.dispatchEvent(new Event(\"change\", { bubbles: true }))\n          if (isControlled) {\n            hiddenEl.value = value ?? \"\"\n          }\n        }\n\n        closePopover()\n      },\n      [isControlled, selectedValue, value]\n    )\n\n    const selectActiveOption = useCallback(() => {\n      if (activeOption && !activeOption.disabled) {\n        commitSelection(activeOption.value!)\n        return true\n      }\n      return false\n    }, [activeOption, commitSelection])\n\n    const commitActiveOptionOrClose = useCallback(() => {\n      if (!selectActiveOption()) {\n        closePopover()\n      }\n    }, [selectActiveOption])\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (disabled) return\n\n      // Tab must not be prevented — allow native focus movement\n      if (e.key === \"Tab\" && isOpen) {\n        commitActiveOptionOrClose()\n        return\n      }\n\n      const action = getComboboxActionFromKey(e, isOpen)\n      if (!action) return\n\n      e.preventDefault()\n\n      switch (action) {\n        case ComboboxAction.OpenPopup:\n          openPopover()\n          break\n        case ComboboxAction.CommitAndClose:\n          commitActiveOptionOrClose()\n          break\n        case ComboboxAction.MoveFirst:\n        case ComboboxAction.MoveLast:\n          if (!isOpen) openPopover()\n          setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n          break\n        case ComboboxAction.MoveNext:\n        case ComboboxAction.MovePrevious:\n          setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n          break\n        case ComboboxAction.TypeCharacter: {\n          if (!isOpen) openPopover()\n\n          clearTimeout(searchTimeoutRef.current)\n          searchStringRef.current += e.key\n          searchTimeoutRef.current = setTimeout(() => {\n            searchStringRef.current = \"\"\n          }, 500)\n\n          const searchIndex = getIndexByLetter(\n            allOptions,\n            searchStringRef.current,\n            activeIndex\n          )\n          if (searchIndex >= 0) {\n            setActiveIndex(searchIndex)\n          }\n          break\n        }\n        case ComboboxAction.ClosePopup:\n          closePopover()\n          break\n      }\n    }\n\n    const createStableEventTarget = (\n      target: HTMLSelectElement,\n      valueSnapshot: string\n    ) => {\n      const proxy = Object.create(target)\n      Object.defineProperties(proxy, {\n        disabled: {\n          configurable: true,\n          enumerable: true,\n          value: target.disabled,\n        },\n        form: { configurable: true, enumerable: true, value: target.form },\n        name: { configurable: true, enumerable: true, value: target.name },\n        type: { configurable: true, enumerable: true, value: target.type },\n        value: { configurable: true, enumerable: true, value: valueSnapshot },\n      })\n      return proxy as HTMLSelectElement\n    }\n\n    const withSelectTarget = useCallback(\n      <\n        SourceEvent extends React.SyntheticEvent,\n        TargetEvent extends React.SyntheticEvent<HTMLSelectElement>,\n      >(\n        event: SourceEvent,\n        target: HTMLSelectElement,\n        currentTarget: HTMLSelectElement = target\n      ) => {\n        return Object.defineProperties(Object.create(event), {\n          currentTarget: { value: currentTarget },\n          target: { value: target },\n        }) as TargetEvent\n      },\n      []\n    )\n\n    const handleHiddenSelectChange = useCallback(\n      (event: React.ChangeEvent<HTMLSelectElement>) => {\n        if (!onChange) return\n\n        const valueSnapshot =\n          pendingChangeValueRef.current ?? event.currentTarget.value\n        pendingChangeValueRef.current = null\n\n        const stableEvent = withSelectTarget<\n          React.ChangeEvent<HTMLSelectElement>,\n          React.ChangeEvent<HTMLSelectElement>\n        >(\n          event,\n          createStableEventTarget(\n            event.target as HTMLSelectElement,\n            valueSnapshot\n          ),\n          createStableEventTarget(event.currentTarget, valueSnapshot)\n        )\n\n        onChange(stableEvent)\n      },\n      [onChange, withSelectTarget]\n    )\n\n    const forwardEventToSelect = useCallback(\n      <\n        ButtonEvent extends React.SyntheticEvent<HTMLButtonElement>,\n        SelectEvent extends React.SyntheticEvent<HTMLSelectElement>,\n      >(\n        event: ButtonEvent,\n        handler?: (event: SelectEvent) => void\n      ) => {\n        if (!handler) return\n\n        const hiddenEl = hiddenSelectRef.current\n        if (!hiddenEl) return\n\n        const stableEvent = withSelectTarget<ButtonEvent, SelectEvent>(\n          event,\n          hiddenEl\n        )\n\n        handler(stableEvent)\n      },\n      [withSelectTarget]\n    )\n\n    const handleButtonBlur = useCallback(\n      (event: React.FocusEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.FocusEvent<HTMLButtonElement>,\n          React.FocusEvent<HTMLSelectElement>\n        >(event, onBlur)\n      },\n      [forwardEventToSelect, onBlur]\n    )\n\n    const handleButtonClick = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.MouseEvent<HTMLButtonElement>,\n          React.MouseEvent<HTMLSelectElement>\n        >(event, onClick)\n      },\n      [forwardEventToSelect, onClick]\n    )\n\n    const handleButtonFocus = useCallback(\n      (event: React.FocusEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.FocusEvent<HTMLButtonElement>,\n          React.FocusEvent<HTMLSelectElement>\n        >(event, onFocus)\n      },\n      [forwardEventToSelect, onFocus]\n    )\n\n    const renderListOption = (option: SelectOption, index: number) => {\n      const { disabled, divider, label, value } = option\n      if (divider) return <li key={index} role=\"separator\" />\n      return (\n        // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard events are handled on the combobox button\n        <li\n          key={value}\n          {...getDataAttributes(option)}\n          aria-disabled={disabled || undefined}\n          aria-selected={value === selectedValue}\n          className={\n            value === activeOption?.value\n              ? \"tds-select-option--active\"\n              : undefined\n          }\n          id={`${baseId}-option-${value}`}\n          onClick={disabled ? undefined : () => commitSelection(value!)}\n          role=\"option\"\n        >\n          {label}\n        </li>\n      )\n    }\n\n    return (\n      <>\n        <button\n          ref={resolvedTriggerRef}\n          popovertarget={baseId}\n          aria-activedescendant={activeOptionId}\n          aria-controls={baseId}\n          aria-describedby={ariaDescribedBy}\n          aria-disabled={disabled ? \"true\" : undefined}\n          aria-expanded={isOpen}\n          aria-haspopup=\"listbox\"\n          aria-invalid={invalid ? \"true\" : undefined}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-required={required ? \"true\" : undefined}\n          disabled={disabled}\n          onBlur={handleButtonBlur}\n          onClick={handleButtonClick}\n          onFocus={handleButtonFocus}\n          onKeyDown={handleKeyDown}\n          role=\"combobox\"\n          type=\"button\"\n        >\n          {selectedOption ? selectedOption.label : placeholder}\n        </button>\n        <div\n          ref={popoverRef}\n          popover=\"\"\n          id={baseId}\n          role=\"listbox\"\n          aria-describedby={ariaDescribedBy}\n          aria-invalid={invalid ? \"true\" : undefined}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-required={required ? \"true\" : undefined}\n        >\n          {renderListSegments(segments, baseId, renderListOption)}\n        </div>\n        <select\n          {...props}\n          ref={setHiddenSelectRef}\n          aria-hidden\n          className=\"tds-select-hidden-select\"\n          disabled={disabled}\n          id={`${baseId}-control`}\n          onChange={handleHiddenSelectChange}\n          required={required}\n          tabIndex={-1}\n          value={selectedValue ?? \"\"}\n        >\n          <option value=\"\" />\n          <SelectOptions items={options} />\n        </select>\n      </>\n    )\n  }\n)\n\nSelectPopover.displayName = \"SelectPopover\"\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"SelectPopover.js","sources":["../../../src/components/select/SelectPopover.tsx"],"sourcesContent":["import {\n  ComboboxAction,\n  getComboboxActionFromKey,\n  getUpdatedIndex,\n} from \"@utilities/keyboardUtils\"\nimport {\n  getDataAttributes,\n  getIndexByLetter,\n  getSelectableOptionsFromSegments,\n  normalizeOptions,\n  type Segment,\n} from \"@utilities/selectUtils\"\nimport { useId } from \"@utilities/useId\"\nimport React, {\n  forwardRef,\n  type SelectHTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\"\n\nimport type { SelectItem, SelectOption } from \"./Select\"\nimport { SelectOptions } from \"./SelectOptions\"\n\ninterface ToggleEvent extends Event {\n  newState: \"closed\" | \"open\"\n  oldState: \"closed\" | \"open\"\n}\n\nexport interface SelectPopoverProps {\n  \"aria-describedby\"?: string\n  \"aria-label\"?: string\n  \"aria-labelledby\"?: string\n  defaultValue?: string\n  disabled?: boolean\n  id?: string\n  invalid?: boolean\n  /** A flat or mixed array of options and option groups. */\n  options: SelectItem[]\n  /** Placeholder text shown in the trigger button when no option is selected. `null` suppresses the placeholder. */\n  placeholder: string | null\n  required?: boolean\n  triggerRef?: React.RefObject<HTMLButtonElement>\n  value?: string\n}\n\nexport type SelectPopoverElementProps = Omit<\n  SelectHTMLAttributes<HTMLSelectElement>,\n  keyof SelectPopoverProps | \"multiple\"\n> &\n  SelectPopoverProps\n\nconst Group = ({\n  children,\n  disabled,\n  id,\n  label,\n}: {\n  children: React.ReactNode\n  disabled?: boolean\n  id: string\n  label: string\n}) => (\n  <ul aria-disabled={disabled || undefined} aria-labelledby={id} role=\"group\">\n    <li id={id} role=\"presentation\">\n      <span>{label}</span>\n    </li>\n    {children}\n  </ul>\n)\n\nfunction renderListSegments(\n  segments: Segment[],\n  baseId: string,\n  renderItem: (option: SelectOption, index: number) => React.ReactNode\n) {\n  let flatIndex = 0\n\n  return segments.map((segment, segmentIndex) => {\n    const startIndex = flatIndex\n    flatIndex += segment.options.length\n\n    if (segment.type === \"group\") {\n      return (\n        <Group\n          key={`${segment.label}-${segmentIndex}`}\n          disabled={segment.disabled}\n          id={`${baseId}-group-${segmentIndex}`}\n          label={segment.label}\n        >\n          {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n        </Group>\n      )\n    }\n\n    return (\n      <ul key={`options-${segmentIndex}`} role=\"presentation\">\n        {segment.options.map((opt, i) => renderItem(opt, startIndex + i))}\n      </ul>\n    )\n  })\n}\n\n/**\n * Internal component. Not intended for direct use — consume `Select` instead.\n *\n * The popover listbox implementation used by `Select` when `complex` is\n * true. Renders a button trigger and a custom listbox that supports rich\n * option content (icons, descriptions) along with keyboard navigation,\n * type-ahead, and option groups.\n *\n * @internal\n */\nexport const SelectPopover = forwardRef<\n  HTMLSelectElement,\n  SelectPopoverElementProps\n>(\n  (\n    {\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      defaultValue,\n      disabled,\n      id,\n      invalid,\n      onBlur,\n      onChange,\n      onClick,\n      onFocus,\n      options,\n      placeholder,\n      required,\n      triggerRef,\n      value,\n      ...props\n    }: SelectPopoverElementProps,\n    ref\n  ) => {\n    const stableId = useId()\n    const baseId = id || `tds-select-popover-${stableId}`\n\n    const [isOpen, setIsOpen] = useState(false)\n    const [uncontrolledValue, setUncontrolledValue] = useState<string | null>(\n      defaultValue ?? null\n    )\n    const [activeIndex, setActiveIndex] = useState(-1)\n\n    const isControlled = value !== undefined\n    const selectedValue = isControlled ? (value ?? null) : uncontrolledValue\n\n    const { allOptions, segments } = useMemo(() => {\n      const segments = normalizeOptions(options)\n      const allOptions = getSelectableOptionsFromSegments(segments)\n      return { allOptions, segments }\n    }, [options])\n\n    const selectedOption = allOptions.find((opt) => opt.value === selectedValue)\n\n    const activeOption = activeIndex >= 0 ? allOptions[activeIndex] : undefined\n    const activeOptionId = activeOption\n      ? `${baseId}-option-${activeOption.value}`\n      : undefined\n\n    const popoverRef = useRef<HTMLDivElement>(null)\n    const internalTriggerRef = useRef<HTMLButtonElement | null>(null)\n    const resolvedTriggerRef = triggerRef ?? internalTriggerRef\n    const hiddenSelectRef = useRef<HTMLSelectElement | null>(null)\n    const pendingChangeValueRef = useRef<string | null>(null)\n    const searchStringRef = useRef(\"\")\n    const searchTimeoutRef = useRef<ReturnType<typeof setTimeout>>()\n\n    const setHiddenSelectRef = useCallback(\n      (element: HTMLSelectElement | null) => {\n        hiddenSelectRef.current = element\n        if (typeof ref === \"function\") {\n          ref(element)\n        } else if (ref) {\n          ref.current = element\n        }\n      },\n      [ref]\n    )\n\n    useEffect(() => {\n      const popoverEl = popoverRef.current\n      if (!popoverEl) return\n\n      const handleToggle = (e: Event) => {\n        const newIsOpen = (e as ToggleEvent).newState === \"open\"\n        setIsOpen(newIsOpen)\n\n        if (newIsOpen) {\n          const index = allOptions.findIndex(\n            (opt) => opt.value === selectedValue && !opt.disabled\n          )\n          if (index >= 0) {\n            setActiveIndex(index)\n          } else {\n            // Find first non-disabled option\n            const firstEnabledIndexOrFirstIndex = Math.max(\n              allOptions.findIndex((opt) => !opt.disabled),\n              0\n            )\n            setActiveIndex(firstEnabledIndexOrFirstIndex)\n          }\n        } else {\n          setActiveIndex(-1)\n        }\n      }\n\n      popoverEl.addEventListener(\"toggle\", handleToggle)\n      return () => popoverEl.removeEventListener(\"toggle\", handleToggle)\n    }, [allOptions, selectedValue])\n\n    useEffect(() => {\n      if (activeOptionId) {\n        document\n          .getElementById(activeOptionId)\n          ?.scrollIntoView({ behavior: \"instant\", block: \"center\" })\n      }\n    }, [activeOptionId])\n\n    useEffect(\n      () => () => {\n        clearTimeout(searchTimeoutRef.current)\n      },\n      []\n    )\n\n    const openPopover = () =>\n      popoverRef.current?.showPopover({ source: resolvedTriggerRef.current! })\n\n    const closePopover = () => popoverRef.current?.hidePopover()\n\n    const commitSelection = useCallback(\n      (nextValue: string) => {\n        if (nextValue === selectedValue) {\n          closePopover()\n          return\n        }\n\n        if (!isControlled) {\n          setUncontrolledValue(nextValue)\n        }\n\n        const hiddenEl = hiddenSelectRef.current\n        if (hiddenEl) {\n          pendingChangeValueRef.current = nextValue\n          hiddenEl.value = nextValue\n          hiddenEl.dispatchEvent(new Event(\"change\", { bubbles: true }))\n          if (isControlled) {\n            hiddenEl.value = value ?? \"\"\n          }\n        }\n\n        closePopover()\n      },\n      [isControlled, selectedValue, value]\n    )\n\n    const selectActiveOption = useCallback(() => {\n      if (activeOption && !activeOption.disabled) {\n        commitSelection(activeOption.value!)\n        return true\n      }\n      return false\n    }, [activeOption, commitSelection])\n\n    const commitActiveOptionOrClose = useCallback(() => {\n      if (!selectActiveOption()) {\n        closePopover()\n      }\n    }, [selectActiveOption])\n\n    const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (disabled) return\n\n      // Tab must not be prevented — allow native focus movement\n      if (e.key === \"Tab\" && isOpen) {\n        commitActiveOptionOrClose()\n        return\n      }\n\n      const action = getComboboxActionFromKey(e, isOpen)\n      if (!action) return\n\n      e.preventDefault()\n\n      switch (action) {\n        case ComboboxAction.OpenPopup:\n          openPopover()\n          break\n        case ComboboxAction.CommitAndClose:\n          commitActiveOptionOrClose()\n          break\n        case ComboboxAction.MoveFirst:\n        case ComboboxAction.MoveLast:\n          if (!isOpen) openPopover()\n          setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n          break\n        case ComboboxAction.MoveNext:\n        case ComboboxAction.MovePrevious:\n          setActiveIndex(getUpdatedIndex(activeIndex, action, allOptions))\n          break\n        case ComboboxAction.TypeCharacter: {\n          if (!isOpen) openPopover()\n\n          clearTimeout(searchTimeoutRef.current)\n          searchStringRef.current += e.key\n          searchTimeoutRef.current = setTimeout(() => {\n            searchStringRef.current = \"\"\n          }, 500)\n\n          const searchIndex = getIndexByLetter(\n            allOptions,\n            searchStringRef.current,\n            activeIndex\n          )\n          if (searchIndex >= 0) {\n            setActiveIndex(searchIndex)\n          }\n          break\n        }\n        case ComboboxAction.ClosePopup:\n          closePopover()\n          break\n      }\n    }\n\n    const createStableEventTarget = (\n      target: HTMLSelectElement,\n      valueSnapshot: string\n    ) => {\n      const proxy = Object.create(target)\n      Object.defineProperties(proxy, {\n        disabled: {\n          configurable: true,\n          enumerable: true,\n          value: target.disabled,\n        },\n        form: { configurable: true, enumerable: true, value: target.form },\n        name: { configurable: true, enumerable: true, value: target.name },\n        type: { configurable: true, enumerable: true, value: target.type },\n        value: { configurable: true, enumerable: true, value: valueSnapshot },\n      })\n      return proxy as HTMLSelectElement\n    }\n\n    const withSelectTarget = useCallback(\n      <\n        SourceEvent extends React.SyntheticEvent,\n        TargetEvent extends React.SyntheticEvent<HTMLSelectElement>,\n      >(\n        event: SourceEvent,\n        target: HTMLSelectElement,\n        currentTarget: HTMLSelectElement = target\n      ) => {\n        return Object.defineProperties(Object.create(event), {\n          currentTarget: { value: currentTarget },\n          target: { value: target },\n        }) as TargetEvent\n      },\n      []\n    )\n\n    const handleHiddenSelectChange = useCallback(\n      (event: React.ChangeEvent<HTMLSelectElement>) => {\n        if (!onChange) return\n\n        const valueSnapshot =\n          pendingChangeValueRef.current ?? event.currentTarget.value\n        pendingChangeValueRef.current = null\n\n        const stableEvent = withSelectTarget<\n          React.ChangeEvent<HTMLSelectElement>,\n          React.ChangeEvent<HTMLSelectElement>\n        >(\n          event,\n          createStableEventTarget(\n            event.target as HTMLSelectElement,\n            valueSnapshot\n          ),\n          createStableEventTarget(event.currentTarget, valueSnapshot)\n        )\n\n        onChange(stableEvent)\n      },\n      [onChange, withSelectTarget]\n    )\n\n    const forwardEventToSelect = useCallback(\n      <\n        ButtonEvent extends React.SyntheticEvent<HTMLButtonElement>,\n        SelectEvent extends React.SyntheticEvent<HTMLSelectElement>,\n      >(\n        event: ButtonEvent,\n        handler?: (event: SelectEvent) => void\n      ) => {\n        if (!handler) return\n\n        const hiddenEl = hiddenSelectRef.current\n        if (!hiddenEl) return\n\n        const stableEvent = withSelectTarget<ButtonEvent, SelectEvent>(\n          event,\n          hiddenEl\n        )\n\n        handler(stableEvent)\n      },\n      [withSelectTarget]\n    )\n\n    const handleButtonBlur = useCallback(\n      (event: React.FocusEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.FocusEvent<HTMLButtonElement>,\n          React.FocusEvent<HTMLSelectElement>\n        >(event, onBlur)\n      },\n      [forwardEventToSelect, onBlur]\n    )\n\n    const handleButtonClick = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.MouseEvent<HTMLButtonElement>,\n          React.MouseEvent<HTMLSelectElement>\n        >(event, onClick)\n      },\n      [forwardEventToSelect, onClick]\n    )\n\n    const handleButtonFocus = useCallback(\n      (event: React.FocusEvent<HTMLButtonElement>) => {\n        forwardEventToSelect<\n          React.FocusEvent<HTMLButtonElement>,\n          React.FocusEvent<HTMLSelectElement>\n        >(event, onFocus)\n      },\n      [forwardEventToSelect, onFocus]\n    )\n\n    const renderListOption = (option: SelectOption, index: number) => {\n      const { disabled, divider, label, value } = option\n      if (divider) return <li key={index} role=\"separator\" />\n      return (\n        // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard events are handled on the combobox button\n        <li\n          key={value}\n          {...getDataAttributes(option)}\n          aria-disabled={disabled || undefined}\n          aria-selected={value === selectedValue}\n          className={\n            value === activeOption?.value\n              ? \"tds-select-option--active\"\n              : undefined\n          }\n          id={`${baseId}-option-${value}`}\n          onClick={disabled ? undefined : () => commitSelection(value!)}\n          role=\"option\"\n        >\n          {label}\n        </li>\n      )\n    }\n\n    return (\n      <>\n        <button\n          ref={resolvedTriggerRef}\n          popovertarget={baseId}\n          aria-activedescendant={activeOptionId}\n          aria-controls={baseId}\n          aria-describedby={ariaDescribedBy}\n          aria-disabled={disabled ? \"true\" : undefined}\n          aria-expanded={isOpen}\n          aria-haspopup=\"listbox\"\n          aria-invalid={invalid ? \"true\" : undefined}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-required={required ? \"true\" : undefined}\n          disabled={disabled}\n          onBlur={handleButtonBlur}\n          onClick={handleButtonClick}\n          onFocus={handleButtonFocus}\n          onKeyDown={handleKeyDown}\n          role=\"combobox\"\n          type=\"button\"\n        >\n          {selectedOption ? selectedOption.label : placeholder}\n        </button>\n        <div\n          ref={popoverRef}\n          popover=\"\"\n          id={baseId}\n          role=\"listbox\"\n          aria-describedby={ariaDescribedBy}\n          aria-invalid={invalid ? \"true\" : undefined}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-required={required ? \"true\" : undefined}\n        >\n          {renderListSegments(segments, baseId, renderListOption)}\n        </div>\n        <select\n          {...props}\n          ref={setHiddenSelectRef}\n          aria-hidden\n          className=\"tds-select-hidden-select\"\n          disabled={disabled}\n          id={`${baseId}-control`}\n          onChange={handleHiddenSelectChange}\n          required={required}\n          tabIndex={-1}\n          value={selectedValue ?? \"\"}\n        >\n          <option value=\"\" />\n          <SelectOptions items={options} />\n        </select>\n      </>\n    )\n  }\n)\n\nSelectPopover.displayName = \"SelectPopover\"\n"],"names":[],"mappings":"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"}

package/dist/components/text-area/TextArea.d.ts

@@ -4,7 +4,7 @@ export type TextAreaResize = "auto" | "none" | "vertical";
 export type TextAreaSize = "lg" | "md";
 interface TextAreaBaseProps {
     /** Helper text displayed below the textarea. Styled as error text when `invalid`. */
-    description?: string;
+    description?: React.ReactNode;
     /** Whether the textarea is in an invalid state. */
     invalid?: boolean;
     /** Controls resize behavior. */

package/dist/components/text-area/TextArea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAA;AAEtE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtC,UAAU,iBAAiB;IACzB,qFAAqF;IACrF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gCAAgC;IAChC,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gCAAgC;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAED,UAAU,wBAAyB,SAAQ,iBAAiB;IAC1D,mEAAmE;IACnE,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,uCAAuC;IACvC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,uBAAwB,SAAQ,iBAAiB;IACzD,mEAAmE;IACnE,SAAS,EAAE,IAAI,CAAA;IACf,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,+DAA+D;IAC/D,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,mBAAmB,GAC3B,0BAA0B,GAC1B,uBAAuB,GACvB,wBAAwB,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,mBAAmB,GAAG,MAAM,CACnC,GACC,mBAAmB,CAAA;AAErB;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,2FAoDpB,CAAA"}
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../src/components/text-area/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,KAAK,sBAAsB,EAAE,MAAM,OAAO,CAAA;AAEtE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,CAAA;AAEtC,UAAU,iBAAiB;IACzB,qFAAqF;IACrF,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gCAAgC;IAChC,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gCAAgC;IAChC,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAED,UAAU,wBAAyB,SAAQ,iBAAiB;IAC1D,mEAAmE;IACnE,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,uCAAuC;IACvC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,uBAAwB,SAAQ,iBAAiB;IACzD,mEAAmE;IACnE,SAAS,EAAE,IAAI,CAAA;IACf,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,0BAA2B,SAAQ,iBAAiB;IAC5D,+DAA+D;IAC/D,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,mBAAmB,GAC3B,0BAA0B,GAC1B,uBAAuB,GACvB,wBAAwB,CAAA;AAE5B,MAAM,MAAM,aAAa,GAAG,IAAI,CAC9B,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,mBAAmB,GAAG,MAAM,CACnC,GACC,mBAAmB,CAAA;AAErB;;;;;;;;GAQG;AACH,eAAO,MAAM,QAAQ,2FAoDpB,CAAA"}

package/dist/components/text-area/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { InputTextBase } from \"@components/input-text-base\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type TextareaHTMLAttributes } from \"react\"\n\nexport type TextAreaResize = \"auto\" | \"none\" | \"vertical\"\n\nexport type TextAreaSize = \"lg\" | \"md\"\n\ninterface TextAreaBaseProps {\n  /** Helper text displayed below the textarea. Styled as error text when `invalid`. */\n  description?: string\n  /** Whether the textarea is in an invalid state. */\n  invalid?: boolean\n  /** Controls resize behavior. */\n  resize?: TextAreaResize\n  /** Visible height in lines. */\n  rows?: number\n  /** The size of the textarea. */\n  size?: TextAreaSize\n}\n\ninterface TextAreaWithVisibleLabel extends TextAreaBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel?: false\n  /** The label text for the textarea. */\n  label: React.ReactNode\n}\n\ninterface TextAreaWithHiddenLabel extends TextAreaBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel: true\n  /** The label text for the textarea. Must be a string when hidden. */\n  label: string\n}\n\ninterface TextAreaWithAriaLabelledBy extends TextAreaBaseProps {\n  /** ID of an external label element. Use instead of `label`. */\n  \"aria-labelledby\": string\n  hideLabel?: never\n  label?: never\n}\n\nexport type TextAreaCustomProps =\n  | TextAreaWithAriaLabelledBy\n  | TextAreaWithHiddenLabel\n  | TextAreaWithVisibleLabel\n\nexport type TextAreaProps = Omit<\n  TextareaHTMLAttributes<HTMLTextAreaElement>,\n  keyof TextAreaCustomProps | \"rows\"\n> &\n  TextAreaCustomProps\n\n/**\n * A multi-line text input that renders as an HTML `<textarea>` with a\n * label and optional description. Supports invalid state, `lg`/`md`\n * sizing, and configurable resize behavior (`vertical`, `none`, `auto`).\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  function TextArea(\n    {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      className,\n      description,\n      hideLabel,\n      id,\n      invalid,\n      label,\n      resize = \"vertical\",\n      rows = 3,\n      size = \"md\",\n      ...restProps\n    }: TextAreaProps,\n    ref\n  ) {\n    const wrapperClassName = classNames(\n      {\n        \"tds-textarea--resize-auto\": resize === \"auto\",\n        \"tds-textarea--resize-none\": resize === \"none\",\n        \"tds-textarea--resize-vertical\": resize === \"vertical\",\n      },\n      className\n    )\n\n    return (\n      <InputTextBase\n        className={wrapperClassName}\n        description={description}\n        hideLabel={hideLabel || !!ariaLabelledBy}\n        id={id}\n        invalid={invalid}\n        label={label}\n        size={size}\n      >\n        {({ descriptionId, inputId }) => (\n          <textarea\n            {...restProps}\n            aria-describedby={descriptionId}\n            aria-invalid={invalid || undefined}\n            aria-label={hideLabel ? ariaLabel || (label as string) : ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            id={inputId}\n            ref={ref}\n            rows={rows}\n          />\n        )}\n      </InputTextBase>\n    )\n  }\n)\n\nTextArea.displayName = \"TextArea\"\n"],"names":["React"],"mappings":";;;;AAuDA;;;;;;;;AAQG;MACU,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CACf,EACE,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,SAAS,EACT,WAAW,EACX,SAAS,EACT,EAAE,EACF,OAAO,EACP,KAAK,EACL,MAAM,GAAG,UAAU,EACnB,IAAI,GAAG,CAAC,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACE,EAChB,GAAG,EAAA;IAEH,MAAM,gBAAgB,GAAG,UAAU,CACjC;QACE,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,+BAA+B,EAAE,MAAM,KAAK,UAAU;KACvD,EACD,SAAS,CACV;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,IACZ,SAAS,EAAE,gBAAgB,EAC3B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,IAAI,CAAC,CAAC,cAAc,EACxC,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EAAA,EAET,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,MAC1BA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAA,GACM,SAAS,EAAA,kBAAA,EACK,aAAa,kBACjB,OAAO,IAAI,SAAS,EAAA,YAAA,EACtB,SAAS,GAAG,SAAS,IAAK,KAAgB,GAAG,SAAS,qBACjD,cAAc,EAC/B,EAAE,EAAE,OAAO,EACX,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,GACV,CACH,CACa;AAEpB,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"TextArea.js","sources":["../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { InputTextBase } from \"@components/input-text-base\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, type TextareaHTMLAttributes } from \"react\"\n\nexport type TextAreaResize = \"auto\" | \"none\" | \"vertical\"\n\nexport type TextAreaSize = \"lg\" | \"md\"\n\ninterface TextAreaBaseProps {\n  /** Helper text displayed below the textarea. Styled as error text when `invalid`. */\n  description?: React.ReactNode\n  /** Whether the textarea is in an invalid state. */\n  invalid?: boolean\n  /** Controls resize behavior. */\n  resize?: TextAreaResize\n  /** Visible height in lines. */\n  rows?: number\n  /** The size of the textarea. */\n  size?: TextAreaSize\n}\n\ninterface TextAreaWithVisibleLabel extends TextAreaBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel?: false\n  /** The label text for the textarea. */\n  label: React.ReactNode\n}\n\ninterface TextAreaWithHiddenLabel extends TextAreaBaseProps {\n  /** If true, the label is visually hidden and set as aria-label. */\n  hideLabel: true\n  /** The label text for the textarea. Must be a string when hidden. */\n  label: string\n}\n\ninterface TextAreaWithAriaLabelledBy extends TextAreaBaseProps {\n  /** ID of an external label element. Use instead of `label`. */\n  \"aria-labelledby\": string\n  hideLabel?: never\n  label?: never\n}\n\nexport type TextAreaCustomProps =\n  | TextAreaWithAriaLabelledBy\n  | TextAreaWithHiddenLabel\n  | TextAreaWithVisibleLabel\n\nexport type TextAreaProps = Omit<\n  TextareaHTMLAttributes<HTMLTextAreaElement>,\n  keyof TextAreaCustomProps | \"rows\"\n> &\n  TextAreaCustomProps\n\n/**\n * A multi-line text input that renders as an HTML `<textarea>` with a\n * label and optional description. Supports invalid state, `lg`/`md`\n * sizing, and configurable resize behavior (`vertical`, `none`, `auto`).\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-textarea--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  function TextArea(\n    {\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      className,\n      description,\n      hideLabel,\n      id,\n      invalid,\n      label,\n      resize = \"vertical\",\n      rows = 3,\n      size = \"md\",\n      ...restProps\n    }: TextAreaProps,\n    ref\n  ) {\n    const wrapperClassName = classNames(\n      {\n        \"tds-textarea--resize-auto\": resize === \"auto\",\n        \"tds-textarea--resize-none\": resize === \"none\",\n        \"tds-textarea--resize-vertical\": resize === \"vertical\",\n      },\n      className\n    )\n\n    return (\n      <InputTextBase\n        className={wrapperClassName}\n        description={description}\n        hideLabel={hideLabel || !!ariaLabelledBy}\n        id={id}\n        invalid={invalid}\n        label={label}\n        size={size}\n      >\n        {({ descriptionId, inputId }) => (\n          <textarea\n            {...restProps}\n            aria-describedby={descriptionId}\n            aria-invalid={invalid || undefined}\n            aria-label={hideLabel ? ariaLabel || (label as string) : ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            id={inputId}\n            ref={ref}\n            rows={rows}\n          />\n        )}\n      </InputTextBase>\n    )\n  }\n)\n\nTextArea.displayName = \"TextArea\"\n"],"names":["React"],"mappings":";;;;AAuDA;;;;;;;;AAQG;MACU,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CACf,EACE,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,SAAS,EACT,WAAW,EACX,SAAS,EACT,EAAE,EACF,OAAO,EACP,KAAK,EACL,MAAM,GAAG,UAAU,EACnB,IAAI,GAAG,CAAC,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACE,EAChB,GAAG,EAAA;IAEH,MAAM,gBAAgB,GAAG,UAAU,CACjC;QACE,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,2BAA2B,EAAE,MAAM,KAAK,MAAM;QAC9C,+BAA+B,EAAE,MAAM,KAAK,UAAU;KACvD,EACD,SAAS,CACV;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,IACZ,SAAS,EAAE,gBAAgB,EAC3B,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,IAAI,CAAC,CAAC,cAAc,EACxC,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EAAA,EAET,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,MAC1BA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAA,GACM,SAAS,EAAA,kBAAA,EACK,aAAa,kBACjB,OAAO,IAAI,SAAS,EAAA,YAAA,EACtB,SAAS,GAAG,SAAS,IAAK,KAAgB,GAAG,SAAS,qBACjD,cAAc,EAC/B,EAAE,EAAE,OAAO,EACX,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,GACV,CACH,CACa;AAEpB,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/dist/components/time-field/TimeField.d.ts

@@ -8,7 +8,7 @@ export type TimeFieldSize = "md" | "lg";
 export type TimeFieldValue = CalendarDateTime | Time | ZonedDateTime;
 export interface TimeFieldProps {
     /** Helper text displayed below the component. Styled as error text when `invalid` is `true`. */
-    description?: string;
+    description?: React.ReactNode;
     /** Disables the field. */
     disabled?: boolean;
     /** If `true`, always shows leading zeros in the hour field. */

package/dist/components/time-field/TimeField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/components/time-field/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,aAAa,CAAA;AAEpB,OAAO,KAAK,EACV,gBAAgB,EAChB,IAAI,EACJ,aAAa,EACd,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAA;AAEhF,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAML,KAAK,cAAc,IAAI,kBAAkB,EAC1C,MAAM,iCAAiC,CAAA;AAExC,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAA;AAEvC,MAAM,MAAM,cAAc,GAAG,gBAAgB,GAAG,IAAI,GAAG,aAAa,CAAA;AAEpE,MAAM,WAAW,cAAc;IAC7B,gGAAgG;IAChG,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,wDAAwD;IACxD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,IAAI,CAAC,EAAE,aAAa,CAAA;CACrB;AAED,KAAK,wBAAwB,GACzB,UAAU,GACV,aAAa,GACb,kBAAkB,GAClB,yBAAyB,GACzB,MAAM,CAAA;AAEV,KAAK,2BAA2B,GAC5B,cAAc,GACd,cAAc,GACd,WAAW,GACX,MAAM,GACN,UAAU,GACV,OAAO,CAAA;AAEX,MAAM,MAAM,qBAAqB,GAAG,+BAA+B,CACjE,kBAAkB,CAAC,cAAc,CAAC,EAClC,cAAc,EACd,wBAAwB,EACxB,2BAA2B,CAC5B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAW,EACX,GAAG,SAAS,EACb,EAAE,qBAAqB,qBAqDvB"}
+{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/components/time-field/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,aAAa,CAAA;AAEpB,OAAO,KAAK,EACV,gBAAgB,EAChB,IAAI,EACJ,aAAa,EACd,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAA;AAEhF,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAML,KAAK,cAAc,IAAI,kBAAkB,EAC1C,MAAM,iCAAiC,CAAA;AAExC,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAA;AAEvC,MAAM,MAAM,cAAc,GAAG,gBAAgB,GAAG,IAAI,GAAG,aAAa,CAAA;AAEpE,MAAM,WAAW,cAAc;IAC7B,gGAAgG;IAChG,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,yDAAyD;IACzD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,wDAAwD;IACxD,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,IAAI,CAAC,EAAE,aAAa,CAAA;CACrB;AAED,KAAK,wBAAwB,GACzB,UAAU,GACV,aAAa,GACb,kBAAkB,GAClB,yBAAyB,GACzB,MAAM,CAAA;AAEV,KAAK,2BAA2B,GAC5B,cAAc,GACd,cAAc,GACd,WAAW,GACX,MAAM,GACN,UAAU,GACV,OAAO,CAAA;AAEX,MAAM,MAAM,qBAAqB,GAAG,+BAA+B,CACjE,kBAAkB,CAAC,cAAc,CAAC,EAClC,cAAc,EACd,wBAAwB,EACxB,2BAA2B,CAC5B,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAW,EACX,GAAG,SAAS,EACb,EAAE,qBAAqB,qBAqDvB"}

package/dist/components/time-field/TimeField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.js","sources":["../../../src/components/time-field/TimeField.tsx"],"sourcesContent":["import \"../field/index.css\"\nimport \"./index.css\"\n\nimport type {\n  CalendarDateTime,\n  Time,\n  ZonedDateTime,\n} from \"@internationalized/date\"\nimport Icon from \"@utilities/Icon\"\nimport type { CombineAriaPropsWithCustomProps } from \"@utilities/reactAriaProps\"\nimport classNames from \"classnames\"\nimport React from \"react\"\nimport {\n  DateInput,\n  DateSegment,\n  Label,\n  Text,\n  TimeField as AriaTimeField,\n  type TimeFieldProps as AriaTimeFieldProps,\n} from \"react-aria-components/TimeField\"\n\nexport type TimeFieldSize = \"md\" | \"lg\"\n\nexport type TimeFieldValue = CalendarDateTime | Time | ZonedDateTime\n\nexport interface TimeFieldProps {\n  /** Helper text displayed below the component. Styled as error text when `invalid` is `true`. */\n  description?: string\n  /** Disables the field. */\n  disabled?: boolean\n  /** If `true`, always shows leading zeros in the hour field. */\n  forceLeadingZeros?: boolean\n  /** If `true`, renders the label visually hidden. */\n  hideLabel?: boolean\n  /** If `true`, applies error styling to the field and description. */\n  invalid?: boolean\n  /** Accessible label for the field. */\n  label: string\n  /** The maximum allowed time (e.g. `new Time(17, 0)`). */\n  max?: TimeFieldValue\n  /** The minimum allowed time (e.g. `new Time(9, 0)`). */\n  min?: TimeFieldValue\n  /** Allows the value to be read but not changed. */\n  readOnly?: boolean\n  /** If `true`, appends an asterisk after the label text. */\n  required?: boolean\n  /** The size of the time field. */\n  size?: TimeFieldSize\n}\n\ntype AriaTimeFieldPropsToOmit =\n  | \"children\"\n  | \"granularity\"\n  | \"placeholderValue\"\n  | \"shouldForceLeadingZeros\"\n  | \"slot\"\n\ntype AriaTimeFieldPropsToInclude =\n  | \"defaultValue\"\n  | \"hideTimeZone\"\n  | \"hourCycle\"\n  | \"name\"\n  | \"onChange\"\n  | \"value\"\n\nexport type TimeFieldElementProps = CombineAriaPropsWithCustomProps<\n  AriaTimeFieldProps<TimeFieldValue>,\n  TimeFieldProps,\n  AriaTimeFieldPropsToOmit,\n  AriaTimeFieldPropsToInclude\n>\n\n/**\n * A time field component allows users to enter and edit time values as individual\n * segments. Each segment supports keyboard entry, increment/decrement\n * with arrow keys, and respects the user's locale (12- vs 24-hour clock),\n * which can be overridden with `hourCycle`.\n *\n * Values are `Time`, `CalendarDateTime`, or `ZonedDateTime` from\n * `@internationalized/date`. Restrict the allowed range with `min`/`max`.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-timefield--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport function TimeField({\n  className,\n  description,\n  disabled,\n  forceLeadingZeros,\n  hideLabel,\n  invalid,\n  label,\n  max,\n  min,\n  readOnly,\n  required,\n  size = \"md\",\n  ...restProps\n}: TimeFieldElementProps) {\n  const combinedClassName = classNames(\n    \"tds-field tds-time-field\",\n    {\n      \"tds-field--lg\": size === \"lg\",\n      \"tds-time-field--lg\": size === \"lg\",\n    },\n    className\n  )\n\n  return (\n    <AriaTimeField\n      {...restProps}\n      aria-label={hideLabel ? label : undefined}\n      className={combinedClassName}\n      granularity=\"minute\"\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isReadOnly={readOnly}\n      isRequired={required}\n      maxValue={max ?? undefined}\n      minValue={min ?? undefined}\n      shouldForceLeadingZeros={forceLeadingZeros}\n    >\n      {!hideLabel && <Label className=\"tds-field-label\">{label}</Label>}\n      <DateInput className=\"tds-field-control tds-time-field-input\">\n        {(segment) => (\n          <DateSegment\n            className={\n              segment.type === \"literal\"\n                ? \"tds-field-date-segment-separator\"\n                : \"tds-field-date-segment\"\n            }\n            segment={segment}\n          />\n        )}\n      </DateInput>\n      {description && (\n        <Text\n          elementType=\"p\"\n          className=\"tds-field-description\"\n          slot=\"description\"\n        >\n          <Icon\n            aria-hidden\n            className=\"tds-field-description-invalid-icon\"\n            symbol=\"general#exclamation-triangle\"\n          />\n          {description}\n        </Text>\n      )}\n    </AriaTimeField>\n  )\n}\n"],"names":["React","AriaTimeField"],"mappings":";;;;;AAwEA;;;;;;;;;;;;AAYG;AACG,SAAU,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACU,EAAA;AACtB,IAAA,MAAM,iBAAiB,GAAG,UAAU,CAClC,0BAA0B,EAC1B;QACE,eAAe,EAAE,IAAI,KAAK,IAAI;QAC9B,oBAAoB,EAAE,IAAI,KAAK,IAAI;KACpC,EACD,SAAS,CACV;IAED,QACEA,cAAA,CAAA,aAAA,CAACC,WAAa,EAAA,EAAA,GACR,SAAS,gBACD,SAAS,GAAG,KAAK,GAAG,SAAS,EACzC,SAAS,EAAE,iBAAiB,EAC5B,WAAW,EAAC,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE,OAAO,EAClB,UAAU,EAAE,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,uBAAuB,EAAE,iBAAiB,EAAA;QAEzC,CAAC,SAAS,IAAID,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,SAAS,EAAC,iBAAiB,EAAA,EAAE,KAAK,CAAS;QACjEA,cAAA,CAAA,aAAA,CAAC,SAAS,IAAC,SAAS,EAAC,wCAAwC,EAAA,EAC1D,CAAC,OAAO,MACPA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,SAAS,EACP,OAAO,CAAC,IAAI,KAAK;AACf,kBAAE;kBACA,wBAAwB,EAE9B,OAAO,EAAE,OAAO,EAAA,CAChB,CACH,CACS;AACX,QAAA,WAAW,KACVA,cAAA,CAAA,aAAA,CAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,SAAS,EAAC,uBAAuB,EACjC,IAAI,EAAC,aAAa,EAAA;YAElBA,cAAA,CAAA,aAAA,CAAC,IAAI,yBAEH,SAAS,EAAC,oCAAoC,EAC9C,MAAM,EAAC,8BAA8B,EAAA,CACrC;AACD,YAAA,WAAW,CACP,CACR,CACa;AAEpB;;;;"}
+{"version":3,"file":"TimeField.js","sources":["../../../src/components/time-field/TimeField.tsx"],"sourcesContent":["import \"../field/index.css\"\nimport \"./index.css\"\n\nimport type {\n  CalendarDateTime,\n  Time,\n  ZonedDateTime,\n} from \"@internationalized/date\"\nimport Icon from \"@utilities/Icon\"\nimport type { CombineAriaPropsWithCustomProps } from \"@utilities/reactAriaProps\"\nimport classNames from \"classnames\"\nimport React from \"react\"\nimport {\n  DateInput,\n  DateSegment,\n  Label,\n  Text,\n  TimeField as AriaTimeField,\n  type TimeFieldProps as AriaTimeFieldProps,\n} from \"react-aria-components/TimeField\"\n\nexport type TimeFieldSize = \"md\" | \"lg\"\n\nexport type TimeFieldValue = CalendarDateTime | Time | ZonedDateTime\n\nexport interface TimeFieldProps {\n  /** Helper text displayed below the component. Styled as error text when `invalid` is `true`. */\n  description?: React.ReactNode\n  /** Disables the field. */\n  disabled?: boolean\n  /** If `true`, always shows leading zeros in the hour field. */\n  forceLeadingZeros?: boolean\n  /** If `true`, renders the label visually hidden. */\n  hideLabel?: boolean\n  /** If `true`, applies error styling to the field and description. */\n  invalid?: boolean\n  /** Accessible label for the field. */\n  label: string\n  /** The maximum allowed time (e.g. `new Time(17, 0)`). */\n  max?: TimeFieldValue\n  /** The minimum allowed time (e.g. `new Time(9, 0)`). */\n  min?: TimeFieldValue\n  /** Allows the value to be read but not changed. */\n  readOnly?: boolean\n  /** If `true`, appends an asterisk after the label text. */\n  required?: boolean\n  /** The size of the time field. */\n  size?: TimeFieldSize\n}\n\ntype AriaTimeFieldPropsToOmit =\n  | \"children\"\n  | \"granularity\"\n  | \"placeholderValue\"\n  | \"shouldForceLeadingZeros\"\n  | \"slot\"\n\ntype AriaTimeFieldPropsToInclude =\n  | \"defaultValue\"\n  | \"hideTimeZone\"\n  | \"hourCycle\"\n  | \"name\"\n  | \"onChange\"\n  | \"value\"\n\nexport type TimeFieldElementProps = CombineAriaPropsWithCustomProps<\n  AriaTimeFieldProps<TimeFieldValue>,\n  TimeFieldProps,\n  AriaTimeFieldPropsToOmit,\n  AriaTimeFieldPropsToInclude\n>\n\n/**\n * A time field component allows users to enter and edit time values as individual\n * segments. Each segment supports keyboard entry, increment/decrement\n * with arrow keys, and respects the user's locale (12- vs 24-hour clock),\n * which can be overridden with `hourCycle`.\n *\n * Values are `Time`, `CalendarDateTime`, or `ZonedDateTime` from\n * `@internationalized/date`. Restrict the allowed range with `min`/`max`.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-timefield--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport function TimeField({\n  className,\n  description,\n  disabled,\n  forceLeadingZeros,\n  hideLabel,\n  invalid,\n  label,\n  max,\n  min,\n  readOnly,\n  required,\n  size = \"md\",\n  ...restProps\n}: TimeFieldElementProps) {\n  const combinedClassName = classNames(\n    \"tds-field tds-time-field\",\n    {\n      \"tds-field--lg\": size === \"lg\",\n      \"tds-time-field--lg\": size === \"lg\",\n    },\n    className\n  )\n\n  return (\n    <AriaTimeField\n      {...restProps}\n      aria-label={hideLabel ? label : undefined}\n      className={combinedClassName}\n      granularity=\"minute\"\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isReadOnly={readOnly}\n      isRequired={required}\n      maxValue={max ?? undefined}\n      minValue={min ?? undefined}\n      shouldForceLeadingZeros={forceLeadingZeros}\n    >\n      {!hideLabel && <Label className=\"tds-field-label\">{label}</Label>}\n      <DateInput className=\"tds-field-control tds-time-field-input\">\n        {(segment) => (\n          <DateSegment\n            className={\n              segment.type === \"literal\"\n                ? \"tds-field-date-segment-separator\"\n                : \"tds-field-date-segment\"\n            }\n            segment={segment}\n          />\n        )}\n      </DateInput>\n      {description && (\n        <Text\n          elementType=\"p\"\n          className=\"tds-field-description\"\n          slot=\"description\"\n        >\n          <Icon\n            aria-hidden\n            className=\"tds-field-description-invalid-icon\"\n            symbol=\"general#exclamation-triangle\"\n          />\n          {description}\n        </Text>\n      )}\n    </AriaTimeField>\n  )\n}\n"],"names":["React","AriaTimeField"],"mappings":";;;;;AAwEA;;;;;;;;;;;;AAYG;AACG,SAAU,SAAS,CAAC,EACxB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACU,EAAA;AACtB,IAAA,MAAM,iBAAiB,GAAG,UAAU,CAClC,0BAA0B,EAC1B;QACE,eAAe,EAAE,IAAI,KAAK,IAAI;QAC9B,oBAAoB,EAAE,IAAI,KAAK,IAAI;KACpC,EACD,SAAS,CACV;IAED,QACEA,cAAA,CAAA,aAAA,CAACC,WAAa,EAAA,EAAA,GACR,SAAS,gBACD,SAAS,GAAG,KAAK,GAAG,SAAS,EACzC,SAAS,EAAE,iBAAiB,EAC5B,WAAW,EAAC,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE,OAAO,EAClB,UAAU,EAAE,QAAQ,EACpB,UAAU,EAAE,QAAQ,EACpB,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,QAAQ,EAAE,GAAG,IAAI,SAAS,EAC1B,uBAAuB,EAAE,iBAAiB,EAAA;QAEzC,CAAC,SAAS,IAAID,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,SAAS,EAAC,iBAAiB,EAAA,EAAE,KAAK,CAAS;QACjEA,cAAA,CAAA,aAAA,CAAC,SAAS,IAAC,SAAS,EAAC,wCAAwC,EAAA,EAC1D,CAAC,OAAO,MACPA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,SAAS,EACP,OAAO,CAAC,IAAI,KAAK;AACf,kBAAE;kBACA,wBAAwB,EAE9B,OAAO,EAAE,OAAO,EAAA,CAChB,CACH,CACS;AACX,QAAA,WAAW,KACVA,cAAA,CAAA,aAAA,CAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,SAAS,EAAC,uBAAuB,EACjC,IAAI,EAAC,aAAa,EAAA;YAElBA,cAAA,CAAA,aAAA,CAAC,IAAI,yBAEH,SAAS,EAAC,oCAAoC,EAC9C,MAAM,EAAC,8BAA8B,EAAA,CACrC;AACD,YAAA,WAAW,CACP,CACR,CACa;AAEpB;;;;"}

package/dist/components/toggle-switch/ToggleSwitch.d.ts

@@ -5,8 +5,8 @@ interface ToggleSwitchBaseProps {
     "aria-invalid"?: never;
     "aria-label"?: never;
     "aria-required"?: never;
-    /** Optional description text that appears below the toggle switch label. */
-    description?: string;
+    /** Optional description that appears below the toggle switch label. */
+    description?: React.ReactNode;
     required?: never;
     /** The size of the toggle switch. */
     size?: ToggleSwitchSize;

package/dist/components/toggle-switch/ToggleSwitch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleSwitch.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAA;AAE1C,UAAU,qBAAqB;IAC7B,cAAc,CAAC,EAAE,KAAK,CAAA;IACtB,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,4EAA4E;IAC5E,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,qCAAqC;IACrC,IAAI,CAAC,EAAE,gBAAgB,CAAA;CACxB;AAED,UAAU,4BAA6B,SAAQ,qBAAqB;IAClE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB;;;;;;;OAOG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,EAAE,IAAI,CAAA;IACf,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,8BAA+B,SAAQ,qBAAqB;IACpE,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,iBAAiB,GACzB,4BAA4B,GAC5B,2BAA2B,GAC3B,8BAA8B,CAAA;AAElC,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,iBAAiB,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,CAChE,GACC,iBAAiB,CAAA;AAEnB;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY,mGA0DxB,CAAA"}
+{"version":3,"file":"ToggleSwitch.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAIpB,OAAO,KAAK,EAAE,EAAc,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAE9D,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAA;AAE1C,UAAU,qBAAqB;IAC7B,cAAc,CAAC,EAAE,KAAK,CAAA;IACtB,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,eAAe,CAAC,EAAE,KAAK,CAAA;IACvB,uEAAuE;IACvE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,qCAAqC;IACrC,IAAI,CAAC,EAAE,gBAAgB,CAAA;CACxB;AAED,UAAU,4BAA6B,SAAQ,qBAAqB;IAClE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB;;;;;;;OAOG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,CAAC,EAAE,KAAK,CAAA;IACzB,yFAAyF;IACzF,SAAS,EAAE,IAAI,CAAA;IACf,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,8BAA+B,SAAQ,qBAAqB;IACpE,iBAAiB,EAAE,MAAM,CAAA;IACzB,SAAS,CAAC,EAAE,KAAK,CAAA;IACjB,wDAAwD;IACxD,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,MAAM,MAAM,iBAAiB,GACzB,4BAA4B,GAC5B,2BAA2B,GAC3B,8BAA8B,CAAA;AAElC,MAAM,MAAM,wBAAwB,GAAG,IAAI,CACzC,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,iBAAiB,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,CAChE,GACC,iBAAiB,CAAA;AAEnB;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY,mGA0DxB,CAAA"}

package/dist/components/toggle-switch/ToggleSwitch.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleSwitch.js","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, InputHTMLAttributes } from \"react\"\n\nexport type ToggleSwitchSize = \"md\" | \"sm\"\n\ninterface ToggleSwitchBaseProps {\n  \"aria-invalid\"?: never\n  \"aria-label\"?: never\n  \"aria-required\"?: never\n  /** Optional description text that appears below the toggle switch label. */\n  description?: string\n  required?: never\n  /** The size of the toggle switch. */\n  size?: ToggleSwitchSize\n}\n\ninterface ToggleSwitchWithVisibleLabel extends ToggleSwitchBaseProps {\n  \"aria-labelledby\"?: never\n  /** When true, hides the visible label and sets it as aria-label on the input instead. */\n  hideLabel?: false\n  /**\n   * The label content for the toggle switch. Required unless\n   * `aria-labelledby` is provided to reference an external label. When\n   * using non-string content (e.g. JSX), it must not contain\n   * interactive elements. This includes native HTML elements such as\n   * `<a>` and `<button>`, as well as Tapestry or Tapestry-React\n   * interactive components.\n   */\n  label: React.ReactNode\n}\n\ninterface ToggleSwitchWithHiddenLabel extends ToggleSwitchBaseProps {\n  \"aria-labelledby\"?: never\n  /** When true, hides the visible label and sets it as aria-label on the input instead. */\n  hideLabel: true\n  /** Label text for the toggle switch, used as an accessible `aria-label`. */\n  label: string\n}\n\ninterface ToggleSwitchWithAriaLabelledBy extends ToggleSwitchBaseProps {\n  \"aria-labelledby\": string\n  hideLabel?: never\n  /** Not available when `aria-labelledby` is provided. */\n  label?: never\n}\n\nexport type ToggleSwitchProps =\n  | ToggleSwitchWithVisibleLabel\n  | ToggleSwitchWithHiddenLabel\n  | ToggleSwitchWithAriaLabelledBy\n\nexport type ToggleSwitchElementProps = Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  keyof ToggleSwitchProps | \"type\" | \"required\" | \"aria-required\"\n> &\n  ToggleSwitchProps\n\n/**\n * A toggle switch component that renders as a checkbox input styled as a switch.\n *\n * **Required:** You must provide either:\n * - `label` - Label content for the switch (must be a string when `hideLabel` is true)\n * - `aria-labelledby` - ID of an external element that provides the label\n *\n * When using non-string content for `label` (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as `<a>` and\n * `<button>`, as well as Tapestry or Tapestry-React interactive components.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const ToggleSwitch = forwardRef<\n  HTMLInputElement,\n  ToggleSwitchElementProps\n>(\n  (\n    {\n      \"aria-describedby\": ariaDescribedby,\n      checked,\n      className,\n      description,\n      hideLabel = false,\n      id,\n      label,\n      size = \"md\",\n      ...restProps\n    }: ToggleSwitchElementProps,\n    ref\n  ) => {\n    const combinedClassName = classNames(\n      \"tds-toggle-switch\",\n      size && size === \"sm\" && `tds-toggle-switch--sm`,\n      hideLabel && `tds-toggle-switch--hide-label`,\n      className\n    )\n\n    const stableId = useId()\n    const toggleSwitchId = id || `tds-toggle-switch-${stableId}`\n\n    return (\n      <div className={combinedClassName}>\n        <div className=\"tds-toggle-switch-track\" aria-hidden=\"true\"></div>\n        <input\n          {...restProps}\n          id={toggleSwitchId}\n          type=\"checkbox\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-label={hideLabel ? (label as string) : undefined}\n          aria-describedby={\n            description && !hideLabel\n              ? `${toggleSwitchId}-description`\n              : ariaDescribedby\n          }\n          checked={checked}\n          ref={ref}\n        />\n        {label && !hideLabel && <label htmlFor={toggleSwitchId}>{label}</label>}\n        {description && !hideLabel && (\n          <p\n            id={`${toggleSwitchId}-description`}\n            className=\"tds-toggle-switch-description\"\n          >\n            {description}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\n\nToggleSwitch.displayName = \"ToggleSwitch\"\n"],"names":["React"],"mappings":";;;;AA4DA;;;;;;;;;;;;;;AAcG;AACI,MAAM,YAAY,GAAG,UAAU,CAIpC,CACE,EACE,kBAAkB,EAAE,eAAe,EACnC,OAAO,EACP,SAAS,EACT,WAAW,EACX,SAAS,GAAG,KAAK,EACjB,EAAE,EACF,KAAK,EACL,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACa,EAC3B,GAAG,KACD;IACF,MAAM,iBAAiB,GAAG,UAAU,CAClC,mBAAmB,EACnB,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,CAAA,qBAAA,CAAuB,EAChD,SAAS,IAAI,+BAA+B,EAC5C,SAAS,CACV;AAED,IAAA,MAAM,QAAQ,GAAG,KAAK,EAAE;AACxB,IAAA,MAAM,cAAc,GAAG,EAAE,IAAI,CAAA,kBAAA,EAAqB,QAAQ,EAAE;AAE5D,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,iBAAiB,EAAA;AAC/B,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,aAAA,EAAa,MAAM,EAAA,CAAO;AAClE,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,GACM,SAAS,EACb,EAAE,EAAE,cAAc,EAClB,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,QAAQ,EAAA,cAAA,EACC,OAAO,EAAA,YAAA,EACT,SAAS,GAAI,KAAgB,GAAG,SAAS,EAAA,kBAAA,EAEnD,WAAW,IAAI,CAAC;kBACZ,CAAA,EAAG,cAAc,CAAA,YAAA;kBACjB,eAAe,EAErB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EAAA,CACR;QACD,KAAK,IAAI,CAAC,SAAS,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAE,cAAc,EAAA,EAAG,KAAK,CAAS;QACtE,WAAW,IAAI,CAAC,SAAS,KACxBA,cAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EACE,EAAE,EAAE,CAAA,EAAG,cAAc,cAAc,EACnC,SAAS,EAAC,+BAA+B,EAAA,EAExC,WAAW,CACV,CACL,CACG;AAEV,CAAC;AAGH,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}
+{"version":3,"file":"ToggleSwitch.js","sources":["../../../src/components/toggle-switch/ToggleSwitch.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { useId } from \"@utilities/useId\"\nimport classNames from \"classnames\"\nimport React, { forwardRef, InputHTMLAttributes } from \"react\"\n\nexport type ToggleSwitchSize = \"md\" | \"sm\"\n\ninterface ToggleSwitchBaseProps {\n  \"aria-invalid\"?: never\n  \"aria-label\"?: never\n  \"aria-required\"?: never\n  /** Optional description that appears below the toggle switch label. */\n  description?: React.ReactNode\n  required?: never\n  /** The size of the toggle switch. */\n  size?: ToggleSwitchSize\n}\n\ninterface ToggleSwitchWithVisibleLabel extends ToggleSwitchBaseProps {\n  \"aria-labelledby\"?: never\n  /** When true, hides the visible label and sets it as aria-label on the input instead. */\n  hideLabel?: false\n  /**\n   * The label content for the toggle switch. Required unless\n   * `aria-labelledby` is provided to reference an external label. When\n   * using non-string content (e.g. JSX), it must not contain\n   * interactive elements. This includes native HTML elements such as\n   * `<a>` and `<button>`, as well as Tapestry or Tapestry-React\n   * interactive components.\n   */\n  label: React.ReactNode\n}\n\ninterface ToggleSwitchWithHiddenLabel extends ToggleSwitchBaseProps {\n  \"aria-labelledby\"?: never\n  /** When true, hides the visible label and sets it as aria-label on the input instead. */\n  hideLabel: true\n  /** Label text for the toggle switch, used as an accessible `aria-label`. */\n  label: string\n}\n\ninterface ToggleSwitchWithAriaLabelledBy extends ToggleSwitchBaseProps {\n  \"aria-labelledby\": string\n  hideLabel?: never\n  /** Not available when `aria-labelledby` is provided. */\n  label?: never\n}\n\nexport type ToggleSwitchProps =\n  | ToggleSwitchWithVisibleLabel\n  | ToggleSwitchWithHiddenLabel\n  | ToggleSwitchWithAriaLabelledBy\n\nexport type ToggleSwitchElementProps = Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  keyof ToggleSwitchProps | \"type\" | \"required\" | \"aria-required\"\n> &\n  ToggleSwitchProps\n\n/**\n * A toggle switch component that renders as a checkbox input styled as a switch.\n *\n * **Required:** You must provide either:\n * - `label` - Label content for the switch (must be a string when `hideLabel` is true)\n * - `aria-labelledby` - ID of an external element that provides the label\n *\n * When using non-string content for `label` (e.g. JSX), it must not contain\n * interactive elements. This includes native HTML elements such as `<a>` and\n * `<button>`, as well as Tapestry or Tapestry-React interactive components.\n *\n * @component\n * @see {@link https://planningcenter.github.io/tapestry/?path=/docs/components-toggle-switch--docs | Storybook Documentation}\n * @see {@link https://github.com/planningcenter/tapestry/tree/main/packages/tapestry-migration-cli | Migration CLI: Available}\n */\nexport const ToggleSwitch = forwardRef<\n  HTMLInputElement,\n  ToggleSwitchElementProps\n>(\n  (\n    {\n      \"aria-describedby\": ariaDescribedby,\n      checked,\n      className,\n      description,\n      hideLabel = false,\n      id,\n      label,\n      size = \"md\",\n      ...restProps\n    }: ToggleSwitchElementProps,\n    ref\n  ) => {\n    const combinedClassName = classNames(\n      \"tds-toggle-switch\",\n      size && size === \"sm\" && `tds-toggle-switch--sm`,\n      hideLabel && `tds-toggle-switch--hide-label`,\n      className\n    )\n\n    const stableId = useId()\n    const toggleSwitchId = id || `tds-toggle-switch-${stableId}`\n\n    return (\n      <div className={combinedClassName}>\n        <div className=\"tds-toggle-switch-track\" aria-hidden=\"true\"></div>\n        <input\n          {...restProps}\n          id={toggleSwitchId}\n          type=\"checkbox\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-label={hideLabel ? (label as string) : undefined}\n          aria-describedby={\n            description && !hideLabel\n              ? `${toggleSwitchId}-description`\n              : ariaDescribedby\n          }\n          checked={checked}\n          ref={ref}\n        />\n        {label && !hideLabel && <label htmlFor={toggleSwitchId}>{label}</label>}\n        {description && !hideLabel && (\n          <p\n            id={`${toggleSwitchId}-description`}\n            className=\"tds-toggle-switch-description\"\n          >\n            {description}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\n\nToggleSwitch.displayName = \"ToggleSwitch\"\n"],"names":["React"],"mappings":";;;;AA4DA;;;;;;;;;;;;;;AAcG;AACI,MAAM,YAAY,GAAG,UAAU,CAIpC,CACE,EACE,kBAAkB,EAAE,eAAe,EACnC,OAAO,EACP,SAAS,EACT,WAAW,EACX,SAAS,GAAG,KAAK,EACjB,EAAE,EACF,KAAK,EACL,IAAI,GAAG,IAAI,EACX,GAAG,SAAS,EACa,EAC3B,GAAG,KACD;IACF,MAAM,iBAAiB,GAAG,UAAU,CAClC,mBAAmB,EACnB,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,CAAA,qBAAA,CAAuB,EAChD,SAAS,IAAI,+BAA+B,EAC5C,SAAS,CACV;AAED,IAAA,MAAM,QAAQ,GAAG,KAAK,EAAE;AACxB,IAAA,MAAM,cAAc,GAAG,EAAE,IAAI,CAAA,kBAAA,EAAqB,QAAQ,EAAE;AAE5D,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,iBAAiB,EAAA;AAC/B,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,yBAAyB,EAAA,aAAA,EAAa,MAAM,EAAA,CAAO;AAClE,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,GACM,SAAS,EACb,EAAE,EAAE,cAAc,EAClB,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,QAAQ,EAAA,cAAA,EACC,OAAO,EAAA,YAAA,EACT,SAAS,GAAI,KAAgB,GAAG,SAAS,EAAA,kBAAA,EAEnD,WAAW,IAAI,CAAC;kBACZ,CAAA,EAAG,cAAc,CAAA,YAAA;kBACjB,eAAe,EAErB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EAAA,CACR;QACD,KAAK,IAAI,CAAC,SAAS,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAE,cAAc,EAAA,EAAG,KAAK,CAAS;QACtE,WAAW,IAAI,CAAC,SAAS,KACxBA,cAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EACE,EAAE,EAAE,CAAA,EAAG,cAAc,cAAc,EACnC,SAAS,EAAC,+BAA+B,EAAA,EAExC,WAAW,CACV,CACL,CACG;AAEV,CAAC;AAGH,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}