@commercetools/nimbus 0.0.0-canary-20250826065101 → 0.0.0-canary-20250826133439

package/dist/chunks/{form-field-B6lCvcf4.cjs.js.map → form-field-DiW_0hSy.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"form-field-B6lCvcf4.cjs.js","sources":["../../src/components/form-field/components/form-field.context.tsx","../../src/components/form-field/form-field.recipe.tsx","../../src/components/form-field/form-field.slots.tsx","../../src/components/form-field/components/form-field.root.tsx","../../src/components/form-field/components/form-field.label.tsx","../../src/components/form-field/components/form-field.input.tsx","../../src/components/form-field/components/form-field.description.tsx","../../src/components/form-field/components/form-field.error.tsx","../../src/components/form-field/components/form-field.info-box.tsx","../../src/components/form-field/form-field.tsx"],"sourcesContent":["import { createContext, type ReactNode } from \"react\";\nimport type {\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldLabelSlotProps,\n} from \"../form-field.slots\";\n\nexport type FormFieldContextPayloadType = {\n  label: ReactNode;\n  labelSlotProps?: FormFieldLabelSlotProps;\n  input: ReactNode;\n  inputSlotProps?: FormFieldInputSlotProps;\n  description: ReactNode;\n  descriptionSlotProps?: FormFieldDescriptionSlotProps;\n  error: ReactNode;\n  errorSlotProps?: FormFieldErrorSlotProps;\n  info: ReactNode;\n  isInvalid?: boolean;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n};\n\nexport type FormFieldContextType = {\n  context: FormFieldContextPayloadType;\n  setContext: React.Dispatch<React.SetStateAction<FormFieldContextPayloadType>>;\n};\n\nexport const FormFieldContext = createContext<FormFieldContextType>({\n  context: {\n    label: null,\n    description: null,\n    error: null,\n    info: null,\n    input: null,\n  },\n  setContext: () => {},\n});\n","import { defineSlotRecipe } from \"@chakra-ui/react/styled-system\";\n\nconst columnLayout = `\n\"label\"\n\"input\"\n\"description\"\n\"error\"\n`;\nconst rowLayout = `\n\"label input\"\n\"label description\"\n\"label error\"\n`;\n\n/**\n * Recipe configuration for the FormField component.\n * Defines the styling variants and base styles using Chakra UI's recipe system.\n */\nexport const formFieldRecipe = defineSlotRecipe({\n  slots: [\"root\", \"label\", \"input\", \"description\", \"error\", \"popover\"],\n  // Unique class name prefix for the component\n  className: \"nimbus-ui-form-field\",\n\n  base: {\n    root: {\n      \"--grid-gap\": \"spacing.100\",\n\n      display: \"grid\",\n      width: \"auto\",\n    },\n    label: {\n      gridArea: \"label\",\n      fontWeight: \"500\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    input: {\n      gridArea: \"input\",\n    },\n    description: {\n      gridArea: \"description\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    error: {\n      gridArea: \"error\",\n      color: \"critical.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    popover: {\n      \"--scrollbar-color\": \"colors.neutral.8\",\n      \"--scrollbar-bg\": \"colors.neutral.3\",\n      bg: \"neutral.1\",\n      maxWidth: \"xl\",\n      borderRadius: \"200\",\n      boxShadow: \"6\",\n      border: \"solid-25\",\n      borderColor: \"neutral.8\",\n      maxHeight: \"40svh\",\n      overflow: \"auto\",\n      scrollbarWidth: \"thin\",\n      scrollbarColor: \"var(--scrollbar-color) var(--scrollbar-bg)\",\n      focusRing: \"outside\",\n    },\n  },\n\n  variants: {\n    size: {\n      md: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.350\",\n          \"--form-field-line-height\": \"lineHeights.500\",\n        },\n      },\n      sm: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.300\",\n          \"--form-field-line-height\": \"lineHeights.450\",\n        },\n      },\n    },\n    direction: {\n      column: {\n        root: {\n          gridTemplateAreas: columnLayout,\n        },\n        input: {\n          mt: \"var(--grid-gap)\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n      row: {\n        root: {\n          gridTemplateAreas: rowLayout,\n          gridTemplateColumns: \"auto 1fr\",\n          gridColumnGap: \"200\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n    },\n  },\n\n  // Default variant values when not explicitly specified\n  defaultVariants: {\n    direction: \"column\",\n    size: \"md\",\n  },\n});\n","/* eslint-disable @typescript-eslint/no-empty-object-type */\nimport {\n  type HTMLChakraProps,\n  type RecipeVariantProps,\n  type UnstyledProp,\n  createSlotRecipeContext,\n} from \"@chakra-ui/react/styled-system\";\n\nimport { formFieldRecipe } from \"./form-field.recipe\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  recipe: formFieldRecipe,\n});\n\n// Root slot\nexport interface FormFieldRootSlotProps\n  extends HTMLChakraProps<\n    \"div\",\n    RecipeVariantProps<typeof formFieldRecipe> & UnstyledProp\n  > {}\n\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport interface FormFieldLabelSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport interface FormFieldInputSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport interface FormFieldDescriptionSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport interface FormFieldErrorSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport interface FormFieldPopoverSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useState,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField } from \"react-aria\";\nimport {\n  FormFieldContext,\n  type FormFieldContextPayloadType,\n} from \"./form-field.context\";\nimport {\n  FormFieldDescriptionSlot,\n  FormFieldErrorSlot,\n  FormFieldInputSlot,\n  FormFieldLabelSlot,\n  FormFieldPopoverSlot,\n  FormFieldRootSlot,\n} from \"../form-field.slots\";\nimport { Dialog, DialogTrigger, Popover } from \"react-aria-components\";\nimport { Box, IconButton } from \"@/components\";\nimport { ErrorOutline, HelpOutline } from \"@commercetools/nimbus-icons\";\n\n/**\n * # FormField\n *\n * displays miscellaneous inputs in a FormField context\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/formfield}\n */\nexport const FormFieldRoot = forwardRef<HTMLDivElement, FormFieldProps>(\n  (\n    { isInvalid, isRequired, isDisabled, isReadOnly, children, ...props },\n    ref\n  ) => {\n    const [context, setContext] = useState<FormFieldContextPayloadType>({\n      label: null,\n      description: null,\n      error: null,\n      info: null,\n      input: null,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    });\n\n    const useFieldArgs: Parameters<typeof useField>[0] = {\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      useFieldArgs.label = context.label;\n    } else {\n      // Context will always start out null, so we need to stub out some aria attributes\n      // FIXME: This is a hack to get the form field to work, but it's not the best solution\n      // FIXME: We should find a better way to handle this by redesigning the FormField component's structure\n      useFieldArgs[\"aria-label\"] = \"empty-label\";\n      useFieldArgs[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n      useField(useFieldArgs);\n\n    useEffect(() => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        isInvalid,\n        isRequired,\n        isDisabled,\n        isReadOnly,\n      }));\n    }, [isInvalid, isRequired, isDisabled, isReadOnly]);\n\n    const inputProps = {\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    };\n\n    return (\n      <FormFieldContext.Provider value={{ context, setContext }}>\n        <FormFieldRootSlot ref={ref} {...props}>\n          {context.label && (\n            <FormFieldLabelSlot {...context.labelSlotProps}>\n              <label {...labelProps}>\n                {context.label}\n                {isRequired && <sup aria-hidden=\"true\">*</sup>}\n              </label>\n              {context.info && (\n                <DialogTrigger>\n                  <Box\n                    as=\"span\"\n                    display=\"inline-block\"\n                    position=\"relative\"\n                    width=\"1ch\"\n                    height=\"1ch\"\n                    ml=\"200\"\n                  >\n                    <Box\n                      as=\"span\"\n                      display=\"inline-flex\"\n                      position=\"absolute\"\n                      top=\"50%\"\n                      right=\"50%\"\n                      transform=\"translate(50%, -50%)\"\n                    >\n                      <IconButton\n                        aria-label=\"__MORE INFO\"\n                        size=\"2xs\"\n                        tone=\"info\"\n                        variant=\"link\"\n                      >\n                        <HelpOutline />\n                      </IconButton>\n                    </Box>\n                  </Box>\n                  <Popover>\n                    <FormFieldPopoverSlot asChild>\n                      <Dialog>\n                        <Box p=\"300\">{context.info}</Box>\n                      </Dialog>\n                    </FormFieldPopoverSlot>\n                  </Popover>\n                </DialogTrigger>\n              )}\n            </FormFieldLabelSlot>\n          )}\n          {context.input && (\n            <FormFieldInputSlot {...context.inputSlotProps}>\n              {Children.map(context.input, (child) => {\n                // Important: Check if the child is a valid React element before cloning.\n                if (isValidElement(child)) {\n                  return cloneElement(child, inputProps);\n                }\n                // If it's not a valid element (e.g., text node, null, undefined), return it as is.\n                return child;\n              })}\n            </FormFieldInputSlot>\n          )}\n          {context.description && (\n            <FormFieldDescriptionSlot\n              {...descriptionProps}\n              {...context.descriptionSlotProps}\n            >\n              {context.description}\n            </FormFieldDescriptionSlot>\n          )}\n          {isInvalid && context.error && (\n            <FormFieldErrorSlot\n              {...errorMessageProps}\n              {...context.errorSlotProps}\n            >\n              <Box\n                as={ErrorOutline}\n                display=\"inline-flex\"\n                boxSize=\"400\"\n                verticalAlign=\"text-bottom\"\n                mr=\"100\"\n              />\n              {context.error}\n            </FormFieldErrorSlot>\n          )}\n          {children}\n        </FormFieldRootSlot>\n      </FormFieldContext.Provider>\n    );\n  }\n);\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldLabel = ({\n  children,\n  ...labelSlotProps\n}: FormFieldLabelSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      label: children,\n      labelSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldInputSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldInput = ({\n  children,\n  ...inputSlotProps\n}: FormFieldInputSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      input: children,\n      inputSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldDescriptionSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldDescription = ({\n  children,\n  ...descriptionSlotProps\n}: FormFieldDescriptionSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      description: children,\n      descriptionSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldErrorSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldError = ({\n  children,\n  ...errorSlotProps\n}: FormFieldErrorSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      error: children,\n      errorSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect, type ReactNode } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\n\ntype FormFieldInfoBoxProps = {\n  /**\n   * The content to display in the InfoBox\n   */\n  children: ReactNode;\n};\n\nexport const FormFieldInfoBox = ({ children }: FormFieldInfoBoxProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      info: children,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { FormFieldRoot } from \"./components/form-field.root\";\nimport { FormFieldLabel } from \"./components/form-field.label\";\nimport { FormFieldInput } from \"./components/form-field.input\";\nimport { FormFieldDescription } from \"./components/form-field.description\";\nimport { FormFieldError } from \"./components/form-field.error\";\nimport { FormFieldInfoBox } from \"./components/form-field.info-box\";\n\nexport const FormField = {\n  Root: FormFieldRoot,\n  Label: FormFieldLabel,\n  Input: FormFieldInput,\n  Description: FormFieldDescription,\n  Error: FormFieldError,\n  InfoBox: FormFieldInfoBox,\n};\n\nexport {\n  FormFieldRoot as _FormFieldRoot,\n  FormFieldLabel as _FormFieldLabel,\n  FormFieldInput as _FormFieldInput,\n  FormFieldDescription as _FormFieldDescription,\n  FormFieldError as _FormFieldError,\n  FormFieldInfoBox as _FormFieldInfoBox,\n};\n"],"names":["FormFieldContext","createContext","columnLayout","rowLayout","formFieldRecipe","defineSlotRecipe","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardRef","isInvalid","isRequired","isDisabled","isReadOnly","children","props","ref","context","setContext","useState","useFieldArgs","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","jsx","jsxs","DialogTrigger","Box","IconButton","HelpOutline","Popover","Dialog","Children","child","isValidElement","cloneElement","ErrorOutline","FormFieldLabel","labelSlotProps","useContext","FormFieldInput","inputSlotProps","FormFieldDescription","descriptionSlotProps","FormFieldError","errorSlotProps","FormFieldInfoBox","FormField"],"mappings":"0WA6BaA,EAAmBC,EAAAA,cAAoC,CAClE,QAAS,CACP,MAAO,KACP,YAAa,KACb,MAAO,KACP,KAAM,KACN,MAAO,IAAA,EAET,WAAY,IAAM,CAAC,CACrB,CAAC,ECpCKC,EAAe;AAAA;AAAA;AAAA;AAAA;AAAA,EAMfC,EAAY;AAAA;AAAA;AAAA;AAAA,EAULC,EAAkBC,EAAAA,iBAAiB,CAC9C,MAAO,CAAC,OAAQ,QAAS,QAAS,cAAe,QAAS,SAAS,EAEnE,UAAW,uBAEX,KAAM,CACJ,KAAM,CACJ,aAAc,cAEd,QAAS,OACT,MAAO,MAAA,EAET,MAAO,CACL,SAAU,QACV,WAAY,MACZ,MAAO,aACP,SAAU,8BACV,WAAY,+BAAA,EAEd,MAAO,CACL,SAAU,OAAA,EAEZ,YAAa,CACX,SAAU,cACV,MAAO,aACP,SAAU,8BACV,WAAY,+BAAA,EAEd,MAAO,CACL,SAAU,QACV,MAAO,cACP,SAAU,8BACV,WAAY,+BAAA,EAEd,QAAS,CACP,oBAAqB,mBACrB,iBAAkB,mBAClB,GAAI,YACJ,SAAU,KACV,aAAc,MACd,UAAW,IACX,OAAQ,WACR,YAAa,YACb,UAAW,QACX,SAAU,OACV,eAAgB,OAChB,eAAgB,6CAChB,UAAW,SAAA,CACb,EAGF,SAAU,CACR,KAAM,CACJ,GAAI,CACF,KAAM,CACJ,yBAA0B,gBAC1B,2BAA4B,iBAAA,CAC9B,EAEF,GAAI,CACF,KAAM,CACJ,yBAA0B,gBAC1B,2BAA4B,iBAAA,CAC9B,CACF,EAEF,UAAW,CACT,OAAQ,CACN,KAAM,CACJ,kBAAmBH,CAAA,EAErB,MAAO,CACL,GAAI,iBAAA,EAEN,YAAa,CACX,GAAI,iBAAA,EAEN,MAAO,CACL,GAAI,iBAAA,CACN,EAEF,IAAK,CACH,KAAM,CACJ,kBAAmBC,EACnB,oBAAqB,WACrB,cAAe,KAAA,EAEjB,YAAa,CACX,GAAI,iBAAA,EAEN,MAAO,CACL,GAAI,iBAAA,CACN,CACF,CACF,EAIF,gBAAiB,CACf,UAAW,SACX,KAAM,IAAA,CAEV,CAAC,EC9GK,CAAE,aAAAG,EAAc,YAAAC,CAAA,EAAgBC,0BAAwB,CAC5D,OAAQJ,CACV,CAAC,EASYK,EAAoBH,EAG/B,MAAO,MAAM,EAIFI,EAAqBH,EAGhC,MAAO,OAAO,EAIHI,EAAqBJ,EAGhC,MAAO,OAAO,EAIHK,EAA2BL,EAGtC,MAAO,aAAa,EAITM,EAAqBN,EAGhC,MAAO,OAAO,EAIHO,EAAuBP,EAGlC,MAAO,SAAS,EC1BLQ,EAAgBC,EAAAA,WAC3B,CACE,CAAE,UAAAC,EAAW,WAAAC,EAAY,WAAAC,EAAY,WAAAC,EAAY,SAAAC,EAAU,GAAGC,CAAA,EAC9DC,IACG,CACH,KAAM,CAACC,EAASC,CAAU,EAAIC,WAAsC,CAClE,MAAO,KACP,YAAa,KACb,MAAO,KACP,KAAM,KACN,MAAO,KACP,UAAAT,EACA,WAAAC,EACA,WAAAC,EACA,WAAAC,CAAA,CACD,EAEKO,EAA+C,CACnD,YAAaH,EAAQ,YACrB,aAAcA,EAAQ,KAAA,EAGpBA,EAAQ,MACVG,EAAa,MAAQH,EAAQ,OAK7BG,EAAa,YAAY,EAAI,cAC7BA,EAAa,iBAAiB,EAAI,eAGpC,KAAM,CAAE,WAAAC,EAAY,WAAAC,EAAY,iBAAAC,EAAkB,kBAAAC,CAAA,EAChDC,EAAAA,0CAASL,CAAY,EAEvBM,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,UAAAjB,EACA,WAAAC,EACA,WAAAC,EACA,WAAAC,CAAA,EACA,CACJ,EAAG,CAACH,EAAWC,EAAYC,EAAYC,CAAU,CAAC,EAElD,MAAMe,EAAa,CACjB,GAAGN,EACH,UAAAZ,EACA,WAAAC,EACA,WAAAC,EACA,WAAAC,CAAA,EAGF,OACEgB,EAAAA,IAACpC,EAAiB,SAAjB,CAA0B,MAAO,CAAE,QAAAwB,EAAS,WAAAC,CAAA,EAC3C,SAAAY,EAAAA,KAAC5B,EAAA,CAAkB,IAAAc,EAAW,GAAGD,EAC9B,SAAA,CAAAE,EAAQ,OACPa,OAAC3B,EAAA,CAAoB,GAAGc,EAAQ,eAC9B,SAAA,CAAAa,EAAAA,KAAC,QAAA,CAAO,GAAGT,EACR,SAAA,CAAAJ,EAAQ,MACRN,GAAckB,EAAAA,IAAC,MAAA,CAAI,cAAY,OAAO,SAAA,GAAA,CAAC,CAAA,EAC1C,EACCZ,EAAQ,MACPa,EAAAA,KAACC,EAAAA,0CAAA,CACC,SAAA,CAAAF,EAAAA,IAACG,EAAAA,IAAA,CACC,GAAG,OACH,QAAQ,eACR,SAAS,WACT,MAAM,MACN,OAAO,MACP,GAAG,MAEH,SAAAH,EAAAA,IAACG,EAAAA,IAAA,CACC,GAAG,OACH,QAAQ,cACR,SAAS,WACT,IAAI,MACJ,MAAM,MACN,UAAU,uBAEV,SAAAH,EAAAA,IAACI,EAAAA,WAAA,CACC,aAAW,cACX,KAAK,MACL,KAAK,OACL,QAAQ,OAER,eAACC,EAAAA,YAAA,CAAA,CAAY,CAAA,CAAA,CACf,CAAA,CACF,CAAA,QAEDC,EAAAA,0CAAA,CACC,SAAAN,MAACtB,EAAA,CAAqB,QAAO,GAC3B,SAAAsB,EAAAA,IAACO,EAAAA,0CAAA,CACC,SAAAP,MAACG,EAAAA,IAAA,CAAI,EAAE,MAAO,SAAAf,EAAQ,IAAA,CAAK,CAAA,CAC7B,EACF,CAAA,CACF,CAAA,CAAA,CACF,CAAA,EAEJ,EAEDA,EAAQ,OACPY,EAAAA,IAACzB,EAAA,CAAoB,GAAGa,EAAQ,eAC7B,SAAAoB,EAAAA,SAAS,IAAIpB,EAAQ,MAAQqB,GAExBC,EAAAA,eAAeD,CAAK,EACfE,EAAAA,aAAaF,EAAOV,CAAU,EAGhCU,CACR,CAAA,CACH,EAEDrB,EAAQ,aACPY,EAAAA,IAACxB,EAAA,CACE,GAAGkB,EACH,GAAGN,EAAQ,qBAEX,SAAAA,EAAQ,WAAA,CAAA,EAGZP,GAAaO,EAAQ,OACpBa,EAAAA,KAACxB,EAAA,CACE,GAAGkB,EACH,GAAGP,EAAQ,eAEZ,SAAA,CAAAY,EAAAA,IAACG,EAAAA,IAAA,CACC,GAAIS,EAAAA,aACJ,QAAQ,cACR,QAAQ,MACR,cAAc,cACd,GAAG,KAAA,CAAA,EAEJxB,EAAQ,KAAA,CAAA,CAAA,EAGZH,CAAA,CAAA,CACH,CAAA,CACF,CAEJ,CACF,EC1Ka4B,EAAiB,CAAC,CAC7B,SAAA5B,EACA,GAAG6B,CACL,IAA+B,CAC7B,KAAM,CAAE,WAAAzB,CAAA,EAAe0B,EAAAA,WAAWnD,CAAgB,EAElDiC,OAAAA,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,MAAOb,EACP,eAAA6B,CAAA,EACA,CACJ,EAAG,CAAC7B,EAAUI,CAAU,CAAC,EAElB,IACT,ECfa2B,EAAiB,CAAC,CAC7B,SAAA/B,EACA,GAAGgC,CACL,IAA+B,CAC7B,KAAM,CAAE,WAAA5B,CAAA,EAAe0B,EAAAA,WAAWnD,CAAgB,EAElDiC,OAAAA,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,MAAOb,EACP,eAAAgC,CAAA,EACA,CACJ,EAAG,CAAChC,EAAUI,CAAU,CAAC,EAElB,IACT,ECfa6B,EAAuB,CAAC,CACnC,SAAAjC,EACA,GAAGkC,CACL,IAAqC,CACnC,KAAM,CAAE,WAAA9B,CAAA,EAAe0B,EAAAA,WAAWnD,CAAgB,EAElDiC,OAAAA,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,YAAab,EACb,qBAAAkC,CAAA,EACA,CACJ,EAAG,CAAClC,EAAUI,CAAU,CAAC,EAElB,IACT,ECfa+B,EAAiB,CAAC,CAC7B,SAAAnC,EACA,GAAGoC,CACL,IAA+B,CAC7B,KAAM,CAAE,WAAAhC,CAAA,EAAe0B,EAAAA,WAAWnD,CAAgB,EAElDiC,OAAAA,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,MAAOb,EACP,eAAAoC,CAAA,EACA,CACJ,EAAG,CAACpC,EAAUI,CAAU,CAAC,EAElB,IACT,ECTaiC,EAAmB,CAAC,CAAE,SAAArC,KAAsC,CACvE,KAAM,CAAE,WAAAI,CAAA,EAAe0B,EAAAA,WAAWnD,CAAgB,EAElDiC,OAAAA,EAAAA,UAAU,IAAM,CACdR,EAAYS,IAAiB,CAC3B,GAAGA,EACH,KAAMb,CAAA,EACN,CACJ,EAAG,CAACA,EAAUI,CAAU,CAAC,EAElB,IACT,ECdakC,EAAY,CACvB,KAAM5C,EACN,MAAOkC,EACP,MAAOG,EACP,YAAaE,EACb,MAAOE,EACP,QAASE,CACX"}
+{"version":3,"file":"form-field-DiW_0hSy.cjs.js","sources":["../../src/components/form-field/components/form-field.context.tsx","../../src/components/form-field/form-field.recipe.tsx","../../src/components/form-field/form-field.slots.tsx","../../src/components/form-field/components/form-field.root.tsx","../../src/components/form-field/components/form-field.label.tsx","../../src/components/form-field/components/form-field.input.tsx","../../src/components/form-field/components/form-field.description.tsx","../../src/components/form-field/components/form-field.error.tsx","../../src/components/form-field/components/form-field.info-box.tsx","../../src/components/form-field/form-field.tsx"],"sourcesContent":["import { createContext, type ReactNode } from \"react\";\nimport type {\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldLabelSlotProps,\n} from \"../form-field.slots\";\n\nexport type FormFieldContextPayloadType = {\n  label: ReactNode;\n  labelSlotProps?: FormFieldLabelSlotProps;\n  input: ReactNode;\n  inputSlotProps?: FormFieldInputSlotProps;\n  description: ReactNode;\n  descriptionSlotProps?: FormFieldDescriptionSlotProps;\n  error: ReactNode;\n  errorSlotProps?: FormFieldErrorSlotProps;\n  info: ReactNode;\n  isInvalid?: boolean;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n};\n\nexport type FormFieldContextType = {\n  context: FormFieldContextPayloadType;\n  setContext: React.Dispatch<React.SetStateAction<FormFieldContextPayloadType>>;\n};\n\nexport const FormFieldContext = createContext<FormFieldContextType>({\n  context: {\n    label: null,\n    description: null,\n    error: null,\n    info: null,\n    input: null,\n  },\n  setContext: () => {},\n});\n","import { defineSlotRecipe } from \"@chakra-ui/react/styled-system\";\n\nconst columnLayout = `\n\"label\"\n\"input\"\n\"description\"\n\"error\"\n`;\nconst rowLayout = `\n\"label input\"\n\"label description\"\n\"label error\"\n`;\n\n/**\n * Recipe configuration for the FormField component.\n * Defines the styling variants and base styles using Chakra UI's recipe system.\n */\nexport const formFieldRecipe = defineSlotRecipe({\n  slots: [\"root\", \"label\", \"input\", \"description\", \"error\", \"popover\"],\n  // Unique class name prefix for the component\n  className: \"nimbus-ui-form-field\",\n\n  base: {\n    root: {\n      \"--grid-gap\": \"spacing.100\",\n\n      display: \"grid\",\n      width: \"auto\",\n    },\n    label: {\n      gridArea: \"label\",\n      fontWeight: \"500\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    input: {\n      gridArea: \"input\",\n    },\n    description: {\n      gridArea: \"description\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    error: {\n      gridArea: \"error\",\n      color: \"critical.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    popover: {\n      \"--scrollbar-color\": \"colors.neutral.8\",\n      \"--scrollbar-bg\": \"colors.neutral.3\",\n      bg: \"neutral.1\",\n      maxWidth: \"xl\",\n      borderRadius: \"200\",\n      boxShadow: \"6\",\n      border: \"solid-25\",\n      borderColor: \"neutral.8\",\n      maxHeight: \"40svh\",\n      overflow: \"auto\",\n      scrollbarWidth: \"thin\",\n      scrollbarColor: \"var(--scrollbar-color) var(--scrollbar-bg)\",\n      focusRing: \"outside\",\n    },\n  },\n\n  variants: {\n    size: {\n      md: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.350\",\n          \"--form-field-line-height\": \"lineHeights.500\",\n        },\n      },\n      sm: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.300\",\n          \"--form-field-line-height\": \"lineHeights.450\",\n        },\n      },\n    },\n    direction: {\n      column: {\n        root: {\n          gridTemplateAreas: columnLayout,\n        },\n        input: {\n          mt: \"var(--grid-gap)\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n      row: {\n        root: {\n          gridTemplateAreas: rowLayout,\n          gridTemplateColumns: \"auto 1fr\",\n          gridColumnGap: \"200\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n    },\n  },\n\n  // Default variant values when not explicitly specified\n  defaultVariants: {\n    direction: \"column\",\n    size: \"md\",\n  },\n});\n","/* eslint-disable @typescript-eslint/no-empty-object-type */\nimport {\n  type HTMLChakraProps,\n  type RecipeVariantProps,\n  type UnstyledProp,\n  createSlotRecipeContext,\n} from \"@chakra-ui/react/styled-system\";\n\nimport { formFieldRecipe } from \"./form-field.recipe\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  recipe: formFieldRecipe,\n});\n\n// Root slot\nexport interface FormFieldRootSlotProps\n  extends HTMLChakraProps<\n    \"div\",\n    RecipeVariantProps<typeof formFieldRecipe> & UnstyledProp\n  > {}\n\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport interface FormFieldLabelSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport interface FormFieldInputSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport interface FormFieldDescriptionSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport interface FormFieldErrorSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport interface FormFieldPopoverSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useState,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField } from \"react-aria\";\nimport {\n  FormFieldContext,\n  type FormFieldContextPayloadType,\n} from \"./form-field.context\";\nimport {\n  FormFieldDescriptionSlot,\n  FormFieldErrorSlot,\n  FormFieldInputSlot,\n  FormFieldLabelSlot,\n  FormFieldPopoverSlot,\n  FormFieldRootSlot,\n} from \"../form-field.slots\";\nimport { Dialog, DialogTrigger, Popover } from \"react-aria-components\";\nimport { Box, IconButton } from \"@/components\";\nimport { ErrorOutline, HelpOutline } from \"@commercetools/nimbus-icons\";\n\n/**\n * # FormField\n *\n * displays miscellaneous inputs in a FormField context\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/formfield}\n */\nexport const FormFieldRoot = forwardRef<HTMLDivElement, FormFieldProps>(\n  (\n    { isInvalid, isRequired, isDisabled, isReadOnly, children, ...props },\n    ref\n  ) => {\n    const [context, setContext] = useState<FormFieldContextPayloadType>({\n      label: null,\n      description: null,\n      error: null,\n      info: null,\n      input: null,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    });\n\n    const useFieldArgs: Parameters<typeof useField>[0] = {\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      useFieldArgs.label = context.label;\n    } else {\n      // Context will always start out null, so we need to stub out some aria attributes\n      // FIXME: This is a hack to get the form field to work, but it's not the best solution\n      // FIXME: We should find a better way to handle this by redesigning the FormField component's structure\n      useFieldArgs[\"aria-label\"] = \"empty-label\";\n      useFieldArgs[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n      useField(useFieldArgs);\n\n    useEffect(() => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        isInvalid,\n        isRequired,\n        isDisabled,\n        isReadOnly,\n      }));\n    }, [isInvalid, isRequired, isDisabled, isReadOnly]);\n\n    const inputProps = {\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    };\n\n    return (\n      <FormFieldContext.Provider value={{ context, setContext }}>\n        <FormFieldRootSlot ref={ref} {...props}>\n          {context.label && (\n            <FormFieldLabelSlot {...context.labelSlotProps}>\n              <label {...labelProps}>\n                {context.label}\n                {isRequired && <sup aria-hidden=\"true\">*</sup>}\n              </label>\n              {context.info && (\n                <DialogTrigger>\n                  <Box\n                    as=\"span\"\n                    display=\"inline-block\"\n                    position=\"relative\"\n                    width=\"1ch\"\n                    height=\"1ch\"\n                    ml=\"200\"\n                  >\n                    <Box\n                      as=\"span\"\n                      display=\"inline-flex\"\n                      position=\"absolute\"\n                      top=\"50%\"\n                      right=\"50%\"\n                      transform=\"translate(50%, -50%)\"\n                    >\n                      <IconButton\n                        aria-label=\"__MORE INFO\"\n                        size=\"2xs\"\n                        tone=\"info\"\n                        variant=\"link\"\n                      >\n                        <HelpOutline />\n                      </IconButton>\n                    </Box>\n                  </Box>\n                  <Popover>\n                    <FormFieldPopoverSlot asChild>\n                      <Dialog>\n                        <Box p=\"300\">{context.info}</Box>\n                      </Dialog>\n                    </FormFieldPopoverSlot>\n                  </Popover>\n                </DialogTrigger>\n              )}\n            </FormFieldLabelSlot>\n          )}\n          {context.input && (\n            <FormFieldInputSlot {...context.inputSlotProps}>\n              {Children.map(context.input, (child) => {\n                // Important: Check if the child is a valid React element before cloning.\n                if (isValidElement(child)) {\n                  return cloneElement(child, inputProps);\n                }\n                // If it's not a valid element (e.g., text node, null, undefined), return it as is.\n                return child;\n              })}\n            </FormFieldInputSlot>\n          )}\n          {context.description && (\n            <FormFieldDescriptionSlot\n              {...descriptionProps}\n              {...context.descriptionSlotProps}\n            >\n              {context.description}\n            </FormFieldDescriptionSlot>\n          )}\n          {isInvalid && context.error && (\n            <FormFieldErrorSlot\n              {...errorMessageProps}\n              {...context.errorSlotProps}\n            >\n              <Box\n                as={ErrorOutline}\n                display=\"inline-flex\"\n                boxSize=\"400\"\n                verticalAlign=\"text-bottom\"\n                mr=\"100\"\n              />\n              {context.error}\n            </FormFieldErrorSlot>\n          )}\n          {children}\n        </FormFieldRootSlot>\n      </FormFieldContext.Provider>\n    );\n  }\n);\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldLabel = ({\n  children,\n  ...labelSlotProps\n}: FormFieldLabelSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      label: children,\n      labelSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldInputSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldInput = ({\n  children,\n  ...inputSlotProps\n}: FormFieldInputSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      input: children,\n      inputSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldDescriptionSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldDescription = ({\n  children,\n  ...descriptionSlotProps\n}: FormFieldDescriptionSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      description: children,\n      descriptionSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldErrorSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldError = ({\n  children,\n  ...errorSlotProps\n}: FormFieldErrorSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      error: children,\n      errorSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect, type ReactNode } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\n\ntype FormFieldInfoBoxProps = {\n  /**\n   * The content to display in the InfoBox\n   */\n  children: ReactNode;\n};\n\nexport const FormFieldInfoBox = ({ children }: FormFieldInfoBoxProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      info: children,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { FormFieldRoot } from \"./components/form-field.root\";\nimport { FormFieldLabel } from \"./components/form-field.label\";\nimport { FormFieldInput } from \"./components/form-field.input\";\nimport { FormFieldDescription } from \"./components/form-field.description\";\nimport { FormFieldError } from \"./components/form-field.error\";\nimport { FormFieldInfoBox } from \"./components/form-field.info-box\";\n\nexport const FormField = {\n  Root: FormFieldRoot,\n  Label: FormFieldLabel,\n  Input: FormFieldInput,\n  Description: FormFieldDescription,\n  Error: FormFieldError,\n  InfoBox: FormFieldInfoBox,\n};\n\nexport {\n  FormFieldRoot as _FormFieldRoot,\n  FormFieldLabel as _FormFieldLabel,\n  FormFieldInput as _FormFieldInput,\n  FormFieldDescription as _FormFieldDescription,\n  FormFieldError as _FormFieldError,\n  FormFieldInfoBox as _FormFieldInfoBox,\n};\n"],"names":["FormFieldContext","createContext","columnLayout","rowLayout","formFieldRecipe","defineSlotRecipe","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardRef","isInvalid","isRequired","isDisabled","isReadOnly","children","props","ref","context","setContext","useState","useFieldArgs","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","jsx","jsxs","DialogTrigger","Box","IconButton","HelpOutline","Popover","Dialog","Children","child","isValidElement","cloneElement","ErrorOutline","FormFieldLabel","labelSlotProps","useContext","FormFieldInput","inputSlotProps","FormFieldDescription","descriptionSlotProps","FormFieldError","errorSlotProps","FormFieldInfoBox","FormField"],"mappings":"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"}

package/dist/chunks/{form-field-BgKHtyTH.es.js → form-field-Do0NhI0D.es.js}

@@ -2,7 +2,7 @@ import { jsx as i, jsxs as c } from "react/jsx-runtime";
 import { createContext as z, forwardRef as $, useState as P, useEffect as n, Children as w, isValidElement as A, cloneElement as E, useContext as d } from "react";
 import { a as H } from "./config-ufbQ08Vi.es.js";
 import { c as y } from "./create-slot-recipe-context-DBNItnlK.es.js";
-import { e as B, $ as L, a as I } from "./Dialog-DNPIKkGE.es.js";
+import { e as B, $ as L, a as I } from "./Dialog-C7IjW1jR.es.js";
 import { B as m } from "./box-C8731OYq.es.js";
 import { I as M } from "./icon-button-D2qU4Eun.es.js";
 import { HelpOutline as R, ErrorOutline as T } from "@commercetools/nimbus-icons";
@@ -307,4 +307,4 @@ export {
   Z as e,
   q as f
 };
-//# sourceMappingURL=form-field-BgKHtyTH.es.js.map
+//# sourceMappingURL=form-field-Do0NhI0D.es.js.map

package/dist/chunks/{form-field-BgKHtyTH.es.js.map → form-field-Do0NhI0D.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"form-field-BgKHtyTH.es.js","sources":["../../src/components/form-field/components/form-field.context.tsx","../../src/components/form-field/form-field.recipe.tsx","../../src/components/form-field/form-field.slots.tsx","../../src/components/form-field/components/form-field.root.tsx","../../src/components/form-field/components/form-field.label.tsx","../../src/components/form-field/components/form-field.input.tsx","../../src/components/form-field/components/form-field.description.tsx","../../src/components/form-field/components/form-field.error.tsx","../../src/components/form-field/components/form-field.info-box.tsx","../../src/components/form-field/form-field.tsx"],"sourcesContent":["import { createContext, type ReactNode } from \"react\";\nimport type {\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldLabelSlotProps,\n} from \"../form-field.slots\";\n\nexport type FormFieldContextPayloadType = {\n  label: ReactNode;\n  labelSlotProps?: FormFieldLabelSlotProps;\n  input: ReactNode;\n  inputSlotProps?: FormFieldInputSlotProps;\n  description: ReactNode;\n  descriptionSlotProps?: FormFieldDescriptionSlotProps;\n  error: ReactNode;\n  errorSlotProps?: FormFieldErrorSlotProps;\n  info: ReactNode;\n  isInvalid?: boolean;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n};\n\nexport type FormFieldContextType = {\n  context: FormFieldContextPayloadType;\n  setContext: React.Dispatch<React.SetStateAction<FormFieldContextPayloadType>>;\n};\n\nexport const FormFieldContext = createContext<FormFieldContextType>({\n  context: {\n    label: null,\n    description: null,\n    error: null,\n    info: null,\n    input: null,\n  },\n  setContext: () => {},\n});\n","import { defineSlotRecipe } from \"@chakra-ui/react/styled-system\";\n\nconst columnLayout = `\n\"label\"\n\"input\"\n\"description\"\n\"error\"\n`;\nconst rowLayout = `\n\"label input\"\n\"label description\"\n\"label error\"\n`;\n\n/**\n * Recipe configuration for the FormField component.\n * Defines the styling variants and base styles using Chakra UI's recipe system.\n */\nexport const formFieldRecipe = defineSlotRecipe({\n  slots: [\"root\", \"label\", \"input\", \"description\", \"error\", \"popover\"],\n  // Unique class name prefix for the component\n  className: \"nimbus-ui-form-field\",\n\n  base: {\n    root: {\n      \"--grid-gap\": \"spacing.100\",\n\n      display: \"grid\",\n      width: \"auto\",\n    },\n    label: {\n      gridArea: \"label\",\n      fontWeight: \"500\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    input: {\n      gridArea: \"input\",\n    },\n    description: {\n      gridArea: \"description\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    error: {\n      gridArea: \"error\",\n      color: \"critical.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    popover: {\n      \"--scrollbar-color\": \"colors.neutral.8\",\n      \"--scrollbar-bg\": \"colors.neutral.3\",\n      bg: \"neutral.1\",\n      maxWidth: \"xl\",\n      borderRadius: \"200\",\n      boxShadow: \"6\",\n      border: \"solid-25\",\n      borderColor: \"neutral.8\",\n      maxHeight: \"40svh\",\n      overflow: \"auto\",\n      scrollbarWidth: \"thin\",\n      scrollbarColor: \"var(--scrollbar-color) var(--scrollbar-bg)\",\n      focusRing: \"outside\",\n    },\n  },\n\n  variants: {\n    size: {\n      md: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.350\",\n          \"--form-field-line-height\": \"lineHeights.500\",\n        },\n      },\n      sm: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.300\",\n          \"--form-field-line-height\": \"lineHeights.450\",\n        },\n      },\n    },\n    direction: {\n      column: {\n        root: {\n          gridTemplateAreas: columnLayout,\n        },\n        input: {\n          mt: \"var(--grid-gap)\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n      row: {\n        root: {\n          gridTemplateAreas: rowLayout,\n          gridTemplateColumns: \"auto 1fr\",\n          gridColumnGap: \"200\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n    },\n  },\n\n  // Default variant values when not explicitly specified\n  defaultVariants: {\n    direction: \"column\",\n    size: \"md\",\n  },\n});\n","/* eslint-disable @typescript-eslint/no-empty-object-type */\nimport {\n  type HTMLChakraProps,\n  type RecipeVariantProps,\n  type UnstyledProp,\n  createSlotRecipeContext,\n} from \"@chakra-ui/react/styled-system\";\n\nimport { formFieldRecipe } from \"./form-field.recipe\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  recipe: formFieldRecipe,\n});\n\n// Root slot\nexport interface FormFieldRootSlotProps\n  extends HTMLChakraProps<\n    \"div\",\n    RecipeVariantProps<typeof formFieldRecipe> & UnstyledProp\n  > {}\n\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport interface FormFieldLabelSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport interface FormFieldInputSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport interface FormFieldDescriptionSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport interface FormFieldErrorSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport interface FormFieldPopoverSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useState,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField } from \"react-aria\";\nimport {\n  FormFieldContext,\n  type FormFieldContextPayloadType,\n} from \"./form-field.context\";\nimport {\n  FormFieldDescriptionSlot,\n  FormFieldErrorSlot,\n  FormFieldInputSlot,\n  FormFieldLabelSlot,\n  FormFieldPopoverSlot,\n  FormFieldRootSlot,\n} from \"../form-field.slots\";\nimport { Dialog, DialogTrigger, Popover } from \"react-aria-components\";\nimport { Box, IconButton } from \"@/components\";\nimport { ErrorOutline, HelpOutline } from \"@commercetools/nimbus-icons\";\n\n/**\n * # FormField\n *\n * displays miscellaneous inputs in a FormField context\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/formfield}\n */\nexport const FormFieldRoot = forwardRef<HTMLDivElement, FormFieldProps>(\n  (\n    { isInvalid, isRequired, isDisabled, isReadOnly, children, ...props },\n    ref\n  ) => {\n    const [context, setContext] = useState<FormFieldContextPayloadType>({\n      label: null,\n      description: null,\n      error: null,\n      info: null,\n      input: null,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    });\n\n    const useFieldArgs: Parameters<typeof useField>[0] = {\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      useFieldArgs.label = context.label;\n    } else {\n      // Context will always start out null, so we need to stub out some aria attributes\n      // FIXME: This is a hack to get the form field to work, but it's not the best solution\n      // FIXME: We should find a better way to handle this by redesigning the FormField component's structure\n      useFieldArgs[\"aria-label\"] = \"empty-label\";\n      useFieldArgs[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n      useField(useFieldArgs);\n\n    useEffect(() => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        isInvalid,\n        isRequired,\n        isDisabled,\n        isReadOnly,\n      }));\n    }, [isInvalid, isRequired, isDisabled, isReadOnly]);\n\n    const inputProps = {\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    };\n\n    return (\n      <FormFieldContext.Provider value={{ context, setContext }}>\n        <FormFieldRootSlot ref={ref} {...props}>\n          {context.label && (\n            <FormFieldLabelSlot {...context.labelSlotProps}>\n              <label {...labelProps}>\n                {context.label}\n                {isRequired && <sup aria-hidden=\"true\">*</sup>}\n              </label>\n              {context.info && (\n                <DialogTrigger>\n                  <Box\n                    as=\"span\"\n                    display=\"inline-block\"\n                    position=\"relative\"\n                    width=\"1ch\"\n                    height=\"1ch\"\n                    ml=\"200\"\n                  >\n                    <Box\n                      as=\"span\"\n                      display=\"inline-flex\"\n                      position=\"absolute\"\n                      top=\"50%\"\n                      right=\"50%\"\n                      transform=\"translate(50%, -50%)\"\n                    >\n                      <IconButton\n                        aria-label=\"__MORE INFO\"\n                        size=\"2xs\"\n                        tone=\"info\"\n                        variant=\"link\"\n                      >\n                        <HelpOutline />\n                      </IconButton>\n                    </Box>\n                  </Box>\n                  <Popover>\n                    <FormFieldPopoverSlot asChild>\n                      <Dialog>\n                        <Box p=\"300\">{context.info}</Box>\n                      </Dialog>\n                    </FormFieldPopoverSlot>\n                  </Popover>\n                </DialogTrigger>\n              )}\n            </FormFieldLabelSlot>\n          )}\n          {context.input && (\n            <FormFieldInputSlot {...context.inputSlotProps}>\n              {Children.map(context.input, (child) => {\n                // Important: Check if the child is a valid React element before cloning.\n                if (isValidElement(child)) {\n                  return cloneElement(child, inputProps);\n                }\n                // If it's not a valid element (e.g., text node, null, undefined), return it as is.\n                return child;\n              })}\n            </FormFieldInputSlot>\n          )}\n          {context.description && (\n            <FormFieldDescriptionSlot\n              {...descriptionProps}\n              {...context.descriptionSlotProps}\n            >\n              {context.description}\n            </FormFieldDescriptionSlot>\n          )}\n          {isInvalid && context.error && (\n            <FormFieldErrorSlot\n              {...errorMessageProps}\n              {...context.errorSlotProps}\n            >\n              <Box\n                as={ErrorOutline}\n                display=\"inline-flex\"\n                boxSize=\"400\"\n                verticalAlign=\"text-bottom\"\n                mr=\"100\"\n              />\n              {context.error}\n            </FormFieldErrorSlot>\n          )}\n          {children}\n        </FormFieldRootSlot>\n      </FormFieldContext.Provider>\n    );\n  }\n);\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldLabel = ({\n  children,\n  ...labelSlotProps\n}: FormFieldLabelSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      label: children,\n      labelSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldInputSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldInput = ({\n  children,\n  ...inputSlotProps\n}: FormFieldInputSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      input: children,\n      inputSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldDescriptionSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldDescription = ({\n  children,\n  ...descriptionSlotProps\n}: FormFieldDescriptionSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      description: children,\n      descriptionSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldErrorSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldError = ({\n  children,\n  ...errorSlotProps\n}: FormFieldErrorSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      error: children,\n      errorSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect, type ReactNode } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\n\ntype FormFieldInfoBoxProps = {\n  /**\n   * The content to display in the InfoBox\n   */\n  children: ReactNode;\n};\n\nexport const FormFieldInfoBox = ({ children }: FormFieldInfoBoxProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      info: children,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { FormFieldRoot } from \"./components/form-field.root\";\nimport { FormFieldLabel } from \"./components/form-field.label\";\nimport { FormFieldInput } from \"./components/form-field.input\";\nimport { FormFieldDescription } from \"./components/form-field.description\";\nimport { FormFieldError } from \"./components/form-field.error\";\nimport { FormFieldInfoBox } from \"./components/form-field.info-box\";\n\nexport const FormField = {\n  Root: FormFieldRoot,\n  Label: FormFieldLabel,\n  Input: FormFieldInput,\n  Description: FormFieldDescription,\n  Error: FormFieldError,\n  InfoBox: FormFieldInfoBox,\n};\n\nexport {\n  FormFieldRoot as _FormFieldRoot,\n  FormFieldLabel as _FormFieldLabel,\n  FormFieldInput as _FormFieldInput,\n  FormFieldDescription as _FormFieldDescription,\n  FormFieldError as _FormFieldError,\n  FormFieldInfoBox as _FormFieldInfoBox,\n};\n"],"names":["FormFieldContext","createContext","columnLayout","rowLayout","formFieldRecipe","defineSlotRecipe","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardRef","isInvalid","isRequired","isDisabled","isReadOnly","children","props","ref","context","setContext","useState","useFieldArgs","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","jsx","jsxs","DialogTrigger","Box","IconButton","HelpOutline","Popover","Dialog","Children","child","isValidElement","cloneElement","ErrorOutline","FormFieldLabel","labelSlotProps","useContext","FormFieldInput","inputSlotProps","FormFieldDescription","descriptionSlotProps","FormFieldError","errorSlotProps","FormFieldInfoBox","FormField"],"mappings":"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"}
+{"version":3,"file":"form-field-Do0NhI0D.es.js","sources":["../../src/components/form-field/components/form-field.context.tsx","../../src/components/form-field/form-field.recipe.tsx","../../src/components/form-field/form-field.slots.tsx","../../src/components/form-field/components/form-field.root.tsx","../../src/components/form-field/components/form-field.label.tsx","../../src/components/form-field/components/form-field.input.tsx","../../src/components/form-field/components/form-field.description.tsx","../../src/components/form-field/components/form-field.error.tsx","../../src/components/form-field/components/form-field.info-box.tsx","../../src/components/form-field/form-field.tsx"],"sourcesContent":["import { createContext, type ReactNode } from \"react\";\nimport type {\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldLabelSlotProps,\n} from \"../form-field.slots\";\n\nexport type FormFieldContextPayloadType = {\n  label: ReactNode;\n  labelSlotProps?: FormFieldLabelSlotProps;\n  input: ReactNode;\n  inputSlotProps?: FormFieldInputSlotProps;\n  description: ReactNode;\n  descriptionSlotProps?: FormFieldDescriptionSlotProps;\n  error: ReactNode;\n  errorSlotProps?: FormFieldErrorSlotProps;\n  info: ReactNode;\n  isInvalid?: boolean;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n  isReadOnly?: boolean;\n};\n\nexport type FormFieldContextType = {\n  context: FormFieldContextPayloadType;\n  setContext: React.Dispatch<React.SetStateAction<FormFieldContextPayloadType>>;\n};\n\nexport const FormFieldContext = createContext<FormFieldContextType>({\n  context: {\n    label: null,\n    description: null,\n    error: null,\n    info: null,\n    input: null,\n  },\n  setContext: () => {},\n});\n","import { defineSlotRecipe } from \"@chakra-ui/react/styled-system\";\n\nconst columnLayout = `\n\"label\"\n\"input\"\n\"description\"\n\"error\"\n`;\nconst rowLayout = `\n\"label input\"\n\"label description\"\n\"label error\"\n`;\n\n/**\n * Recipe configuration for the FormField component.\n * Defines the styling variants and base styles using Chakra UI's recipe system.\n */\nexport const formFieldRecipe = defineSlotRecipe({\n  slots: [\"root\", \"label\", \"input\", \"description\", \"error\", \"popover\"],\n  // Unique class name prefix for the component\n  className: \"nimbus-ui-form-field\",\n\n  base: {\n    root: {\n      \"--grid-gap\": \"spacing.100\",\n\n      display: \"grid\",\n      width: \"auto\",\n    },\n    label: {\n      gridArea: \"label\",\n      fontWeight: \"500\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    input: {\n      gridArea: \"input\",\n    },\n    description: {\n      gridArea: \"description\",\n      color: \"neutral.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    error: {\n      gridArea: \"error\",\n      color: \"critical.11\",\n      fontSize: \"var(--form-field-font-size)\",\n      lineHeight: \"var(--form-field-line-height)\",\n    },\n    popover: {\n      \"--scrollbar-color\": \"colors.neutral.8\",\n      \"--scrollbar-bg\": \"colors.neutral.3\",\n      bg: \"neutral.1\",\n      maxWidth: \"xl\",\n      borderRadius: \"200\",\n      boxShadow: \"6\",\n      border: \"solid-25\",\n      borderColor: \"neutral.8\",\n      maxHeight: \"40svh\",\n      overflow: \"auto\",\n      scrollbarWidth: \"thin\",\n      scrollbarColor: \"var(--scrollbar-color) var(--scrollbar-bg)\",\n      focusRing: \"outside\",\n    },\n  },\n\n  variants: {\n    size: {\n      md: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.350\",\n          \"--form-field-line-height\": \"lineHeights.500\",\n        },\n      },\n      sm: {\n        root: {\n          \"--form-field-font-size\": \"fontSizes.300\",\n          \"--form-field-line-height\": \"lineHeights.450\",\n        },\n      },\n    },\n    direction: {\n      column: {\n        root: {\n          gridTemplateAreas: columnLayout,\n        },\n        input: {\n          mt: \"var(--grid-gap)\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n      row: {\n        root: {\n          gridTemplateAreas: rowLayout,\n          gridTemplateColumns: \"auto 1fr\",\n          gridColumnGap: \"200\",\n        },\n        description: {\n          mt: \"var(--grid-gap)\",\n        },\n        error: {\n          mt: \"var(--grid-gap)\",\n        },\n      },\n    },\n  },\n\n  // Default variant values when not explicitly specified\n  defaultVariants: {\n    direction: \"column\",\n    size: \"md\",\n  },\n});\n","/* eslint-disable @typescript-eslint/no-empty-object-type */\nimport {\n  type HTMLChakraProps,\n  type RecipeVariantProps,\n  type UnstyledProp,\n  createSlotRecipeContext,\n} from \"@chakra-ui/react/styled-system\";\n\nimport { formFieldRecipe } from \"./form-field.recipe\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  recipe: formFieldRecipe,\n});\n\n// Root slot\nexport interface FormFieldRootSlotProps\n  extends HTMLChakraProps<\n    \"div\",\n    RecipeVariantProps<typeof formFieldRecipe> & UnstyledProp\n  > {}\n\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport interface FormFieldLabelSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport interface FormFieldInputSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport interface FormFieldDescriptionSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport interface FormFieldErrorSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport interface FormFieldPopoverSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useEffect,\n  useState,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField } from \"react-aria\";\nimport {\n  FormFieldContext,\n  type FormFieldContextPayloadType,\n} from \"./form-field.context\";\nimport {\n  FormFieldDescriptionSlot,\n  FormFieldErrorSlot,\n  FormFieldInputSlot,\n  FormFieldLabelSlot,\n  FormFieldPopoverSlot,\n  FormFieldRootSlot,\n} from \"../form-field.slots\";\nimport { Dialog, DialogTrigger, Popover } from \"react-aria-components\";\nimport { Box, IconButton } from \"@/components\";\nimport { ErrorOutline, HelpOutline } from \"@commercetools/nimbus-icons\";\n\n/**\n * # FormField\n *\n * displays miscellaneous inputs in a FormField context\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/formfield}\n */\nexport const FormFieldRoot = forwardRef<HTMLDivElement, FormFieldProps>(\n  (\n    { isInvalid, isRequired, isDisabled, isReadOnly, children, ...props },\n    ref\n  ) => {\n    const [context, setContext] = useState<FormFieldContextPayloadType>({\n      label: null,\n      description: null,\n      error: null,\n      info: null,\n      input: null,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    });\n\n    const useFieldArgs: Parameters<typeof useField>[0] = {\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      useFieldArgs.label = context.label;\n    } else {\n      // Context will always start out null, so we need to stub out some aria attributes\n      // FIXME: This is a hack to get the form field to work, but it's not the best solution\n      // FIXME: We should find a better way to handle this by redesigning the FormField component's structure\n      useFieldArgs[\"aria-label\"] = \"empty-label\";\n      useFieldArgs[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    const { labelProps, fieldProps, descriptionProps, errorMessageProps } =\n      useField(useFieldArgs);\n\n    useEffect(() => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        isInvalid,\n        isRequired,\n        isDisabled,\n        isReadOnly,\n      }));\n    }, [isInvalid, isRequired, isDisabled, isReadOnly]);\n\n    const inputProps = {\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    };\n\n    return (\n      <FormFieldContext.Provider value={{ context, setContext }}>\n        <FormFieldRootSlot ref={ref} {...props}>\n          {context.label && (\n            <FormFieldLabelSlot {...context.labelSlotProps}>\n              <label {...labelProps}>\n                {context.label}\n                {isRequired && <sup aria-hidden=\"true\">*</sup>}\n              </label>\n              {context.info && (\n                <DialogTrigger>\n                  <Box\n                    as=\"span\"\n                    display=\"inline-block\"\n                    position=\"relative\"\n                    width=\"1ch\"\n                    height=\"1ch\"\n                    ml=\"200\"\n                  >\n                    <Box\n                      as=\"span\"\n                      display=\"inline-flex\"\n                      position=\"absolute\"\n                      top=\"50%\"\n                      right=\"50%\"\n                      transform=\"translate(50%, -50%)\"\n                    >\n                      <IconButton\n                        aria-label=\"__MORE INFO\"\n                        size=\"2xs\"\n                        tone=\"info\"\n                        variant=\"link\"\n                      >\n                        <HelpOutline />\n                      </IconButton>\n                    </Box>\n                  </Box>\n                  <Popover>\n                    <FormFieldPopoverSlot asChild>\n                      <Dialog>\n                        <Box p=\"300\">{context.info}</Box>\n                      </Dialog>\n                    </FormFieldPopoverSlot>\n                  </Popover>\n                </DialogTrigger>\n              )}\n            </FormFieldLabelSlot>\n          )}\n          {context.input && (\n            <FormFieldInputSlot {...context.inputSlotProps}>\n              {Children.map(context.input, (child) => {\n                // Important: Check if the child is a valid React element before cloning.\n                if (isValidElement(child)) {\n                  return cloneElement(child, inputProps);\n                }\n                // If it's not a valid element (e.g., text node, null, undefined), return it as is.\n                return child;\n              })}\n            </FormFieldInputSlot>\n          )}\n          {context.description && (\n            <FormFieldDescriptionSlot\n              {...descriptionProps}\n              {...context.descriptionSlotProps}\n            >\n              {context.description}\n            </FormFieldDescriptionSlot>\n          )}\n          {isInvalid && context.error && (\n            <FormFieldErrorSlot\n              {...errorMessageProps}\n              {...context.errorSlotProps}\n            >\n              <Box\n                as={ErrorOutline}\n                display=\"inline-flex\"\n                boxSize=\"400\"\n                verticalAlign=\"text-bottom\"\n                mr=\"100\"\n              />\n              {context.error}\n            </FormFieldErrorSlot>\n          )}\n          {children}\n        </FormFieldRootSlot>\n      </FormFieldContext.Provider>\n    );\n  }\n);\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldLabel = ({\n  children,\n  ...labelSlotProps\n}: FormFieldLabelSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      label: children,\n      labelSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldInputSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldInput = ({\n  children,\n  ...inputSlotProps\n}: FormFieldInputSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      input: children,\n      inputSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldDescriptionSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldDescription = ({\n  children,\n  ...descriptionSlotProps\n}: FormFieldDescriptionSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      description: children,\n      descriptionSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldErrorSlotProps } from \"../form-field.slots\";\n\nexport const FormFieldError = ({\n  children,\n  ...errorSlotProps\n}: FormFieldErrorSlotProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      error: children,\n      errorSlotProps,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { useContext, useEffect, type ReactNode } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\n\ntype FormFieldInfoBoxProps = {\n  /**\n   * The content to display in the InfoBox\n   */\n  children: ReactNode;\n};\n\nexport const FormFieldInfoBox = ({ children }: FormFieldInfoBoxProps) => {\n  const { setContext } = useContext(FormFieldContext);\n\n  useEffect(() => {\n    setContext((prevContext) => ({\n      ...prevContext,\n      info: children,\n    }));\n  }, [children, setContext]);\n\n  return null;\n};\n","import { FormFieldRoot } from \"./components/form-field.root\";\nimport { FormFieldLabel } from \"./components/form-field.label\";\nimport { FormFieldInput } from \"./components/form-field.input\";\nimport { FormFieldDescription } from \"./components/form-field.description\";\nimport { FormFieldError } from \"./components/form-field.error\";\nimport { FormFieldInfoBox } from \"./components/form-field.info-box\";\n\nexport const FormField = {\n  Root: FormFieldRoot,\n  Label: FormFieldLabel,\n  Input: FormFieldInput,\n  Description: FormFieldDescription,\n  Error: FormFieldError,\n  InfoBox: FormFieldInfoBox,\n};\n\nexport {\n  FormFieldRoot as _FormFieldRoot,\n  FormFieldLabel as _FormFieldLabel,\n  FormFieldInput as _FormFieldInput,\n  FormFieldDescription as _FormFieldDescription,\n  FormFieldError as _FormFieldError,\n  FormFieldInfoBox as _FormFieldInfoBox,\n};\n"],"names":["FormFieldContext","createContext","columnLayout","rowLayout","formFieldRecipe","defineSlotRecipe","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardRef","isInvalid","isRequired","isDisabled","isReadOnly","children","props","ref","context","setContext","useState","useFieldArgs","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","jsx","jsxs","DialogTrigger","Box","IconButton","HelpOutline","Popover","Dialog","Children","child","isValidElement","cloneElement","ErrorOutline","FormFieldLabel","labelSlotProps","useContext","FormFieldInput","inputSlotProps","FormFieldDescription","descriptionSlotProps","FormFieldError","errorSlotProps","FormFieldInfoBox","FormField"],"mappings":";;;;;;;;;AA6BO,MAAMA,IAAmB,gBAAAC,EAAoC;AAAA,EAClE,SAAS;AAAA,IACP,OAAO;AAAA,IACP,aAAa;AAAA,IACb,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAET,YAAY,MAAM;AAAA,EAAC;AACrB,CAAC,GCpCKC,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA,GAMfC,IAAY;AAAA;AAAA;AAAA;AAAA,GAULC,IAAkB,gBAAAC,EAAiB;AAAA,EAC9C,OAAO,CAAC,QAAQ,SAAS,SAAS,eAAe,SAAS,SAAS;AAAA;AAAA,EAEnE,WAAW;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,cAAc;AAAA,MAEd,SAAS;AAAA,MACT,OAAO;AAAA,IAAA;AAAA,IAET,OAAO;AAAA,MACL,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAU;AAAA,MACV,YAAY;AAAA,IAAA;AAAA,IAEd,OAAO;AAAA,MACL,UAAU;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,UAAU;AAAA,MACV,OAAO;AAAA,MACP,UAAU;AAAA,MACV,YAAY;AAAA,IAAA;AAAA,IAEd,OAAO;AAAA,MACL,UAAU;AAAA,MACV,OAAO;AAAA,MACP,UAAU;AAAA,MACV,YAAY;AAAA,IAAA;AAAA,IAEd,SAAS;AAAA,MACP,qBAAqB;AAAA,MACrB,kBAAkB;AAAA,MAClB,IAAI;AAAA,MACJ,UAAU;AAAA,MACV,cAAc;AAAA,MACd,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,WAAW;AAAA,MACX,UAAU;AAAA,MACV,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB,WAAW;AAAA,IAAA;AAAA,EACb;AAAA,EAGF,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,IAAI;AAAA,QACF,MAAM;AAAA,UACJ,0BAA0B;AAAA,UAC1B,4BAA4B;AAAA,QAAA;AAAA,MAC9B;AAAA,MAEF,IAAI;AAAA,QACF,MAAM;AAAA,UACJ,0BAA0B;AAAA,UAC1B,4BAA4B;AAAA,QAAA;AAAA,MAC9B;AAAA,IACF;AAAA,IAEF,WAAW;AAAA,MACT,QAAQ;AAAA,QACN,MAAM;AAAA,UACJ,mBAAmBH;AAAA,QAAA;AAAA,QAErB,OAAO;AAAA,UACL,IAAI;AAAA,QAAA;AAAA,QAEN,aAAa;AAAA,UACX,IAAI;AAAA,QAAA;AAAA,QAEN,OAAO;AAAA,UACL,IAAI;AAAA,QAAA;AAAA,MACN;AAAA,MAEF,KAAK;AAAA,QACH,MAAM;AAAA,UACJ,mBAAmBC;AAAA,UACnB,qBAAqB;AAAA,UACrB,eAAe;AAAA,QAAA;AAAA,QAEjB,aAAa;AAAA,UACX,IAAI;AAAA,QAAA;AAAA,QAEN,OAAO;AAAA,UACL,IAAI;AAAA,QAAA;AAAA,MACN;AAAA,IACF;AAAA,EACF;AAAA;AAAA,EAIF,iBAAiB;AAAA,IACf,WAAW;AAAA,IACX,MAAM;AAAA,EAAA;AAEV,CAAC,GC9GK,EAAE,cAAAG,GAAc,aAAAC,EAAA,IAAgB,gBAAAC,EAAwB;AAAA,EAC5D,QAAQJ;AACV,CAAC,GASYK,IAAoB,gBAAAH,EAG/B,OAAO,MAAM,GAIFI,IAAqB,gBAAAH,EAGhC,OAAO,OAAO,GAIHI,IAAqB,gBAAAJ,EAGhC,OAAO,OAAO,GAIHK,IAA2B,gBAAAL,EAGtC,OAAO,aAAa,GAITM,IAAqB,gBAAAN,EAGhC,OAAO,OAAO,GAIHO,IAAuB,gBAAAP,EAGlC,OAAO,SAAS,GC1BLQ,IAAgB,gBAAAC;AAAA,EAC3B,CACE,EAAE,WAAAC,GAAW,YAAAC,GAAY,YAAAC,GAAY,YAAAC,GAAY,UAAAC,GAAU,GAAGC,EAAA,GAC9DC,MACG;AACH,UAAM,CAACC,GAASC,CAAU,IAAIC,EAAsC;AAAA,MAClE,OAAO;AAAA,MACP,aAAa;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,MACN,OAAO;AAAA,MACP,WAAAT;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,IAAA,CACD,GAEKO,IAA+C;AAAA,MACnD,aAAaH,EAAQ;AAAA,MACrB,cAAcA,EAAQ;AAAA,IAAA;AAGxB,IAAIA,EAAQ,QACVG,EAAa,QAAQH,EAAQ,SAK7BG,EAAa,YAAY,IAAI,eAC7BA,EAAa,iBAAiB,IAAI;AAGpC,UAAM,EAAE,YAAAC,GAAY,YAAAC,GAAY,kBAAAC,GAAkB,mBAAAC,EAAA,IAChDC,EAASL,CAAY;AAEvB,IAAAM,EAAU,MAAM;AACd,MAAAR,EAAW,CAACS,OAAiB;AAAA,QAC3B,GAAGA;AAAA,QACH,WAAAjB;AAAA,QACA,YAAAC;AAAA,QACA,YAAAC;AAAA,QACA,YAAAC;AAAA,MAAA,EACA;AAAA,IACJ,GAAG,CAACH,GAAWC,GAAYC,GAAYC,CAAU,CAAC;AAElD,UAAMe,IAAa;AAAA,MACjB,GAAGN;AAAA,MACH,WAAAZ;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,IAAA;AAGF,WACE,gBAAAgB,EAACpC,EAAiB,UAAjB,EAA0B,OAAO,EAAE,SAAAwB,GAAS,YAAAC,EAAA,GAC3C,UAAA,gBAAAY,EAAC5B,GAAA,EAAkB,KAAAc,GAAW,GAAGD,GAC9B,UAAA;AAAA,MAAAE,EAAQ,SACP,gBAAAa,EAAC3B,GAAA,EAAoB,GAAGc,EAAQ,gBAC9B,UAAA;AAAA,QAAA,gBAAAa,EAAC,SAAA,EAAO,GAAGT,GACR,UAAA;AAAA,UAAAJ,EAAQ;AAAA,UACRN,KAAc,gBAAAkB,EAAC,OAAA,EAAI,eAAY,QAAO,UAAA,IAAA,CAAC;AAAA,QAAA,GAC1C;AAAA,QACCZ,EAAQ,QACP,gBAAAa,EAACC,GAAA,EACC,UAAA;AAAA,UAAA,gBAAAF;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,IAAG;AAAA,cACH,SAAQ;AAAA,cACR,UAAS;AAAA,cACT,OAAM;AAAA,cACN,QAAO;AAAA,cACP,IAAG;AAAA,cAEH,UAAA,gBAAAH;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,IAAG;AAAA,kBACH,SAAQ;AAAA,kBACR,UAAS;AAAA,kBACT,KAAI;AAAA,kBACJ,OAAM;AAAA,kBACN,WAAU;AAAA,kBAEV,UAAA,gBAAAH;AAAA,oBAACI;AAAA,oBAAA;AAAA,sBACC,cAAW;AAAA,sBACX,MAAK;AAAA,sBACL,MAAK;AAAA,sBACL,SAAQ;AAAA,sBAER,4BAACC,GAAA,CAAA,CAAY;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACf;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,4BAEDC,GAAA,EACC,UAAA,gBAAAN,EAACtB,GAAA,EAAqB,SAAO,IAC3B,UAAA,gBAAAsB,EAACO,GAAA,EACC,UAAA,gBAAAP,EAACG,GAAA,EAAI,GAAE,OAAO,UAAAf,EAAQ,KAAA,CAAK,EAAA,CAC7B,GACF,EAAA,CACF;AAAA,QAAA,EAAA,CACF;AAAA,MAAA,GAEJ;AAAA,MAEDA,EAAQ,SACP,gBAAAY,EAACzB,GAAA,EAAoB,GAAGa,EAAQ,gBAC7B,UAAAoB,EAAS,IAAIpB,EAAQ,OAAO,CAACqB,MAExBC,EAAeD,CAAK,IACfE,EAAaF,GAAOV,CAAU,IAGhCU,CACR,EAAA,CACH;AAAA,MAEDrB,EAAQ,eACP,gBAAAY;AAAA,QAACxB;AAAA,QAAA;AAAA,UACE,GAAGkB;AAAA,UACH,GAAGN,EAAQ;AAAA,UAEX,UAAAA,EAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,MAGZP,KAAaO,EAAQ,SACpB,gBAAAa;AAAA,QAACxB;AAAA,QAAA;AAAA,UACE,GAAGkB;AAAA,UACH,GAAGP,EAAQ;AAAA,UAEZ,UAAA;AAAA,YAAA,gBAAAY;AAAA,cAACG;AAAA,cAAA;AAAA,gBACC,IAAIS;AAAA,gBACJ,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,eAAc;AAAA,gBACd,IAAG;AAAA,cAAA;AAAA,YAAA;AAAA,YAEJxB,EAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAGZH;AAAA,IAAA,EAAA,CACH,EAAA,CACF;AAAA,EAEJ;AACF,GC1Ka4B,IAAiB,CAAC;AAAA,EAC7B,UAAA5B;AAAA,EACA,GAAG6B;AACL,MAA+B;AAC7B,QAAM,EAAE,YAAAzB,EAAA,IAAe0B,EAAWnD,CAAgB;AAElD,SAAAiC,EAAU,MAAM;AACd,IAAAR,EAAW,CAACS,OAAiB;AAAA,MAC3B,GAAGA;AAAA,MACH,OAAOb;AAAA,MACP,gBAAA6B;AAAA,IAAA,EACA;AAAA,EACJ,GAAG,CAAC7B,GAAUI,CAAU,CAAC,GAElB;AACT,GCfa2B,IAAiB,CAAC;AAAA,EAC7B,UAAA/B;AAAA,EACA,GAAGgC;AACL,MAA+B;AAC7B,QAAM,EAAE,YAAA5B,EAAA,IAAe0B,EAAWnD,CAAgB;AAElD,SAAAiC,EAAU,MAAM;AACd,IAAAR,EAAW,CAACS,OAAiB;AAAA,MAC3B,GAAGA;AAAA,MACH,OAAOb;AAAA,MACP,gBAAAgC;AAAA,IAAA,EACA;AAAA,EACJ,GAAG,CAAChC,GAAUI,CAAU,CAAC,GAElB;AACT,GCfa6B,IAAuB,CAAC;AAAA,EACnC,UAAAjC;AAAA,EACA,GAAGkC;AACL,MAAqC;AACnC,QAAM,EAAE,YAAA9B,EAAA,IAAe0B,EAAWnD,CAAgB;AAElD,SAAAiC,EAAU,MAAM;AACd,IAAAR,EAAW,CAACS,OAAiB;AAAA,MAC3B,GAAGA;AAAA,MACH,aAAab;AAAA,MACb,sBAAAkC;AAAA,IAAA,EACA;AAAA,EACJ,GAAG,CAAClC,GAAUI,CAAU,CAAC,GAElB;AACT,GCfa+B,IAAiB,CAAC;AAAA,EAC7B,UAAAnC;AAAA,EACA,GAAGoC;AACL,MAA+B;AAC7B,QAAM,EAAE,YAAAhC,EAAA,IAAe0B,EAAWnD,CAAgB;AAElD,SAAAiC,EAAU,MAAM;AACd,IAAAR,EAAW,CAACS,OAAiB;AAAA,MAC3B,GAAGA;AAAA,MACH,OAAOb;AAAA,MACP,gBAAAoC;AAAA,IAAA,EACA;AAAA,EACJ,GAAG,CAACpC,GAAUI,CAAU,CAAC,GAElB;AACT,GCTaiC,IAAmB,CAAC,EAAE,UAAArC,QAAsC;AACvE,QAAM,EAAE,YAAAI,EAAA,IAAe0B,EAAWnD,CAAgB;AAElD,SAAAiC,EAAU,MAAM;AACd,IAAAR,EAAW,CAACS,OAAiB;AAAA,MAC3B,GAAGA;AAAA,MACH,MAAMb;AAAA,IAAA,EACN;AAAA,EACJ,GAAG,CAACA,GAAUI,CAAU,CAAC,GAElB;AACT,GCdakC,KAAY;AAAA,EACvB,MAAM5C;AAAA,EACN,OAAOkC;AAAA,EACP,OAAOG;AAAA,EACP,aAAaE;AAAA,EACb,OAAOE;AAAA,EACP,SAASE;AACX;"}

package/dist/chunks/{password-input-XSc2MhLG.es.js → password-input-BT594v5p.es.js}

@@ -2,7 +2,7 @@ import { jsxs as r, jsx as o } from "react/jsx-runtime";
 import { forwardRef as f, useState as w } from "react";
 import { B as e } from "./box-C8731OYq.es.js";
 import { I as h } from "./icon-button-D2qU4Eun.es.js";
-import { b as n } from "./tooltip-BLyAAnK-.es.js";
+import { b as n } from "./tooltip-BOK0Uejw.es.js";
 import { T as u } from "./text-input-B7XCw3SS.es.js";
 import { VisibilityOff as P, Visibility as S } from "@commercetools/nimbus-icons";
 const b = /* @__PURE__ */ f(
@@ -47,4 +47,4 @@ b.displayName = "PasswordInput";
 export {
   b as P
 };
-//# sourceMappingURL=password-input-XSc2MhLG.es.js.map
+//# sourceMappingURL=password-input-BT594v5p.es.js.map

package/dist/chunks/{password-input-XSc2MhLG.es.js.map → password-input-BT594v5p.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"password-input-XSc2MhLG.es.js","sources":["../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { forwardRef, useState } from \"react\";\nimport { Box, IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n  (props, forwardedRef) => {\n    const { size = \"md\", isDisabled } = props;\n    const [showPassword, setShowPassword] = useState(false);\n    const toggleVisibility = () => setShowPassword(!showPassword);\n\n    /** size icon based on input size */\n    const iconSize = size === \"md\" ? \"xs\" : \"2xs\";\n    /**\n     * position the icon button at the right edge of the input based on\n     * the size of the input\n     */\n    const iconPositionProps =\n      size === \"md\"\n        ? {\n            top: \"100\",\n            right: \"400\",\n          }\n        : {\n            top: \"50\",\n            right: \"400\",\n          };\n\n    /** safe space between the text within the input and the icon button */\n    const iconButtonSafeSpace = size === \"md\" ? \"1400\" : \"1100\";\n\n    return (\n      <Box display=\"inline-block\" position=\"relative\">\n        <TextInput\n          width=\"full\"\n          ref={forwardedRef}\n          type={showPassword ? \"text\" : \"password\"}\n          {...props}\n          pr={iconButtonSafeSpace}\n        />\n        <Box position=\"absolute\" {...iconPositionProps}>\n          <Tooltip.Root>\n            <IconButton\n              size={iconSize}\n              variant=\"ghost\"\n              tone=\"primary\"\n              aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n              onPress={toggleVisibility}\n              isDisabled={isDisabled}\n            >\n              {showPassword ? <VisibilityOff /> : <Visibility />}\n            </IconButton>\n            <Tooltip.Content>\n              {showPassword ? \"Hide password\" : \"Show Password\"}\n            </Tooltip.Content>\n          </Tooltip.Root>\n        </Box>\n      </Box>\n    );\n  }\n);\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["PasswordInput","forwardRef","props","forwardedRef","size","isDisabled","showPassword","setShowPassword","useState","toggleVisibility","iconSize","iconPositionProps","jsxs","Box","jsx","TextInput","Tooltip","IconButton","VisibilityOff","Visibility"],"mappings":";;;;;;;AAaO,MAAMA,IAAgB,gBAAAC;AAAA,EAC3B,CAACC,GAAOC,MAAiB;AACvB,UAAM,EAAE,MAAAC,IAAO,MAAM,YAAAC,EAAA,IAAeH,GAC9B,CAACI,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChDC,IAAmB,MAAMF,EAAgB,CAACD,CAAY,GAGtDI,IAAWN,MAAS,OAAO,OAAO,OAKlCO,IACJP,MAAS,OACL;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,IAAA,IAET;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,IAAA;AAMf,WACE,gBAAAQ,EAACC,GAAA,EAAI,SAAQ,gBAAe,UAAS,YACnC,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,KAAKZ;AAAA,UACL,MAAMG,IAAe,SAAS;AAAA,UAC7B,GAAGJ;AAAA,UACJ,IATsBE,MAAS,OAAO,SAAS;AAAA,QAS3C;AAAA,MAAA;AAAA,MAEN,gBAAAU,EAACD,KAAI,UAAS,YAAY,GAAGF,GAC3B,UAAA,gBAAAC,EAACI,EAAQ,MAAR,EACC,UAAA;AAAA,QAAA,gBAAAF;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,MAAMP;AAAA,YACN,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,cAAYJ,IAAe,kBAAkB;AAAA,YAC7C,SAASG;AAAA,YACT,YAAAJ;AAAA,YAEC,UAAAC,IAAe,gBAAAQ,EAACI,GAAA,CAAA,CAAc,sBAAMC,GAAA,CAAA,CAAW;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEjDH,EAAQ,SAAR,EACE,UAAAV,IAAe,kBAAkB,gBAAA,CACpC;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA,GACF;AAAA,EAEJ;AACF;AAEAN,EAAc,cAAc;"}
+{"version":3,"file":"password-input-BT594v5p.es.js","sources":["../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { forwardRef, useState } from \"react\";\nimport { Box, IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n  (props, forwardedRef) => {\n    const { size = \"md\", isDisabled } = props;\n    const [showPassword, setShowPassword] = useState(false);\n    const toggleVisibility = () => setShowPassword(!showPassword);\n\n    /** size icon based on input size */\n    const iconSize = size === \"md\" ? \"xs\" : \"2xs\";\n    /**\n     * position the icon button at the right edge of the input based on\n     * the size of the input\n     */\n    const iconPositionProps =\n      size === \"md\"\n        ? {\n            top: \"100\",\n            right: \"400\",\n          }\n        : {\n            top: \"50\",\n            right: \"400\",\n          };\n\n    /** safe space between the text within the input and the icon button */\n    const iconButtonSafeSpace = size === \"md\" ? \"1400\" : \"1100\";\n\n    return (\n      <Box display=\"inline-block\" position=\"relative\">\n        <TextInput\n          width=\"full\"\n          ref={forwardedRef}\n          type={showPassword ? \"text\" : \"password\"}\n          {...props}\n          pr={iconButtonSafeSpace}\n        />\n        <Box position=\"absolute\" {...iconPositionProps}>\n          <Tooltip.Root>\n            <IconButton\n              size={iconSize}\n              variant=\"ghost\"\n              tone=\"primary\"\n              aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n              onPress={toggleVisibility}\n              isDisabled={isDisabled}\n            >\n              {showPassword ? <VisibilityOff /> : <Visibility />}\n            </IconButton>\n            <Tooltip.Content>\n              {showPassword ? \"Hide password\" : \"Show Password\"}\n            </Tooltip.Content>\n          </Tooltip.Root>\n        </Box>\n      </Box>\n    );\n  }\n);\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["PasswordInput","forwardRef","props","forwardedRef","size","isDisabled","showPassword","setShowPassword","useState","toggleVisibility","iconSize","iconPositionProps","jsxs","Box","jsx","TextInput","Tooltip","IconButton","VisibilityOff","Visibility"],"mappings":";;;;;;;AAaO,MAAMA,IAAgB,gBAAAC;AAAA,EAC3B,CAACC,GAAOC,MAAiB;AACvB,UAAM,EAAE,MAAAC,IAAO,MAAM,YAAAC,EAAA,IAAeH,GAC9B,CAACI,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChDC,IAAmB,MAAMF,EAAgB,CAACD,CAAY,GAGtDI,IAAWN,MAAS,OAAO,OAAO,OAKlCO,IACJP,MAAS,OACL;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,IAAA,IAET;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,IAAA;AAMf,WACE,gBAAAQ,EAACC,GAAA,EAAI,SAAQ,gBAAe,UAAS,YACnC,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,KAAKZ;AAAA,UACL,MAAMG,IAAe,SAAS;AAAA,UAC7B,GAAGJ;AAAA,UACJ,IATsBE,MAAS,OAAO,SAAS;AAAA,QAS3C;AAAA,MAAA;AAAA,MAEN,gBAAAU,EAACD,KAAI,UAAS,YAAY,GAAGF,GAC3B,UAAA,gBAAAC,EAACI,EAAQ,MAAR,EACC,UAAA;AAAA,QAAA,gBAAAF;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,MAAMP;AAAA,YACN,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,cAAYJ,IAAe,kBAAkB;AAAA,YAC7C,SAASG;AAAA,YACT,YAAAJ;AAAA,YAEC,UAAAC,IAAe,gBAAAQ,EAACI,GAAA,CAAA,CAAc,sBAAMC,GAAA,CAAA,CAAW;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEjDH,EAAQ,SAAR,EACE,UAAAV,IAAe,kBAAkB,gBAAA,CACpC;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA,GACF;AAAA,EAEJ;AACF;AAEAN,EAAc,cAAc;"}

package/dist/chunks/{password-input--fYkZAW3.cjs.js → password-input-D1LSzb9p.cjs.js}

@@ -1,2 +1,2 @@
-"use strict";const s=require("react/jsx-runtime"),e=require("react"),n=require("./box-BPfqlznQ.cjs.js"),b=require("./icon-button-BBkPfAM3.cjs.js"),r=require("./tooltip-tZKuAv4E.cjs.js"),j=require("./text-input-CCX8LUl1.cjs.js"),c=require("@commercetools/nimbus-icons"),a=e.forwardRef((i,d)=>{const{size:t="md",isDisabled:l}=i,[o,u]=e.useState(!1),p=()=>u(!o),x=t==="md"?"xs":"2xs",w=t==="md"?{top:"100",right:"400"}:{top:"50",right:"400"},h=t==="md"?"1400":"1100";return s.jsxs(n.Box,{display:"inline-block",position:"relative",children:[s.jsx(j.TextInput,{width:"full",ref:d,type:o?"text":"password",...i,pr:h}),s.jsx(n.Box,{position:"absolute",...w,children:s.jsxs(r.Tooltip.Root,{children:[s.jsx(b.IconButton,{size:x,variant:"ghost",tone:"primary","aria-label":o?"Hide password":"Show password",onPress:p,isDisabled:l,children:o?s.jsx(c.VisibilityOff,{}):s.jsx(c.Visibility,{})}),s.jsx(r.Tooltip.Content,{children:o?"Hide password":"Show Password"})]})})]})});a.displayName="PasswordInput";exports.PasswordInput=a;
-//# sourceMappingURL=password-input--fYkZAW3.cjs.js.map
+"use strict";const s=require("react/jsx-runtime"),e=require("react"),n=require("./box-BPfqlznQ.cjs.js"),b=require("./icon-button-BBkPfAM3.cjs.js"),r=require("./tooltip-DjUjwciC.cjs.js"),j=require("./text-input-CCX8LUl1.cjs.js"),c=require("@commercetools/nimbus-icons"),a=e.forwardRef((i,d)=>{const{size:t="md",isDisabled:l}=i,[o,u]=e.useState(!1),p=()=>u(!o),x=t==="md"?"xs":"2xs",w=t==="md"?{top:"100",right:"400"}:{top:"50",right:"400"},h=t==="md"?"1400":"1100";return s.jsxs(n.Box,{display:"inline-block",position:"relative",children:[s.jsx(j.TextInput,{width:"full",ref:d,type:o?"text":"password",...i,pr:h}),s.jsx(n.Box,{position:"absolute",...w,children:s.jsxs(r.Tooltip.Root,{children:[s.jsx(b.IconButton,{size:x,variant:"ghost",tone:"primary","aria-label":o?"Hide password":"Show password",onPress:p,isDisabled:l,children:o?s.jsx(c.VisibilityOff,{}):s.jsx(c.Visibility,{})}),s.jsx(r.Tooltip.Content,{children:o?"Hide password":"Show Password"})]})})]})});a.displayName="PasswordInput";exports.PasswordInput=a;
+//# sourceMappingURL=password-input-D1LSzb9p.cjs.js.map

package/dist/chunks/{password-input--fYkZAW3.cjs.js.map → password-input-D1LSzb9p.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"password-input--fYkZAW3.cjs.js","sources":["../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { forwardRef, useState } from \"react\";\nimport { Box, IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n  (props, forwardedRef) => {\n    const { size = \"md\", isDisabled } = props;\n    const [showPassword, setShowPassword] = useState(false);\n    const toggleVisibility = () => setShowPassword(!showPassword);\n\n    /** size icon based on input size */\n    const iconSize = size === \"md\" ? \"xs\" : \"2xs\";\n    /**\n     * position the icon button at the right edge of the input based on\n     * the size of the input\n     */\n    const iconPositionProps =\n      size === \"md\"\n        ? {\n            top: \"100\",\n            right: \"400\",\n          }\n        : {\n            top: \"50\",\n            right: \"400\",\n          };\n\n    /** safe space between the text within the input and the icon button */\n    const iconButtonSafeSpace = size === \"md\" ? \"1400\" : \"1100\";\n\n    return (\n      <Box display=\"inline-block\" position=\"relative\">\n        <TextInput\n          width=\"full\"\n          ref={forwardedRef}\n          type={showPassword ? \"text\" : \"password\"}\n          {...props}\n          pr={iconButtonSafeSpace}\n        />\n        <Box position=\"absolute\" {...iconPositionProps}>\n          <Tooltip.Root>\n            <IconButton\n              size={iconSize}\n              variant=\"ghost\"\n              tone=\"primary\"\n              aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n              onPress={toggleVisibility}\n              isDisabled={isDisabled}\n            >\n              {showPassword ? <VisibilityOff /> : <Visibility />}\n            </IconButton>\n            <Tooltip.Content>\n              {showPassword ? \"Hide password\" : \"Show Password\"}\n            </Tooltip.Content>\n          </Tooltip.Root>\n        </Box>\n      </Box>\n    );\n  }\n);\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["PasswordInput","forwardRef","props","forwardedRef","size","isDisabled","showPassword","setShowPassword","useState","toggleVisibility","iconSize","iconPositionProps","iconButtonSafeSpace","jsxs","Box","jsx","TextInput","Tooltip","IconButton","VisibilityOff","Visibility"],"mappings":"6QAaaA,EAAgBC,EAAAA,WAC3B,CAACC,EAAOC,IAAiB,CACvB,KAAM,CAAE,KAAAC,EAAO,KAAM,WAAAC,CAAA,EAAeH,EAC9B,CAACI,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAmB,IAAMF,EAAgB,CAACD,CAAY,EAGtDI,EAAWN,IAAS,KAAO,KAAO,MAKlCO,EACJP,IAAS,KACL,CACE,IAAK,MACL,MAAO,KAAA,EAET,CACE,IAAK,KACL,MAAO,KAAA,EAITQ,EAAsBR,IAAS,KAAO,OAAS,OAErD,OACES,EAAAA,KAACC,EAAAA,IAAA,CAAI,QAAQ,eAAe,SAAS,WACnC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,UAAA,CACC,MAAM,OACN,IAAKb,EACL,KAAMG,EAAe,OAAS,WAC7B,GAAGJ,EACJ,GAAIU,CAAA,CAAA,EAENG,EAAAA,IAACD,EAAAA,KAAI,SAAS,WAAY,GAAGH,EAC3B,SAAAE,OAACI,EAAAA,QAAQ,KAAR,CACC,SAAA,CAAAF,EAAAA,IAACG,EAAAA,WAAA,CACC,KAAMR,EACN,QAAQ,QACR,KAAK,UACL,aAAYJ,EAAe,gBAAkB,gBAC7C,QAASG,EACT,WAAAJ,EAEC,SAAAC,EAAeS,MAACI,EAAAA,cAAA,CAAA,CAAc,QAAMC,EAAAA,WAAA,CAAA,CAAW,CAAA,CAAA,QAEjDH,EAAAA,QAAQ,QAAR,CACE,SAAAX,EAAe,gBAAkB,eAAA,CACpC,CAAA,CAAA,CACF,CAAA,CACF,CAAA,EACF,CAEJ,CACF,EAEAN,EAAc,YAAc"}
+{"version":3,"file":"password-input-D1LSzb9p.cjs.js","sources":["../../src/components/password-input/password-input.tsx"],"sourcesContent":["import { forwardRef, useState } from \"react\";\nimport { Box, IconButton, Tooltip } from \"@/components\";\nimport { TextInput } from \"@/components/text-input\";\nimport { Visibility, VisibilityOff } from \"@commercetools/nimbus-icons\";\nimport type { PasswordInputProps } from \"./password-input.types\";\n\n/**\n * # PasswordInput\n *\n * A password input is a text field that hides entered characters for secure password entry.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/passwordinput}\n */\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n  (props, forwardedRef) => {\n    const { size = \"md\", isDisabled } = props;\n    const [showPassword, setShowPassword] = useState(false);\n    const toggleVisibility = () => setShowPassword(!showPassword);\n\n    /** size icon based on input size */\n    const iconSize = size === \"md\" ? \"xs\" : \"2xs\";\n    /**\n     * position the icon button at the right edge of the input based on\n     * the size of the input\n     */\n    const iconPositionProps =\n      size === \"md\"\n        ? {\n            top: \"100\",\n            right: \"400\",\n          }\n        : {\n            top: \"50\",\n            right: \"400\",\n          };\n\n    /** safe space between the text within the input and the icon button */\n    const iconButtonSafeSpace = size === \"md\" ? \"1400\" : \"1100\";\n\n    return (\n      <Box display=\"inline-block\" position=\"relative\">\n        <TextInput\n          width=\"full\"\n          ref={forwardedRef}\n          type={showPassword ? \"text\" : \"password\"}\n          {...props}\n          pr={iconButtonSafeSpace}\n        />\n        <Box position=\"absolute\" {...iconPositionProps}>\n          <Tooltip.Root>\n            <IconButton\n              size={iconSize}\n              variant=\"ghost\"\n              tone=\"primary\"\n              aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n              onPress={toggleVisibility}\n              isDisabled={isDisabled}\n            >\n              {showPassword ? <VisibilityOff /> : <Visibility />}\n            </IconButton>\n            <Tooltip.Content>\n              {showPassword ? \"Hide password\" : \"Show Password\"}\n            </Tooltip.Content>\n          </Tooltip.Root>\n        </Box>\n      </Box>\n    );\n  }\n);\n\nPasswordInput.displayName = \"PasswordInput\";\n"],"names":["PasswordInput","forwardRef","props","forwardedRef","size","isDisabled","showPassword","setShowPassword","useState","toggleVisibility","iconSize","iconPositionProps","iconButtonSafeSpace","jsxs","Box","jsx","TextInput","Tooltip","IconButton","VisibilityOff","Visibility"],"mappings":"6QAaaA,EAAgBC,EAAAA,WAC3B,CAACC,EAAOC,IAAiB,CACvB,KAAM,CAAE,KAAAC,EAAO,KAAM,WAAAC,CAAA,EAAeH,EAC9B,CAACI,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAmB,IAAMF,EAAgB,CAACD,CAAY,EAGtDI,EAAWN,IAAS,KAAO,KAAO,MAKlCO,EACJP,IAAS,KACL,CACE,IAAK,MACL,MAAO,KAAA,EAET,CACE,IAAK,KACL,MAAO,KAAA,EAITQ,EAAsBR,IAAS,KAAO,OAAS,OAErD,OACES,EAAAA,KAACC,EAAAA,IAAA,CAAI,QAAQ,eAAe,SAAS,WACnC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,UAAA,CACC,MAAM,OACN,IAAKb,EACL,KAAMG,EAAe,OAAS,WAC7B,GAAGJ,EACJ,GAAIU,CAAA,CAAA,EAENG,EAAAA,IAACD,EAAAA,KAAI,SAAS,WAAY,GAAGH,EAC3B,SAAAE,OAACI,EAAAA,QAAQ,KAAR,CACC,SAAA,CAAAF,EAAAA,IAACG,EAAAA,WAAA,CACC,KAAMR,EACN,QAAQ,QACR,KAAK,UACL,aAAYJ,EAAe,gBAAkB,gBAC7C,QAASG,EACT,WAAAJ,EAEC,SAAAC,EAAeS,MAACI,EAAAA,cAAA,CAAA,CAAc,QAAMC,EAAAA,WAAA,CAAA,CAAW,CAAA,CAAA,QAEjDH,EAAAA,QAAQ,QAAR,CACE,SAAAX,EAAe,gBAAkB,eAAA,CACpC,CAAA,CAAA,CACF,CAAA,CACF,CAAA,EACF,CAEJ,CACF,EAEAN,EAAc,YAAc"}

package/dist/chunks/select-BnN5zaBu.cjs.js

@@ -0,0 +1,2 @@
+"use strict";const s=require("react/jsx-runtime"),i=require("react"),z=require("@commercetools/nimbus-icons"),Y=require("./box-BPfqlznQ.cjs.js"),L=require("./Button-DQ_WkLNH.cjs.js"),F=require("./Dialog-Cbq66gyc.cjs.js"),h=require("./utils-BHdR5Nww.cjs.js"),re=require("./FieldError-DyGFfqST.cjs.js"),ae=require("./Form-BuOomA4T.cjs.js"),ne=require("./intlStrings-ClBuC6xN.cjs.js"),Z=require("./Label-BgrYyYXn.cjs.js"),B=require("./ListBox-CzZFXtHY.cjs.js"),N=require("./Text-BWSfeB9p.cjs.js"),O=require("./Collection-BsItrctR.cjs.js"),D=require("./mergeProps-BA5Cwf5w.cjs.js"),G=require("./filterDOMProps-WUskt27c.cjs.js"),_=require("./OverlayArrow-C5Ymp9MC.cjs.js"),se=require("./useLocalizedStringFormatter-fJnbqb2x.cjs.js"),ee=require("./useFormValidation-DJy_cdgv.cjs.js"),de=require("./useSingleSelectListState-BpAVpRdZ.cjs.js"),ce=require("./useFocusRing-DRIoF592.cjs.js"),ue=require("./useFocusVisible-bRnVksaU.cjs.js"),fe=require("./useCollator-ZqnkTllN.cjs.js"),be=require("./useField-DmqO9k7a.cjs.js"),$e=require("./useFormReset--wPlnEOl.cjs.js"),pe=require("./VisuallyHidden-B4l0wZHw.cjs.js"),te=require("./create-slot-recipe-context-HIF51Igr.cjs.js"),ve=require("./icon-button-BBkPfAM3.cjs.js"),xe=require("./index-XyB4gGC8.cjs.js"),le=require("./extractStyleProps-wjyId_vK.cjs.js"),me=require("./factory-DlCuwIGL.cjs.js"),T=require("./flex-BhVeeItQ.cjs.js"),he=require("./Separator-DBLZ41YB.cjs.js"),H=new WeakMap;function ye(e,t,n){let{keyboardDelegate:r,isDisabled:l,isRequired:d,name:u,form:a,validationBehavior:c="aria"}=e,$=fe.$325a3faab7a68acd$export$a16aca283550c30d({usage:"search",sensitivity:"base"}),o=i.useMemo(()=>r||new O.$2a25aae57d74318e$export$a05409b8bb224a5a(t.collection,t.disabledKeys,n,$),[r,t.collection,t.disabledKeys,$,n]),{menuTriggerProps:v,menuProps:p}=F.$168583247155ddda$export$dc9c12ed27dd1b49({isDisabled:l,type:"listbox"},t,n),f=b=>{switch(b.key){case"ArrowLeft":{var S,g;b.preventDefault();let q=t.selectedKey!=null?(S=o.getKeyAbove)===null||S===void 0?void 0:S.call(o,t.selectedKey):(g=o.getFirstKey)===null||g===void 0?void 0:g.call(o);q&&t.setSelectedKey(q);break}case"ArrowRight":{var M,V;b.preventDefault();let q=t.selectedKey!=null?(M=o.getKeyBelow)===null||M===void 0?void 0:M.call(o,t.selectedKey):(V=o.getFirstKey)===null||V===void 0?void 0:V.call(o);q&&t.setSelectedKey(q);break}}},{typeSelectProps:x}=O.$fb3050f43d946246$export$e32c88dfddc6e1d8({keyboardDelegate:o,selectionManager:t.selectionManager,onTypeSelect(b){t.setSelectedKey(b)}}),{isInvalid:P,validationErrors:R,validationDetails:I}=t.displayValidation,{labelProps:w,fieldProps:C,descriptionProps:y,errorMessageProps:E}=be.$2baaea4c71418dea$export$294aa081a6c6f55d({...e,labelElementType:"span",isInvalid:P,errorMessage:e.errorMessage||R});x.onKeyDown=x.onKeyDownCapture,delete x.onKeyDownCapture;let k=G.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(e,{labelable:!0}),m=D.$3ef42575df84b30b$export$9d1611c77c2fe928(x,v,C),j=D.$bdb11010cef70236$export$f680877a34711e37();return H.set(t,{isDisabled:l,isRequired:d,name:u,form:a,validationBehavior:c}),{labelProps:{...w,onClick:()=>{if(!e.isDisabled){var b;(b=n.current)===null||b===void 0||b.focus(),ue.$507fabe10e71c6fb$export$8397ddfc504fdb9a("keyboard")}}},triggerProps:D.$3ef42575df84b30b$export$9d1611c77c2fe928(k,{...m,isDisabled:l,onKeyDown:D.$ff5963eb1fccf552$export$e08e3b67e392101e(m.onKeyDown,f,e.onKeyDown),onKeyUp:e.onKeyUp,"aria-labelledby":[j,m["aria-labelledby"],m["aria-label"]&&!m["aria-labelledby"]?m.id:null].filter(Boolean).join(" "),onFocus(b){t.isFocused||(e.onFocus&&e.onFocus(b),e.onFocusChange&&e.onFocusChange(!0),t.setFocused(!0))},onBlur(b){t.isOpen||(e.onBlur&&e.onBlur(b),e.onFocusChange&&e.onFocusChange(!1),t.setFocused(!1))}}),valueProps:{id:j},menuProps:{...p,autoFocus:t.focusStrategy||!0,shouldSelectOnPressUp:!0,shouldFocusOnHover:!0,disallowEmptySelection:!0,linkBehavior:"selection",onBlur:b=>{b.currentTarget.contains(b.relatedTarget)||(e.onBlur&&e.onBlur(b),e.onFocusChange&&e.onFocusChange(!1),t.setFocused(!1))},"aria-labelledby":[C["aria-labelledby"],m["aria-label"]&&!C["aria-labelledby"]?m.id:null].filter(Boolean).join(" ")},descriptionProps:y,errorMessageProps:E,isInvalid:P,validationErrors:R,validationDetails:I,hiddenSelectProps:{isDisabled:l,name:u,label:e.label,state:t,triggerRef:n,form:a}}}function Se(e,t,n){let r=H.get(t)||{},{autoComplete:l,name:d=r.name,form:u=r.form,isDisabled:a=r.isDisabled}=e,{validationBehavior:c,isRequired:$}=r,{visuallyHiddenProps:o}=pe.$5c3e21d68f1c4674$export$a966af930f325cab({style:{position:"fixed",top:0,left:0}});$e.$99facab73266f662$export$5add1d006293d136(e.selectRef,t.defaultSelectedKey,t.setSelectedKey),ee.$e93e671b31057976$export$b8473d3665f3a75a({validationBehavior:c,focus:()=>{var f;return(f=n.current)===null||f===void 0?void 0:f.focus()}},t,e.selectRef);let v=i.useCallback(f=>t.setSelectedKey(f.currentTarget.value),[t.setSelectedKey]);var p;return{containerProps:{...o,"aria-hidden":!0,"data-react-aria-prevent-focus":!0,"data-a11y-ignore":"aria-hidden-focus"},inputProps:{style:{display:"none"}},selectProps:{tabIndex:-1,autoComplete:l,disabled:a,required:c==="native"&&$,name:d,form:u,value:(p=t.selectedKey)!==null&&p!==void 0?p:"",onChange:v,onInput:v}}}function ge(e){let{state:t,triggerRef:n,label:r,name:l,form:d,isDisabled:u}=e,a=i.useRef(null),c=i.useRef(null),{containerProps:$,selectProps:o}=Se({...e,selectRef:t.collection.size<=300?a:c},t,n);if(t.collection.size<=300)return i.createElement("div",{...$,"data-testid":"hidden-select-container"},i.createElement("label",null,r,i.createElement("select",{...o,ref:a},i.createElement("option",null),[...t.collection.getKeys()].map(p=>{let f=t.collection.getItem(p);if(f&&f.type==="item")return i.createElement("option",{key:f.key,value:f.key},f.textValue)}))));if(l){let p=H.get(t)||{},{validationBehavior:f}=p;var v;let x={type:"hidden",autoComplete:o.autoComplete,name:l,form:d,disabled:u,value:(v=t.selectedKey)!==null&&v!==void 0?v:""};return f==="native"?i.createElement("input",{...x,ref:c,style:{display:"none"},type:"text",required:o.required,onChange:()=>{}}):i.createElement("input",{...x,ref:c})}return null}function Pe(e){let t=_.$fc909762b330b746$export$61c6a8c84e605fb6(e),[n,r]=i.useState(null),l=de.$a0d645289fe9b86b$export$e7f05e985daf4b5f({...e,onSelectionChange:o=>{e.onSelectionChange!=null&&e.onSelectionChange(o),t.close(),d.commitValidation()}}),d=ee.$e5be200c675c3b3a$export$fc1a364ae1f3ff10({...e,value:l.selectedKey}),[u,a]=i.useState(!1),[c]=i.useState(l.selectedKey);var $;return{...d,...l,...t,defaultSelectedKey:($=e.defaultSelectedKey)!==null&&$!==void 0?$:c,focusStrategy:n,open(o=null){l.collection.size!==0&&(r(o),t.open())},toggle(o=null){l.collection.size!==0&&(r(o),t.toggle())},isFocused:u,setFocused:a}}function Re(e){return e&&e.__esModule?e.default:e}const W=i.createContext(null),A=i.createContext(null),Ce=i.forwardRef(function(t,n){[t,n]=h.$64fa3d84918910a7$export$29f1550f4b0d4415(t,n,W);let{children:r,isDisabled:l=!1,isInvalid:d=!1,isRequired:u=!1}=t,a=i.useMemo(()=>typeof r=="function"?r({isOpen:!1,isDisabled:l,isInvalid:d,isRequired:u,isFocused:!1,isFocusVisible:!1,defaultChildren:null}):r,[r,l,d,u]);return i.createElement(O.$e1995378a142960e$export$bf788dd355e3a401,{content:a},c=>i.createElement(De,{props:t,collection:c,selectRef:n}))}),qe=[Z.$01b77f81d0f07f68$export$75b6ee27786ba447,L.$d2b4bc8c273e7be6$export$24d547caef80ccd1,N.$514c0188e459b4c0$export$9afb8bc826b033ea];function De({props:e,selectRef:t,collection:n}){let{validationBehavior:r}=h.$64fa3d84918910a7$export$fabf2dc03a41866e(ae.$d3e0e05bdfcf66bd$export$c24727297075ec6a)||{};var l,d;let u=(d=(l=e.validationBehavior)!==null&&l!==void 0?l:r)!==null&&d!==void 0?d:"native",a=Pe({...e,collection:n,children:void 0,validationBehavior:u}),{isFocusVisible:c,focusProps:$}=ce.$f7dceffc5ad7768b$export$4e328f61c538687f({within:!0}),o=i.useRef(null),[v,p]=h.$64fa3d84918910a7$export$9d4c57ee4c6ffdd8(!e["aria-label"]&&!e["aria-labelledby"]),{labelProps:f,triggerProps:x,valueProps:P,menuProps:R,descriptionProps:I,errorMessageProps:w,hiddenSelectProps:C,...y}=ye({...h.$64fa3d84918910a7$export$ef03459518577ad4(e),label:p,validationBehavior:u},a,o),[E,k]=i.useState(null),m=i.useCallback(()=>{o.current&&k(o.current.offsetWidth+"px")},[o]);_.$9daab02d461809db$export$683480f191c0e3ea({ref:o,onResize:m});let j=i.useMemo(()=>({isOpen:a.isOpen,isFocused:a.isFocused,isFocusVisible:c,isDisabled:e.isDisabled||!1,isInvalid:y.isInvalid||!1,isRequired:e.isRequired||!1}),[a.isOpen,a.isFocused,c,e.isDisabled,y.isInvalid,e.isRequired]),b=h.$64fa3d84918910a7$export$4d86445c2cf5e3({...e,values:j,defaultClassName:"react-aria-Select"}),S=G.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(e,{global:!0});delete S.id;let g=i.useRef(null);return i.createElement(h.$64fa3d84918910a7$export$2881499e37b75b9a,{values:[[W,e],[A,a],[oe,P],[Z.$01b77f81d0f07f68$export$75b6ee27786ba447,{...f,ref:v,elementType:"span"}],[L.$d2b4bc8c273e7be6$export$24d547caef80ccd1,{...x,ref:o,isPressed:a.isOpen,autoFocus:e.autoFocus}],[F.$de32f1b87079253c$export$d2f961adcb0afbe,a],[F.$07b14b47974efb58$export$9b9a0cd73afb7ca4,{trigger:"Select",triggerRef:o,scrollRef:g,placement:"bottom start",style:{"--trigger-width":E},"aria-labelledby":R["aria-labelledby"],clearContexts:qe}],[B.$eed445e0843c11d0$export$7ff8f37d2d81a48d,{...R,ref:g}],[B.$eed445e0843c11d0$export$7c5906fe4f1f2af2,a],[N.$514c0188e459b4c0$export$9afb8bc826b033ea,{slots:{description:I,errorMessage:w}}],[re.$ee014567cb39d3f0$export$ff05c3ac10437e03,y]]},i.createElement("div",{...D.$3ef42575df84b30b$export$9d1611c77c2fe928(S,b,$),ref:t,slot:e.slot||void 0,"data-focused":a.isFocused||void 0,"data-focus-visible":c||void 0,"data-open":a.isOpen||void 0,"data-disabled":e.isDisabled||void 0,"data-invalid":y.isInvalid||void 0,"data-required":e.isRequired||void 0},b.children,i.createElement(ge,{...C,autoComplete:e.autoComplete})))}const oe=i.createContext(null),Fe=i.forwardRef(function(t,n){var r,l;[t,n]=h.$64fa3d84918910a7$export$29f1550f4b0d4415(t,n,oe);let d=i.useContext(A),{placeholder:u}=h.$64fa3d84918910a7$export$fabf2dc03a41866e(W),a=d.selectedKey!=null?d.collection.getItem(d.selectedKey):null,c=a?.props.children;typeof c=="function"&&(c=c({isHovered:!1,isPressed:!1,isSelected:!1,isFocused:!1,isFocusVisible:!1,isDisabled:!1,selectionMode:"single",selectionBehavior:"toggle"}));let $=se.$fca6afa0e843324b$export$f12b703ca79dfbb1(Re(ne.$df39c1238ae2b5f3$exports),"react-aria-components");var o,v,p;let f=h.$64fa3d84918910a7$export$4d86445c2cf5e3({...t,defaultChildren:(o=c??u)!==null&&o!==void 0?o:$.format("selectPlaceholder"),defaultClassName:"react-aria-SelectValue",values:{selectedItem:(v=(r=d.selectedItem)===null||r===void 0?void 0:r.value)!==null&&v!==void 0?v:null,selectedText:(p=(l=d.selectedItem)===null||l===void 0?void 0:l.textValue)!==null&&p!==void 0?p:null,isPlaceholder:!a}}),x=G.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(t,{global:!0});return i.createElement("span",{ref:n,...x,...f,"data-placeholder":!a||void 0},i.createElement(N.$514c0188e459b4c0$export$9afb8bc826b033ea.Provider,{value:void 0},f.children))}),{withProvider:Be,withContext:K}=te.createSlotRecipeContext({key:"select"}),Ke=Be("div","root"),je=K("button","trigger"),Oe=K("span","triggerLabel"),Ie=K("div","options"),we=K("div","option"),Ee=K("div","optionGroup"),ie=()=>{const e=i.useContext(A);if(!e?.selectedKey)return null;const t=()=>{e?.setSelectedKey(null)};return s.jsx(F.$f1ab8c75478c6f73$export$cf75428e0b9ed1ea,{children:s.jsx(ve.IconButton,{pointerEvents:"all",size:"2xs",variant:"ghost",tone:"primary","aria-label":"Clear Selection",onPress:t,children:s.jsx(z.Close,{})})})};ie.displayName="Select.ClearButton";const U=i.forwardRef(({children:e,isLoading:t,isDisabled:n,...r},l)=>{const d=te.useSlotRecipe({recipe:xe.selectSlotRecipe}),[u,a]=d.splitVariantProps(r),[c,$]=le.extractStyleProps(a),o={...$,isDisabled:t||n};return s.jsx(Ke,{asChild:!0,ref:l,...u,...c,children:s.jsxs(Ce,{...o,children:[s.jsxs(me.chakra.div,{position:"relative",children:[s.jsx(je,{zIndex:0,asChild:!0,children:s.jsx(L.$d2b4bc8c273e7be6$export$353f5b6fc5456de1,{children:s.jsx(Oe,{asChild:!0,children:s.jsx(Fe,{})})})}),s.jsxs(T.Flex,{position:"absolute",top:"0",bottom:"0",zIndex:1,right:"400",pointerEvents:"none",children:[s.jsx(T.Flex,{width:"600",my:"auto",children:s.jsx(ie,{})}),s.jsx(T.Flex,{my:"auto",w:"600",h:"600",pointerEvents:"none",children:s.jsx(Y.Box,{color:"neutral.9",asChild:!0,m:"auto",w:"400",h:"400",children:t?s.jsx(Y.Box,{asChild:!0,animation:"spin",animationDuration:"slowest",children:s.jsx(z.Loop,{})}):s.jsx(z.KeyboardArrowDown,{})})})]})]}),s.jsx(F.$07b14b47974efb58$export$5b6b19405a83ff9d,{children:e})]})})});U.displayName="Select.Root";const X=e=>{const{ref:t,...n}=e,[r,l]=le.extractStyleProps(n);return s.jsx(Ie,{asChild:!0,...r,children:s.jsx(B.$eed445e0843c11d0$export$41f133550aa26f48,{ref:t,...l})})};X.displayName="Select.Options";const J=({ref:e,...t})=>s.jsx(we,{asChild:!0,ref:e,children:s.jsx(B.$eed445e0843c11d0$export$a11e76429ed99b4,{...t})});J.displayName="Select.Option";const Q=e=>{const{ref:t,label:n,items:r,children:l,...d}=e;if(r&&typeof l!="function")throw new Error('SelectOptionGroup: When "items" is provided, "children" must be a function');return s.jsxs(B.$eed445e0843c11d0$export$dca12b0bb56e4fc,{ref:t,...d,children:[s.jsx(Ee,{asChild:!0,children:s.jsx(he.$72a5793c14baf454$export$8b251419efc915eb,{children:n})}),r?s.jsx(O.$e1995378a142960e$export$fb8073518f34e6ec,{items:r,children:u=>typeof l=="function"?l(u):null}):l]})};Q.displayName="Select.OptionGroup";const ke={Root:U,Options:X,Option:J,OptionGroup:Q};exports.Select=ke;exports.SelectOption=J;exports.SelectOptionGroup=Q;exports.SelectOptions=X;exports.SelectRoot=U;
+//# sourceMappingURL=select-BnN5zaBu.cjs.js.map