@purpur/library 9.2.2 → 9.2.3

package/dist/modal-DZIdw9xy.js

@@ -1,2 +0,0 @@
-"use strict";const e=require("react/jsx-runtime"),d=require("./index-2cFVyGXq.js"),a=require("react"),F=require("./button-DmybVApa.js"),L=require("./heading-drD5ugCC.js"),U=require("./close.es-VL3lKi1O.js"),V=require("./paragraph-BsI53OR0.js"),K=require("./visually-hidden-C2CKovZx.js"),k=require("./bind-DeUYJ6m9.js"),G="_fadeIn_slvdi_1",J="_fadeOut_slvdi_1",Q="_slideUp_slvdi_1",X="_slideDown_slvdi_1",Y={"purpur-modal-content":"_purpur-modal-content_slvdi_1",fadeIn:G,fadeOut:J,slideUp:Q,slideDown:X,"purpur-modal-content__overlay":"_purpur-modal-content__overlay_slvdi_49","purpur-modal-content__close-button":"_purpur-modal-content__close-button_slvdi_65","purpur-modal-content__wrapper":"_purpur-modal-content__wrapper_slvdi_75","purpur-modal-content__wrapper-inner":"_purpur-modal-content__wrapper-inner_slvdi_85","purpur-modal-content__image-wrapper":"_purpur-modal-content__image-wrapper_slvdi_89","purpur-modal-content__header":"_purpur-modal-content__header_slvdi_112","purpur-modal-content__title":"_purpur-modal-content__title_slvdi_125","purpur-modal-content__description":"_purpur-modal-content__description_slvdi_128","purpur-modal-content__body":"_purpur-modal-content__body_slvdi_131","purpur-modal-content__body-inner":"_purpur-modal-content__body-inner_slvdi_139","purpur-modal-content__actions-buttons":"_purpur-modal-content__actions-buttons_slvdi_151","purpur-modal-content__notification":"_purpur-modal-content__notification_slvdi_169","purpur-modal-content--with-image":"_purpur-modal-content--with-image_slvdi_172","purpur-modal-content--overflow":"_purpur-modal-content--overflow_slvdi_172","purpur-modal-content__actions":"_purpur-modal-content__actions_slvdi_151","purpur-modal-content__actions-separator":"_purpur-modal-content__actions-separator_slvdi_203","purpur-modal-content--sticky-footer":"_purpur-modal-content--sticky-footer_slvdi_213"},N=n=>n.showCloseButton===!0,r=k.c.bind(Y),t="purpur-modal-content",Z=a.forwardRef(({["data-testid"]:n,actions:s,children:o,className:u,description:_,disableCloseOnClickOutside:b,hideDescription:g,image:p,stickyButtons:x=!0,title:q,notification:j=void 0,zIndex:$,onCloseAutoFocus:D,...y},O)=>{const{closeButtonAriaLabel:v,showCloseButton:E,...H}=y,[I,M]=a.useState(!1),[P,S]=a.useState(0),m=a.useRef(null),h=a.useRef(null),B=r(t,{[`${t}--with-image`]:!!p},{[`${t}--overflow`]:I},{[`${t}--sticky-footer`]:x},u),i=l=>n?`${n} ${l}`:void 0,T=l=>{b&&l.preventDefault()},c=a.useCallback(()=>{if(!m.current||!h.current)return;const l=window.getComputedStyle(m.current,null),f=parseFloat(l.getPropertyValue("height")),A=h.current.offsetHeight;M(f<A),S((m.current.offsetWidth??0)-(m.current.clientWidth??0))},[]),W=()=>{const l=h.current;if(l){const f=l.querySelector("h2");f&&setTimeout(()=>{f.focus()})}},z=l=>{b&&!E&&l.preventDefault()};return a.useEffect(()=>(window.addEventListener("resize",c),()=>{window.removeEventListener("resize",c)}),[c]),a.useEffect(()=>{c()},[j,o,c]),e.jsxs(d.Portal,{children:[e.jsx(d.Overlay,{className:r(`${t}__overlay`),style:{zIndex:$}}),e.jsxs(d.Content,{...H,className:B,"data-testid":n,ref:O,...!_&&{"aria-describedby":void 0},onPointerDownOutside:T,onOpenAutoFocus:()=>{c(),W()},onEscapeKeyDown:z,onCloseAutoFocus:D,style:{zIndex:`calc(${$} + 1)`},children:[e.jsxs("div",{ref:m,className:r(`${t}__wrapper`),children:[N(y)&&v&&p&&e.jsx(C,{"aria-label":v,hasImage:!0,scrollbarWidth:P,"data-testid":i("close-button")}),e.jsxs("div",{ref:h,className:r(`${t}__wrapper-inner`),children:[e.jsxs("div",{className:r(`${t}__header`),children:[N(y)&&v&&!p&&e.jsx(C,{"aria-label":v,"data-testid":i("close-button")}),e.jsx(d.Title,{asChild:!0,className:r(`${t}__title`),"data-testid":i("title"),children:e.jsx(L.Heading,{tag:"h2",variant:"display-10",tabIndex:-1,children:q})})]}),p&&e.jsx("div",{className:r(`${t}__image-wrapper`),"data-testid":i("image"),children:p}),e.jsx("div",{className:r(`${t}__body`),children:e.jsxs("div",{className:r(`${t}__body-inner`),children:[_&&g&&e.jsx(K.VisuallyHidden,{asChild:!0,children:e.jsx(d.Description,{"data-testid":i("description"),children:_})}),_&&!g&&e.jsx(d.Description,{asChild:!0,className:r(`${t}__description`),"data-testid":i("description"),children:e.jsx(V.Paragraph,{variant:"paragraph-100",children:_})}),e.jsx("div",{children:o}),!x&&e.jsx(R,{actions:s,notification:j})]})})]})]}),x&&e.jsx(R,{actions:s,notification:j})]})]})}),C=({["aria-label"]:n,hasImage:s,scrollbarWidth:o,["data-testid"]:u})=>e.jsx(d.Close,{asChild:!0,children:e.jsx(F.Button,{variant:s?"primary":"tertiary-purple",negative:s,size:"sm",iconOnly:!0,"aria-label":n,className:r(`${t}__close-button`),style:{right:`calc(var(--purpur-spacing-100) + ${o||0}px)`},"data-testid":u,children:e.jsx(U.r,{})})}),R=({actions:n,notification:s})=>{const o=a.useRef(null);return a.useEffect(()=>{s&&o?.current?.scrollIntoView?.(!1)},[s]),n?e.jsxs("div",{className:r(`${t}__actions`),children:[e.jsx("div",{className:r(`${t}__actions-buttons`),"data-testid":"modal actions",children:n}),s&&e.jsx("div",{className:r(`${t}__notification`),ref:o,children:s}),e.jsx("span",{className:r(`${t}__actions-separator`)})]}):null},ee=a.forwardRef(({children:n,...s},o)=>e.jsx(d.Trigger,{asChild:!0,ref:o,...s,children:n})),w=({["data-testid"]:n,children:s,open:o,onOpenChange:u})=>e.jsx(d.Root,{open:o,onOpenChange:u,"data-testid":n,children:s});w.Trigger=ee;w.Content=Z;w.displayName="Modal";exports.Modal=w;
-//# sourceMappingURL=modal-DZIdw9xy.js.map

package/dist/modal-DZIdw9xy.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal-DZIdw9xy.js","sources":["../../../components/modal/src/modal-content.tsx","../../../components/modal/src/modal-trigger.tsx","../../../components/modal/src/modal.tsx"],"sourcesContent":["import React, { forwardRef, type ReactNode, useCallback, useEffect, useRef, useState } from \"react\";\nimport { Button } from \"@purpur/button\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { Heading } from \"@purpur/heading\";\nimport { IconClose } from \"@purpur/icon/close\";\nimport { Paragraph } from \"@purpur/paragraph\";\nimport { VisuallyHidden } from \"@purpur/visually-hidden\";\nimport {\n  Close as RadixClose,\n  Content as RadixContent,\n  Description as RadixDescription,\n  Overlay as RadixOverlay,\n  Portal as RadixPortal,\n  Title as RadixTitle,\n} from \"@radix-ui/react-dialog\";\nimport c from \"classnames/bind\";\n\nimport \"@purpur/notification/styles\";\nimport styles from \"./modal-content.module.scss\";\n\nexport type DefaultProps = Omit<BaseProps, \"children\"> & {\n  /**\n   * One or several CTA links or buttons\n   * */\n  actions?: ReactNode;\n  children: ReactNode;\n  /**\n   * An optional accessible description to be announced when the dialog is opened.\n   * */\n  description?: string;\n  /**\n   * Prevents the modal from closing on click outside if set to `true`.\n   * */\n  disableCloseOnClickOutside?: boolean;\n  /**\n   * Visually hides the description if set to `true`.\n   * */\n  hideDescription?: boolean;\n  /**\n   * An optional image to be displayed at the top of the modal.\n   * */\n  image?: ReactNode;\n  /**\n   * Provide a Purpur Notification which will render beneath the modal buttons, otherwise leave it undefined.\n   * */\n  notification?: ReactNode;\n  /**\n   * Determines whether the button group should be fixed at the bottom or scroll with the content.\n   * */\n  stickyButtons?: boolean;\n  /**\n   * An accessible title to be announced when the dialog is opened.\n   * */\n  title: string;\n  /**\n   * z-index of the modal\n   * */\n  zIndex?: number;\n  /**\n   * Event handler called when focus moves to the trigger after closing.\n   * */\n  onCloseAutoFocus?: (e: Event) => void;\n};\n\ntype NoCloseButtonProps = {\n  /**\n   * An accessible label for the close button.\n   * */\n  closeButtonAriaLabel?: never;\n  /**\n   * Shows the close button if set to `true`. Must be used in conjunction with `closeButtonAriaLabel`.\n   * */\n  showCloseButton?: false;\n};\n\ntype CloseButtonProps = {\n  /**\n   * An accessible label for the close button.\n   * */\n  closeButtonAriaLabel: string;\n  /**\n   * Shows the close button if set to `true`. Must be used in conjunction with `closeButtonAriaLabel`.\n   * */\n  showCloseButton: true;\n};\n\nexport type ModalContentProps = DefaultProps & (CloseButtonProps | NoCloseButtonProps);\n\nconst hasCloseButtonProps = (\n  props: CloseButtonProps | NoCloseButtonProps\n): props is CloseButtonProps => (props as CloseButtonProps).showCloseButton === true;\n\nconst cx = c.bind(styles);\nconst rootClassName = \"purpur-modal-content\";\n\nexport const ModalContent = forwardRef<HTMLDivElement, ModalContentProps>(\n  (\n    {\n      [\"data-testid\"]: dataTestId,\n      actions,\n      children,\n      className,\n      description,\n      disableCloseOnClickOutside,\n      hideDescription,\n      image,\n      stickyButtons = true,\n      title,\n      notification = undefined,\n      zIndex,\n      onCloseAutoFocus,\n      ...props\n    },\n    ref\n  ) => {\n    const { closeButtonAriaLabel, showCloseButton, ...rest } = props;\n    const [contentOverflow, setContentOverflow] = useState(false);\n    const [scrollbarWidth, setScrollbarWidth] = useState(0);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const wrapperInnerRef = useRef<HTMLDivElement>(null);\n\n    const classes = cx(\n      rootClassName,\n      { [`${rootClassName}--with-image`]: !!image },\n      { [`${rootClassName}--overflow`]: contentOverflow },\n      { [`${rootClassName}--sticky-footer`]: stickyButtons },\n      className\n    );\n\n    const getTestId = (id: string) => (dataTestId ? `${dataTestId} ${id}` : undefined);\n\n    const handlePointerDownOutside = (event: CustomEvent<{ originalEvent: PointerEvent }>) => {\n      if (disableCloseOnClickOutside) {\n        event.preventDefault();\n      }\n    };\n\n    const handleContentOverflow = useCallback(() => {\n      if (!wrapperRef.current || !wrapperInnerRef.current) {\n        return;\n      }\n\n      const computedStyle = window.getComputedStyle(wrapperRef.current, null);\n      const wrapperHeight = parseFloat(computedStyle.getPropertyValue(\"height\"));\n      const innerHeight = wrapperInnerRef.current.offsetHeight;\n\n      setContentOverflow(wrapperHeight < innerHeight);\n\n      setScrollbarWidth(\n        (wrapperRef.current.offsetWidth ?? 0) - (wrapperRef.current.clientWidth ?? 0)\n      );\n    }, []);\n\n    const handleInitialFocus = () => {\n      const frame = wrapperInnerRef.current;\n      if (frame) {\n        const heading = frame.querySelector(\"h2\");\n\n        heading &&\n          setTimeout(() => {\n            heading.focus();\n          });\n      }\n    };\n\n    const handleEscapeKeyDown = (event: KeyboardEvent) => {\n      if (disableCloseOnClickOutside && !showCloseButton) {\n        event.preventDefault();\n      }\n    };\n\n    useEffect(() => {\n      window.addEventListener(\"resize\", handleContentOverflow);\n\n      return () => {\n        window.removeEventListener(\"resize\", handleContentOverflow);\n      };\n    }, [handleContentOverflow]);\n\n    useEffect(() => {\n      handleContentOverflow();\n    }, [notification, children, handleContentOverflow]);\n\n    return (\n      <RadixPortal>\n        <RadixOverlay className={cx(`${rootClassName}__overlay`)} style={{ zIndex }} />\n        <RadixContent\n          {...rest}\n          className={classes}\n          data-testid={dataTestId}\n          ref={ref}\n          {...(!description && { [\"aria-describedby\"]: undefined })}\n          onPointerDownOutside={handlePointerDownOutside}\n          onOpenAutoFocus={() => {\n            handleContentOverflow();\n            handleInitialFocus();\n          }}\n          onEscapeKeyDown={handleEscapeKeyDown}\n          onCloseAutoFocus={onCloseAutoFocus}\n          style={{ zIndex: `calc(${zIndex} + 1)` }}\n        >\n          <div ref={wrapperRef} className={cx(`${rootClassName}__wrapper`)}>\n            {hasCloseButtonProps(props) && closeButtonAriaLabel && image && (\n              <CloseButton\n                aria-label={closeButtonAriaLabel}\n                hasImage\n                scrollbarWidth={scrollbarWidth}\n                data-testid={getTestId(\"close-button\")}\n              />\n            )}\n            <div ref={wrapperInnerRef} className={cx(`${rootClassName}__wrapper-inner`)}>\n              <div className={cx(`${rootClassName}__header`)}>\n                {hasCloseButtonProps(props) && closeButtonAriaLabel && !image && (\n                  <CloseButton\n                    aria-label={closeButtonAriaLabel}\n                    data-testid={getTestId(\"close-button\")}\n                  />\n                )}\n                <RadixTitle\n                  asChild\n                  className={cx(`${rootClassName}__title`)}\n                  data-testid={getTestId(\"title\")}\n                >\n                  <Heading tag=\"h2\" variant=\"display-10\" tabIndex={-1}>\n                    {title}\n                  </Heading>\n                </RadixTitle>\n              </div>\n              {image && (\n                <div\n                  className={cx(`${rootClassName}__image-wrapper`)}\n                  data-testid={getTestId(\"image\")}\n                >\n                  {image}\n                </div>\n              )}\n              <div className={cx(`${rootClassName}__body`)}>\n                <div className={cx(`${rootClassName}__body-inner`)}>\n                  {description && hideDescription && (\n                    <VisuallyHidden asChild>\n                      <RadixDescription data-testid={getTestId(\"description\")}>\n                        {description}\n                      </RadixDescription>\n                    </VisuallyHidden>\n                  )}\n                  {description && !hideDescription && (\n                    <RadixDescription\n                      asChild\n                      className={cx(`${rootClassName}__description`)}\n                      data-testid={getTestId(\"description\")}\n                    >\n                      <Paragraph variant=\"paragraph-100\">{description}</Paragraph>\n                    </RadixDescription>\n                  )}\n                  <div>{children}</div>\n                  {!stickyButtons && <ModalActions actions={actions} notification={notification} />}\n                </div>\n              </div>\n            </div>\n          </div>\n\n          {stickyButtons && <ModalActions actions={actions} notification={notification} />}\n        </RadixContent>\n      </RadixPortal>\n    );\n  }\n);\n\nconst CloseButton = ({\n  [\"aria-label\"]: ariaLabel,\n  hasImage,\n  scrollbarWidth,\n  [\"data-testid\"]: dataTestId,\n}: {\n  [\"aria-label\"]: string;\n  hasImage?: boolean;\n  scrollbarWidth?: number;\n  [\"data-testid\"]?: string;\n}) => (\n  <RadixClose asChild>\n    <Button\n      variant={hasImage ? \"primary\" : \"tertiary-purple\"}\n      negative={hasImage}\n      size=\"sm\"\n      iconOnly\n      aria-label={ariaLabel}\n      className={cx(`${rootClassName}__close-button`)}\n      style={{ right: `calc(var(--purpur-spacing-100) + ${scrollbarWidth || 0}px)` }}\n      data-testid={dataTestId}\n    >\n      <IconClose />\n    </Button>\n  </RadixClose>\n);\n\nexport const MAX_NUMBER_OF_ACTIONS = 3;\n\nexport const ModalActions = ({\n  actions,\n  notification,\n}: Pick<ModalContentProps, \"actions\" | \"notification\">) => {\n  const notificationRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (notification) {\n      notificationRef?.current?.scrollIntoView?.(false);\n    }\n  }, [notification]);\n\n  return actions ? (\n    <div className={cx(`${rootClassName}__actions`)}>\n      <div className={cx(`${rootClassName}__actions-buttons`)} data-testid=\"modal actions\">\n        {actions}\n      </div>\n      {notification && (\n        <div className={cx(`${rootClassName}__notification`)} ref={notificationRef}>\n          {notification}\n        </div>\n      )}\n      <span className={cx(`${rootClassName}__actions-separator`)} />\n    </div>\n  ) : null;\n};\n","import React, { forwardRef, type ReactNode } from \"react\";\nimport type { BaseProps } from \"@purpur/common-types\";\nimport { Trigger as RadixTrigger } from \"@radix-ui/react-dialog\";\n\nexport type ModalTriggerProps = Omit<BaseProps<\"button\">, \"children\"> & {\n  children: ReactNode;\n};\n\nexport const ModalTrigger = forwardRef<HTMLButtonElement, ModalTriggerProps>(\n  ({ children, ...props }, ref) => {\n    return (\n      <RadixTrigger asChild ref={ref} {...props}>\n        {children}\n      </RadixTrigger>\n    );\n  }\n);\n","import React, { type ReactNode } from \"react\";\nimport { Root as RadixRoot } from \"@radix-ui/react-dialog\";\n\nimport { ModalContent } from \"./modal-content\";\nimport { ModalTrigger } from \"./modal-trigger\";\n\nexport type ModalProps = {\n  [\"data-testid\"]?: string;\n  children: ReactNode;\n  /**\n   * Event handler called when the open state of the dialog changes.\n   * */\n  onOpenChange?: (value: boolean) => void;\n  /**\n   * The controlled open state of the dialog. Must be used in conjunction with `onOpenChange`.\n   * */\n  open?: boolean;\n};\n\nexport const Modal = ({\n  [\"data-testid\"]: dataTestId,\n  children,\n  open,\n  onOpenChange,\n}: ModalProps) => (\n  <RadixRoot open={open} onOpenChange={onOpenChange} data-testid={dataTestId}>\n    {children}\n  </RadixRoot>\n);\n\nModal.Trigger = ModalTrigger;\nModal.Content = ModalContent;\n\nModal.displayName = \"Modal\";\n"],"names":["hasCloseButtonProps","props","cx","c","styles","rootClassName","ModalContent","forwardRef","dataTestId","actions","children","className","description","disableCloseOnClickOutside","hideDescription","image","stickyButtons","title","notification","zIndex","onCloseAutoFocus","ref","closeButtonAriaLabel","showCloseButton","rest","contentOverflow","setContentOverflow","useState","scrollbarWidth","setScrollbarWidth","wrapperRef","useRef","wrapperInnerRef","classes","getTestId","id","handlePointerDownOutside","event","handleContentOverflow","useCallback","computedStyle","wrapperHeight","innerHeight","handleInitialFocus","frame","heading","handleEscapeKeyDown","useEffect","RadixPortal","jsx","RadixOverlay","jsxs","RadixContent","CloseButton","RadixTitle","Heading","VisuallyHidden","RadixDescription","Paragraph","ModalActions","ariaLabel","hasImage","RadixClose","Button","IconClose","notificationRef","ModalTrigger","RadixTrigger","Modal","open","onOpenChange","RadixRoot"],"mappings":"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"}

package/dist/search-field-CU_tsmHb.js

@@ -1,2 +0,0 @@
-"use strict";const e=require("react/jsx-runtime"),f=require("react"),S=require("./listbox-COBHLRtB.js"),A=require("./use-autocomplete.es-BHDgQLae.js"),j=require("./bind-DeUYJ6m9.js"),R=require("./search.es-Cg2amJSR.js"),B=require("./text-field-CYJzQG3h.js"),F=require("./button-DmybVApa.js"),C={"purpur-search-field":"_purpur-search-field_6ot57_1","purpur-search-field--has-clear-button":"_purpur-search-field--has-clear-button_6ot57_4","purpur-search-field--no-gap":"_purpur-search-field--no-gap_6ot57_13","purpur-search-field__wrapper":"_purpur-search-field__wrapper_6ot57_17","purpur-search-field__wrapper--gap":"_purpur-search-field__wrapper--gap_6ot57_20","purpur-search-field__search-icon":"_purpur-search-field__search-icon_6ot57_24","purpur-search-field__close-icon":"_purpur-search-field__close-icon_6ot57_24","purpur-search-field__autocomplete-root":"_purpur-search-field__autocomplete-root_6ot57_27","purpur-search-field__listbox":"_purpur-search-field__listbox_6ot57_31"},L={"purpur-search-field-button":"_purpur-search-field-button_c16yo_1","purpur-search-field-button--icon-only":"_purpur-search-field-button--icon-only_c16yo_1"},z=j.c.bind(L),w="purpur-search-field-button",V=({["data-testid"]:t,disabled:a,iconOnly:u,label:o})=>{const i={className:z(w,{[`${w}--icon-only`]:u}),disabled:a,"data-testid":t};return u?e.jsx(F.Button,{...i,"aria-label":o,iconOnly:!0,size:"sm",type:"submit",variant:"primary",children:e.jsx(R.s,{size:"xs"})}):e.jsx(F.Button,{...i,size:"sm",type:"submit",variant:"primary",children:o})},k=["button-attached","no-button"],y=j.c.bind(C),d="purpur-search-field",$=f.forwardRef(({["data-testid"]:t,className:a,clearButtonAriaLabel:u,disabled:o,iconOnlySearchButton:i,onClear:c,onSearch:l,searchButtonLabel:b,variant:p,formRef:r,wrapperStyle:m,...n},s)=>{const _=h=>t?`${t}-${h}`:void 0,x=(typeof n.value=="number"?n.value!==void 0:n.value?.length)&&!o&&!n.readOnly&&!n.loading,O=y(a,d,{[`${d}--no-gap`]:p==="button-attached",[`${d}--has-clear-button`]:x});return e.jsx("form",{ref:r,className:y(`${d}__wrapper`),"data-testid":t,style:m,onSubmit:h=>{h.preventDefault(),l?.(h)},children:e.jsx(B.TextField,{ref:s,className:O,clearButtonAriaLabel:u,disabled:o,onClear:c,startAdornment:i?null:e.jsx(R.s,{size:"xs",className:y(`${d}__search-icon`)},"1"),afterField:p!=="no-button"?e.jsx(V,{disabled:o,iconOnly:i,label:b,"data-testid":_("button")}):null,"data-testid":_("text-field"),type:"search",...n})})});$.displayName="SearchFieldBase";const q=j.c.bind(C),v="purpur-search-field",g=f.forwardRef(({suggestions:t,suggestionsLabel:a,onSelectSuggestion:u,openSuggestionsOnFocus:o,suggestionsMaxHeight:i,...c},l)=>{const b=f.useId(),p=c.id??b,r=A.ee({id:p,options:t,listboxLabel:a,disabled:c.disabled,readOnly:c.readOnly,openOnFocus:o,listboxMaxHeight:i,onSelect:u,"data-testid":c["data-testid"]}),m=s=>{r.inputRef.current=s,typeof l=="function"?l(s):l&&(l.current=s)},n=s=>{c.onChange?.(s),r.isOpen||r.openListbox()};return e.jsxs("div",{ref:r.rootRef,className:q(`${v}__autocomplete-root`),children:[e.jsx($,{ref:m,...c,onChange:n,id:p,wrapperStyle:r.anchorStyle,...r.inputProps}),r.isOpen&&e.jsx(S.Listbox,{...r.listboxProps,className:q(`${v}__listbox`),children:t.map((s,_)=>{const{key:N,...x}=r.getListboxItemProps(s,_);return e.jsx(S.Listbox.Item,{...x,children:s.label},N)})})]})});g.displayName="SearchFieldAutocomplete";const I=f.forwardRef((t,a)=>t.suggestions?e.jsx(g,{ref:a,...t}):e.jsx($,{ref:a,...t}));I.displayName="SearchField";exports.SearchField=I;exports.SearchFieldAutocomplete=g;exports.searchFieldVariants=k;
-//# sourceMappingURL=search-field-CU_tsmHb.js.map