@purpur/library 10.1.1 → 10.2.0

package/dist/rich-text.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./RichText-B865Qkzj.js");exports.RichText=e.RichText;exports.richToPlainText=e.richToPlainText;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./RichText-CeYecUFV.js");exports.RichText=e.RichText;exports.richToPlainText=e.richToPlainText;
 //# sourceMappingURL=rich-text.cjs.js.map

package/dist/rich-text.es.js

@@ -1,4 +1,4 @@
-import { R as e, r as i } from "./RichText-CPkBwXNI.mjs";
+import { R as e, r as i } from "./RichText-CwQfDo_S.mjs";
 export {
   e as RichText,
   i as richToPlainText

package/dist/search-field-BR4gETPP.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),g=require("react"),C=require("./use-autocomplete.es-Djt1u2i8.js"),R=require("./listbox-lXO21cJV.js"),M=require("./paragraph-B8HFdNne.js"),k=require("./bind-DeUYJ6m9.js"),D=require("./search.es-Cg2amJSR.js"),B=require("./text-field-BSgqJjpv.js"),I=require("./button-C5CYysw5.js"),V={"purpur-search-field":"_purpur-search-field_fgjyk_1","purpur-search-field--has-clear-button":"_purpur-search-field--has-clear-button_fgjyk_4","purpur-search-field--no-gap":"_purpur-search-field--no-gap_fgjyk_13","purpur-search-field__wrapper":"_purpur-search-field__wrapper_fgjyk_17","purpur-search-field__wrapper--gap":"_purpur-search-field__wrapper--gap_fgjyk_20","purpur-search-field__search-icon":"_purpur-search-field__search-icon_fgjyk_24","purpur-search-field__close-icon":"_purpur-search-field__close-icon_fgjyk_24","purpur-search-field__search-icon--negative":"_purpur-search-field__search-icon--negative_fgjyk_27","purpur-search-field__close-icon--negative":"_purpur-search-field__close-icon--negative_fgjyk_27","purpur-search-field__autocomplete-root":"_purpur-search-field__autocomplete-root_fgjyk_30","purpur-search-field__listbox":"_purpur-search-field__listbox_fgjyk_34"},E={"purpur-search-field-button":"_purpur-search-field-button_c16yo_1","purpur-search-field-button--icon-only":"_purpur-search-field-button--icon-only_c16yo_1"},H=k.c.bind(E),L="purpur-search-field-button",G=({["data-testid"]:s,disabled:u,iconOnly:p,negative:l,label:_,type:c="submit",onClick:t})=>{const i={className:H(L,{[`${L}--icon-only`]:p}),disabled:u,"data-testid":s,negative:l,onClick:t};return p?e.jsx(I.Button,{...i,"aria-label":_,iconOnly:!0,size:"sm",type:c,variant:"primary",children:e.jsx(D.s,{size:"xs"})}):e.jsx(I.Button,{...i,size:"sm",type:c,variant:"primary",children:_})},J=["button-attached","no-button"],y=k.c.bind(V),d="purpur-search-field",N=g.forwardRef(({["data-testid"]:s,className:u,clearButtonAriaLabel:p,disabled:l,submitBehavior:_="form",iconOnlySearchButton:c,negative:t=!1,onClear:i,onSearch:f,searchButtonLabel:x,variant:a,formRef:j,wrapperStyle:m,...n},v)=>{const r=o=>s?`${s}-${o}`:void 0,$=(typeof n.value=="number"?n.value!==void 0:n.value?.length)&&!l&&!n.readOnly&&!n.loading,h=_==="manual",K=y(u,d,{[`${d}--no-gap`]:a==="button-attached",[`${d}--has-clear-button`]:$}),q={ref:v,className:K,clearButtonAriaLabel:p,disabled:l,negative:t,onClear:i,startAdornment:c?null:e.jsx(D.s,{size:"xs",className:y(`${d}__search-icon`,{[`${d}__search-icon--negative`]:t})},"1"),"data-testid":r("text-field"),type:"search",...n},F=a!=="no-button"?e.jsx(G,{type:h?"button":"submit",onClick:h?o=>f?.(o):void 0,disabled:l,iconOnly:c,negative:t,label:x,"data-testid":r("button")}):null;if(h){const o=b=>{n.onKeyDown?.(b),b.key==="Enter"&&!b.defaultPrevented&&(b.preventDefault(),f?.(b))};return e.jsx("div",{className:y(`${d}__wrapper`),"data-testid":s,style:m,children:e.jsx(B.TextField,{...q,onKeyDown:o,afterField:F})})}return e.jsx("form",{ref:j,className:y(`${d}__wrapper`),"data-testid":s,style:m,onSubmit:o=>{o.preventDefault(),f?.(o)},children:e.jsx(B.TextField,{...q,afterField:F})})});N.displayName="SearchFieldBase";const O=k.c.bind(V),A="purpur-search-field",w=g.forwardRef(({suggestions:s,suggestionsLabel:u,onSelectSuggestion:p,openSuggestionsOnFocus:l,suggestionsMaxHeight:_,formatOption:c,...t},i)=>{const f=g.useId(),x=t.id??f,a=C.te({id:x,options:s,listboxLabel:u,disabled:t.disabled,negative:t.negative,readOnly:t.readOnly,openOnFocus:l,listboxMaxHeight:_,onSelect:p,"data-testid":t["data-testid"]}),j=r=>{a.inputRef.current=r,typeof i=="function"?i(r):i&&(i.current=r)},m=r=>{t.onChange?.(r),a.isOpen||a.openListbox()},n=t.value!=null?String(t.value):"",v=r=>c?c(r,n):e.jsx(C.x,{text:r.label,query:n});return e.jsxs("div",{ref:a.rootRef,className:O(`${A}__autocomplete-root`),children:[e.jsx(N,{ref:j,...t,onChange:m,id:x,wrapperStyle:a.anchorStyle,...a.inputProps}),a.isOpen&&e.jsx(R.Listbox,{...a.listboxProps,className:O(`${A}__listbox`),children:s.map((r,S)=>{const{key:$,...h}=a.getListboxItemProps(r,S);return e.jsx(R.Listbox.Item,{...h,children:e.jsx(M.Paragraph,{disabled:r.disabled,negative:t.negative,children:v(r)})},$)})})]})});w.displayName="SearchFieldAutocomplete";const z=g.forwardRef((s,u)=>s.suggestions?e.jsx(w,{ref:u,...s}):e.jsx(N,{ref:u,...s}));z.displayName="SearchField";exports.SearchField=z;exports.SearchFieldAutocomplete=w;exports.searchFieldVariants=J;
+//# sourceMappingURL=search-field-BR4gETPP.js.map

package/dist/search-field-BR4gETPP.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-field-BR4gETPP.js","sources":["../../../components/search-field/src/search-field-button.tsx","../../../components/search-field/src/search-field-base.tsx","../../../components/search-field/src/search-field-autocomplete.tsx","../../../components/search-field/src/search-field.tsx"],"sourcesContent":["import React from \"react\";\nimport { Button } from \"@purpur/button\";\nimport { IconSearch } from \"@purpur/icon/search\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field-button.module.scss\";\n\ntype Props = {\n  [\"data-testid\"]?: string;\n  disabled?: boolean;\n  iconOnly?: boolean;\n  negative?: boolean;\n  label: string;\n  type?: \"submit\" | \"button\";\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field-button\";\n\nexport const SearchFieldButton = ({\n  [\"data-testid\"]: dataTestid,\n  disabled,\n  iconOnly,\n  negative,\n  label,\n  type = \"submit\",\n  onClick,\n}: Props) => {\n  const buttonProps = {\n    className: cx(rootClassName, {\n      [`${rootClassName}--icon-only`]: iconOnly,\n    }),\n    disabled,\n    [\"data-testid\"]: dataTestid,\n    negative,\n    onClick,\n  };\n\n  if (iconOnly) {\n    return (\n      <Button {...buttonProps} aria-label={label} iconOnly size=\"sm\" type={type} variant=\"primary\">\n        <IconSearch size=\"xs\" />\n      </Button>\n    );\n  }\n\n  return (\n    <Button {...buttonProps} size=\"sm\" type={type} variant=\"primary\">\n      {label}\n    </Button>\n  );\n};\n","import React, {\n  type ChangeEvent,\n  type CSSProperties,\n  forwardRef,\n  type RefObject,\n  type SubmitEvent,\n} from \"react\";\nimport { IconSearch } from \"@purpur/icon/search\";\nimport { TextField, type TextFieldProps } from \"@purpur/text-field\";\nimport { type AutocompleteOption } from \"@purpur/use-autocomplete\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field.module.scss\";\nimport { SearchFieldButton } from \"./search-field-button\";\n\nexport const searchFieldVariants = [\"button-attached\", \"no-button\"] as const;\n\ntype Variant = (typeof searchFieldVariants)[number];\n\ntype DefaultProps = {\n  [\"data-testid\"]?: string;\n  clearButtonAriaLabel: string;\n  disabled?: boolean;\n  /**\n   * Will display only a search icon in the search button if `true`.\n   * */\n  iconOnlySearchButton?: boolean;\n  negative?: boolean;\n  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * Event handler called when the clear button is clicked.\n   * */\n  onClear: () => void;\n  /**\n   * Event handler called when the search is triggered.\n   * */\n  onSearch?: (event?: React.SyntheticEvent) => void;\n  /**\n   * Controls how the search field handles submission.\n   * - `\"form\"` (default): Renders a `<form>` element and submits via form submission.\n   * - `\"manual\"`: Renders a `<div>` instead of a `<form>` element.\n   *   Use this when the component is nested inside another form.\n   * */\n  submitBehavior?: \"form\" | \"manual\";\n  /**\n   * The label text (or `aria-label` if `iconOnlySearchButton` is `true`) of the search button.\n   * */\n  searchButtonLabel?: string;\n  variant: Variant;\n  formRef?: RefObject<HTMLFormElement>;\n};\n\ntype TextSearchButton = {\n  iconOnlySearchButton?: false;\n  searchButtonLabel: string;\n  variant: \"button-attached\";\n};\n\ntype IconOnlySearchButton = {\n  iconOnlySearchButton: true;\n  searchButtonLabel: string;\n  variant: \"button-attached\";\n};\n\ntype NoButton = {\n  searchButtonLabel?: never;\n  variant: \"no-button\";\n};\n\nexport type SearchFieldBaseProps = DefaultProps &\n  (TextSearchButton | IconOnlySearchButton | NoButton) &\n  Omit<TextFieldProps, \"startAdornment\" | \"endAdornment\" | \"afterField\" | \"onChange\" | \"variant\">;\n\ntype SearchFieldBaseInternalProps = SearchFieldBaseProps & {\n  wrapperStyle?: CSSProperties;\n};\n\ntype SearchFieldAutocompleteSharedProps = {\n  /**\n   * Called when the user selects a suggestion.\n   */\n  onSelectSuggestion?: (option: AutocompleteOption) => void;\n  /**\n   * Open the suggestions listbox when the input receives focus.\n   */\n  openSuggestionsOnFocus?: boolean;\n  /**\n   * Maximum height of the suggestions listbox. A number is interpreted as px.\n   */\n  suggestionsMaxHeight?: string | number;\n  /** Custom renderer for an option's label in the listbox, given the current input value. Defaults to bolding the matched text. */\n  formatOption?: (option: AutocompleteOption, inputValue: string) => React.ReactNode;\n};\n\ntype SearchFieldWithoutAutocomplete = SearchFieldAutocompleteSharedProps & {\n  suggestions?: never;\n  suggestionsLabel?: never;\n};\n\ntype SearchFieldWithAutocomplete = SearchFieldAutocompleteSharedProps & {\n  /**\n   * The list of suggestions to display in a listbox below the field.\n   * No filtering is applied — pass the already-correct (pre-filtered) list.\n   * If autocomplete should stay enabled while there are temporarily no matches,\n   * pass an empty array instead of `undefined` or `null`. Changing this prop\n   * from an absent value to an array switches between the regular and\n   * autocomplete variants, which causes a re-render, drops input focus, and\n   * hides the listbox.\n   */\n  suggestions: AutocompleteOption[];\n  /**\n   * Accessible label for the suggestions listbox.\n   */\n  suggestionsLabel: string;\n};\n\nexport type SearchFieldAutocompleteEnhancements =\n  | SearchFieldWithoutAutocomplete\n  | SearchFieldWithAutocomplete;\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field\";\n\nexport const SearchFieldBase = forwardRef<HTMLInputElement, SearchFieldBaseInternalProps>(\n  (\n    {\n      [\"data-testid\"]: dataTestId,\n      className,\n      clearButtonAriaLabel,\n      disabled,\n      submitBehavior = \"form\",\n      iconOnlySearchButton,\n      negative = false,\n      onClear,\n      onSearch,\n      searchButtonLabel,\n      variant,\n      formRef,\n      wrapperStyle,\n      ...props\n    },\n    ref\n  ) => {\n    const getTestId = (name: string) => (dataTestId ? `${dataTestId}-${name}` : undefined);\n    const hasValue =\n      typeof props.value === \"number\" ? props.value !== undefined : props.value?.length;\n    const hasClearButton = hasValue && !disabled && !props.readOnly && !props.loading;\n    const isManualSubmit = submitBehavior === \"manual\";\n\n    const classes = cx(className, rootClassName, {\n      [`${rootClassName}--no-gap`]: variant === \"button-attached\",\n      [`${rootClassName}--has-clear-button`]: hasClearButton,\n    });\n\n    const textFieldProps: TextFieldProps = {\n      ref,\n      className: classes,\n      clearButtonAriaLabel,\n      disabled,\n      negative,\n      onClear,\n      startAdornment: !iconOnlySearchButton ? (\n        <IconSearch\n          size=\"xs\"\n          className={cx(`${rootClassName}__search-icon`, {\n            [`${rootClassName}__search-icon--negative`]: negative,\n          })}\n          key=\"1\"\n        />\n      ) : null,\n      \"data-testid\": getTestId(\"text-field\"),\n      type: \"search\" as const,\n      ...props,\n    };\n\n    const searchButton =\n      variant !== \"no-button\" ? (\n        <SearchFieldButton\n          type={isManualSubmit ? \"button\" : \"submit\"}\n          onClick={isManualSubmit ? (event) => onSearch?.(event) : undefined}\n          disabled={disabled}\n          iconOnly={iconOnlySearchButton}\n          negative={negative}\n          label={searchButtonLabel}\n          data-testid={getTestId(\"button\")}\n        />\n      ) : null;\n\n    if (isManualSubmit) {\n      const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (event.key === \"Enter\" && !event.defaultPrevented) {\n          event.preventDefault();\n          onSearch?.(event);\n        }\n      };\n\n      return (\n        <div\n          className={cx(`${rootClassName}__wrapper`)}\n          data-testid={dataTestId}\n          style={wrapperStyle}\n        >\n          <TextField {...textFieldProps} onKeyDown={handleKeyDown} afterField={searchButton} />\n        </div>\n      );\n    }\n\n    return (\n      <form\n        ref={formRef}\n        className={cx(`${rootClassName}__wrapper`)}\n        data-testid={dataTestId}\n        style={wrapperStyle}\n        onSubmit={(e: SubmitEvent<HTMLFormElement>) => {\n          e.preventDefault();\n          onSearch?.(e);\n        }}\n      >\n        <TextField {...textFieldProps} afterField={searchButton} />\n      </form>\n    );\n  }\n);\n\nSearchFieldBase.displayName = \"SearchFieldBase\";\n","import React, { forwardRef, useId } from \"react\";\nimport { HighlightMatch } from \"@purpur/highlight-match\";\nimport { Listbox } from \"@purpur/listbox\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport { type AutocompleteOption, useAutocomplete } from \"@purpur/use-autocomplete\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field.module.scss\";\nimport {\n  type SearchFieldAutocompleteEnhancements,\n  SearchFieldBase,\n  type SearchFieldBaseProps,\n} from \"./search-field-base\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field\";\n\nexport type SearchFieldAutocompleteProps = SearchFieldBaseProps &\n  Extract<SearchFieldAutocompleteEnhancements, { suggestions: AutocompleteOption[] }>;\n\nexport const SearchFieldAutocomplete = forwardRef<HTMLInputElement, SearchFieldAutocompleteProps>(\n  (\n    {\n      suggestions,\n      suggestionsLabel,\n      onSelectSuggestion,\n      openSuggestionsOnFocus,\n      suggestionsMaxHeight,\n      formatOption,\n      ...searchFieldProps\n    },\n    ref\n  ) => {\n    const randomId = useId();\n    const inputId = (searchFieldProps.id as string | undefined) ?? randomId;\n    const autocomplete = useAutocomplete({\n      id: inputId,\n      options: suggestions,\n      listboxLabel: suggestionsLabel,\n      disabled: searchFieldProps.disabled,\n      negative: searchFieldProps.negative,\n      readOnly: searchFieldProps.readOnly,\n      openOnFocus: openSuggestionsOnFocus,\n      listboxMaxHeight: suggestionsMaxHeight,\n      onSelect: onSelectSuggestion,\n      [\"data-testid\"]: searchFieldProps[\"data-testid\"],\n    });\n\n    const setInputRef = (node: HTMLInputElement | null) => {\n      (autocomplete.inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node;\n      if (typeof ref === \"function\") ref(node);\n      else if (ref) (ref as React.MutableRefObject<HTMLInputElement | null>).current = node;\n    };\n\n    const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n      searchFieldProps.onChange?.(event);\n      if (!autocomplete.isOpen) {\n        autocomplete.openListbox();\n      }\n    };\n\n    const inputValue = searchFieldProps.value != null ? String(searchFieldProps.value) : \"\";\n\n    const renderOptionLabel = (option: AutocompleteOption) =>\n      formatOption ? (\n        formatOption(option, inputValue)\n      ) : (\n        <HighlightMatch text={option.label} query={inputValue} />\n      );\n\n    return (\n      <div\n        ref={autocomplete.rootRef as React.RefObject<HTMLDivElement>}\n        className={cx(`${rootClassName}__autocomplete-root`)}\n      >\n        <SearchFieldBase\n          ref={setInputRef}\n          {...searchFieldProps}\n          onChange={handleInputChange}\n          id={inputId}\n          wrapperStyle={autocomplete.anchorStyle}\n          {...autocomplete.inputProps}\n        />\n        {autocomplete.isOpen && (\n          <Listbox {...autocomplete.listboxProps} className={cx(`${rootClassName}__listbox`)}>\n            {suggestions.map((option, index) => {\n              const { key, ...listboxItemProps } = autocomplete.getListboxItemProps(option, index);\n\n              return (\n                <Listbox.Item key={key} {...listboxItemProps}>\n                  <Paragraph disabled={option.disabled} negative={searchFieldProps.negative}>\n                    {renderOptionLabel(option)}\n                  </Paragraph>\n                </Listbox.Item>\n              );\n            })}\n          </Listbox>\n        )}\n      </div>\n    );\n  }\n);\n\nSearchFieldAutocomplete.displayName = \"SearchFieldAutocomplete\";\n","import React, { forwardRef } from \"react\";\n\nimport { SearchFieldAutocomplete } from \"./search-field-autocomplete\";\nimport {\n  type SearchFieldAutocompleteEnhancements,\n  SearchFieldBase,\n  type SearchFieldBaseProps,\n  searchFieldVariants,\n} from \"./search-field-base\";\n\nexport { searchFieldVariants };\n\nexport type SearchFieldProps = SearchFieldBaseProps & SearchFieldAutocompleteEnhancements;\n\nexport const SearchField = forwardRef<HTMLInputElement, SearchFieldProps>((props, ref) => {\n  if (props.suggestions) {\n    return <SearchFieldAutocomplete ref={ref} {...props} />;\n  }\n\n  return <SearchFieldBase ref={ref} {...props} />;\n});\n\nSearchField.displayName = \"SearchField\";\n\nexport {\n  SearchFieldAutocomplete,\n  type SearchFieldAutocompleteProps,\n} from \"./search-field-autocomplete\";\n"],"names":["cx","c","styles","rootClassName","SearchFieldButton","dataTestid","disabled","iconOnly","negative","label","type","onClick","buttonProps","Button","IconSearch","jsx","searchFieldVariants","SearchFieldBase","forwardRef","dataTestId","className","clearButtonAriaLabel","submitBehavior","iconOnlySearchButton","onClear","onSearch","searchButtonLabel","variant","formRef","wrapperStyle","props","ref","getTestId","name","hasClearButton","isManualSubmit","classes","textFieldProps","searchButton","event","handleKeyDown","TextField","e","SearchFieldAutocomplete","suggestions","suggestionsLabel","onSelectSuggestion","openSuggestionsOnFocus","suggestionsMaxHeight","formatOption","searchFieldProps","randomId","useId","inputId","autocomplete","useAutocomplete","setInputRef","node","handleInputChange","inputValue","renderOptionLabel","option","HighlightMatch","jsxs","Listbox","index","key","listboxItemProps","Paragraph","SearchField"],"mappings":"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"}

package/dist/search-field-DyBcoB9g.mjs

@@ -0,0 +1,186 @@
+import { jsx as t, jsxs as K } from "react/jsx-runtime";
+import { forwardRef as k, useId as M } from "react";
+import { t as q, x as E } from "./use-autocomplete.es-CoAeiJiu.mjs";
+import { L as I } from "./listbox-CtV-Vcmy.mjs";
+import { P as H } from "./paragraph-CwAdFoIm.mjs";
+import { c as j } from "./bind-CU-R61T-.mjs";
+import { s as F } from "./search.es-DoFKg2Hr.mjs";
+import { T as L } from "./text-field-MQHeITxy.mjs";
+import { b as O } from "./button-mHw_J7JU.mjs";
+const R = {
+  "purpur-search-field": "_purpur-search-field_fgjyk_1",
+  "purpur-search-field--has-clear-button": "_purpur-search-field--has-clear-button_fgjyk_4",
+  "purpur-search-field--no-gap": "_purpur-search-field--no-gap_fgjyk_13",
+  "purpur-search-field__wrapper": "_purpur-search-field__wrapper_fgjyk_17",
+  "purpur-search-field__wrapper--gap": "_purpur-search-field__wrapper--gap_fgjyk_20",
+  "purpur-search-field__search-icon": "_purpur-search-field__search-icon_fgjyk_24",
+  "purpur-search-field__close-icon": "_purpur-search-field__close-icon_fgjyk_24",
+  "purpur-search-field__search-icon--negative": "_purpur-search-field__search-icon--negative_fgjyk_27",
+  "purpur-search-field__close-icon--negative": "_purpur-search-field__close-icon--negative_fgjyk_27",
+  "purpur-search-field__autocomplete-root": "_purpur-search-field__autocomplete-root_fgjyk_30",
+  "purpur-search-field__listbox": "_purpur-search-field__listbox_fgjyk_34"
+}, G = {
+  "purpur-search-field-button": "_purpur-search-field-button_c16yo_1",
+  "purpur-search-field-button--icon-only": "_purpur-search-field-button--icon-only_c16yo_1"
+}, J = j.bind(G), B = "purpur-search-field-button", P = ({
+  ["data-testid"]: a,
+  disabled: i,
+  iconOnly: d,
+  negative: c,
+  label: _,
+  type: u = "submit",
+  onClick: e
+}) => {
+  const o = {
+    className: J(B, {
+      [`${B}--icon-only`]: d
+    }),
+    disabled: i,
+    "data-testid": a,
+    negative: c,
+    onClick: e
+  };
+  return d ? /* @__PURE__ */ t(O, { ...o, "aria-label": _, iconOnly: !0, size: "sm", type: u, variant: "primary", children: /* @__PURE__ */ t(F, { size: "xs" }) }) : /* @__PURE__ */ t(O, { ...o, size: "sm", type: u, variant: "primary", children: _ });
+}, ae = ["button-attached", "no-button"], g = j.bind(R), p = "purpur-search-field", N = k(
+  ({
+    ["data-testid"]: a,
+    className: i,
+    clearButtonAriaLabel: d,
+    disabled: c,
+    submitBehavior: _ = "form",
+    iconOnlySearchButton: u,
+    negative: e = !1,
+    onClear: o,
+    onSearch: f,
+    searchButtonLabel: b,
+    variant: s,
+    formRef: x,
+    wrapperStyle: y,
+    ...n
+  }, v) => {
+    const r = (l) => a ? `${a}-${l}` : void 0, $ = (typeof n.value == "number" ? n.value !== void 0 : n.value?.length) && !c && !n.readOnly && !n.loading, h = _ === "manual", A = g(i, p, {
+      [`${p}--no-gap`]: s === "button-attached",
+      [`${p}--has-clear-button`]: $
+    }), S = {
+      ref: v,
+      className: A,
+      clearButtonAriaLabel: d,
+      disabled: c,
+      negative: e,
+      onClear: o,
+      startAdornment: u ? null : /* @__PURE__ */ t(
+        F,
+        {
+          size: "xs",
+          className: g(`${p}__search-icon`, {
+            [`${p}__search-icon--negative`]: e
+          })
+        },
+        "1"
+      ),
+      "data-testid": r("text-field"),
+      type: "search",
+      ...n
+    }, C = s !== "no-button" ? /* @__PURE__ */ t(
+      P,
+      {
+        type: h ? "button" : "submit",
+        onClick: h ? (l) => f?.(l) : void 0,
+        disabled: c,
+        iconOnly: u,
+        negative: e,
+        label: b,
+        "data-testid": r("button")
+      }
+    ) : null;
+    if (h) {
+      const l = (m) => {
+        n.onKeyDown?.(m), m.key === "Enter" && !m.defaultPrevented && (m.preventDefault(), f?.(m));
+      };
+      return /* @__PURE__ */ t(
+        "div",
+        {
+          className: g(`${p}__wrapper`),
+          "data-testid": a,
+          style: y,
+          children: /* @__PURE__ */ t(L, { ...S, onKeyDown: l, afterField: C })
+        }
+      );
+    }
+    return /* @__PURE__ */ t(
+      "form",
+      {
+        ref: x,
+        className: g(`${p}__wrapper`),
+        "data-testid": a,
+        style: y,
+        onSubmit: (l) => {
+          l.preventDefault(), f?.(l);
+        },
+        children: /* @__PURE__ */ t(L, { ...S, afterField: C })
+      }
+    );
+  }
+);
+N.displayName = "SearchFieldBase";
+const D = j.bind(R), z = "purpur-search-field", V = k(
+  ({
+    suggestions: a,
+    suggestionsLabel: i,
+    onSelectSuggestion: d,
+    openSuggestionsOnFocus: c,
+    suggestionsMaxHeight: _,
+    formatOption: u,
+    ...e
+  }, o) => {
+    const f = M(), b = e.id ?? f, s = q({
+      id: b,
+      options: a,
+      listboxLabel: i,
+      disabled: e.disabled,
+      negative: e.negative,
+      readOnly: e.readOnly,
+      openOnFocus: c,
+      listboxMaxHeight: _,
+      onSelect: d,
+      "data-testid": e["data-testid"]
+    }), x = (r) => {
+      s.inputRef.current = r, typeof o == "function" ? o(r) : o && (o.current = r);
+    }, y = (r) => {
+      e.onChange?.(r), s.isOpen || s.openListbox();
+    }, n = e.value != null ? String(e.value) : "", v = (r) => u ? u(r, n) : /* @__PURE__ */ t(E, { text: r.label, query: n });
+    return /* @__PURE__ */ K(
+      "div",
+      {
+        ref: s.rootRef,
+        className: D(`${z}__autocomplete-root`),
+        children: [
+          /* @__PURE__ */ t(
+            N,
+            {
+              ref: x,
+              ...e,
+              onChange: y,
+              id: b,
+              wrapperStyle: s.anchorStyle,
+              ...s.inputProps
+            }
+          ),
+          s.isOpen && /* @__PURE__ */ t(I, { ...s.listboxProps, className: D(`${z}__listbox`), children: a.map((r, w) => {
+            const { key: $, ...h } = s.getListboxItemProps(r, w);
+            return /* @__PURE__ */ t(I.Item, { ...h, children: /* @__PURE__ */ t(H, { disabled: r.disabled, negative: e.negative, children: v(r) }) }, $);
+          }) })
+        ]
+      }
+    );
+  }
+);
+V.displayName = "SearchFieldAutocomplete";
+const Q = k((a, i) => a.suggestions ? /* @__PURE__ */ t(V, { ref: i, ...a }) : /* @__PURE__ */ t(N, { ref: i, ...a }));
+Q.displayName = "SearchField";
+export {
+  Q as S,
+  V as a,
+  ae as s
+};
+//# sourceMappingURL=search-field-DyBcoB9g.mjs.map

package/dist/search-field-DyBcoB9g.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-field-DyBcoB9g.mjs","sources":["../../../components/search-field/src/search-field-button.tsx","../../../components/search-field/src/search-field-base.tsx","../../../components/search-field/src/search-field-autocomplete.tsx","../../../components/search-field/src/search-field.tsx"],"sourcesContent":["import React from \"react\";\nimport { Button } from \"@purpur/button\";\nimport { IconSearch } from \"@purpur/icon/search\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field-button.module.scss\";\n\ntype Props = {\n  [\"data-testid\"]?: string;\n  disabled?: boolean;\n  iconOnly?: boolean;\n  negative?: boolean;\n  label: string;\n  type?: \"submit\" | \"button\";\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field-button\";\n\nexport const SearchFieldButton = ({\n  [\"data-testid\"]: dataTestid,\n  disabled,\n  iconOnly,\n  negative,\n  label,\n  type = \"submit\",\n  onClick,\n}: Props) => {\n  const buttonProps = {\n    className: cx(rootClassName, {\n      [`${rootClassName}--icon-only`]: iconOnly,\n    }),\n    disabled,\n    [\"data-testid\"]: dataTestid,\n    negative,\n    onClick,\n  };\n\n  if (iconOnly) {\n    return (\n      <Button {...buttonProps} aria-label={label} iconOnly size=\"sm\" type={type} variant=\"primary\">\n        <IconSearch size=\"xs\" />\n      </Button>\n    );\n  }\n\n  return (\n    <Button {...buttonProps} size=\"sm\" type={type} variant=\"primary\">\n      {label}\n    </Button>\n  );\n};\n","import React, {\n  type ChangeEvent,\n  type CSSProperties,\n  forwardRef,\n  type RefObject,\n  type SubmitEvent,\n} from \"react\";\nimport { IconSearch } from \"@purpur/icon/search\";\nimport { TextField, type TextFieldProps } from \"@purpur/text-field\";\nimport { type AutocompleteOption } from \"@purpur/use-autocomplete\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field.module.scss\";\nimport { SearchFieldButton } from \"./search-field-button\";\n\nexport const searchFieldVariants = [\"button-attached\", \"no-button\"] as const;\n\ntype Variant = (typeof searchFieldVariants)[number];\n\ntype DefaultProps = {\n  [\"data-testid\"]?: string;\n  clearButtonAriaLabel: string;\n  disabled?: boolean;\n  /**\n   * Will display only a search icon in the search button if `true`.\n   * */\n  iconOnlySearchButton?: boolean;\n  negative?: boolean;\n  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * Event handler called when the clear button is clicked.\n   * */\n  onClear: () => void;\n  /**\n   * Event handler called when the search is triggered.\n   * */\n  onSearch?: (event?: React.SyntheticEvent) => void;\n  /**\n   * Controls how the search field handles submission.\n   * - `\"form\"` (default): Renders a `<form>` element and submits via form submission.\n   * - `\"manual\"`: Renders a `<div>` instead of a `<form>` element.\n   *   Use this when the component is nested inside another form.\n   * */\n  submitBehavior?: \"form\" | \"manual\";\n  /**\n   * The label text (or `aria-label` if `iconOnlySearchButton` is `true`) of the search button.\n   * */\n  searchButtonLabel?: string;\n  variant: Variant;\n  formRef?: RefObject<HTMLFormElement>;\n};\n\ntype TextSearchButton = {\n  iconOnlySearchButton?: false;\n  searchButtonLabel: string;\n  variant: \"button-attached\";\n};\n\ntype IconOnlySearchButton = {\n  iconOnlySearchButton: true;\n  searchButtonLabel: string;\n  variant: \"button-attached\";\n};\n\ntype NoButton = {\n  searchButtonLabel?: never;\n  variant: \"no-button\";\n};\n\nexport type SearchFieldBaseProps = DefaultProps &\n  (TextSearchButton | IconOnlySearchButton | NoButton) &\n  Omit<TextFieldProps, \"startAdornment\" | \"endAdornment\" | \"afterField\" | \"onChange\" | \"variant\">;\n\ntype SearchFieldBaseInternalProps = SearchFieldBaseProps & {\n  wrapperStyle?: CSSProperties;\n};\n\ntype SearchFieldAutocompleteSharedProps = {\n  /**\n   * Called when the user selects a suggestion.\n   */\n  onSelectSuggestion?: (option: AutocompleteOption) => void;\n  /**\n   * Open the suggestions listbox when the input receives focus.\n   */\n  openSuggestionsOnFocus?: boolean;\n  /**\n   * Maximum height of the suggestions listbox. A number is interpreted as px.\n   */\n  suggestionsMaxHeight?: string | number;\n  /** Custom renderer for an option's label in the listbox, given the current input value. Defaults to bolding the matched text. */\n  formatOption?: (option: AutocompleteOption, inputValue: string) => React.ReactNode;\n};\n\ntype SearchFieldWithoutAutocomplete = SearchFieldAutocompleteSharedProps & {\n  suggestions?: never;\n  suggestionsLabel?: never;\n};\n\ntype SearchFieldWithAutocomplete = SearchFieldAutocompleteSharedProps & {\n  /**\n   * The list of suggestions to display in a listbox below the field.\n   * No filtering is applied — pass the already-correct (pre-filtered) list.\n   * If autocomplete should stay enabled while there are temporarily no matches,\n   * pass an empty array instead of `undefined` or `null`. Changing this prop\n   * from an absent value to an array switches between the regular and\n   * autocomplete variants, which causes a re-render, drops input focus, and\n   * hides the listbox.\n   */\n  suggestions: AutocompleteOption[];\n  /**\n   * Accessible label for the suggestions listbox.\n   */\n  suggestionsLabel: string;\n};\n\nexport type SearchFieldAutocompleteEnhancements =\n  | SearchFieldWithoutAutocomplete\n  | SearchFieldWithAutocomplete;\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field\";\n\nexport const SearchFieldBase = forwardRef<HTMLInputElement, SearchFieldBaseInternalProps>(\n  (\n    {\n      [\"data-testid\"]: dataTestId,\n      className,\n      clearButtonAriaLabel,\n      disabled,\n      submitBehavior = \"form\",\n      iconOnlySearchButton,\n      negative = false,\n      onClear,\n      onSearch,\n      searchButtonLabel,\n      variant,\n      formRef,\n      wrapperStyle,\n      ...props\n    },\n    ref\n  ) => {\n    const getTestId = (name: string) => (dataTestId ? `${dataTestId}-${name}` : undefined);\n    const hasValue =\n      typeof props.value === \"number\" ? props.value !== undefined : props.value?.length;\n    const hasClearButton = hasValue && !disabled && !props.readOnly && !props.loading;\n    const isManualSubmit = submitBehavior === \"manual\";\n\n    const classes = cx(className, rootClassName, {\n      [`${rootClassName}--no-gap`]: variant === \"button-attached\",\n      [`${rootClassName}--has-clear-button`]: hasClearButton,\n    });\n\n    const textFieldProps: TextFieldProps = {\n      ref,\n      className: classes,\n      clearButtonAriaLabel,\n      disabled,\n      negative,\n      onClear,\n      startAdornment: !iconOnlySearchButton ? (\n        <IconSearch\n          size=\"xs\"\n          className={cx(`${rootClassName}__search-icon`, {\n            [`${rootClassName}__search-icon--negative`]: negative,\n          })}\n          key=\"1\"\n        />\n      ) : null,\n      \"data-testid\": getTestId(\"text-field\"),\n      type: \"search\" as const,\n      ...props,\n    };\n\n    const searchButton =\n      variant !== \"no-button\" ? (\n        <SearchFieldButton\n          type={isManualSubmit ? \"button\" : \"submit\"}\n          onClick={isManualSubmit ? (event) => onSearch?.(event) : undefined}\n          disabled={disabled}\n          iconOnly={iconOnlySearchButton}\n          negative={negative}\n          label={searchButtonLabel}\n          data-testid={getTestId(\"button\")}\n        />\n      ) : null;\n\n    if (isManualSubmit) {\n      const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        props.onKeyDown?.(event);\n\n        if (event.key === \"Enter\" && !event.defaultPrevented) {\n          event.preventDefault();\n          onSearch?.(event);\n        }\n      };\n\n      return (\n        <div\n          className={cx(`${rootClassName}__wrapper`)}\n          data-testid={dataTestId}\n          style={wrapperStyle}\n        >\n          <TextField {...textFieldProps} onKeyDown={handleKeyDown} afterField={searchButton} />\n        </div>\n      );\n    }\n\n    return (\n      <form\n        ref={formRef}\n        className={cx(`${rootClassName}__wrapper`)}\n        data-testid={dataTestId}\n        style={wrapperStyle}\n        onSubmit={(e: SubmitEvent<HTMLFormElement>) => {\n          e.preventDefault();\n          onSearch?.(e);\n        }}\n      >\n        <TextField {...textFieldProps} afterField={searchButton} />\n      </form>\n    );\n  }\n);\n\nSearchFieldBase.displayName = \"SearchFieldBase\";\n","import React, { forwardRef, useId } from \"react\";\nimport { HighlightMatch } from \"@purpur/highlight-match\";\nimport { Listbox } from \"@purpur/listbox\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport { type AutocompleteOption, useAutocomplete } from \"@purpur/use-autocomplete\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./search-field.module.scss\";\nimport {\n  type SearchFieldAutocompleteEnhancements,\n  SearchFieldBase,\n  type SearchFieldBaseProps,\n} from \"./search-field-base\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-search-field\";\n\nexport type SearchFieldAutocompleteProps = SearchFieldBaseProps &\n  Extract<SearchFieldAutocompleteEnhancements, { suggestions: AutocompleteOption[] }>;\n\nexport const SearchFieldAutocomplete = forwardRef<HTMLInputElement, SearchFieldAutocompleteProps>(\n  (\n    {\n      suggestions,\n      suggestionsLabel,\n      onSelectSuggestion,\n      openSuggestionsOnFocus,\n      suggestionsMaxHeight,\n      formatOption,\n      ...searchFieldProps\n    },\n    ref\n  ) => {\n    const randomId = useId();\n    const inputId = (searchFieldProps.id as string | undefined) ?? randomId;\n    const autocomplete = useAutocomplete({\n      id: inputId,\n      options: suggestions,\n      listboxLabel: suggestionsLabel,\n      disabled: searchFieldProps.disabled,\n      negative: searchFieldProps.negative,\n      readOnly: searchFieldProps.readOnly,\n      openOnFocus: openSuggestionsOnFocus,\n      listboxMaxHeight: suggestionsMaxHeight,\n      onSelect: onSelectSuggestion,\n      [\"data-testid\"]: searchFieldProps[\"data-testid\"],\n    });\n\n    const setInputRef = (node: HTMLInputElement | null) => {\n      (autocomplete.inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node;\n      if (typeof ref === \"function\") ref(node);\n      else if (ref) (ref as React.MutableRefObject<HTMLInputElement | null>).current = node;\n    };\n\n    const handleInputChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\n      searchFieldProps.onChange?.(event);\n      if (!autocomplete.isOpen) {\n        autocomplete.openListbox();\n      }\n    };\n\n    const inputValue = searchFieldProps.value != null ? String(searchFieldProps.value) : \"\";\n\n    const renderOptionLabel = (option: AutocompleteOption) =>\n      formatOption ? (\n        formatOption(option, inputValue)\n      ) : (\n        <HighlightMatch text={option.label} query={inputValue} />\n      );\n\n    return (\n      <div\n        ref={autocomplete.rootRef as React.RefObject<HTMLDivElement>}\n        className={cx(`${rootClassName}__autocomplete-root`)}\n      >\n        <SearchFieldBase\n          ref={setInputRef}\n          {...searchFieldProps}\n          onChange={handleInputChange}\n          id={inputId}\n          wrapperStyle={autocomplete.anchorStyle}\n          {...autocomplete.inputProps}\n        />\n        {autocomplete.isOpen && (\n          <Listbox {...autocomplete.listboxProps} className={cx(`${rootClassName}__listbox`)}>\n            {suggestions.map((option, index) => {\n              const { key, ...listboxItemProps } = autocomplete.getListboxItemProps(option, index);\n\n              return (\n                <Listbox.Item key={key} {...listboxItemProps}>\n                  <Paragraph disabled={option.disabled} negative={searchFieldProps.negative}>\n                    {renderOptionLabel(option)}\n                  </Paragraph>\n                </Listbox.Item>\n              );\n            })}\n          </Listbox>\n        )}\n      </div>\n    );\n  }\n);\n\nSearchFieldAutocomplete.displayName = \"SearchFieldAutocomplete\";\n","import React, { forwardRef } from \"react\";\n\nimport { SearchFieldAutocomplete } from \"./search-field-autocomplete\";\nimport {\n  type SearchFieldAutocompleteEnhancements,\n  SearchFieldBase,\n  type SearchFieldBaseProps,\n  searchFieldVariants,\n} from \"./search-field-base\";\n\nexport { searchFieldVariants };\n\nexport type SearchFieldProps = SearchFieldBaseProps & SearchFieldAutocompleteEnhancements;\n\nexport const SearchField = forwardRef<HTMLInputElement, SearchFieldProps>((props, ref) => {\n  if (props.suggestions) {\n    return <SearchFieldAutocomplete ref={ref} {...props} />;\n  }\n\n  return <SearchFieldBase ref={ref} {...props} />;\n});\n\nSearchField.displayName = \"SearchField\";\n\nexport {\n  SearchFieldAutocomplete,\n  type SearchFieldAutocompleteProps,\n} from \"./search-field-autocomplete\";\n"],"names":["cx","c","styles","rootClassName","SearchFieldButton","dataTestid","disabled","iconOnly","negative","label","type","onClick","buttonProps","Button","IconSearch","jsx","searchFieldVariants","SearchFieldBase","forwardRef","dataTestId","className","clearButtonAriaLabel","submitBehavior","iconOnlySearchButton","onClear","onSearch","searchButtonLabel","variant","formRef","wrapperStyle","props","ref","getTestId","name","hasClearButton","isManualSubmit","classes","textFieldProps","searchButton","event","handleKeyDown","TextField","e","SearchFieldAutocomplete","suggestions","suggestionsLabel","onSelectSuggestion","openSuggestionsOnFocus","suggestionsMaxHeight","formatOption","searchFieldProps","randomId","useId","inputId","autocomplete","useAutocomplete","setInputRef","node","handleInputChange","inputValue","renderOptionLabel","option","HighlightMatch","jsxs","Listbox","index","key","listboxItemProps","Paragraph","SearchField"],"mappings":"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"}

package/dist/search-field.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./search-field-nzVXak1a.js");exports.SearchField=e.SearchField;exports.SearchFieldAutocomplete=e.SearchFieldAutocomplete;exports.searchFieldVariants=e.searchFieldVariants;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./search-field-BR4gETPP.js");exports.SearchField=e.SearchField;exports.SearchFieldAutocomplete=e.SearchFieldAutocomplete;exports.searchFieldVariants=e.searchFieldVariants;
 //# sourceMappingURL=search-field.cjs.js.map

package/dist/search-field.es.js

@@ -1,4 +1,4 @@
-import { S as r, a as s, s as c } from "./search-field-BTJtRyw5.mjs";
+import { S as r, a as s, s as c } from "./search-field-DyBcoB9g.mjs";
 export {
   r as SearchField,
   s as SearchFieldAutocomplete,

package/dist/{stepper-D59T-Y2_.mjs → stepper-CGBjyjVw.mjs}

@@ -5,7 +5,7 @@ import { l as tr } from "./chevron-left.es-UFhf3v35.mjs";
 import { n as sr } from "./chevron-right.es-D7aVK4ER.mjs";
 import { R as nr, V as pr, S as lr, T as ir } from "./index-B8Mazo6u.mjs";
 import { c as E } from "./bind-CU-R61T-.mjs";
-import { b as or } from "./tooltip-bqdd2lJL.mjs";
+import { b as or } from "./tooltip-DzY9olpb.mjs";
 import { a as ar } from "./checkmark.es-DdgIZN2R.mjs";
 const _r = {
   PRIMARY: "primary"
@@ -466,4 +466,4 @@ M.displayName = "Stepper";
 export {
   M as S
 };
-//# sourceMappingURL=stepper-D59T-Y2_.mjs.map
+//# sourceMappingURL=stepper-CGBjyjVw.mjs.map

package/dist/{stepper-D59T-Y2_.mjs.map → stepper-CGBjyjVw.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"stepper-D59T-Y2_.mjs","sources":["../../../components/stepper/src/constants.ts","../../../components/stepper/src/stepper-container.tsx","../../../components/stepper/src/stepper-content.tsx","../../../components/stepper/src/stepper-link.tsx","../../../components/stepper/src/stepper-nav-items.tsx","../../../components/stepper/src/use-content-focus.hook.ts","../../../components/stepper/src/use-scroll-buttons.hook.ts","../../../components/stepper/src/stepper.tsx"],"sourcesContent":["export const STEPPER_VARIANT = {\n  PRIMARY: \"primary\",\n  SECONDARY: \"secondary\",\n} as const;\n\nexport const VISIBILITY_STATES = {\n  SMALL_SCREEN: \"small-screen\",\n  LARGE_SCREEN: \"large-screen\",\n  ALWAYS: \"always\",\n} as const;\n","import React, { type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-container.module.scss\";\nimport { type StepperVariant } from \"./types\";\n\nconst cx = c.bind(styles);\n\nexport type StepperContainerProps = Omit<BaseProps, \"children\"> & {\n  children: ReactNode;\n  alignWithGrid: boolean;\n  variant: StepperVariant;\n};\n\nconst rootClassName = \"purpur-stepper-container\";\n\nexport const StepperContainer = ({\n  [\"data-testid\"]: dataTestId = \"purpur-stepper-container\",\n  children,\n  className,\n  alignWithGrid,\n  variant,\n  ...props\n}: StepperContainerProps) => {\n  const classes: string = cx(className, rootClassName, {\n    [`${rootClassName}--${variant}`]: variant,\n    [`${rootClassName}--align-with-grid`]: alignWithGrid,\n  });\n\n  return (\n    <div className={classes} data-testid={dataTestId} {...props}>\n      <div\n        className={cx(`${rootClassName}__inner`, {\n          [`${rootClassName}__inner--align-with-grid`]: alignWithGrid,\n        })}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n","import React, { forwardRef, isValidElement, type ReactElement, type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\n\nimport { type Optional, type Step } from \"./types\";\n\nexport type StepperContentProps = Omit<BaseProps, \"children\"> & {\n  children: ReactNode;\n} & Optional<Step, \"disabled\" | \"finished\">;\n\nexport const StepperContent = forwardRef<HTMLDivElement, StepperContentProps>(\n  ({ children, ...props }, ref) => {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { finished, ...rest } = props;\n    return (\n      <div {...rest} ref={ref}>\n        {children}\n      </div>\n    );\n  }\n);\n\nexport const isStepperContent = (child?: ReactNode): child is ReactElement<StepperContentProps> =>\n  !!child && isValidElement<StepperContentProps>(child) && !!child.props.label;\n","import React, { forwardRef, type MouseEvent } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-link.module.scss\";\nimport {\n  type HandleStepChangeFunction,\n  type HandleStepFocusFunction,\n  type Step,\n  type StepperVariant,\n  type VisibilityStates,\n} from \"./types\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-stepper-link\";\n\nexport type StepNumberProps = {\n  current: boolean;\n  disabled: boolean;\n  stepNumber: number;\n  [\"data-testid\"]?: string;\n};\n\nconst StepNumber = ({\n  [\"data-testid\"]: dataTestId,\n  current,\n  disabled,\n  stepNumber,\n}: StepNumberProps) => {\n  return (\n    <div\n      data-testid={dataTestId}\n      className={cx([\n        `${rootClassName}__step-number`,\n        {\n          [`${rootClassName}__step-number--current`]: current,\n        },\n        {\n          [`${rootClassName}__step-number--disabled`]: disabled,\n        },\n      ])}\n    >\n      {stepNumber}\n    </div>\n  );\n};\n\nexport type StepperLinkProps = Omit<BaseProps<\"a\">, \"children\"> & {\n  variant: StepperVariant;\n  step: Step;\n  currentStepIndex: number;\n  index: number;\n  indexOfLastItem: number;\n  whenToBeVisible: VisibilityStates;\n  handleStepChange: HandleStepChangeFunction;\n  handleStepFocus: HandleStepFocusFunction;\n  completedStepLabel: string;\n  idPrefix: string;\n};\n\nexport const StepperLink = forwardRef<HTMLAnchorElement, StepperLinkProps>(\n  (\n    {\n      className,\n      [\"data-testid\"]: dataTestId,\n      variant,\n      step,\n      indexOfLastItem,\n      index,\n      currentStepIndex,\n      whenToBeVisible,\n      handleStepChange,\n      handleStepFocus,\n      completedStepLabel,\n      idPrefix,\n      ...props\n    },\n    ref\n  ) => {\n    const placement = index === 0 ? \"first\" : index === indexOfLastItem ? \"last\" : \"middle\";\n    const isCurrentStep = index === currentStepIndex;\n\n    const handleClick = (e: MouseEvent<HTMLAnchorElement>): void => {\n      if (step.disabled) {\n        e.preventDefault();\n        return;\n      }\n      handleStepChange(e, index);\n    };\n\n    return (\n      <a\n        {...props}\n        ref={ref}\n        className={cx(\n          className,\n          rootClassName,\n          `${rootClassName}--${placement}`,\n          `${rootClassName}--${variant}`,\n          `${rootClassName}--visibility-${whenToBeVisible}`,\n          {\n            [`${rootClassName}--current`]: isCurrentStep,\n          },\n          {\n            [`${rootClassName}--disabled`]: step.disabled,\n          },\n          {\n            [\"arrow-tail\"]: placement !== \"first\",\n          },\n          {\n            [\"arrow-forward\"]: placement !== \"last\",\n          }\n        )}\n        id={`${idPrefix}-trigger-${index}`}\n        href={step.disabled ? undefined : `#${idPrefix}-content`}\n        tabIndex={step.disabled ? -1 : undefined}\n        data-testid={`${dataTestId}-step-trigger-item-${index}`}\n        aria-disabled={step.disabled}\n        aria-current={isCurrentStep && \"step\"}\n        aria-label={\n          step.finished && !isCurrentStep\n            ? [String(index + 1), step.label, completedStepLabel].filter(Boolean).join(\", \")\n            : undefined\n        }\n        onClick={handleClick}\n        onFocus={handleStepFocus}\n      >\n        <span className={cx(`${rootClassName}__trigger-outline`)}>\n          {step.finished && !isCurrentStep ? (\n            <IconCheckmark\n              className={cx(`${rootClassName}__icon`)}\n              data-testid={`${dataTestId}-step-finished-icon`}\n              size=\"sm\"\n            />\n          ) : (\n            <StepNumber\n              data-testid={`${dataTestId}-step-number`}\n              current={isCurrentStep}\n              disabled={step.disabled}\n              stepNumber={index + 1}\n            />\n          )}\n          <span\n            className={cx(`${rootClassName}__step-label`, {\n              [`sr-only--lg-down`]: !isCurrentStep,\n            })}\n          >\n            {step.label}\n          </span>\n        </span>\n      </a>\n    );\n  }\n);\n","import React, { forwardRef, type RefObject } from \"react\";\nimport { Tooltip } from \"@purpur/tooltip\";\nimport c from \"classnames/bind\";\n\nimport { VISIBILITY_STATES } from \"./constants\";\nimport { StepperLink } from \"./stepper-link\";\nimport styles from \"./stepper-nav-items.module.scss\";\nimport {\n  type HandleStepChangeFunction,\n  type HandleStepFocusFunction,\n  type Step,\n  type StepperVariant,\n} from \"./types\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper-nav-items\";\n\nexport type StepperNavItemsProps = {\n  variant: StepperVariant;\n  [\"data-testid\"]?: string;\n  firstStepRef: RefObject<HTMLLIElement | null>;\n  lastStepRef: RefObject<HTMLLIElement | null>;\n  steps: Step[];\n  currentStepIndex: number;\n  handleStepChange: HandleStepChangeFunction;\n  handleStepFocus: HandleStepFocusFunction;\n  completedStepLabel: string;\n  idPrefix: string;\n};\n\nexport const StepperNavItems = forwardRef<HTMLOListElement, StepperNavItemsProps>(\n  (\n    {\n      [\"data-testid\"]: dataTestId,\n      variant,\n      handleStepChange,\n      handleStepFocus,\n      steps,\n      firstStepRef,\n      lastStepRef,\n      currentStepIndex,\n      completedStepLabel,\n      idPrefix,\n    },\n    ref\n  ) => {\n    const stepListItems = steps.map((step: Step, index: number) => {\n      const tooltipTriggerItem = (\n        <span className={cx(`${rootClassName}__tooltip-trigger-item-container`)}>\n          <StepperLink\n            data-testid={`${dataTestId}-disabled-sm`}\n            variant={variant}\n            step={step}\n            indexOfLastItem={steps.length - 1}\n            index={index}\n            currentStepIndex={currentStepIndex}\n            whenToBeVisible={VISIBILITY_STATES.SMALL_SCREEN}\n            completedStepLabel={completedStepLabel}\n            handleStepChange={handleStepChange}\n            handleStepFocus={handleStepFocus}\n            idPrefix={idPrefix}\n          />\n        </span>\n      );\n\n      return (\n        <li\n          className={cx(`${rootClassName}__list-item`, {\n            [`${rootClassName}__list-item--current`]: index === currentStepIndex,\n          })}\n          ref={index === 0 ? firstStepRef : index === steps.length - 1 ? lastStepRef : null}\n          key={step.label}\n        >\n          {step.disabled ? (\n            <>\n              <Tooltip\n                contentClassName={cx(`${rootClassName}__tooltip-content`)}\n                triggerElement={tooltipTriggerItem}\n              >\n                {step.label}\n              </Tooltip>\n              <StepperLink\n                data-testid={`${dataTestId}-disabled-lg`}\n                variant={variant}\n                step={step}\n                indexOfLastItem={steps.length - 1}\n                index={index}\n                currentStepIndex={currentStepIndex}\n                whenToBeVisible={VISIBILITY_STATES.LARGE_SCREEN}\n                completedStepLabel={completedStepLabel}\n                handleStepChange={handleStepChange}\n                handleStepFocus={handleStepFocus}\n                idPrefix={idPrefix}\n              />\n            </>\n          ) : (\n            <StepperLink\n              data-testid={dataTestId}\n              variant={variant}\n              step={step}\n              indexOfLastItem={steps.length - 1}\n              index={index}\n              currentStepIndex={currentStepIndex}\n              whenToBeVisible={VISIBILITY_STATES.ALWAYS}\n              completedStepLabel={completedStepLabel}\n              handleStepChange={handleStepChange}\n              handleStepFocus={handleStepFocus}\n              idPrefix={idPrefix}\n            />\n          )}\n        </li>\n      );\n    });\n    return (\n      <ol ref={ref} className={cx(`${rootClassName}__list`)}>\n        {stepListItems}\n      </ol>\n    );\n  }\n);\n","import { type RefObject, useEffect, useRef } from \"react\";\n\ninterface UseContentFocusHook<T extends HTMLElement> {\n  contentRef: RefObject<T | null>;\n}\n\nexport const useContentFocus = <T extends HTMLElement>(\n  currentStepIndex: number\n): UseContentFocusHook<T> => {\n  const firstLoad = useRef<boolean>(true);\n  const contentRef = useRef<T | null>(null);\n\n  useEffect(() => {\n    if (!firstLoad.current && contentRef.current !== null) {\n      contentRef.current.focus();\n    }\n    firstLoad.current = false;\n\n  }, [currentStepIndex]);\n\n  return {\n    contentRef,\n  };\n};\n","import { type RefObject, useEffect, useRef, useState } from \"react\";\n\nexport const SCROLL_DIRECTION = {\n  LEFT: \"left\",\n  RIGHT: \"right\",\n} as const;\n\nexport type ScrollDirection = (typeof SCROLL_DIRECTION)[keyof typeof SCROLL_DIRECTION];\n\nexport type UseScrollHook<ContainerElement, WatchedElement> = {\n  scrollContainer: RefObject<ContainerElement | null>;\n  firstStepRef: RefObject<WatchedElement | null>;\n  lastStepRef: RefObject<WatchedElement | null>;\n  displayLeftScrollButton: boolean;\n  displayRightScrollButton: boolean;\n  handleHorizontalScroll: (dir: ScrollDirection) => void;\n};\n\nexport const useScrollButtons = <\n  ContainerElement extends HTMLElement,\n  WatchedElement extends HTMLElement\n>(): UseScrollHook<ContainerElement, WatchedElement> => {\n  const scrollContainer = useRef<ContainerElement | null>(null);\n  const firstStepRef = useRef<WatchedElement | null>(null);\n  const lastStepRef = useRef<WatchedElement | null>(null);\n  const [displayLeftScrollButton, setDisplayLeftScrollButton] = useState(false);\n  const [displayRightScrollButton, setDisplayRightScrollButton] = useState(false);\n\n  const handleHorizontalScroll = (dir: ScrollDirection): void => {\n    if (!scrollContainer.current) {\n      return;\n    }\n    const scrollableContainer = scrollContainer.current;\n    const scrollableContainerWidth = scrollableContainer.clientWidth;\n    const currentScrollLeft = scrollableContainer.scrollLeft;\n    if (dir === SCROLL_DIRECTION.LEFT) {\n      scrollableContainer.scroll({\n        behavior: \"smooth\",\n        left: currentScrollLeft - scrollableContainerWidth / 2,\n      });\n    }\n    if (dir === SCROLL_DIRECTION.RIGHT) {\n      scrollableContainer.scroll({\n        behavior: \"smooth\",\n        left: currentScrollLeft + scrollableContainerWidth / 2,\n      });\n    }\n  };\n\n  useEffect(() => {\n    if (firstStepRef.current && lastStepRef.current && scrollContainer.current) {\n      const observer: IntersectionObserver = new IntersectionObserver(\n        (entries: IntersectionObserverEntry[]) => {\n          for (const entry of entries) {\n            if (entry.target === firstStepRef.current) {\n              if (entry.isIntersecting) {\n                setDisplayLeftScrollButton(false);\n              } else {\n                setDisplayLeftScrollButton(true);\n              }\n              continue;\n            }\n            if (entry.target === lastStepRef.current) {\n              if (entry.isIntersecting) {\n                setDisplayRightScrollButton(false);\n              } else {\n                setDisplayRightScrollButton(true);\n              }\n            }\n          }\n        },\n        {\n          root: scrollContainer.current,\n          threshold: 0.95,\n        }\n      );\n\n      observer.observe(firstStepRef.current);\n      observer.observe(lastStepRef.current);\n\n      return () => observer.disconnect();\n    }\n    return undefined;\n  }, [firstStepRef, lastStepRef, scrollContainer]);\n\n  return {\n    scrollContainer,\n    firstStepRef,\n    lastStepRef,\n    displayLeftScrollButton,\n    displayRightScrollButton,\n    handleHorizontalScroll,\n  };\n};\n","import React, { Children, type ReactElement, useId } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconChevronLeft } from \"@purpur/icon/chevron-left\";\nimport { IconChevronRight } from \"@purpur/icon/chevron-right\";\nimport * as ScrollArea from \"@radix-ui/react-scroll-area\";\nimport c from \"classnames/bind\";\n\nimport { STEPPER_VARIANT } from \"./constants\";\nimport styles from \"./stepper.module.scss\";\nimport { StepperContainer } from \"./stepper-container\";\nimport { isStepperContent, StepperContent } from \"./stepper-content\";\nimport { StepperNavItems } from \"./stepper-nav-items\";\nimport { type Step, type StepChangeFunction, type StepperVariant } from \"./types\";\nimport { useContentFocus } from \"./use-content-focus.hook\";\nimport { SCROLL_DIRECTION, useScrollButtons } from \"./use-scroll-buttons.hook\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper\";\n\nexport type StepperProps = Omit<BaseProps, \"children\"> & {\n  children: Array<ReactElement<typeof StepperContent>> | ReactElement<typeof StepperContent>;\n  completedStepLabel: string;\n  currentStepIndex: number;\n  onStepChange: StepChangeFunction;\n  alignWithGrid?: boolean;\n  leftScrollButtonAriaLabel: string;\n  rightScrollButtonAriaLabel: string;\n  variant: StepperVariant;\n};\n\nexport type StepperComponent<P> = React.FunctionComponent<P> & {\n  Content: typeof StepperContent;\n};\n\nexport const Stepper: StepperComponent<StepperProps> = ({\n  [\"aria-label\"]: ariaLabel,\n  [\"data-testid\"]: dataTestId,\n  children,\n  className,\n  completedStepLabel,\n  currentStepIndex = 0,\n  onStepChange,\n  alignWithGrid = false,\n  leftScrollButtonAriaLabel,\n  rightScrollButtonAriaLabel,\n  variant = STEPPER_VARIANT.PRIMARY,\n  ...props\n}: StepperProps) => {\n  const stepperContentChildren = Children.toArray(children).filter(isStepperContent);\n  const steps: Step[] = Children.map(stepperContentChildren, (child) => {\n    const { disabled, finished, label } = child.props;\n    return {\n      disabled: disabled ?? false,\n      finished: finished ?? false,\n      label,\n    };\n  });\n  const idPrefix = useId();\n  const contentId = `${idPrefix}-content`;\n  const {\n    scrollContainer,\n    firstStepRef,\n    lastStepRef,\n    displayLeftScrollButton,\n    displayRightScrollButton,\n    handleHorizontalScroll,\n  } = useScrollButtons<HTMLDivElement, HTMLLIElement>();\n  const { contentRef } = useContentFocus<HTMLElement>(currentStepIndex);\n\n  const classes: string = cx([\n    className,\n    rootClassName,\n    {\n      [`${rootClassName}--${variant}`]: variant,\n    },\n  ]);\n  const scrollTriggerIntoView = (e: React.FocusEvent | React.MouseEvent): void => {\n    (e.target as HTMLAnchorElement).scrollIntoView({\n      behavior: \"smooth\",\n      block: \"nearest\",\n      inline: \"center\",\n    });\n  };\n\n  const handleStepChange = (e: React.MouseEvent<HTMLAnchorElement>, idx: number): void => {\n    e.preventDefault();\n    scrollTriggerIntoView(e);\n    onStepChange(idx);\n  };\n\n  const handleStepFocus = (e: React.FocusEvent<HTMLAnchorElement>): void => {\n    scrollTriggerIntoView(e);\n  };\n\n  return (\n    <div className={classes} {...props}>\n      <StepperContainer variant={variant} alignWithGrid={alignWithGrid}>\n        <div className={cx(`${rootClassName}__nav-container`)}>\n          <ScrollArea.Root>\n            <ScrollArea.Viewport ref={scrollContainer}>\n              <nav\n                aria-label={ariaLabel}\n                data-testid={dataTestId}\n                className={cx([\n                  `${rootClassName}__nav`,\n                  {\n                    [`${rootClassName}__nav--${variant}`]: variant,\n                  },\n                ])}\n              >\n                <StepperNavItems\n                  data-testid={dataTestId}\n                  variant={variant}\n                  firstStepRef={firstStepRef}\n                  lastStepRef={lastStepRef}\n                  steps={steps}\n                  currentStepIndex={currentStepIndex}\n                  handleStepChange={handleStepChange}\n                  handleStepFocus={handleStepFocus}\n                  completedStepLabel={completedStepLabel}\n                  idPrefix={idPrefix}\n                />\n              </nav>\n            </ScrollArea.Viewport>\n            <ScrollArea.Scrollbar orientation=\"horizontal\">\n              <ScrollArea.Thumb />\n            </ScrollArea.Scrollbar>\n          </ScrollArea.Root>\n          {displayLeftScrollButton && (\n            <Button\n              aria-label={leftScrollButtonAriaLabel}\n              className={cx([\n                `${rootClassName}__scroll-button`,\n                `${rootClassName}__scroll-button--left`,\n                {\n                  [`${rootClassName}__scroll-button--align-with-grid`]: alignWithGrid,\n                },\n              ])}\n              variant={BUTTON_VARIANT.TEXT}\n              tabIndex={-1}\n              iconOnly\n              onClick={() => {\n                handleHorizontalScroll(SCROLL_DIRECTION.LEFT);\n              }}\n            >\n              <IconChevronLeft className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n            </Button>\n          )}\n          {displayRightScrollButton && (\n            <Button\n              aria-label={rightScrollButtonAriaLabel}\n              className={cx([\n                `${rootClassName}__scroll-button`,\n                `${rootClassName}__scroll-button--right`,\n                {\n                  [`${rootClassName}__scroll-button--align-with-grid`]: alignWithGrid,\n                },\n              ])}\n              variant={BUTTON_VARIANT.TEXT}\n              tabIndex={-1}\n              iconOnly\n              onClick={() => {\n                handleHorizontalScroll(SCROLL_DIRECTION.RIGHT);\n              }}\n            >\n              <IconChevronRight className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n            </Button>\n          )}\n        </div>\n      </StepperContainer>\n      <section\n        tabIndex={-1}\n        id={contentId}\n        aria-labelledby={`${idPrefix}-trigger-${currentStepIndex}`}\n        ref={contentRef}\n        style={{ outline: \"none\" }}\n      >\n        {Children.map(stepperContentChildren, (child, index: number) => (\n          <div\n            className={cx({\n              [`${rootClassName}__hidden`]: index !== currentStepIndex,\n            })}\n            hidden={index !== currentStepIndex}\n          >\n            {child}\n          </div>\n        ))}\n      </section>\n    </div>\n  );\n};\n\nStepper.Content = StepperContent;\n\nStepper.displayName = \"Stepper\";\n"],"names":["STEPPER_VARIANT","VISIBILITY_STATES","cx","c","styles","rootClassName","StepperContainer","dataTestId","children","className","alignWithGrid","variant","props","classes","jsx","StepperContent","forwardRef","ref","finished","rest","isStepperContent","child","isValidElement","StepNumber","current","disabled","stepNumber","StepperLink","step","indexOfLastItem","index","currentStepIndex","whenToBeVisible","handleStepChange","handleStepFocus","completedStepLabel","idPrefix","placement","isCurrentStep","handleClick","e","IconCheckmark","StepperNavItems","steps","firstStepRef","lastStepRef","stepListItems","tooltipTriggerItem","jsxs","Fragment","Tooltip","useContentFocus","firstLoad","useRef","contentRef","useEffect","SCROLL_DIRECTION","useScrollButtons","scrollContainer","displayLeftScrollButton","setDisplayLeftScrollButton","useState","displayRightScrollButton","setDisplayRightScrollButton","handleHorizontalScroll","dir","scrollableContainer","scrollableContainerWidth","currentScrollLeft","observer","entries","entry","Stepper","ariaLabel","onStepChange","leftScrollButtonAriaLabel","rightScrollButtonAriaLabel","stepperContentChildren","Children","label","useId","contentId","scrollTriggerIntoView","idx","ScrollArea.Root","ScrollArea.Viewport","ScrollArea.Scrollbar","ScrollArea.Thumb","Button","BUTTON_VARIANT","IconChevronLeft","IconChevronRight"],"mappings":"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"}
+{"version":3,"file":"stepper-CGBjyjVw.mjs","sources":["../../../components/stepper/src/constants.ts","../../../components/stepper/src/stepper-container.tsx","../../../components/stepper/src/stepper-content.tsx","../../../components/stepper/src/stepper-link.tsx","../../../components/stepper/src/stepper-nav-items.tsx","../../../components/stepper/src/use-content-focus.hook.ts","../../../components/stepper/src/use-scroll-buttons.hook.ts","../../../components/stepper/src/stepper.tsx"],"sourcesContent":["export const STEPPER_VARIANT = {\n  PRIMARY: \"primary\",\n  SECONDARY: \"secondary\",\n} as const;\n\nexport const VISIBILITY_STATES = {\n  SMALL_SCREEN: \"small-screen\",\n  LARGE_SCREEN: \"large-screen\",\n  ALWAYS: \"always\",\n} as const;\n","import React, { type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-container.module.scss\";\nimport { type StepperVariant } from \"./types\";\n\nconst cx = c.bind(styles);\n\nexport type StepperContainerProps = Omit<BaseProps, \"children\"> & {\n  children: ReactNode;\n  alignWithGrid: boolean;\n  variant: StepperVariant;\n};\n\nconst rootClassName = \"purpur-stepper-container\";\n\nexport const StepperContainer = ({\n  [\"data-testid\"]: dataTestId = \"purpur-stepper-container\",\n  children,\n  className,\n  alignWithGrid,\n  variant,\n  ...props\n}: StepperContainerProps) => {\n  const classes: string = cx(className, rootClassName, {\n    [`${rootClassName}--${variant}`]: variant,\n    [`${rootClassName}--align-with-grid`]: alignWithGrid,\n  });\n\n  return (\n    <div className={classes} data-testid={dataTestId} {...props}>\n      <div\n        className={cx(`${rootClassName}__inner`, {\n          [`${rootClassName}__inner--align-with-grid`]: alignWithGrid,\n        })}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n","import React, { forwardRef, isValidElement, type ReactElement, type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\n\nimport { type Optional, type Step } from \"./types\";\n\nexport type StepperContentProps = Omit<BaseProps, \"children\"> & {\n  children: ReactNode;\n} & Optional<Step, \"disabled\" | \"finished\">;\n\nexport const StepperContent = forwardRef<HTMLDivElement, StepperContentProps>(\n  ({ children, ...props }, ref) => {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { finished, ...rest } = props;\n    return (\n      <div {...rest} ref={ref}>\n        {children}\n      </div>\n    );\n  }\n);\n\nexport const isStepperContent = (child?: ReactNode): child is ReactElement<StepperContentProps> =>\n  !!child && isValidElement<StepperContentProps>(child) && !!child.props.label;\n","import React, { forwardRef, type MouseEvent } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconCheckmark } from \"@purpur/icon/checkmark\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./stepper-link.module.scss\";\nimport {\n  type HandleStepChangeFunction,\n  type HandleStepFocusFunction,\n  type Step,\n  type StepperVariant,\n  type VisibilityStates,\n} from \"./types\";\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-stepper-link\";\n\nexport type StepNumberProps = {\n  current: boolean;\n  disabled: boolean;\n  stepNumber: number;\n  [\"data-testid\"]?: string;\n};\n\nconst StepNumber = ({\n  [\"data-testid\"]: dataTestId,\n  current,\n  disabled,\n  stepNumber,\n}: StepNumberProps) => {\n  return (\n    <div\n      data-testid={dataTestId}\n      className={cx([\n        `${rootClassName}__step-number`,\n        {\n          [`${rootClassName}__step-number--current`]: current,\n        },\n        {\n          [`${rootClassName}__step-number--disabled`]: disabled,\n        },\n      ])}\n    >\n      {stepNumber}\n    </div>\n  );\n};\n\nexport type StepperLinkProps = Omit<BaseProps<\"a\">, \"children\"> & {\n  variant: StepperVariant;\n  step: Step;\n  currentStepIndex: number;\n  index: number;\n  indexOfLastItem: number;\n  whenToBeVisible: VisibilityStates;\n  handleStepChange: HandleStepChangeFunction;\n  handleStepFocus: HandleStepFocusFunction;\n  completedStepLabel: string;\n  idPrefix: string;\n};\n\nexport const StepperLink = forwardRef<HTMLAnchorElement, StepperLinkProps>(\n  (\n    {\n      className,\n      [\"data-testid\"]: dataTestId,\n      variant,\n      step,\n      indexOfLastItem,\n      index,\n      currentStepIndex,\n      whenToBeVisible,\n      handleStepChange,\n      handleStepFocus,\n      completedStepLabel,\n      idPrefix,\n      ...props\n    },\n    ref\n  ) => {\n    const placement = index === 0 ? \"first\" : index === indexOfLastItem ? \"last\" : \"middle\";\n    const isCurrentStep = index === currentStepIndex;\n\n    const handleClick = (e: MouseEvent<HTMLAnchorElement>): void => {\n      if (step.disabled) {\n        e.preventDefault();\n        return;\n      }\n      handleStepChange(e, index);\n    };\n\n    return (\n      <a\n        {...props}\n        ref={ref}\n        className={cx(\n          className,\n          rootClassName,\n          `${rootClassName}--${placement}`,\n          `${rootClassName}--${variant}`,\n          `${rootClassName}--visibility-${whenToBeVisible}`,\n          {\n            [`${rootClassName}--current`]: isCurrentStep,\n          },\n          {\n            [`${rootClassName}--disabled`]: step.disabled,\n          },\n          {\n            [\"arrow-tail\"]: placement !== \"first\",\n          },\n          {\n            [\"arrow-forward\"]: placement !== \"last\",\n          }\n        )}\n        id={`${idPrefix}-trigger-${index}`}\n        href={step.disabled ? undefined : `#${idPrefix}-content`}\n        tabIndex={step.disabled ? -1 : undefined}\n        data-testid={`${dataTestId}-step-trigger-item-${index}`}\n        aria-disabled={step.disabled}\n        aria-current={isCurrentStep && \"step\"}\n        aria-label={\n          step.finished && !isCurrentStep\n            ? [String(index + 1), step.label, completedStepLabel].filter(Boolean).join(\", \")\n            : undefined\n        }\n        onClick={handleClick}\n        onFocus={handleStepFocus}\n      >\n        <span className={cx(`${rootClassName}__trigger-outline`)}>\n          {step.finished && !isCurrentStep ? (\n            <IconCheckmark\n              className={cx(`${rootClassName}__icon`)}\n              data-testid={`${dataTestId}-step-finished-icon`}\n              size=\"sm\"\n            />\n          ) : (\n            <StepNumber\n              data-testid={`${dataTestId}-step-number`}\n              current={isCurrentStep}\n              disabled={step.disabled}\n              stepNumber={index + 1}\n            />\n          )}\n          <span\n            className={cx(`${rootClassName}__step-label`, {\n              [`sr-only--lg-down`]: !isCurrentStep,\n            })}\n          >\n            {step.label}\n          </span>\n        </span>\n      </a>\n    );\n  }\n);\n","import React, { forwardRef, type RefObject } from \"react\";\nimport { Tooltip } from \"@purpur/tooltip\";\nimport c from \"classnames/bind\";\n\nimport { VISIBILITY_STATES } from \"./constants\";\nimport { StepperLink } from \"./stepper-link\";\nimport styles from \"./stepper-nav-items.module.scss\";\nimport {\n  type HandleStepChangeFunction,\n  type HandleStepFocusFunction,\n  type Step,\n  type StepperVariant,\n} from \"./types\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper-nav-items\";\n\nexport type StepperNavItemsProps = {\n  variant: StepperVariant;\n  [\"data-testid\"]?: string;\n  firstStepRef: RefObject<HTMLLIElement | null>;\n  lastStepRef: RefObject<HTMLLIElement | null>;\n  steps: Step[];\n  currentStepIndex: number;\n  handleStepChange: HandleStepChangeFunction;\n  handleStepFocus: HandleStepFocusFunction;\n  completedStepLabel: string;\n  idPrefix: string;\n};\n\nexport const StepperNavItems = forwardRef<HTMLOListElement, StepperNavItemsProps>(\n  (\n    {\n      [\"data-testid\"]: dataTestId,\n      variant,\n      handleStepChange,\n      handleStepFocus,\n      steps,\n      firstStepRef,\n      lastStepRef,\n      currentStepIndex,\n      completedStepLabel,\n      idPrefix,\n    },\n    ref\n  ) => {\n    const stepListItems = steps.map((step: Step, index: number) => {\n      const tooltipTriggerItem = (\n        <span className={cx(`${rootClassName}__tooltip-trigger-item-container`)}>\n          <StepperLink\n            data-testid={`${dataTestId}-disabled-sm`}\n            variant={variant}\n            step={step}\n            indexOfLastItem={steps.length - 1}\n            index={index}\n            currentStepIndex={currentStepIndex}\n            whenToBeVisible={VISIBILITY_STATES.SMALL_SCREEN}\n            completedStepLabel={completedStepLabel}\n            handleStepChange={handleStepChange}\n            handleStepFocus={handleStepFocus}\n            idPrefix={idPrefix}\n          />\n        </span>\n      );\n\n      return (\n        <li\n          className={cx(`${rootClassName}__list-item`, {\n            [`${rootClassName}__list-item--current`]: index === currentStepIndex,\n          })}\n          ref={index === 0 ? firstStepRef : index === steps.length - 1 ? lastStepRef : null}\n          key={step.label}\n        >\n          {step.disabled ? (\n            <>\n              <Tooltip\n                contentClassName={cx(`${rootClassName}__tooltip-content`)}\n                triggerElement={tooltipTriggerItem}\n              >\n                {step.label}\n              </Tooltip>\n              <StepperLink\n                data-testid={`${dataTestId}-disabled-lg`}\n                variant={variant}\n                step={step}\n                indexOfLastItem={steps.length - 1}\n                index={index}\n                currentStepIndex={currentStepIndex}\n                whenToBeVisible={VISIBILITY_STATES.LARGE_SCREEN}\n                completedStepLabel={completedStepLabel}\n                handleStepChange={handleStepChange}\n                handleStepFocus={handleStepFocus}\n                idPrefix={idPrefix}\n              />\n            </>\n          ) : (\n            <StepperLink\n              data-testid={dataTestId}\n              variant={variant}\n              step={step}\n              indexOfLastItem={steps.length - 1}\n              index={index}\n              currentStepIndex={currentStepIndex}\n              whenToBeVisible={VISIBILITY_STATES.ALWAYS}\n              completedStepLabel={completedStepLabel}\n              handleStepChange={handleStepChange}\n              handleStepFocus={handleStepFocus}\n              idPrefix={idPrefix}\n            />\n          )}\n        </li>\n      );\n    });\n    return (\n      <ol ref={ref} className={cx(`${rootClassName}__list`)}>\n        {stepListItems}\n      </ol>\n    );\n  }\n);\n","import { type RefObject, useEffect, useRef } from \"react\";\n\ninterface UseContentFocusHook<T extends HTMLElement> {\n  contentRef: RefObject<T | null>;\n}\n\nexport const useContentFocus = <T extends HTMLElement>(\n  currentStepIndex: number\n): UseContentFocusHook<T> => {\n  const firstLoad = useRef<boolean>(true);\n  const contentRef = useRef<T | null>(null);\n\n  useEffect(() => {\n    if (!firstLoad.current && contentRef.current !== null) {\n      contentRef.current.focus();\n    }\n    firstLoad.current = false;\n\n  }, [currentStepIndex]);\n\n  return {\n    contentRef,\n  };\n};\n","import { type RefObject, useEffect, useRef, useState } from \"react\";\n\nexport const SCROLL_DIRECTION = {\n  LEFT: \"left\",\n  RIGHT: \"right\",\n} as const;\n\nexport type ScrollDirection = (typeof SCROLL_DIRECTION)[keyof typeof SCROLL_DIRECTION];\n\nexport type UseScrollHook<ContainerElement, WatchedElement> = {\n  scrollContainer: RefObject<ContainerElement | null>;\n  firstStepRef: RefObject<WatchedElement | null>;\n  lastStepRef: RefObject<WatchedElement | null>;\n  displayLeftScrollButton: boolean;\n  displayRightScrollButton: boolean;\n  handleHorizontalScroll: (dir: ScrollDirection) => void;\n};\n\nexport const useScrollButtons = <\n  ContainerElement extends HTMLElement,\n  WatchedElement extends HTMLElement\n>(): UseScrollHook<ContainerElement, WatchedElement> => {\n  const scrollContainer = useRef<ContainerElement | null>(null);\n  const firstStepRef = useRef<WatchedElement | null>(null);\n  const lastStepRef = useRef<WatchedElement | null>(null);\n  const [displayLeftScrollButton, setDisplayLeftScrollButton] = useState(false);\n  const [displayRightScrollButton, setDisplayRightScrollButton] = useState(false);\n\n  const handleHorizontalScroll = (dir: ScrollDirection): void => {\n    if (!scrollContainer.current) {\n      return;\n    }\n    const scrollableContainer = scrollContainer.current;\n    const scrollableContainerWidth = scrollableContainer.clientWidth;\n    const currentScrollLeft = scrollableContainer.scrollLeft;\n    if (dir === SCROLL_DIRECTION.LEFT) {\n      scrollableContainer.scroll({\n        behavior: \"smooth\",\n        left: currentScrollLeft - scrollableContainerWidth / 2,\n      });\n    }\n    if (dir === SCROLL_DIRECTION.RIGHT) {\n      scrollableContainer.scroll({\n        behavior: \"smooth\",\n        left: currentScrollLeft + scrollableContainerWidth / 2,\n      });\n    }\n  };\n\n  useEffect(() => {\n    if (firstStepRef.current && lastStepRef.current && scrollContainer.current) {\n      const observer: IntersectionObserver = new IntersectionObserver(\n        (entries: IntersectionObserverEntry[]) => {\n          for (const entry of entries) {\n            if (entry.target === firstStepRef.current) {\n              if (entry.isIntersecting) {\n                setDisplayLeftScrollButton(false);\n              } else {\n                setDisplayLeftScrollButton(true);\n              }\n              continue;\n            }\n            if (entry.target === lastStepRef.current) {\n              if (entry.isIntersecting) {\n                setDisplayRightScrollButton(false);\n              } else {\n                setDisplayRightScrollButton(true);\n              }\n            }\n          }\n        },\n        {\n          root: scrollContainer.current,\n          threshold: 0.95,\n        }\n      );\n\n      observer.observe(firstStepRef.current);\n      observer.observe(lastStepRef.current);\n\n      return () => observer.disconnect();\n    }\n    return undefined;\n  }, [firstStepRef, lastStepRef, scrollContainer]);\n\n  return {\n    scrollContainer,\n    firstStepRef,\n    lastStepRef,\n    displayLeftScrollButton,\n    displayRightScrollButton,\n    handleHorizontalScroll,\n  };\n};\n","import React, { Children, type ReactElement, useId } from \"react\";\nimport { Button, BUTTON_VARIANT } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { IconChevronLeft } from \"@purpur/icon/chevron-left\";\nimport { IconChevronRight } from \"@purpur/icon/chevron-right\";\nimport * as ScrollArea from \"@radix-ui/react-scroll-area\";\nimport c from \"classnames/bind\";\n\nimport { STEPPER_VARIANT } from \"./constants\";\nimport styles from \"./stepper.module.scss\";\nimport { StepperContainer } from \"./stepper-container\";\nimport { isStepperContent, StepperContent } from \"./stepper-content\";\nimport { StepperNavItems } from \"./stepper-nav-items\";\nimport { type Step, type StepChangeFunction, type StepperVariant } from \"./types\";\nimport { useContentFocus } from \"./use-content-focus.hook\";\nimport { SCROLL_DIRECTION, useScrollButtons } from \"./use-scroll-buttons.hook\";\n\nconst cx = c.bind(styles);\n\nconst rootClassName = \"purpur-stepper\";\n\nexport type StepperProps = Omit<BaseProps, \"children\"> & {\n  children: Array<ReactElement<typeof StepperContent>> | ReactElement<typeof StepperContent>;\n  completedStepLabel: string;\n  currentStepIndex: number;\n  onStepChange: StepChangeFunction;\n  alignWithGrid?: boolean;\n  leftScrollButtonAriaLabel: string;\n  rightScrollButtonAriaLabel: string;\n  variant: StepperVariant;\n};\n\nexport type StepperComponent<P> = React.FunctionComponent<P> & {\n  Content: typeof StepperContent;\n};\n\nexport const Stepper: StepperComponent<StepperProps> = ({\n  [\"aria-label\"]: ariaLabel,\n  [\"data-testid\"]: dataTestId,\n  children,\n  className,\n  completedStepLabel,\n  currentStepIndex = 0,\n  onStepChange,\n  alignWithGrid = false,\n  leftScrollButtonAriaLabel,\n  rightScrollButtonAriaLabel,\n  variant = STEPPER_VARIANT.PRIMARY,\n  ...props\n}: StepperProps) => {\n  const stepperContentChildren = Children.toArray(children).filter(isStepperContent);\n  const steps: Step[] = Children.map(stepperContentChildren, (child) => {\n    const { disabled, finished, label } = child.props;\n    return {\n      disabled: disabled ?? false,\n      finished: finished ?? false,\n      label,\n    };\n  });\n  const idPrefix = useId();\n  const contentId = `${idPrefix}-content`;\n  const {\n    scrollContainer,\n    firstStepRef,\n    lastStepRef,\n    displayLeftScrollButton,\n    displayRightScrollButton,\n    handleHorizontalScroll,\n  } = useScrollButtons<HTMLDivElement, HTMLLIElement>();\n  const { contentRef } = useContentFocus<HTMLElement>(currentStepIndex);\n\n  const classes: string = cx([\n    className,\n    rootClassName,\n    {\n      [`${rootClassName}--${variant}`]: variant,\n    },\n  ]);\n  const scrollTriggerIntoView = (e: React.FocusEvent | React.MouseEvent): void => {\n    (e.target as HTMLAnchorElement).scrollIntoView({\n      behavior: \"smooth\",\n      block: \"nearest\",\n      inline: \"center\",\n    });\n  };\n\n  const handleStepChange = (e: React.MouseEvent<HTMLAnchorElement>, idx: number): void => {\n    e.preventDefault();\n    scrollTriggerIntoView(e);\n    onStepChange(idx);\n  };\n\n  const handleStepFocus = (e: React.FocusEvent<HTMLAnchorElement>): void => {\n    scrollTriggerIntoView(e);\n  };\n\n  return (\n    <div className={classes} {...props}>\n      <StepperContainer variant={variant} alignWithGrid={alignWithGrid}>\n        <div className={cx(`${rootClassName}__nav-container`)}>\n          <ScrollArea.Root>\n            <ScrollArea.Viewport ref={scrollContainer}>\n              <nav\n                aria-label={ariaLabel}\n                data-testid={dataTestId}\n                className={cx([\n                  `${rootClassName}__nav`,\n                  {\n                    [`${rootClassName}__nav--${variant}`]: variant,\n                  },\n                ])}\n              >\n                <StepperNavItems\n                  data-testid={dataTestId}\n                  variant={variant}\n                  firstStepRef={firstStepRef}\n                  lastStepRef={lastStepRef}\n                  steps={steps}\n                  currentStepIndex={currentStepIndex}\n                  handleStepChange={handleStepChange}\n                  handleStepFocus={handleStepFocus}\n                  completedStepLabel={completedStepLabel}\n                  idPrefix={idPrefix}\n                />\n              </nav>\n            </ScrollArea.Viewport>\n            <ScrollArea.Scrollbar orientation=\"horizontal\">\n              <ScrollArea.Thumb />\n            </ScrollArea.Scrollbar>\n          </ScrollArea.Root>\n          {displayLeftScrollButton && (\n            <Button\n              aria-label={leftScrollButtonAriaLabel}\n              className={cx([\n                `${rootClassName}__scroll-button`,\n                `${rootClassName}__scroll-button--left`,\n                {\n                  [`${rootClassName}__scroll-button--align-with-grid`]: alignWithGrid,\n                },\n              ])}\n              variant={BUTTON_VARIANT.TEXT}\n              tabIndex={-1}\n              iconOnly\n              onClick={() => {\n                handleHorizontalScroll(SCROLL_DIRECTION.LEFT);\n              }}\n            >\n              <IconChevronLeft className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n            </Button>\n          )}\n          {displayRightScrollButton && (\n            <Button\n              aria-label={rightScrollButtonAriaLabel}\n              className={cx([\n                `${rootClassName}__scroll-button`,\n                `${rootClassName}__scroll-button--right`,\n                {\n                  [`${rootClassName}__scroll-button--align-with-grid`]: alignWithGrid,\n                },\n              ])}\n              variant={BUTTON_VARIANT.TEXT}\n              tabIndex={-1}\n              iconOnly\n              onClick={() => {\n                handleHorizontalScroll(SCROLL_DIRECTION.RIGHT);\n              }}\n            >\n              <IconChevronRight className={cx(`${rootClassName}__scroll-button-icon`)} size=\"md\" />\n            </Button>\n          )}\n        </div>\n      </StepperContainer>\n      <section\n        tabIndex={-1}\n        id={contentId}\n        aria-labelledby={`${idPrefix}-trigger-${currentStepIndex}`}\n        ref={contentRef}\n        style={{ outline: \"none\" }}\n      >\n        {Children.map(stepperContentChildren, (child, index: number) => (\n          <div\n            className={cx({\n              [`${rootClassName}__hidden`]: index !== currentStepIndex,\n            })}\n            hidden={index !== currentStepIndex}\n          >\n            {child}\n          </div>\n        ))}\n      </section>\n    </div>\n  );\n};\n\nStepper.Content = StepperContent;\n\nStepper.displayName = \"Stepper\";\n"],"names":["STEPPER_VARIANT","VISIBILITY_STATES","cx","c","styles","rootClassName","StepperContainer","dataTestId","children","className","alignWithGrid","variant","props","classes","jsx","StepperContent","forwardRef","ref","finished","rest","isStepperContent","child","isValidElement","StepNumber","current","disabled","stepNumber","StepperLink","step","indexOfLastItem","index","currentStepIndex","whenToBeVisible","handleStepChange","handleStepFocus","completedStepLabel","idPrefix","placement","isCurrentStep","handleClick","e","IconCheckmark","StepperNavItems","steps","firstStepRef","lastStepRef","stepListItems","tooltipTriggerItem","jsxs","Fragment","Tooltip","useContentFocus","firstLoad","useRef","contentRef","useEffect","SCROLL_DIRECTION","useScrollButtons","scrollContainer","displayLeftScrollButton","setDisplayLeftScrollButton","useState","displayRightScrollButton","setDisplayRightScrollButton","handleHorizontalScroll","dir","scrollableContainer","scrollableContainerWidth","currentScrollLeft","observer","entries","entry","Stepper","ariaLabel","onStepChange","leftScrollButtonAriaLabel","rightScrollButtonAriaLabel","stepperContentChildren","Children","label","useId","contentId","scrollTriggerIntoView","idx","ScrollArea.Root","ScrollArea.Viewport","ScrollArea.Scrollbar","ScrollArea.Thumb","Button","BUTTON_VARIANT","IconChevronLeft","IconChevronRight"],"mappings":"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"}

package/dist/{stepper-Dao4XaDV.js → stepper-CbcFVE3v.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("react/jsx-runtime"),o=require("react"),S=require("./button-C5CYysw5.js"),X=require("./chevron-left.es-B0vPg5XM.js"),W=require("./chevron-right.es-Bv376M3o.js"),C=require("./index-CoR7YA3H.js"),L=require("./bind-DeUYJ6m9.js"),J=require("./tooltip-DeP1UsPW.js"),K=require("./checkmark.es-lYntWFA3.js"),Q={PRIMARY:"primary"},x={SMALL_SCREEN:"small-screen",LARGE_SCREEN:"large-screen",ALWAYS:"always"},Z={"purpur-stepper__nav-container":"_purpur-stepper__nav-container_17tj8_1","purpur-stepper__nav":"_purpur-stepper__nav_17tj8_1","purpur-stepper":"_purpur-stepper_17tj8_1","purpur-stepper__scroll-button":"_purpur-stepper__scroll-button_17tj8_7","purpur-stepper__scroll-button--left":"_purpur-stepper__scroll-button--left_17tj8_18","purpur-stepper__scroll-button--right":"_purpur-stepper__scroll-button--right_17tj8_21","purpur-stepper__scroll-button--align-with-grid":"_purpur-stepper__scroll-button--align-with-grid_17tj8_24","purpur-stepper__scroll-button-icon":"_purpur-stepper__scroll-button-icon_17tj8_48","purpur-stepper__hidden":"_purpur-stepper__hidden_17tj8_51"},ee={"purpur-stepper-container":"_purpur-stepper-container_lnheo_1","purpur-stepper-container__inner--align-with-grid":"_purpur-stepper-container__inner--align-with-grid_lnheo_5","purpur-stepper-container--primary":"_purpur-stepper-container--primary_lnheo_28","purpur-stepper-container--secondary":"_purpur-stepper-container--secondary_lnheo_31"},V=L.c.bind(ee),R="purpur-stepper-container",re=({["data-testid"]:r="purpur-stepper-container",children:t,className:n,alignWithGrid:s,variant:p,...l})=>{const m=V(n,R,{[`${R}--${p}`]:p,[`${R}--align-with-grid`]:s});return e.jsx("div",{className:m,"data-testid":r,...l,children:e.jsx("div",{className:V(`${R}__inner`,{[`${R}__inner--align-with-grid`]:s}),children:t})})},te=o.forwardRef(({children:r,...t},n)=>{const{finished:s,...p}=t;return e.jsx("div",{...p,ref:n,children:r})}),se=r=>!!r&&o.isValidElement(r)&&!!r.props.label,ne={"purpur-stepper-link":"_purpur-stepper-link_1sqvz_1","purpur-stepper-link--disabled":"_purpur-stepper-link--disabled_1sqvz_27","purpur-stepper-link__trigger-outline":"_purpur-stepper-link__trigger-outline_1sqvz_53","purpur-stepper-link--first":"_purpur-stepper-link--first_1sqvz_65","purpur-stepper-link--current":"_purpur-stepper-link--current_1sqvz_65","purpur-stepper-link--middle":"_purpur-stepper-link--middle_1sqvz_70","purpur-stepper-link--last":"_purpur-stepper-link--last_1sqvz_80","purpur-stepper-link--visibility-small-screen":"_purpur-stepper-link--visibility-small-screen_1sqvz_90","purpur-stepper-link--visibility-large-screen":"_purpur-stepper-link--visibility-large-screen_1sqvz_98","purpur-stepper-link__icon":"_purpur-stepper-link__icon_1sqvz_122","purpur-stepper-link__step-number":"_purpur-stepper-link__step-number_1sqvz_132","purpur-stepper-link__step-number--current":"_purpur-stepper-link__step-number--current_1sqvz_143","purpur-stepper-link__step-number--disabled":"_purpur-stepper-link__step-number--disabled_1sqvz_147","purpur-stepper-link__step-label":"_purpur-stepper-link__step-label_1sqvz_152","arrow-forward":"_arrow-forward_1sqvz_156","purpur-stepper-link--primary":"_purpur-stepper-link--primary_1sqvz_168","purpur-stepper-link--secondary":"_purpur-stepper-link--secondary_1sqvz_177","arrow-tail":"_arrow-tail_1sqvz_187","sr-only--lg-down":"_sr-only--lg-down_1sqvz_206"},y=L.c.bind(ne),d="purpur-stepper-link",le=({["data-testid"]:r,current:t,disabled:n,stepNumber:s})=>e.jsx("div",{"data-testid":r,className:y([`${d}__step-number`,{[`${d}__step-number--current`]:t},{[`${d}__step-number--disabled`]:n}]),children:s}),E=o.forwardRef(({className:r,["data-testid"]:t,variant:n,step:s,indexOfLastItem:p,index:l,currentStepIndex:m,whenToBeVisible:c,handleStepChange:u,handleStepFocus:_,completedStepLabel:i,idPrefix:g,...b},f)=>{const v=l===0?"first":l===p?"last":"middle",$=l===m,T=w=>{if(s.disabled){w.preventDefault();return}u(w,l)};return e.jsx("a",{...b,ref:f,className:y(r,d,`${d}--${v}`,`${d}--${n}`,`${d}--visibility-${c}`,{[`${d}--current`]:$},{[`${d}--disabled`]:s.disabled},{"arrow-tail":v!=="first"},{"arrow-forward":v!=="last"}),id:`${g}-trigger-${l}`,href:s.disabled?void 0:`#${g}-content`,tabIndex:s.disabled?-1:void 0,"data-testid":`${t}-step-trigger-item-${l}`,"aria-disabled":s.disabled,"aria-current":$&&"step","aria-label":s.finished&&!$?[String(l+1),s.label,i].filter(Boolean).join(", "):void 0,onClick:T,onFocus:_,children:e.jsxs("span",{className:y(`${d}__trigger-outline`),children:[s.finished&&!$?e.jsx(K.a,{className:y(`${d}__icon`),"data-testid":`${t}-step-finished-icon`,size:"sm"}):e.jsx(le,{"data-testid":`${t}-step-number`,current:$,disabled:s.disabled,stepNumber:l+1}),e.jsx("span",{className:y(`${d}__step-label`,{"sr-only--lg-down":!$}),children:s.label})]})})}),ie={"purpur-stepper-nav-items__list":"_purpur-stepper-nav-items__list_lgkh0_1","purpur-stepper-nav-items__list-item":"_purpur-stepper-nav-items__list-item_lgkh0_7","purpur-stepper-nav-items__list-item--current":"_purpur-stepper-nav-items__list-item--current_lgkh0_25","purpur-stepper-nav-items__tooltip-content":"_purpur-stepper-nav-items__tooltip-content_lgkh0_31","purpur-stepper-nav-items__tooltip-trigger-item-container":"_purpur-stepper-nav-items__tooltip-trigger-item-container_lgkh0_34"},q=L.c.bind(ie),N="purpur-stepper-nav-items",pe=o.forwardRef(({["data-testid"]:r,variant:t,handleStepChange:n,handleStepFocus:s,steps:p,firstStepRef:l,lastStepRef:m,currentStepIndex:c,completedStepLabel:u,idPrefix:_},i)=>{const g=p.map((b,f)=>{const v=e.jsx("span",{className:q(`${N}__tooltip-trigger-item-container`),children:e.jsx(E,{"data-testid":`${r}-disabled-sm`,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.SMALL_SCREEN,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})});return e.jsx("li",{className:q(`${N}__list-item`,{[`${N}__list-item--current`]:f===c}),ref:f===0?l:f===p.length-1?m:null,children:b.disabled?e.jsxs(e.Fragment,{children:[e.jsx(J.Tooltip,{contentClassName:q(`${N}__tooltip-content`),triggerElement:v,children:b.label}),e.jsx(E,{"data-testid":`${r}-disabled-lg`,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.LARGE_SCREEN,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})]}):e.jsx(E,{"data-testid":r,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.ALWAYS,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})},b.label)});return e.jsx("ol",{ref:i,className:q(`${N}__list`),children:g})}),oe=r=>{const t=o.useRef(!0),n=o.useRef(null);return o.useEffect(()=>{!t.current&&n.current!==null&&n.current.focus(),t.current=!1},[r]),{contentRef:n}},z={LEFT:"left",RIGHT:"right"},ue=()=>{const r=o.useRef(null),t=o.useRef(null),n=o.useRef(null),[s,p]=o.useState(!1),[l,m]=o.useState(!1),c=u=>{if(!r.current)return;const _=r.current,i=_.clientWidth,g=_.scrollLeft;u===z.LEFT&&_.scroll({behavior:"smooth",left:g-i/2}),u===z.RIGHT&&_.scroll({behavior:"smooth",left:g+i/2})};return o.useEffect(()=>{if(t.current&&n.current&&r.current){const u=new IntersectionObserver(_=>{for(const i of _){if(i.target===t.current){i.isIntersecting?p(!1):p(!0);continue}i.target===n.current&&(i.isIntersecting?m(!1):m(!0))}},{root:r.current,threshold:.95});return u.observe(t.current),u.observe(n.current),()=>u.disconnect()}},[t,n,r]),{scrollContainer:r,firstStepRef:t,lastStepRef:n,displayLeftScrollButton:s,displayRightScrollButton:l,handleHorizontalScroll:c}},k=L.c.bind(Z),a="purpur-stepper",I=({["aria-label"]:r,["data-testid"]:t,children:n,className:s,completedStepLabel:p,currentStepIndex:l=0,onStepChange:m,alignWithGrid:c=!1,leftScrollButtonAriaLabel:u,rightScrollButtonAriaLabel:_,variant:i=Q.PRIMARY,...g})=>{const b=o.Children.toArray(n).filter(se),f=o.Children.map(b,h=>{const{disabled:j,finished:P,label:U}=h.props;return{disabled:j??!1,finished:P??!1,label:U}}),v=o.useId(),$=`${v}-content`,{scrollContainer:T,firstStepRef:w,lastStepRef:O,displayLeftScrollButton:D,displayRightScrollButton:F,handleHorizontalScroll:A}=ue(),{contentRef:H}=oe(l),Y=k([s,a,{[`${a}--${i}`]:i}]),B=h=>{h.target.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})},M=(h,j)=>{h.preventDefault(),B(h),m(j)},G=h=>{B(h)};return e.jsxs("div",{className:Y,...g,children:[e.jsx(re,{variant:i,alignWithGrid:c,children:e.jsxs("div",{className:k(`${a}__nav-container`),children:[e.jsxs(C.Root,{children:[e.jsx(C.Viewport,{ref:T,children:e.jsx("nav",{"aria-label":r,"data-testid":t,className:k([`${a}__nav`,{[`${a}__nav--${i}`]:i}]),children:e.jsx(pe,{"data-testid":t,variant:i,firstStepRef:w,lastStepRef:O,steps:f,currentStepIndex:l,handleStepChange:M,handleStepFocus:G,completedStepLabel:p,idPrefix:v})})}),e.jsx(C.Scrollbar,{orientation:"horizontal",children:e.jsx(C.Thumb,{})})]}),D&&e.jsx(S.Button,{"aria-label":u,className:k([`${a}__scroll-button`,`${a}__scroll-button--left`,{[`${a}__scroll-button--align-with-grid`]:c}]),variant:S.BUTTON_VARIANT.TEXT,tabIndex:-1,iconOnly:!0,onClick:()=>{A(z.LEFT)},children:e.jsx(X.l,{className:k(`${a}__scroll-button-icon`),size:"md"})}),F&&e.jsx(S.Button,{"aria-label":_,className:k([`${a}__scroll-button`,`${a}__scroll-button--right`,{[`${a}__scroll-button--align-with-grid`]:c}]),variant:S.BUTTON_VARIANT.TEXT,tabIndex:-1,iconOnly:!0,onClick:()=>{A(z.RIGHT)},children:e.jsx(W.n,{className:k(`${a}__scroll-button-icon`),size:"md"})})]})}),e.jsx("section",{tabIndex:-1,id:$,"aria-labelledby":`${v}-trigger-${l}`,ref:H,style:{outline:"none"},children:o.Children.map(b,(h,j)=>e.jsx("div",{className:k({[`${a}__hidden`]:j!==l}),hidden:j!==l,children:h}))})]})};I.Content=te;I.displayName="Stepper";exports.Stepper=I;
-//# sourceMappingURL=stepper-Dao4XaDV.js.map
+"use strict";const e=require("react/jsx-runtime"),o=require("react"),S=require("./button-C5CYysw5.js"),X=require("./chevron-left.es-B0vPg5XM.js"),W=require("./chevron-right.es-Bv376M3o.js"),C=require("./index-CoR7YA3H.js"),L=require("./bind-DeUYJ6m9.js"),J=require("./tooltip-DRW4N9Z-.js"),K=require("./checkmark.es-lYntWFA3.js"),Q={PRIMARY:"primary"},x={SMALL_SCREEN:"small-screen",LARGE_SCREEN:"large-screen",ALWAYS:"always"},Z={"purpur-stepper__nav-container":"_purpur-stepper__nav-container_17tj8_1","purpur-stepper__nav":"_purpur-stepper__nav_17tj8_1","purpur-stepper":"_purpur-stepper_17tj8_1","purpur-stepper__scroll-button":"_purpur-stepper__scroll-button_17tj8_7","purpur-stepper__scroll-button--left":"_purpur-stepper__scroll-button--left_17tj8_18","purpur-stepper__scroll-button--right":"_purpur-stepper__scroll-button--right_17tj8_21","purpur-stepper__scroll-button--align-with-grid":"_purpur-stepper__scroll-button--align-with-grid_17tj8_24","purpur-stepper__scroll-button-icon":"_purpur-stepper__scroll-button-icon_17tj8_48","purpur-stepper__hidden":"_purpur-stepper__hidden_17tj8_51"},ee={"purpur-stepper-container":"_purpur-stepper-container_lnheo_1","purpur-stepper-container__inner--align-with-grid":"_purpur-stepper-container__inner--align-with-grid_lnheo_5","purpur-stepper-container--primary":"_purpur-stepper-container--primary_lnheo_28","purpur-stepper-container--secondary":"_purpur-stepper-container--secondary_lnheo_31"},V=L.c.bind(ee),R="purpur-stepper-container",re=({["data-testid"]:r="purpur-stepper-container",children:t,className:n,alignWithGrid:s,variant:p,...l})=>{const m=V(n,R,{[`${R}--${p}`]:p,[`${R}--align-with-grid`]:s});return e.jsx("div",{className:m,"data-testid":r,...l,children:e.jsx("div",{className:V(`${R}__inner`,{[`${R}__inner--align-with-grid`]:s}),children:t})})},te=o.forwardRef(({children:r,...t},n)=>{const{finished:s,...p}=t;return e.jsx("div",{...p,ref:n,children:r})}),se=r=>!!r&&o.isValidElement(r)&&!!r.props.label,ne={"purpur-stepper-link":"_purpur-stepper-link_1sqvz_1","purpur-stepper-link--disabled":"_purpur-stepper-link--disabled_1sqvz_27","purpur-stepper-link__trigger-outline":"_purpur-stepper-link__trigger-outline_1sqvz_53","purpur-stepper-link--first":"_purpur-stepper-link--first_1sqvz_65","purpur-stepper-link--current":"_purpur-stepper-link--current_1sqvz_65","purpur-stepper-link--middle":"_purpur-stepper-link--middle_1sqvz_70","purpur-stepper-link--last":"_purpur-stepper-link--last_1sqvz_80","purpur-stepper-link--visibility-small-screen":"_purpur-stepper-link--visibility-small-screen_1sqvz_90","purpur-stepper-link--visibility-large-screen":"_purpur-stepper-link--visibility-large-screen_1sqvz_98","purpur-stepper-link__icon":"_purpur-stepper-link__icon_1sqvz_122","purpur-stepper-link__step-number":"_purpur-stepper-link__step-number_1sqvz_132","purpur-stepper-link__step-number--current":"_purpur-stepper-link__step-number--current_1sqvz_143","purpur-stepper-link__step-number--disabled":"_purpur-stepper-link__step-number--disabled_1sqvz_147","purpur-stepper-link__step-label":"_purpur-stepper-link__step-label_1sqvz_152","arrow-forward":"_arrow-forward_1sqvz_156","purpur-stepper-link--primary":"_purpur-stepper-link--primary_1sqvz_168","purpur-stepper-link--secondary":"_purpur-stepper-link--secondary_1sqvz_177","arrow-tail":"_arrow-tail_1sqvz_187","sr-only--lg-down":"_sr-only--lg-down_1sqvz_206"},y=L.c.bind(ne),d="purpur-stepper-link",le=({["data-testid"]:r,current:t,disabled:n,stepNumber:s})=>e.jsx("div",{"data-testid":r,className:y([`${d}__step-number`,{[`${d}__step-number--current`]:t},{[`${d}__step-number--disabled`]:n}]),children:s}),E=o.forwardRef(({className:r,["data-testid"]:t,variant:n,step:s,indexOfLastItem:p,index:l,currentStepIndex:m,whenToBeVisible:c,handleStepChange:u,handleStepFocus:_,completedStepLabel:i,idPrefix:g,...b},f)=>{const v=l===0?"first":l===p?"last":"middle",$=l===m,T=w=>{if(s.disabled){w.preventDefault();return}u(w,l)};return e.jsx("a",{...b,ref:f,className:y(r,d,`${d}--${v}`,`${d}--${n}`,`${d}--visibility-${c}`,{[`${d}--current`]:$},{[`${d}--disabled`]:s.disabled},{"arrow-tail":v!=="first"},{"arrow-forward":v!=="last"}),id:`${g}-trigger-${l}`,href:s.disabled?void 0:`#${g}-content`,tabIndex:s.disabled?-1:void 0,"data-testid":`${t}-step-trigger-item-${l}`,"aria-disabled":s.disabled,"aria-current":$&&"step","aria-label":s.finished&&!$?[String(l+1),s.label,i].filter(Boolean).join(", "):void 0,onClick:T,onFocus:_,children:e.jsxs("span",{className:y(`${d}__trigger-outline`),children:[s.finished&&!$?e.jsx(K.a,{className:y(`${d}__icon`),"data-testid":`${t}-step-finished-icon`,size:"sm"}):e.jsx(le,{"data-testid":`${t}-step-number`,current:$,disabled:s.disabled,stepNumber:l+1}),e.jsx("span",{className:y(`${d}__step-label`,{"sr-only--lg-down":!$}),children:s.label})]})})}),ie={"purpur-stepper-nav-items__list":"_purpur-stepper-nav-items__list_lgkh0_1","purpur-stepper-nav-items__list-item":"_purpur-stepper-nav-items__list-item_lgkh0_7","purpur-stepper-nav-items__list-item--current":"_purpur-stepper-nav-items__list-item--current_lgkh0_25","purpur-stepper-nav-items__tooltip-content":"_purpur-stepper-nav-items__tooltip-content_lgkh0_31","purpur-stepper-nav-items__tooltip-trigger-item-container":"_purpur-stepper-nav-items__tooltip-trigger-item-container_lgkh0_34"},q=L.c.bind(ie),N="purpur-stepper-nav-items",pe=o.forwardRef(({["data-testid"]:r,variant:t,handleStepChange:n,handleStepFocus:s,steps:p,firstStepRef:l,lastStepRef:m,currentStepIndex:c,completedStepLabel:u,idPrefix:_},i)=>{const g=p.map((b,f)=>{const v=e.jsx("span",{className:q(`${N}__tooltip-trigger-item-container`),children:e.jsx(E,{"data-testid":`${r}-disabled-sm`,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.SMALL_SCREEN,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})});return e.jsx("li",{className:q(`${N}__list-item`,{[`${N}__list-item--current`]:f===c}),ref:f===0?l:f===p.length-1?m:null,children:b.disabled?e.jsxs(e.Fragment,{children:[e.jsx(J.Tooltip,{contentClassName:q(`${N}__tooltip-content`),triggerElement:v,children:b.label}),e.jsx(E,{"data-testid":`${r}-disabled-lg`,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.LARGE_SCREEN,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})]}):e.jsx(E,{"data-testid":r,variant:t,step:b,indexOfLastItem:p.length-1,index:f,currentStepIndex:c,whenToBeVisible:x.ALWAYS,completedStepLabel:u,handleStepChange:n,handleStepFocus:s,idPrefix:_})},b.label)});return e.jsx("ol",{ref:i,className:q(`${N}__list`),children:g})}),oe=r=>{const t=o.useRef(!0),n=o.useRef(null);return o.useEffect(()=>{!t.current&&n.current!==null&&n.current.focus(),t.current=!1},[r]),{contentRef:n}},z={LEFT:"left",RIGHT:"right"},ue=()=>{const r=o.useRef(null),t=o.useRef(null),n=o.useRef(null),[s,p]=o.useState(!1),[l,m]=o.useState(!1),c=u=>{if(!r.current)return;const _=r.current,i=_.clientWidth,g=_.scrollLeft;u===z.LEFT&&_.scroll({behavior:"smooth",left:g-i/2}),u===z.RIGHT&&_.scroll({behavior:"smooth",left:g+i/2})};return o.useEffect(()=>{if(t.current&&n.current&&r.current){const u=new IntersectionObserver(_=>{for(const i of _){if(i.target===t.current){i.isIntersecting?p(!1):p(!0);continue}i.target===n.current&&(i.isIntersecting?m(!1):m(!0))}},{root:r.current,threshold:.95});return u.observe(t.current),u.observe(n.current),()=>u.disconnect()}},[t,n,r]),{scrollContainer:r,firstStepRef:t,lastStepRef:n,displayLeftScrollButton:s,displayRightScrollButton:l,handleHorizontalScroll:c}},k=L.c.bind(Z),a="purpur-stepper",I=({["aria-label"]:r,["data-testid"]:t,children:n,className:s,completedStepLabel:p,currentStepIndex:l=0,onStepChange:m,alignWithGrid:c=!1,leftScrollButtonAriaLabel:u,rightScrollButtonAriaLabel:_,variant:i=Q.PRIMARY,...g})=>{const b=o.Children.toArray(n).filter(se),f=o.Children.map(b,h=>{const{disabled:j,finished:P,label:U}=h.props;return{disabled:j??!1,finished:P??!1,label:U}}),v=o.useId(),$=`${v}-content`,{scrollContainer:T,firstStepRef:w,lastStepRef:O,displayLeftScrollButton:D,displayRightScrollButton:F,handleHorizontalScroll:A}=ue(),{contentRef:H}=oe(l),Y=k([s,a,{[`${a}--${i}`]:i}]),B=h=>{h.target.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})},M=(h,j)=>{h.preventDefault(),B(h),m(j)},G=h=>{B(h)};return e.jsxs("div",{className:Y,...g,children:[e.jsx(re,{variant:i,alignWithGrid:c,children:e.jsxs("div",{className:k(`${a}__nav-container`),children:[e.jsxs(C.Root,{children:[e.jsx(C.Viewport,{ref:T,children:e.jsx("nav",{"aria-label":r,"data-testid":t,className:k([`${a}__nav`,{[`${a}__nav--${i}`]:i}]),children:e.jsx(pe,{"data-testid":t,variant:i,firstStepRef:w,lastStepRef:O,steps:f,currentStepIndex:l,handleStepChange:M,handleStepFocus:G,completedStepLabel:p,idPrefix:v})})}),e.jsx(C.Scrollbar,{orientation:"horizontal",children:e.jsx(C.Thumb,{})})]}),D&&e.jsx(S.Button,{"aria-label":u,className:k([`${a}__scroll-button`,`${a}__scroll-button--left`,{[`${a}__scroll-button--align-with-grid`]:c}]),variant:S.BUTTON_VARIANT.TEXT,tabIndex:-1,iconOnly:!0,onClick:()=>{A(z.LEFT)},children:e.jsx(X.l,{className:k(`${a}__scroll-button-icon`),size:"md"})}),F&&e.jsx(S.Button,{"aria-label":_,className:k([`${a}__scroll-button`,`${a}__scroll-button--right`,{[`${a}__scroll-button--align-with-grid`]:c}]),variant:S.BUTTON_VARIANT.TEXT,tabIndex:-1,iconOnly:!0,onClick:()=>{A(z.RIGHT)},children:e.jsx(W.n,{className:k(`${a}__scroll-button-icon`),size:"md"})})]})}),e.jsx("section",{tabIndex:-1,id:$,"aria-labelledby":`${v}-trigger-${l}`,ref:H,style:{outline:"none"},children:o.Children.map(b,(h,j)=>e.jsx("div",{className:k({[`${a}__hidden`]:j!==l}),hidden:j!==l,children:h}))})]})};I.Content=te;I.displayName="Stepper";exports.Stepper=I;
+//# sourceMappingURL=stepper-CbcFVE3v.js.map