@commercetools/nimbus 0.0.0-canary-20251024125521 → 0.0.0-canary-20251024153651

package/dist/chunks/{form-field-B9wlWUcK.cjs.js.map → form-field-zi8RBlcC.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"form-field-B9wlWUcK.cjs.js","sources":["../../src/components/form-field/components/form-field.context.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.types\";\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 { createSlotRecipeContext } from \"@chakra-ui/react\";\nimport type {\n  FormFieldRootSlotProps,\n  FormFieldLabelSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldPopoverSlotProps,\n} from \"./form-field.types\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  key: \"formField\",\n});\n\n// Root slot\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useState,\n  useRef,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField, useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\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 = function FormFieldRoot({\n  ref: forwardedRef,\n  id,\n  isInvalid,\n  isRequired,\n  isDisabled,\n  isReadOnly,\n  children,\n  ...props\n}: FormFieldProps) {\n  const localRef = useRef<HTMLDivElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\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] = useMemo(() => {\n    const args: Parameters<typeof useField>[0] = {\n      id,\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      args.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      args[\"aria-label\"] = \"empty-label\";\n      args[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    return args;\n  }, [id, context.description, context.error, context.label]);\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 = useMemo(\n    () => ({\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    }),\n    [fieldProps, isInvalid, isRequired, isDisabled, isReadOnly]\n  );\n\n  const contextValue = useMemo(() => ({ context, setContext }), [context]);\n\n  return (\n    <FormFieldContext.Provider value={contextValue}>\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              alignSelf=\"center\"\n            />\n            {context.error}\n          </FormFieldErrorSlot>\n        )}\n        {children}\n      </FormFieldRootSlot>\n    </FormFieldContext.Provider>\n  );\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.types\";\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\n    // Cleanup: clear label when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        label: null,\n        labelSlotProps: undefined,\n      }));\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.types\";\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.types\";\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\n    // Cleanup: clear description when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        description: null,\n        descriptionSlotProps: undefined,\n      }));\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.types\";\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\n    // Cleanup: clear error when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        error: null,\n        errorSlotProps: undefined,\n      }));\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\n    // Cleanup: clear info when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        info: null,\n      }));\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","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardedRef","id","isInvalid","isRequired","isDisabled","isReadOnly","children","props","localRef","useRef","ref","useObjectRef","mergeRefs","context","setContext","useState","useFieldArgs","useMemo","args","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","contextValue","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-zi8RBlcC.cjs.js","sources":["../../src/components/form-field/components/form-field.context.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.types\";\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 { createSlotRecipeContext } from \"@chakra-ui/react\";\nimport type {\n  FormFieldRootSlotProps,\n  FormFieldLabelSlotProps,\n  FormFieldInputSlotProps,\n  FormFieldDescriptionSlotProps,\n  FormFieldErrorSlotProps,\n  FormFieldPopoverSlotProps,\n} from \"./form-field.types\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  key: \"formField\",\n});\n\n// Root slot\nexport const FormFieldRootSlot = withProvider<\n  HTMLDivElement,\n  FormFieldRootSlotProps\n>(\"div\", \"root\");\n\n// Label Slot\nexport const FormFieldLabelSlot = withContext<\n  HTMLDivElement,\n  FormFieldLabelSlotProps\n>(\"div\", \"label\");\n\n// Input Slot\nexport const FormFieldInputSlot = withContext<\n  HTMLDivElement,\n  FormFieldInputSlotProps\n>(\"div\", \"input\");\n\n// Description Slot\nexport const FormFieldDescriptionSlot = withContext<\n  HTMLDivElement,\n  FormFieldDescriptionSlotProps\n>(\"div\", \"description\");\n\n// Error Slot\nexport const FormFieldErrorSlot = withContext<\n  HTMLDivElement,\n  FormFieldErrorSlotProps\n>(\"div\", \"error\");\n\n// Error Slot\nexport const FormFieldPopoverSlot = withContext<\n  HTMLDivElement,\n  FormFieldPopoverSlotProps\n>(\"div\", \"popover\");\n","import {\n  Children,\n  cloneElement,\n  isValidElement,\n  useEffect,\n  useMemo,\n  useState,\n  useRef,\n} from \"react\";\nimport type { FormFieldProps } from \"../form-field.types\";\nimport { useField, useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\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 = function FormFieldRoot({\n  ref: forwardedRef,\n  id,\n  isInvalid,\n  isRequired,\n  isDisabled,\n  isReadOnly,\n  children,\n  ...props\n}: FormFieldProps) {\n  const localRef = useRef<HTMLDivElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\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] = useMemo(() => {\n    const args: Parameters<typeof useField>[0] = {\n      id,\n      description: context.description,\n      errorMessage: context.error,\n    };\n\n    if (context.label) {\n      args.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      args[\"aria-label\"] = \"empty-label\";\n      args[\"aria-labelledby\"] = \"empty-label\";\n    }\n\n    return args;\n  }, [id, context.description, context.error, context.label]);\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 = useMemo(\n    () => ({\n      ...fieldProps,\n      isInvalid,\n      isRequired,\n      isDisabled,\n      isReadOnly,\n    }),\n    [fieldProps, isInvalid, isRequired, isDisabled, isReadOnly]\n  );\n\n  const contextValue = useMemo(() => ({ context, setContext }), [context]);\n\n  return (\n    <FormFieldContext.Provider value={contextValue}>\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              alignSelf=\"center\"\n            />\n            {context.error}\n          </FormFieldErrorSlot>\n        )}\n        {children}\n      </FormFieldRootSlot>\n    </FormFieldContext.Provider>\n  );\n};\n","import { useContext, useEffect } from \"react\";\nimport { FormFieldContext } from \"./form-field.context\";\nimport type { FormFieldLabelSlotProps } from \"../form-field.types\";\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\n    // Cleanup: clear label when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        label: null,\n        labelSlotProps: undefined,\n      }));\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.types\";\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.types\";\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\n    // Cleanup: clear description when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        description: null,\n        descriptionSlotProps: undefined,\n      }));\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.types\";\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\n    // Cleanup: clear error when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        error: null,\n        errorSlotProps: undefined,\n      }));\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\n    // Cleanup: clear info when component unmounts\n    return () => {\n      setContext((prevContext) => ({\n        ...prevContext,\n        info: null,\n      }));\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","withProvider","withContext","createSlotRecipeContext","FormFieldRootSlot","FormFieldLabelSlot","FormFieldInputSlot","FormFieldDescriptionSlot","FormFieldErrorSlot","FormFieldPopoverSlot","FormFieldRoot","forwardedRef","id","isInvalid","isRequired","isDisabled","isReadOnly","children","props","localRef","useRef","ref","useObjectRef","mergeRefs","context","setContext","useState","useFieldArgs","useMemo","args","labelProps","fieldProps","descriptionProps","errorMessageProps","useField","useEffect","prevContext","inputProps","contextValue","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/{icon-button-B28VUff9.cjs.js → icon-button-CCOl3BcF.cjs.js}

@@ -1,2 +1,2 @@
-"use strict";const u=require("react/jsx-runtime"),f=require("react"),i=require("@chakra-ui/react"),a=require("./useObjectRef-4v2MxSjQ.cjs.js"),d=require("./button-CA3VvD2G.cjs.js"),e=t=>{const{children:r,ref:n,...o}=t,s=f.useRef(null),c=a.$df56164dff5785e2$export$4338b53315abf666(i.mergeRefs(s,n));return u.jsx(d.Button,{px:0,py:0,...o,ref:c,children:r})};e.displayName="IconButton";exports.IconButton=e;
-//# sourceMappingURL=icon-button-B28VUff9.cjs.js.map
+"use strict";const u=require("react/jsx-runtime"),f=require("react"),i=require("@chakra-ui/react"),a=require("./useObjectRef-4v2MxSjQ.cjs.js"),d=require("./button-Y1zC9ASp.cjs.js"),e=t=>{const{children:r,ref:n,...o}=t,s=f.useRef(null),c=a.$df56164dff5785e2$export$4338b53315abf666(i.mergeRefs(s,n));return u.jsx(d.Button,{px:0,py:0,...o,ref:c,children:r})};e.displayName="IconButton";exports.IconButton=e;
+//# sourceMappingURL=icon-button-CCOl3BcF.cjs.js.map

package/dist/chunks/{icon-button-B28VUff9.cjs.js.map → icon-button-CCOl3BcF.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icon-button-B28VUff9.cjs.js","sources":["../../src/components/icon-button/icon-button.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\nimport type { IconButtonProps } from \"./icon-button.types\";\nimport { Button } from \"@/components\";\n\n/**\n * # IconButton\n *\n * displays a button with an icon only as child\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/iconbutton}\n */\nexport const IconButton = (props: IconButtonProps) => {\n  const { children, ref: forwardedRef, ...restProps } = props;\n\n  // Create a local ref and merge with forwarded ref\n  const localRef = useRef<HTMLButtonElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n  return (\n    <Button px={0} py={0} {...restProps} ref={ref}>\n      {children}\n    </Button>\n  );\n};\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","props","children","forwardedRef","restProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","Button"],"mappings":"qLAaaA,EAAcC,GAA2B,CACpD,KAAM,CAAE,SAAAC,EAAU,IAAKC,EAAc,GAAGC,GAAcH,EAGhDI,EAAWC,EAAAA,OAA0B,IAAI,EACzCC,EAAMC,EAAAA,0CAAaC,EAAAA,UAAUJ,EAAUF,CAAY,CAAC,EAE1D,OACEO,MAACC,EAAAA,QAAO,GAAI,EAAG,GAAI,EAAI,GAAGP,EAAW,IAAAG,EAClC,SAAAL,CAAA,CACH,CAEJ,EAEAF,EAAW,YAAc"}
+{"version":3,"file":"icon-button-CCOl3BcF.cjs.js","sources":["../../src/components/icon-button/icon-button.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\nimport type { IconButtonProps } from \"./icon-button.types\";\nimport { Button } from \"@/components\";\n\n/**\n * # IconButton\n *\n * displays a button with an icon only as child\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/iconbutton}\n */\nexport const IconButton = (props: IconButtonProps) => {\n  const { children, ref: forwardedRef, ...restProps } = props;\n\n  // Create a local ref and merge with forwarded ref\n  const localRef = useRef<HTMLButtonElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n  return (\n    <Button px={0} py={0} {...restProps} ref={ref}>\n      {children}\n    </Button>\n  );\n};\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","props","children","forwardedRef","restProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","Button"],"mappings":"qLAaaA,EAAcC,GAA2B,CACpD,KAAM,CAAE,SAAAC,EAAU,IAAKC,EAAc,GAAGC,GAAcH,EAGhDI,EAAWC,EAAAA,OAA0B,IAAI,EACzCC,EAAMC,EAAAA,0CAAaC,EAAAA,UAAUJ,EAAUF,CAAY,CAAC,EAE1D,OACEO,MAACC,EAAAA,QAAO,GAAI,EAAG,GAAI,EAAI,GAAGP,EAAW,IAAAG,EAClC,SAAAL,CAAA,CACH,CAEJ,EAEAF,EAAW,YAAc"}

package/dist/chunks/{icon-button-g4dZUH5O.es.js → icon-button-CKfDmEjG.es.js}

@@ -2,7 +2,7 @@ import { jsx as m } from "react/jsx-runtime";
 import { useRef as n } from "react";
 import { mergeRefs as p } from "@chakra-ui/react";
 import { $ as a } from "./useObjectRef-CaJ5pgjX.es.js";
-import { B as c } from "./button-Ccof5UcQ.es.js";
+import { B as c } from "./button-Do9q1MTT.es.js";
 const i = (o) => {
   const { children: r, ref: t, ...e } = o, f = n(null), s = a(p(f, t));
   return /* @__PURE__ */ m(c, { px: 0, py: 0, ...e, ref: s, children: r });
@@ -11,4 +11,4 @@ i.displayName = "IconButton";
 export {
   i as I
 };
-//# sourceMappingURL=icon-button-g4dZUH5O.es.js.map
+//# sourceMappingURL=icon-button-CKfDmEjG.es.js.map

package/dist/chunks/{icon-button-g4dZUH5O.es.js.map → icon-button-CKfDmEjG.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icon-button-g4dZUH5O.es.js","sources":["../../src/components/icon-button/icon-button.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\nimport type { IconButtonProps } from \"./icon-button.types\";\nimport { Button } from \"@/components\";\n\n/**\n * # IconButton\n *\n * displays a button with an icon only as child\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/iconbutton}\n */\nexport const IconButton = (props: IconButtonProps) => {\n  const { children, ref: forwardedRef, ...restProps } = props;\n\n  // Create a local ref and merge with forwarded ref\n  const localRef = useRef<HTMLButtonElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n  return (\n    <Button px={0} py={0} {...restProps} ref={ref}>\n      {children}\n    </Button>\n  );\n};\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","props","children","forwardedRef","restProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","Button"],"mappings":";;;;;AAaO,MAAMA,IAAa,CAACC,MAA2B;AACpD,QAAM,EAAE,UAAAC,GAAU,KAAKC,GAAc,GAAGC,MAAcH,GAGhDI,IAAWC,EAA0B,IAAI,GACzCC,IAAMC,EAAaC,EAAUJ,GAAUF,CAAY,CAAC;AAE1D,SACE,gBAAAO,EAACC,KAAO,IAAI,GAAG,IAAI,GAAI,GAAGP,GAAW,KAAAG,GAClC,UAAAL,EAAA,CACH;AAEJ;AAEAF,EAAW,cAAc;"}
+{"version":3,"file":"icon-button-CKfDmEjG.es.js","sources":["../../src/components/icon-button/icon-button.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs } from \"@chakra-ui/react\";\nimport type { IconButtonProps } from \"./icon-button.types\";\nimport { Button } from \"@/components\";\n\n/**\n * # IconButton\n *\n * displays a button with an icon only as child\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/inputs/iconbutton}\n */\nexport const IconButton = (props: IconButtonProps) => {\n  const { children, ref: forwardedRef, ...restProps } = props;\n\n  // Create a local ref and merge with forwarded ref\n  const localRef = useRef<HTMLButtonElement>(null);\n  const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n  return (\n    <Button px={0} py={0} {...restProps} ref={ref}>\n      {children}\n    </Button>\n  );\n};\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","props","children","forwardedRef","restProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","Button"],"mappings":";;;;;AAaO,MAAMA,IAAa,CAACC,MAA2B;AACpD,QAAM,EAAE,UAAAC,GAAU,KAAKC,GAAc,GAAGC,MAAcH,GAGhDI,IAAWC,EAA0B,IAAI,GACzCC,IAAMC,EAAaC,EAAUJ,GAAUF,CAAY,CAAC;AAE1D,SACE,gBAAAO,EAACC,KAAO,IAAI,GAAG,IAAI,GAAI,GAAGP,GAAW,KAAAG,GAClC,UAAAL,EAAA,CACH;AAEJ;AAEAF,EAAW,cAAc;"}

package/dist/chunks/{icon-toggle-button-DPOco2hU.cjs.js → icon-toggle-button-CpvcaoHY.cjs.js}

@@ -1,2 +1,2 @@
-"use strict";const l=require("react/jsx-runtime"),u=require("./toggle-button-jNsiq27z.cjs.js"),t=({"aria-label":o,children:e,ref:n,...g})=>l.jsx(u.ToggleButton,{ref:n,"aria-label":o,px:0,py:0,...g,children:e});t.displayName="IconToggleButton";exports.IconToggleButton=t;
-//# sourceMappingURL=icon-toggle-button-DPOco2hU.cjs.js.map
+"use strict";const l=require("react/jsx-runtime"),u=require("./toggle-button-gBCYH8cY.cjs.js"),t=({"aria-label":o,children:e,ref:n,...g})=>l.jsx(u.ToggleButton,{ref:n,"aria-label":o,px:0,py:0,...g,children:e});t.displayName="IconToggleButton";exports.IconToggleButton=t;
+//# sourceMappingURL=icon-toggle-button-CpvcaoHY.cjs.js.map

package/dist/chunks/{icon-toggle-button-DPOco2hU.cjs.js.map → icon-toggle-button-CpvcaoHY.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icon-toggle-button-DPOco2hU.cjs.js","sources":["../../src/components/icon-toggle-button/icon-toggle-button.tsx"],"sourcesContent":["import { ToggleButton } from \"@/components/toggle-button\";\nimport type { IconToggleButtonProps } from \"./icon-toggle-button.types\";\n\n/**\n * # IconToggleButton\n * ============================================================\n * A toggle button with only an icon as child. It is based\n * on the regular `ToggleButton` component, but with a few adjustments.\n *\n */\nexport const IconToggleButton = ({\n  \"aria-label\": ariaLabel,\n  children,\n  ref,\n  ...props\n}: IconToggleButtonProps) => {\n  return (\n    <ToggleButton ref={ref} aria-label={ariaLabel} px={0} py={0} {...props}>\n      {children}\n    </ToggleButton>\n  );\n};\n\nIconToggleButton.displayName = \"IconToggleButton\";\n"],"names":["IconToggleButton","ariaLabel","children","ref","props","jsx","ToggleButton"],"mappings":"+FAUaA,EAAmB,CAAC,CAC/B,aAAcC,EACd,SAAAC,EACA,IAAAC,EACA,GAAGC,CACL,IAEIC,EAAAA,IAACC,EAAAA,aAAA,CAAa,IAAAH,EAAU,aAAYF,EAAW,GAAI,EAAG,GAAI,EAAI,GAAGG,EAC9D,SAAAF,CAAA,CACH,EAIJF,EAAiB,YAAc"}
+{"version":3,"file":"icon-toggle-button-CpvcaoHY.cjs.js","sources":["../../src/components/icon-toggle-button/icon-toggle-button.tsx"],"sourcesContent":["import { ToggleButton } from \"@/components/toggle-button\";\nimport type { IconToggleButtonProps } from \"./icon-toggle-button.types\";\n\n/**\n * # IconToggleButton\n * ============================================================\n * A toggle button with only an icon as child. It is based\n * on the regular `ToggleButton` component, but with a few adjustments.\n *\n */\nexport const IconToggleButton = ({\n  \"aria-label\": ariaLabel,\n  children,\n  ref,\n  ...props\n}: IconToggleButtonProps) => {\n  return (\n    <ToggleButton ref={ref} aria-label={ariaLabel} px={0} py={0} {...props}>\n      {children}\n    </ToggleButton>\n  );\n};\n\nIconToggleButton.displayName = \"IconToggleButton\";\n"],"names":["IconToggleButton","ariaLabel","children","ref","props","jsx","ToggleButton"],"mappings":"+FAUaA,EAAmB,CAAC,CAC/B,aAAcC,EACd,SAAAC,EACA,IAAAC,EACA,GAAGC,CACL,IAEIC,EAAAA,IAACC,EAAAA,aAAA,CAAa,IAAAH,EAAU,aAAYF,EAAW,GAAI,EAAG,GAAI,EAAI,GAAGG,EAC9D,SAAAF,CAAA,CACH,EAIJF,EAAiB,YAAc"}

package/dist/chunks/{icon-toggle-button-DBGgxBWR.es.js → icon-toggle-button-_8HGkSiT.es.js}

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import { T as l } from "./toggle-button-D1v2OtiG.es.js";
+import { T as l } from "./toggle-button-B7pXF-Kq.es.js";
 const n = ({
   "aria-label": o,
   children: t,
@@ -10,4 +10,4 @@ n.displayName = "IconToggleButton";
 export {
   n as I
 };
-//# sourceMappingURL=icon-toggle-button-DBGgxBWR.es.js.map
+//# sourceMappingURL=icon-toggle-button-_8HGkSiT.es.js.map

package/dist/chunks/{icon-toggle-button-DBGgxBWR.es.js.map → icon-toggle-button-_8HGkSiT.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"icon-toggle-button-DBGgxBWR.es.js","sources":["../../src/components/icon-toggle-button/icon-toggle-button.tsx"],"sourcesContent":["import { ToggleButton } from \"@/components/toggle-button\";\nimport type { IconToggleButtonProps } from \"./icon-toggle-button.types\";\n\n/**\n * # IconToggleButton\n * ============================================================\n * A toggle button with only an icon as child. It is based\n * on the regular `ToggleButton` component, but with a few adjustments.\n *\n */\nexport const IconToggleButton = ({\n  \"aria-label\": ariaLabel,\n  children,\n  ref,\n  ...props\n}: IconToggleButtonProps) => {\n  return (\n    <ToggleButton ref={ref} aria-label={ariaLabel} px={0} py={0} {...props}>\n      {children}\n    </ToggleButton>\n  );\n};\n\nIconToggleButton.displayName = \"IconToggleButton\";\n"],"names":["IconToggleButton","ariaLabel","children","ref","props","jsx","ToggleButton"],"mappings":";;AAUO,MAAMA,IAAmB,CAAC;AAAA,EAC/B,cAAcC;AAAA,EACd,UAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAACC,GAAA,EAAa,KAAAH,GAAU,cAAYF,GAAW,IAAI,GAAG,IAAI,GAAI,GAAGG,GAC9D,UAAAF,EAAA,CACH;AAIJF,EAAiB,cAAc;"}
+{"version":3,"file":"icon-toggle-button-_8HGkSiT.es.js","sources":["../../src/components/icon-toggle-button/icon-toggle-button.tsx"],"sourcesContent":["import { ToggleButton } from \"@/components/toggle-button\";\nimport type { IconToggleButtonProps } from \"./icon-toggle-button.types\";\n\n/**\n * # IconToggleButton\n * ============================================================\n * A toggle button with only an icon as child. It is based\n * on the regular `ToggleButton` component, but with a few adjustments.\n *\n */\nexport const IconToggleButton = ({\n  \"aria-label\": ariaLabel,\n  children,\n  ref,\n  ...props\n}: IconToggleButtonProps) => {\n  return (\n    <ToggleButton ref={ref} aria-label={ariaLabel} px={0} py={0} {...props}>\n      {children}\n    </ToggleButton>\n  );\n};\n\nIconToggleButton.displayName = \"IconToggleButton\";\n"],"names":["IconToggleButton","ariaLabel","children","ref","props","jsx","ToggleButton"],"mappings":";;AAUO,MAAMA,IAAmB,CAAC;AAAA,EAC/B,cAAcC;AAAA,EACd,UAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC,EAACC,GAAA,EAAa,KAAAH,GAAU,cAAYF,GAAW,IAAI,GAAG,IAAI,GAAI,GAAGG,GAC9D,UAAAF,EAAA,CACH;AAIJF,EAAiB,cAAc;"}

package/dist/chunks/{index-CaeeOiBp.es.js → index-DlmEj62V.es.js}

@@ -59,7 +59,7 @@ function W(i) {
     i[r]?.value ? n[r] = i[r].value : n[r] = i[r];
   return n;
 }
-const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
+const _ = /* @__PURE__ */ W(t.breakpoints), H = /* @__PURE__ */ f({
   /**
    * Maps to React Aria's open state data attributes
    * Used for animations when a component is opening/entering
@@ -70,7 +70,7 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
    * Used for animations when a component is closing/exiting
    */
   closed: "&:is([data-exiting], [data-closed])"
-}), H = /* @__PURE__ */ h({
+}), N = /* @__PURE__ */ h({
   "*": {
     fontFeatureSettings: '"liga", "calt", "case", "ss01", "ss07", "ss08", "tnum"',
     /**
@@ -3918,6 +3918,8 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
     editable: {
       padding: "400",
       minHeight: "inherit",
+      maxHeight: "inherit",
+      overflow: "auto",
       outline: "none",
       color: "colorPalette.12",
       // Disabled state styling for editable
@@ -5000,7 +5002,7 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
     variant: "line",
     size: "md"
   }
-}), Ne = /* @__PURE__ */ e({
+}), He = /* @__PURE__ */ e({
   slots: ["root", "list", "tab", "panels", "panel", "trigger"],
   className: "nimbus-tabs",
   base: {
@@ -5183,7 +5185,7 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
     placement: "start",
     size: "md"
   }
-}), He = /* @__PURE__ */ e({
+}), Ne = /* @__PURE__ */ e({
   slots: ["root", "tagList", "tag"],
   // Unique class name prefix for the component
   className: "nimbus-tag-group",
@@ -5438,7 +5440,7 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
   textInput: Re,
   splitButton: Ie,
   drawer: le,
-  tabs: Ne,
+  tabs: He,
   localizedField: be,
   card: ee,
   checkbox: c,
@@ -5457,7 +5459,7 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
   select: l,
   switch: We,
   table: _e,
-  taggroup: He,
+  taggroup: Ne,
   timeInput: Be,
   toggleButtonGroup: I
 }, Te = /* @__PURE__ */ v(
@@ -5610,8 +5612,8 @@ const _ = /* @__PURE__ */ W(t.breakpoints), N = /* @__PURE__ */ f({
   preflight: !0,
   cssVarsPrefix: "nimbus",
   cssVarsRoot: ":where(:root, :host)",
-  globalCss: H,
-  conditions: N,
+  globalCss: N,
+  conditions: H,
   theme: {
     breakpoints: _,
     keyframes: B,
@@ -5647,4 +5649,4 @@ export {
   Be as t,
   te as u
 };
-//# sourceMappingURL=index-CaeeOiBp.es.js.map
+//# sourceMappingURL=index-DlmEj62V.es.js.map