@launchpad-ui/form 0.8.18 → 0.9.0

package/dist/IconField.d.ts

@@ -1,7 +1,7 @@
 import type { IconProps } from '@launchpad-ui/icons';
-import type { ComponentProps } from 'react';
+import type { ComponentProps, ReactElement } from 'react';
 type IconFieldProps = ComponentProps<'div'> & {
-    icon(args: IconProps): JSX.Element;
+    icon: ReactElement<IconProps>;
     children: JSX.Element | JSX.Element[];
     'data-test-id'?: string;
 };

package/dist/IconField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconField.d.ts","sourceRoot":"","sources":["../src/IconField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAM5C,KAAK,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC5C,IAAI,CAAC,IAAI,EAAE,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC;IACnC,QAAQ,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,SAAS,mEAMZ,cAAc,4CAWhB,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC;AACrB,YAAY,EAAE,cAAc,EAAE,CAAC"}
+{"version":3,"file":"IconField.d.ts","sourceRoot":"","sources":["../src/IconField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAO1D,KAAK,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC5C,IAAI,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAC9B,QAAQ,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,QAAA,MAAM,SAAS,mEAMZ,cAAc,4CAWhB,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC;AACrB,YAAY,EAAE,cAAc,EAAE,CAAC"}

package/dist/index.es.js

@@ -1,42 +1,42 @@
 import './style.css';
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { forwardRef, useRef, useMemo, useState, Children, isValidElement, cloneElement } from "react";
+import { forwardRef, useRef, useMemo, useState, cloneElement, Children, isValidElement } from "react";
 import { cx } from "classix";
-import { AlertRhombus, ExpandLess, ExpandMore } from "@launchpad-ui/icons";
+import { Icon } from "@launchpad-ui/icons";
 import { VisuallyHidden } from "@react-aria/visually-hidden";
 import { useButton } from "@react-aria/button";
 import { useLocale } from "@react-aria/i18n";
 import { useNumberField as useNumberField$1 } from "@react-aria/numberfield";
 import { useNumberFieldState } from "@react-stately/numberfield";
-const formGroup = "_formGroup_1u9hb_10";
-const formIncreasedErrorMargin = "_formIncreasedErrorMargin_1u9hb_18";
-const formInline = "_formInline_1u9hb_22";
-const form = "_form_1u9hb_10";
-const formInput = "_formInput_1u9hb_36";
-const isFocused = "_isFocused_1u9hb_56";
-const iconField = "_iconField_1u9hb_73";
-const suffixContainer = "_suffixContainer_1u9hb_77";
-const isInvalid = "_isInvalid_1u9hb_82";
-const inlineForm = "_inlineForm_1u9hb_93";
-const label = "_label_1u9hb_98";
-const labelDisabled = "_labelDisabled_1u9hb_104";
-const labelOptional = "_labelOptional_1u9hb_108";
-const compactTextField = "_compactTextField_1u9hb_114";
-const fieldError = "_fieldError_1u9hb_138";
-const hint = "_hint_1u9hb_184";
-const field = "_field_1u9hb_138";
-const fieldErrorMessage = "_fieldErrorMessage_1u9hb_204";
-const isDisabled = "_isDisabled_1u9hb_217";
-const checkbox = "_checkbox_1u9hb_284";
-const radio = "_radio_1u9hb_291";
-const number = "_number_1u9hb_295";
-const suffix = "_suffix_1u9hb_77";
-const iconFieldIcon = "_iconFieldIcon_1u9hb_333";
-const formInputTiny = "_formInputTiny_1u9hb_341";
-const requiredAsterisk = "_requiredAsterisk_1u9hb_350";
-const fieldSet = "_fieldSet_1u9hb_354";
-const isActive = "_isActive_1u9hb_365";
-const numberField = "_numberField_1u9hb_372";
+const formGroup = "_formGroup_19syx_10";
+const formIncreasedErrorMargin = "_formIncreasedErrorMargin_19syx_18";
+const formInline = "_formInline_19syx_22";
+const form = "_form_19syx_10";
+const formInput = "_formInput_19syx_36";
+const isFocused = "_isFocused_19syx_56";
+const iconField = "_iconField_19syx_75";
+const suffixContainer = "_suffixContainer_19syx_79";
+const isInvalid = "_isInvalid_19syx_84";
+const inlineForm = "_inlineForm_19syx_95";
+const label = "_label_19syx_100";
+const labelDisabled = "_labelDisabled_19syx_106";
+const labelOptional = "_labelOptional_19syx_110";
+const compactTextField = "_compactTextField_19syx_116";
+const fieldError = "_fieldError_19syx_140";
+const hint = "_hint_19syx_186";
+const field = "_field_19syx_140";
+const fieldErrorMessage = "_fieldErrorMessage_19syx_206";
+const isDisabled = "_isDisabled_19syx_219";
+const checkbox = "_checkbox_19syx_286";
+const radio = "_radio_19syx_293";
+const number = "_number_19syx_297";
+const suffix = "_suffix_19syx_79";
+const iconFieldIcon = "_iconFieldIcon_19syx_335";
+const formInputTiny = "_formInputTiny_19syx_343";
+const requiredAsterisk = "_requiredAsterisk_19syx_352";
+const fieldSet = "_fieldSet_19syx_356";
+const isActive = "_isActive_19syx_367";
+const numberField = "_numberField_19syx_374";
 const styles = {
   formGroup,
   formIncreasedErrorMargin,
@@ -67,9 +67,9 @@ const styles = {
   fieldSet,
   isActive,
   numberField,
-  "numberField-input": "_numberField-input_1u9hb_376",
-  "numberField-stepperContainer": "_numberField-stepperContainer_1u9hb_380",
-  "numberField-stepper": "_numberField-stepper_1u9hb_380"
+  "numberField-input": "_numberField-input_19syx_378",
+  "numberField-stepperContainer": "_numberField-stepperContainer_19syx_382",
+  "numberField-stepper": "_numberField-stepper_19syx_382"
 };
 const RequiredAsterisk = ({
   className,
@@ -273,7 +273,7 @@ const FieldError = ({
       "aria-label": "Error",
       id: createFieldErrorId(name),
       children: [
-        /* @__PURE__ */ jsx(AlertRhombus, { size: "small" }),
+        /* @__PURE__ */ jsx(Icon, { name: "alert-rhombus", size: "small" }),
         " ",
         errorMessage
       ]
@@ -385,11 +385,11 @@ const IconField = ({
   "data-test-id": testId = "icon-field",
   ...rest
 }) => {
-  const Icon = icon;
+  const renderIcon = cloneElement(icon, { size: "small", className: styles.iconFieldIcon });
   const classes = cx(styles.iconField, className);
   return /* @__PURE__ */ jsxs("div", { className: classes, "data-test-id": testId, ...rest, children: [
     children,
-    /* @__PURE__ */ jsx(Icon, { size: "small", className: styles.iconFieldIcon })
+    renderIcon
   ] });
 };
 const Radio = ({
@@ -558,8 +558,8 @@ const useNumberField = ({
         }
       ),
       /* @__PURE__ */ jsxs("div", { className: styles["numberField-stepperContainer"], children: [
-        /* @__PURE__ */ jsx(Stepper, { ...incrementButtonProps, children: /* @__PURE__ */ jsx(ExpandLess, {}) }),
-        /* @__PURE__ */ jsx(Stepper, { ...decrementButtonProps, children: /* @__PURE__ */ jsx(ExpandMore, {}) })
+        /* @__PURE__ */ jsx(Stepper, { ...incrementButtonProps, children: /* @__PURE__ */ jsx(Icon, { name: "expand-less" }) }),
+        /* @__PURE__ */ jsx(Stepper, { ...decrementButtonProps, children: /* @__PURE__ */ jsx(Icon, { name: "expand-more" }) })
       ] })
     ] })
   };

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../src/RequiredAsterisk.tsx","../src/Label.tsx","../src/Checkbox.tsx","../src/utils/index.ts","../src/TextField.tsx","../src/CompactTextField.tsx","../src/FieldError.tsx","../src/FieldSet.tsx","../src/Form.tsx","../src/FormGroup.tsx","../src/FormHint.tsx","../src/FormField.tsx","../src/IconField.tsx","../src/Radio.tsx","../src/RadioGroup.tsx","../src/SelectField.tsx","../src/TextArea.tsx","../src/useNumberField.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype RequiredAsteriskProps = ComponentProps<'span'> & {\n  'data-test-id'?: string;\n};\n\nconst RequiredAsterisk = ({\n  className,\n  'data-test-id': testId = 'required-asterisk',\n  ...rest\n}: RequiredAsteriskProps) => {\n  const classes = cx(styles.requiredAsterisk, className);\n\n  return (\n    <span {...rest} data-test-id={testId} className={classes}>\n      *\n    </span>\n  );\n};\n\nexport { RequiredAsterisk };\nexport type { RequiredAsteriskProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { RequiredAsterisk } from './RequiredAsterisk';\nimport styles from './styles/Form.module.css';\n\ntype LabelProps = ComponentProps<'label'> & {\n  required?: boolean;\n  optional?: boolean;\n  disabled?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Label = ({\n  disabled,\n  className,\n  children,\n  required = false,\n  optional = false,\n  'data-test-id': testId = 'label',\n  ...rest\n}: LabelProps) => {\n  const classes = cx(styles.label, className, disabled && styles.labelDisabled);\n\n  return (\n    <label {...rest} data-test-id={testId} className={classes}>\n      {children}\n      {optional && !required && <small className={styles.labelOptional}>(optional)</small>}\n      {required && !optional && <RequiredAsterisk />}\n    </label>\n  );\n};\n\nexport { Label };\nexport type { LabelProps };\n","import type { ComponentProps } from 'react';\n\nimport { forwardRef } from 'react';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype CheckboxProps = ComponentProps<'input'> & {\n  /**\n   * The className to pass into the Checkbox's Label component\n   */\n  labelClassName?: string;\n  'data-test-id'?: string;\n};\n\nconst Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      children,\n      disabled,\n      checked,\n      labelClassName,\n      'data-test-id': testId = 'checkbox',\n      ...rest\n    },\n    ref\n  ) => {\n    const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n    if (!children && !hasAriaLabel) {\n      console.warn(\n        'If you do not provide children, you must specify an aria-label for accessibility'\n      );\n    }\n\n    return (\n      <Label className={labelClassName}>\n        <input\n          {...rest}\n          ref={ref}\n          checked={checked}\n          aria-checked={checked ? 'true' : 'false'}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={styles.checkbox}\n          disabled={disabled}\n          type=\"checkbox\"\n          data-test-id={testId}\n        />{' '}\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport { Checkbox };\nexport type { CheckboxProps };\n","import { useMemo, useRef } from 'react';\n\ntype FieldPath = string | string[];\n\nconst createFieldErrorId = (fieldIdentifier?: FieldPath) =>\n  fieldIdentifier ? `${[...fieldIdentifier].join('')}-err` : undefined;\n\nfunction hasObjectChanged<T extends object>(obj1: T, obj2: T): boolean {\n  return (\n    Object.keys(obj1).length !== Object.keys(obj2).length ||\n    Object.keys(obj1).some((k) => {\n      const key = k as keyof T;\n      return typeof obj1[key] === 'object' && typeof obj2[key] === 'object'\n        ? hasObjectChanged(obj1[key] as T, obj2[key] as T)\n        : obj1[key] !== obj2[key];\n    })\n  );\n}\n\nfunction useObjectMemo<T extends object>(obj: T) {\n  const objRef = useRef(obj);\n\n  return useMemo(() => {\n    if (hasObjectChanged(obj, objRef.current)) {\n      objRef.current = obj;\n    }\n\n    return objRef.current;\n  }, [obj]);\n}\n\nexport { createFieldErrorId, useObjectMemo };\nexport type { FieldPath };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextFieldProps = ComponentProps<'input'> & {\n  suffix?: string;\n  tiny?: boolean;\n  overrideWidth?: string;\n  'data-test-id'?: string;\n};\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      className,\n      type = 'text',\n      tiny = false,\n      readOnly,\n      tabIndex = 0,\n      suffix,\n      overrideWidth,\n      'data-test-id': testId = 'text-field',\n      autoComplete,\n      ...rest\n    },\n    ref\n  ) => {\n    const classes = overrideWidth\n      ? className\n      : cx(styles.formInput, tiny && styles.formInputTiny, className);\n\n    const disablePasswordManagers = autoComplete === 'off';\n\n    if (suffix) {\n      return (\n        <div className={styles.suffixContainer}>\n          <input\n            {...rest}\n            type={type}\n            data-test-id={testId}\n            autoComplete={autoComplete}\n            className={classes}\n            readOnly={readOnly}\n            ref={ref}\n            aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n          />\n          <label className={styles.suffix} htmlFor={rest.id}>\n            {suffix}\n          </label>\n        </div>\n      );\n    }\n\n    return (\n      <input\n        {...rest}\n        data-1p-ignore={disablePasswordManagers} // \"data-1p-ignore\" is added to prevent 1Password from injecting a password autofill icon\n        type={type}\n        className={classes}\n        readOnly={readOnly}\n        tabIndex={tabIndex}\n        autoComplete={autoComplete}\n        ref={ref}\n        data-test-id={testId}\n        style={\n          overrideWidth\n            ? {\n                width: overrideWidth,\n              }\n            : undefined\n        }\n        aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n      />\n    );\n  }\n);\n\nTextField.displayName = 'TextField';\n\nexport { TextField };\nexport type { TextFieldProps };\n","import type { TextFieldProps } from './TextField';\nimport type { FocusEvent } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef, useState } from 'react';\n\nimport { Label } from './Label';\nimport { TextField } from './TextField';\nimport styles from './styles/Form.module.css';\n\ntype CompactTextFieldProps = TextFieldProps & {\n  label: string;\n  needsErrorFeedback?: boolean;\n};\n\nconst CompactTextField = forwardRef<HTMLInputElement, CompactTextFieldProps>(\n  (\n    {\n      className,\n      id,\n      label,\n      needsErrorFeedback,\n      value,\n      onFocus,\n      onBlur,\n      'data-test-id': testId = 'compact-text-field',\n      ...rest\n    },\n    ref\n  ) => {\n    const [isActive, setIsActive] = useState(\n      (typeof value === 'boolean' || value ? value.toString() : '').trim().length !== 0\n    );\n\n    const isActiveState = isActive || needsErrorFeedback;\n\n    const classes = cx(styles.compactTextField, className, isActiveState && styles.isActive);\n\n    const placeholder = isActiveState ? '' : label;\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      setIsActive(true);\n      if (onFocus) {\n        onFocus(event);\n      }\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      const value = event.target.value || '';\n      setIsActive(value.trim().length !== 0);\n      if (onBlur) {\n        onBlur(event);\n      }\n    };\n\n    return (\n      <div className={classes} data-test-id={testId}>\n        <Label htmlFor={id}>{label}</Label>\n        <TextField\n          {...rest}\n          id={id}\n          placeholder={placeholder}\n          value={value}\n          ref={ref}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n        />\n      </div>\n    );\n  }\n);\n\nCompactTextField.displayName = 'CompactTextField';\n\nexport { CompactTextField };\nexport type { CompactTextFieldProps };\n","import type { FieldPath } from './utils';\nimport type { ComponentProps } from 'react';\n\nimport { AlertRhombus } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype FieldErrorProps = ComponentProps<'span'> & {\n  name: FieldPath;\n  errorMessage?: string;\n  'data-test-id'?: string;\n};\n\nconst FieldError = ({\n  name,\n  errorMessage,\n  className,\n  'data-test-id': testId = 'field-error',\n  ...rest\n}: FieldErrorProps) => {\n  if (!errorMessage) {\n    return null;\n  }\n\n  return (\n    <span\n      {...rest}\n      className={cx(styles.fieldError, className)}\n      aria-live=\"polite\"\n      data-test-id={testId}\n      aria-label=\"Error\"\n      id={createFieldErrorId(name)}\n    >\n      <AlertRhombus size=\"small\" /> {errorMessage}\n    </span>\n  );\n};\n\nexport { FieldError };\nexport type { FieldErrorProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FieldSetProps = ComponentProps<'fieldset'> & {\n  'data-test-id'?: string;\n};\n\nconst FieldSet = ({\n  children,\n  className,\n  'data-test-id': testId = 'field-set',\n  ...rest\n}: FieldSetProps) => {\n  const classes = cx(styles.fieldSet, className);\n\n  return (\n    <fieldset data-test-id={testId} className={classes} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FieldSet };\nexport type { FieldSetProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormProps = ComponentProps<'form'> & {\n  inline?: boolean;\n  // Increases margin between form fields to make room for error messages.\n  // This prevents the form from shifting when rendering a field error.\n  // This may be desired when the form contains external links that will\n  // shift while clicking if the form shifts from validation.\n  hasIncreasedErrorMargin?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Form = (props: FormProps) => {\n  const {\n    className,\n    inline,\n    children,\n    hasIncreasedErrorMargin,\n    'data-test-id': testId = 'form',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.form,\n    className,\n    inline && styles.formInline,\n    !!hasIncreasedErrorMargin && styles.formIncreasedErrorMargin\n  );\n\n  return (\n    <form {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </form>\n  );\n};\n\nexport { Form };\nexport type { FormProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormGroupProps = ComponentProps<'fieldset'> & {\n  name?: string | string[];\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  'data-test-id'?: string;\n};\n\nconst FormGroup = (props: FormGroupProps) => {\n  const {\n    className,\n    name,\n    ignoreValidation,\n    isInvalid,\n    children,\n    'data-test-id': testId = 'form-group',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.formGroup,\n    className,\n    !ignoreValidation && isInvalid && styles.isInvalid\n  );\n\n  return (\n    <fieldset className={classes} data-test-id={testId} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FormGroup };\nexport type { FormGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormHintProps = ComponentProps<'div'> & {\n  'data-test-id'?: string;\n};\n\nconst FormHint = ({\n  className,\n  children,\n  'data-test-id': testId = 'form-hint',\n  ...rest\n}: FormHintProps) => {\n  const classes = cx(styles.hint, className);\n\n  return (\n    <div {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </div>\n  );\n};\n\nexport { FormHint };\nexport type { FormHintProps };\n","import type { FieldErrorProps } from './FieldError';\nimport type { FormHintProps } from './FormHint';\nimport type { LabelProps } from './Label';\n\nimport { cx } from 'classix';\n\nimport { FieldError } from './FieldError';\nimport { FormGroup } from './FormGroup';\nimport { FormHint } from './FormHint';\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype FormFieldProps = {\n  isRequired: boolean;\n  label?: string;\n  name: string;\n  htmlFor: string;\n  hint?: string;\n  errorMessage?: string;\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  children: JSX.Element;\n  className?: string;\n  onBlur?: (field: string) => void;\n  'data-test-id'?: string;\n  LabelProps?: Partial<LabelProps>;\n  FormHintProps?: Partial<FormHintProps>;\n  FieldErrorProps?: Partial<FieldErrorProps>;\n};\n\nconst FormField = ({\n  isRequired,\n  label,\n  name,\n  htmlFor,\n  hint,\n  errorMessage,\n  ignoreValidation,\n  isInvalid,\n  children,\n  className,\n  onBlur,\n  'data-test-id': testId = 'form-field',\n  LabelProps = {},\n  FormHintProps = {},\n  FieldErrorProps = {},\n}: FormFieldProps) => {\n  const handleBlur = () => {\n    onBlur && onBlur(name);\n  };\n\n  return (\n    <FormGroup\n      className={cx(styles.field, className)}\n      name={name}\n      ignoreValidation={ignoreValidation}\n      isInvalid={isInvalid}\n      onBlur={handleBlur}\n      data-test-id={testId}\n    >\n      {label && (\n        <Label htmlFor={htmlFor} required={isRequired} {...LabelProps}>\n          {label}\n        </Label>\n      )}\n      {hint && (\n        <FormHint className={styles.hint} {...FormHintProps}>\n          {hint}\n        </FormHint>\n      )}\n      {children}\n      <FieldError\n        className={styles.fieldErrorMessage}\n        name={name}\n        errorMessage={errorMessage}\n        {...FieldErrorProps}\n      />\n    </FormGroup>\n  );\n};\n\nexport type { FormFieldProps };\nexport { FormField };\n","import type { IconProps } from '@launchpad-ui/icons';\nimport type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype IconFieldProps = ComponentProps<'div'> & {\n  icon(args: IconProps): JSX.Element;\n  children: JSX.Element | JSX.Element[];\n  'data-test-id'?: string;\n};\n\nconst IconField = ({\n  icon,\n  children,\n  className,\n  'data-test-id': testId = 'icon-field',\n  ...rest\n}: IconFieldProps) => {\n  const Icon = icon;\n\n  const classes = cx(styles.iconField, className);\n\n  return (\n    <div className={classes} data-test-id={testId} {...rest}>\n      {children}\n      <Icon size=\"small\" className={styles.iconFieldIcon} />\n    </div>\n  );\n};\n\nexport { IconField };\nexport type { IconFieldProps };\n","import type { CSSProperties, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype RadioProps = Omit<ComponentProps<'input'>, 'type'> & {\n  labelClassName?: string;\n  labelStyle?: CSSProperties;\n  'data-test-id'?: string;\n};\n\nconst Radio = ({\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  checked = false,\n  children,\n  className,\n  disabled = false,\n  id,\n  labelClassName,\n  labelStyle,\n  'data-test-id': testId = 'radio',\n  ...rest\n}: RadioProps) => {\n  const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n\n  if (!children && !hasAriaLabel) {\n    console.warn(\n      'If you do not provide children, you must specify an aria-label for accessibility'\n    );\n  }\n\n  return (\n    <>\n      <input\n        {...rest}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        className={cx(styles.radio, className)}\n        checked={checked}\n        disabled={disabled}\n        id={id}\n        data-test-id={testId}\n        type=\"radio\"\n      />\n      <Label className={labelClassName} htmlFor={id} style={labelStyle}>\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    </>\n  );\n};\n\nexport { Radio };\nexport type { RadioProps };\n","import type { ChangeEvent, FormEvent, ReactElement, ReactNode } from 'react';\n\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { Children, cloneElement, isValidElement, useRef } from 'react';\n\nimport { Label } from './Label';\nimport { Radio } from './Radio';\n\ntype RadioGroupProps = {\n  /**\n   * The legend that describes this groups of radio buttons. The legend\n   * is important for screen reader users.\n   */\n  legend?: string;\n  /**\n   * The children passed into the RadioGroup.\n   */\n  children?: ReactNode;\n  /**\n   * Custom classname(s) passed to the fieldset inner div.\n   */\n  className?: string;\n  /**\n   * Set the underlying Radio to disabled if the Radio's disabled prop is undefined.\n   */\n  disabled?: boolean;\n  /**\n   * The RadioGroup's id.\n   */\n  id?: string;\n  /**\n   * Name to apply to the underlying Radio. The same name value is passed to each Radio when grouping in a RadioGroup for screen reader support.\n   */\n  name: string;\n  /**\n   * This function is passed into each Radio onChange synthetic event handler.\n   */\n  onChange?(e: ChangeEvent | FormEvent<HTMLInputElement>): void;\n  /**\n   * The value to compare against the Radio's value to determine if the Radio will be checked.\n   */\n  value: string;\n\n  'data-test-id'?: string;\n};\n\nconst RadioGroup = (props: RadioGroupProps) => {\n  const {\n    name,\n    value,\n    onChange,\n    children,\n    disabled,\n    legend,\n    'data-test-id': testId = 'radio-group',\n    ...rest\n  } = props;\n  const fieldsetRef = useRef<HTMLFieldSetElement>(null);\n\n  function updateRadioElems(elem: ReactNode): ReactNode {\n    if (!isValidElement(elem)) {\n      return elem;\n    }\n\n    const item = elem as ReactElement;\n\n    if (item?.type && item.type === Radio) {\n      return cloneElement(item, {\n        ...item.props,\n        name,\n        checked: item.props.value === value,\n        onChange,\n        disabled: typeof item.props?.disabled !== 'undefined' ? item.props.disabled : disabled,\n      });\n    }\n\n    if (item?.type && item.type === Label) {\n      return cloneElement(item, {\n        ...item.props,\n        onChange,\n        disabled,\n      });\n    }\n\n    const elemChildren = item?.props?.children;\n    if (elemChildren) {\n      if (Array.isArray(elemChildren)) {\n        return cloneElement(item, {\n          children: Children.map(elemChildren, (elemChild) => updateRadioElems(elemChild)),\n        });\n      }\n      return cloneElement(item, {\n        children: updateRadioElems(elemChildren),\n      });\n    }\n\n    if (item?.type && item.type !== Radio && item.type !== Label) {\n      return item;\n    }\n\n    return null;\n  }\n\n  const radios = Children.map(children, (child) => updateRadioElems(child));\n  return (\n    <fieldset data-test-id={testId} ref={fieldsetRef}>\n      {legend && (\n        <legend>\n          <VisuallyHidden>{legend}</VisuallyHidden>\n        </legend>\n      )}\n      <div {...rest}>{radios}</div>\n    </fieldset>\n  );\n};\n\nexport { RadioGroup };\nexport type { RadioGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype SelectFieldProps = ComponentProps<'select'> & {\n  'data-test-id'?: string;\n};\n\nconst SelectField = forwardRef<HTMLSelectElement, SelectFieldProps>(\n  ({ className, children, 'data-test-id': testId = 'select', ...rest }: SelectFieldProps, ref) => {\n    const classes = cx(styles.formInput, className);\n\n    return (\n      <select {...rest} data-test-id={testId} className={classes} ref={ref}>\n        {children}\n      </select>\n    );\n  }\n);\n\nSelectField.displayName = 'SelectField';\n\nexport { SelectField };\nexport type { SelectFieldProps };\n","import type { KeyboardEvent, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextAreaProps = ComponentProps<'textarea'> & {\n  'data-test-id'?: string;\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  ({ className, 'data-test-id': testId = 'text-area', ...props }, ref) => {\n    const onKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n      if (\n        e.key === 'ArrowRight' ||\n        e.key === 'ArrowDown' ||\n        e.key === 'ArrowUp' ||\n        e.key === 'ArrowLeft'\n      ) {\n        e.stopPropagation();\n      }\n      if (e.key === 'Escape') {\n        e.nativeEvent.stopImmediatePropagation();\n      }\n    };\n\n    return (\n      <textarea\n        {...props}\n        className={cx(styles.formInput, className)}\n        ref={ref}\n        data-test-id={testId}\n        aria-describedby={props['aria-describedby'] || createFieldErrorId(props.id)}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport { TextArea };\nexport type { TextAreaProps };\n","import type { AriaButtonProps } from '@react-aria/button';\nimport type { AriaNumberFieldProps } from '@react-aria/numberfield';\n\nimport { ExpandLess, ExpandMore } from '@launchpad-ui/icons';\nimport { useButton } from '@react-aria/button';\nimport { useLocale } from '@react-aria/i18n';\nimport { useNumberField as useReactAriaNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport { cx } from 'classix';\nimport { useRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { useObjectMemo } from './utils';\n\ntype UseNumberFieldProps = AriaNumberFieldProps & {\n  className?: string;\n  'data-test-id'?: string;\n  id?: string;\n  name?: string;\n};\n\nconst defaultFormatOptions: Intl.NumberFormatOptions = {\n  maximumFractionDigits: 6,\n};\n\nconst useNumberField = ({\n  className: rootClassName,\n  'data-test-id': testId = 'input',\n  id,\n  name,\n  ...otherProps\n}: UseNumberFieldProps = {}): {\n  fieldErrorProps: ReturnType<typeof useReactAriaNumberField>['errorMessageProps'];\n  formHintProps: ReturnType<typeof useReactAriaNumberField>['descriptionProps'];\n  labelProps: ReturnType<typeof useReactAriaNumberField>['labelProps'];\n  renderNumberField: () => JSX.Element;\n} => {\n  // @react-aria's hooks have a state-updating effect somewhere that depends on \"formatOptions\",\n  // so we need to memoize it to prevent an infinite render loop.\n  const formatOptions = useObjectMemo({\n    ...defaultFormatOptions,\n    ...otherProps.formatOptions,\n  });\n  const { locale } = useLocale();\n  const numberFieldState = useNumberFieldState({ ...otherProps, locale, formatOptions });\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    descriptionProps: formHintProps,\n    errorMessageProps: fieldErrorProps,\n    labelProps,\n    groupProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n  } = useReactAriaNumberField({ ...otherProps, formatOptions, id }, numberFieldState, inputRef);\n\n  return {\n    fieldErrorProps,\n    formHintProps,\n    labelProps,\n    renderNumberField: () => (\n      <div {...groupProps} className={styles.numberField}>\n        <input\n          {...inputProps}\n          className={cx(styles.formInput, styles['numberField-input'])}\n          data-test-id={testId}\n          name={name}\n          ref={inputRef}\n        />\n        <div className={styles['numberField-stepperContainer']}>\n          <Stepper {...incrementButtonProps}>\n            <ExpandLess />\n          </Stepper>\n          <Stepper {...decrementButtonProps}>\n            <ExpandMore />\n          </Stepper>\n        </div>\n      </div>\n    ),\n  };\n};\n\nconst Stepper = (props: AriaButtonProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(props, buttonRef);\n\n  return (\n    <button {...buttonProps} className={styles['numberField-stepper']} ref={buttonRef}>\n      {props.children}\n    </button>\n  );\n};\n\nexport { useNumberField };\nexport type { UseNumberFieldProps };\n"],"names":["suffix","label","isActive","value","isInvalid","hint","useReactAriaNumberField"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../src/RequiredAsterisk.tsx","../src/Label.tsx","../src/Checkbox.tsx","../src/utils/index.ts","../src/TextField.tsx","../src/CompactTextField.tsx","../src/FieldError.tsx","../src/FieldSet.tsx","../src/Form.tsx","../src/FormGroup.tsx","../src/FormHint.tsx","../src/FormField.tsx","../src/IconField.tsx","../src/Radio.tsx","../src/RadioGroup.tsx","../src/SelectField.tsx","../src/TextArea.tsx","../src/useNumberField.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype RequiredAsteriskProps = ComponentProps<'span'> & {\n  'data-test-id'?: string;\n};\n\nconst RequiredAsterisk = ({\n  className,\n  'data-test-id': testId = 'required-asterisk',\n  ...rest\n}: RequiredAsteriskProps) => {\n  const classes = cx(styles.requiredAsterisk, className);\n\n  return (\n    <span {...rest} data-test-id={testId} className={classes}>\n      *\n    </span>\n  );\n};\n\nexport { RequiredAsterisk };\nexport type { RequiredAsteriskProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { RequiredAsterisk } from './RequiredAsterisk';\nimport styles from './styles/Form.module.css';\n\ntype LabelProps = ComponentProps<'label'> & {\n  required?: boolean;\n  optional?: boolean;\n  disabled?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Label = ({\n  disabled,\n  className,\n  children,\n  required = false,\n  optional = false,\n  'data-test-id': testId = 'label',\n  ...rest\n}: LabelProps) => {\n  const classes = cx(styles.label, className, disabled && styles.labelDisabled);\n\n  return (\n    <label {...rest} data-test-id={testId} className={classes}>\n      {children}\n      {optional && !required && <small className={styles.labelOptional}>(optional)</small>}\n      {required && !optional && <RequiredAsterisk />}\n    </label>\n  );\n};\n\nexport { Label };\nexport type { LabelProps };\n","import type { ComponentProps } from 'react';\n\nimport { forwardRef } from 'react';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype CheckboxProps = ComponentProps<'input'> & {\n  /**\n   * The className to pass into the Checkbox's Label component\n   */\n  labelClassName?: string;\n  'data-test-id'?: string;\n};\n\nconst Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      children,\n      disabled,\n      checked,\n      labelClassName,\n      'data-test-id': testId = 'checkbox',\n      ...rest\n    },\n    ref\n  ) => {\n    const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n    if (!children && !hasAriaLabel) {\n      console.warn(\n        'If you do not provide children, you must specify an aria-label for accessibility'\n      );\n    }\n\n    return (\n      <Label className={labelClassName}>\n        <input\n          {...rest}\n          ref={ref}\n          checked={checked}\n          aria-checked={checked ? 'true' : 'false'}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={styles.checkbox}\n          disabled={disabled}\n          type=\"checkbox\"\n          data-test-id={testId}\n        />{' '}\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport { Checkbox };\nexport type { CheckboxProps };\n","import { useMemo, useRef } from 'react';\n\ntype FieldPath = string | string[];\n\nconst createFieldErrorId = (fieldIdentifier?: FieldPath) =>\n  fieldIdentifier ? `${[...fieldIdentifier].join('')}-err` : undefined;\n\nfunction hasObjectChanged<T extends object>(obj1: T, obj2: T): boolean {\n  return (\n    Object.keys(obj1).length !== Object.keys(obj2).length ||\n    Object.keys(obj1).some((k) => {\n      const key = k as keyof T;\n      return typeof obj1[key] === 'object' && typeof obj2[key] === 'object'\n        ? hasObjectChanged(obj1[key] as T, obj2[key] as T)\n        : obj1[key] !== obj2[key];\n    })\n  );\n}\n\nfunction useObjectMemo<T extends object>(obj: T) {\n  const objRef = useRef(obj);\n\n  return useMemo(() => {\n    if (hasObjectChanged(obj, objRef.current)) {\n      objRef.current = obj;\n    }\n\n    return objRef.current;\n  }, [obj]);\n}\n\nexport { createFieldErrorId, useObjectMemo };\nexport type { FieldPath };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextFieldProps = ComponentProps<'input'> & {\n  suffix?: string;\n  tiny?: boolean;\n  overrideWidth?: string;\n  'data-test-id'?: string;\n};\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      className,\n      type = 'text',\n      tiny = false,\n      readOnly,\n      tabIndex = 0,\n      suffix,\n      overrideWidth,\n      'data-test-id': testId = 'text-field',\n      autoComplete,\n      ...rest\n    },\n    ref\n  ) => {\n    const classes = overrideWidth\n      ? className\n      : cx(styles.formInput, tiny && styles.formInputTiny, className);\n\n    const disablePasswordManagers = autoComplete === 'off';\n\n    if (suffix) {\n      return (\n        <div className={styles.suffixContainer}>\n          <input\n            {...rest}\n            type={type}\n            data-test-id={testId}\n            autoComplete={autoComplete}\n            className={classes}\n            readOnly={readOnly}\n            ref={ref}\n            aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n          />\n          <label className={styles.suffix} htmlFor={rest.id}>\n            {suffix}\n          </label>\n        </div>\n      );\n    }\n\n    return (\n      <input\n        {...rest}\n        data-1p-ignore={disablePasswordManagers} // \"data-1p-ignore\" is added to prevent 1Password from injecting a password autofill icon\n        type={type}\n        className={classes}\n        readOnly={readOnly}\n        tabIndex={tabIndex}\n        autoComplete={autoComplete}\n        ref={ref}\n        data-test-id={testId}\n        style={\n          overrideWidth\n            ? {\n                width: overrideWidth,\n              }\n            : undefined\n        }\n        aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n      />\n    );\n  }\n);\n\nTextField.displayName = 'TextField';\n\nexport { TextField };\nexport type { TextFieldProps };\n","import type { TextFieldProps } from './TextField';\nimport type { FocusEvent } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef, useState } from 'react';\n\nimport { Label } from './Label';\nimport { TextField } from './TextField';\nimport styles from './styles/Form.module.css';\n\ntype CompactTextFieldProps = TextFieldProps & {\n  label: string;\n  needsErrorFeedback?: boolean;\n};\n\nconst CompactTextField = forwardRef<HTMLInputElement, CompactTextFieldProps>(\n  (\n    {\n      className,\n      id,\n      label,\n      needsErrorFeedback,\n      value,\n      onFocus,\n      onBlur,\n      'data-test-id': testId = 'compact-text-field',\n      ...rest\n    },\n    ref\n  ) => {\n    const [isActive, setIsActive] = useState(\n      (typeof value === 'boolean' || value ? value.toString() : '').trim().length !== 0\n    );\n\n    const isActiveState = isActive || needsErrorFeedback;\n\n    const classes = cx(styles.compactTextField, className, isActiveState && styles.isActive);\n\n    const placeholder = isActiveState ? '' : label;\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      setIsActive(true);\n      if (onFocus) {\n        onFocus(event);\n      }\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      const value = event.target.value || '';\n      setIsActive(value.trim().length !== 0);\n      if (onBlur) {\n        onBlur(event);\n      }\n    };\n\n    return (\n      <div className={classes} data-test-id={testId}>\n        <Label htmlFor={id}>{label}</Label>\n        <TextField\n          {...rest}\n          id={id}\n          placeholder={placeholder}\n          value={value}\n          ref={ref}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n        />\n      </div>\n    );\n  }\n);\n\nCompactTextField.displayName = 'CompactTextField';\n\nexport { CompactTextField };\nexport type { CompactTextFieldProps };\n","import type { FieldPath } from './utils';\nimport type { ComponentProps } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype FieldErrorProps = ComponentProps<'span'> & {\n  name: FieldPath;\n  errorMessage?: string;\n  'data-test-id'?: string;\n};\n\nconst FieldError = ({\n  name,\n  errorMessage,\n  className,\n  'data-test-id': testId = 'field-error',\n  ...rest\n}: FieldErrorProps) => {\n  if (!errorMessage) {\n    return null;\n  }\n\n  return (\n    <span\n      {...rest}\n      className={cx(styles.fieldError, className)}\n      aria-live=\"polite\"\n      data-test-id={testId}\n      aria-label=\"Error\"\n      id={createFieldErrorId(name)}\n    >\n      <Icon name=\"alert-rhombus\" size=\"small\" /> {errorMessage}\n    </span>\n  );\n};\n\nexport { FieldError };\nexport type { FieldErrorProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FieldSetProps = ComponentProps<'fieldset'> & {\n  'data-test-id'?: string;\n};\n\nconst FieldSet = ({\n  children,\n  className,\n  'data-test-id': testId = 'field-set',\n  ...rest\n}: FieldSetProps) => {\n  const classes = cx(styles.fieldSet, className);\n\n  return (\n    <fieldset data-test-id={testId} className={classes} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FieldSet };\nexport type { FieldSetProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormProps = ComponentProps<'form'> & {\n  inline?: boolean;\n  // Increases margin between form fields to make room for error messages.\n  // This prevents the form from shifting when rendering a field error.\n  // This may be desired when the form contains external links that will\n  // shift while clicking if the form shifts from validation.\n  hasIncreasedErrorMargin?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Form = (props: FormProps) => {\n  const {\n    className,\n    inline,\n    children,\n    hasIncreasedErrorMargin,\n    'data-test-id': testId = 'form',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.form,\n    className,\n    inline && styles.formInline,\n    !!hasIncreasedErrorMargin && styles.formIncreasedErrorMargin\n  );\n\n  return (\n    <form {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </form>\n  );\n};\n\nexport { Form };\nexport type { FormProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormGroupProps = ComponentProps<'fieldset'> & {\n  name?: string | string[];\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  'data-test-id'?: string;\n};\n\nconst FormGroup = (props: FormGroupProps) => {\n  const {\n    className,\n    name,\n    ignoreValidation,\n    isInvalid,\n    children,\n    'data-test-id': testId = 'form-group',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.formGroup,\n    className,\n    !ignoreValidation && isInvalid && styles.isInvalid\n  );\n\n  return (\n    <fieldset className={classes} data-test-id={testId} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FormGroup };\nexport type { FormGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormHintProps = ComponentProps<'div'> & {\n  'data-test-id'?: string;\n};\n\nconst FormHint = ({\n  className,\n  children,\n  'data-test-id': testId = 'form-hint',\n  ...rest\n}: FormHintProps) => {\n  const classes = cx(styles.hint, className);\n\n  return (\n    <div {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </div>\n  );\n};\n\nexport { FormHint };\nexport type { FormHintProps };\n","import type { FieldErrorProps } from './FieldError';\nimport type { FormHintProps } from './FormHint';\nimport type { LabelProps } from './Label';\n\nimport { cx } from 'classix';\n\nimport { FieldError } from './FieldError';\nimport { FormGroup } from './FormGroup';\nimport { FormHint } from './FormHint';\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype FormFieldProps = {\n  isRequired: boolean;\n  label?: string;\n  name: string;\n  htmlFor: string;\n  hint?: string;\n  errorMessage?: string;\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  children: JSX.Element;\n  className?: string;\n  onBlur?: (field: string) => void;\n  'data-test-id'?: string;\n  LabelProps?: Partial<LabelProps>;\n  FormHintProps?: Partial<FormHintProps>;\n  FieldErrorProps?: Partial<FieldErrorProps>;\n};\n\nconst FormField = ({\n  isRequired,\n  label,\n  name,\n  htmlFor,\n  hint,\n  errorMessage,\n  ignoreValidation,\n  isInvalid,\n  children,\n  className,\n  onBlur,\n  'data-test-id': testId = 'form-field',\n  LabelProps = {},\n  FormHintProps = {},\n  FieldErrorProps = {},\n}: FormFieldProps) => {\n  const handleBlur = () => {\n    onBlur && onBlur(name);\n  };\n\n  return (\n    <FormGroup\n      className={cx(styles.field, className)}\n      name={name}\n      ignoreValidation={ignoreValidation}\n      isInvalid={isInvalid}\n      onBlur={handleBlur}\n      data-test-id={testId}\n    >\n      {label && (\n        <Label htmlFor={htmlFor} required={isRequired} {...LabelProps}>\n          {label}\n        </Label>\n      )}\n      {hint && (\n        <FormHint className={styles.hint} {...FormHintProps}>\n          {hint}\n        </FormHint>\n      )}\n      {children}\n      <FieldError\n        className={styles.fieldErrorMessage}\n        name={name}\n        errorMessage={errorMessage}\n        {...FieldErrorProps}\n      />\n    </FormGroup>\n  );\n};\n\nexport type { FormFieldProps };\nexport { FormField };\n","import type { IconProps } from '@launchpad-ui/icons';\nimport type { ComponentProps, ReactElement } from 'react';\n\nimport { cx } from 'classix';\nimport { cloneElement } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype IconFieldProps = ComponentProps<'div'> & {\n  icon: ReactElement<IconProps>;\n  children: JSX.Element | JSX.Element[];\n  'data-test-id'?: string;\n};\n\nconst IconField = ({\n  icon,\n  children,\n  className,\n  'data-test-id': testId = 'icon-field',\n  ...rest\n}: IconFieldProps) => {\n  const renderIcon = cloneElement(icon, { size: 'small', className: styles.iconFieldIcon });\n\n  const classes = cx(styles.iconField, className);\n\n  return (\n    <div className={classes} data-test-id={testId} {...rest}>\n      {children}\n      {renderIcon}\n    </div>\n  );\n};\n\nexport { IconField };\nexport type { IconFieldProps };\n","import type { CSSProperties, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype RadioProps = Omit<ComponentProps<'input'>, 'type'> & {\n  labelClassName?: string;\n  labelStyle?: CSSProperties;\n  'data-test-id'?: string;\n};\n\nconst Radio = ({\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  checked = false,\n  children,\n  className,\n  disabled = false,\n  id,\n  labelClassName,\n  labelStyle,\n  'data-test-id': testId = 'radio',\n  ...rest\n}: RadioProps) => {\n  const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n\n  if (!children && !hasAriaLabel) {\n    console.warn(\n      'If you do not provide children, you must specify an aria-label for accessibility'\n    );\n  }\n\n  return (\n    <>\n      <input\n        {...rest}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        className={cx(styles.radio, className)}\n        checked={checked}\n        disabled={disabled}\n        id={id}\n        data-test-id={testId}\n        type=\"radio\"\n      />\n      <Label className={labelClassName} htmlFor={id} style={labelStyle}>\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    </>\n  );\n};\n\nexport { Radio };\nexport type { RadioProps };\n","import type { ChangeEvent, FormEvent, ReactElement, ReactNode } from 'react';\n\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { Children, cloneElement, isValidElement, useRef } from 'react';\n\nimport { Label } from './Label';\nimport { Radio } from './Radio';\n\ntype RadioGroupProps = {\n  /**\n   * The legend that describes this groups of radio buttons. The legend\n   * is important for screen reader users.\n   */\n  legend?: string;\n  /**\n   * The children passed into the RadioGroup.\n   */\n  children?: ReactNode;\n  /**\n   * Custom classname(s) passed to the fieldset inner div.\n   */\n  className?: string;\n  /**\n   * Set the underlying Radio to disabled if the Radio's disabled prop is undefined.\n   */\n  disabled?: boolean;\n  /**\n   * The RadioGroup's id.\n   */\n  id?: string;\n  /**\n   * Name to apply to the underlying Radio. The same name value is passed to each Radio when grouping in a RadioGroup for screen reader support.\n   */\n  name: string;\n  /**\n   * This function is passed into each Radio onChange synthetic event handler.\n   */\n  onChange?(e: ChangeEvent | FormEvent<HTMLInputElement>): void;\n  /**\n   * The value to compare against the Radio's value to determine if the Radio will be checked.\n   */\n  value: string;\n\n  'data-test-id'?: string;\n};\n\nconst RadioGroup = (props: RadioGroupProps) => {\n  const {\n    name,\n    value,\n    onChange,\n    children,\n    disabled,\n    legend,\n    'data-test-id': testId = 'radio-group',\n    ...rest\n  } = props;\n  const fieldsetRef = useRef<HTMLFieldSetElement>(null);\n\n  function updateRadioElems(elem: ReactNode): ReactNode {\n    if (!isValidElement(elem)) {\n      return elem;\n    }\n\n    const item = elem as ReactElement;\n\n    if (item?.type && item.type === Radio) {\n      return cloneElement(item, {\n        ...item.props,\n        name,\n        checked: item.props.value === value,\n        onChange,\n        disabled: typeof item.props?.disabled !== 'undefined' ? item.props.disabled : disabled,\n      });\n    }\n\n    if (item?.type && item.type === Label) {\n      return cloneElement(item, {\n        ...item.props,\n        onChange,\n        disabled,\n      });\n    }\n\n    const elemChildren = item?.props?.children;\n    if (elemChildren) {\n      if (Array.isArray(elemChildren)) {\n        return cloneElement(item, {\n          children: Children.map(elemChildren, (elemChild) => updateRadioElems(elemChild)),\n        });\n      }\n      return cloneElement(item, {\n        children: updateRadioElems(elemChildren),\n      });\n    }\n\n    if (item?.type && item.type !== Radio && item.type !== Label) {\n      return item;\n    }\n\n    return null;\n  }\n\n  const radios = Children.map(children, (child) => updateRadioElems(child));\n  return (\n    <fieldset data-test-id={testId} ref={fieldsetRef}>\n      {legend && (\n        <legend>\n          <VisuallyHidden>{legend}</VisuallyHidden>\n        </legend>\n      )}\n      <div {...rest}>{radios}</div>\n    </fieldset>\n  );\n};\n\nexport { RadioGroup };\nexport type { RadioGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype SelectFieldProps = ComponentProps<'select'> & {\n  'data-test-id'?: string;\n};\n\nconst SelectField = forwardRef<HTMLSelectElement, SelectFieldProps>(\n  ({ className, children, 'data-test-id': testId = 'select', ...rest }: SelectFieldProps, ref) => {\n    const classes = cx(styles.formInput, className);\n\n    return (\n      <select {...rest} data-test-id={testId} className={classes} ref={ref}>\n        {children}\n      </select>\n    );\n  }\n);\n\nSelectField.displayName = 'SelectField';\n\nexport { SelectField };\nexport type { SelectFieldProps };\n","import type { KeyboardEvent, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextAreaProps = ComponentProps<'textarea'> & {\n  'data-test-id'?: string;\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  ({ className, 'data-test-id': testId = 'text-area', ...props }, ref) => {\n    const onKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n      if (\n        e.key === 'ArrowRight' ||\n        e.key === 'ArrowDown' ||\n        e.key === 'ArrowUp' ||\n        e.key === 'ArrowLeft'\n      ) {\n        e.stopPropagation();\n      }\n      if (e.key === 'Escape') {\n        e.nativeEvent.stopImmediatePropagation();\n      }\n    };\n\n    return (\n      <textarea\n        {...props}\n        className={cx(styles.formInput, className)}\n        ref={ref}\n        data-test-id={testId}\n        aria-describedby={props['aria-describedby'] || createFieldErrorId(props.id)}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport { TextArea };\nexport type { TextAreaProps };\n","import type { AriaButtonProps } from '@react-aria/button';\nimport type { AriaNumberFieldProps } from '@react-aria/numberfield';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { useButton } from '@react-aria/button';\nimport { useLocale } from '@react-aria/i18n';\nimport { useNumberField as useReactAriaNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport { cx } from 'classix';\nimport { useRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { useObjectMemo } from './utils';\n\ntype UseNumberFieldProps = AriaNumberFieldProps & {\n  className?: string;\n  'data-test-id'?: string;\n  id?: string;\n  name?: string;\n};\n\nconst defaultFormatOptions: Intl.NumberFormatOptions = {\n  maximumFractionDigits: 6,\n};\n\nconst useNumberField = ({\n  className: rootClassName,\n  'data-test-id': testId = 'input',\n  id,\n  name,\n  ...otherProps\n}: UseNumberFieldProps = {}): {\n  fieldErrorProps: ReturnType<typeof useReactAriaNumberField>['errorMessageProps'];\n  formHintProps: ReturnType<typeof useReactAriaNumberField>['descriptionProps'];\n  labelProps: ReturnType<typeof useReactAriaNumberField>['labelProps'];\n  renderNumberField: () => JSX.Element;\n} => {\n  // @react-aria's hooks have a state-updating effect somewhere that depends on \"formatOptions\",\n  // so we need to memoize it to prevent an infinite render loop.\n  const formatOptions = useObjectMemo({\n    ...defaultFormatOptions,\n    ...otherProps.formatOptions,\n  });\n  const { locale } = useLocale();\n  const numberFieldState = useNumberFieldState({ ...otherProps, locale, formatOptions });\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    descriptionProps: formHintProps,\n    errorMessageProps: fieldErrorProps,\n    labelProps,\n    groupProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n  } = useReactAriaNumberField({ ...otherProps, formatOptions, id }, numberFieldState, inputRef);\n\n  return {\n    fieldErrorProps,\n    formHintProps,\n    labelProps,\n    renderNumberField: () => (\n      <div {...groupProps} className={styles.numberField}>\n        <input\n          {...inputProps}\n          className={cx(styles.formInput, styles['numberField-input'])}\n          data-test-id={testId}\n          name={name}\n          ref={inputRef}\n        />\n        <div className={styles['numberField-stepperContainer']}>\n          <Stepper {...incrementButtonProps}>\n            <Icon name=\"expand-less\" />\n          </Stepper>\n          <Stepper {...decrementButtonProps}>\n            <Icon name=\"expand-more\" />\n          </Stepper>\n        </div>\n      </div>\n    ),\n  };\n};\n\nconst Stepper = (props: AriaButtonProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(props, buttonRef);\n\n  return (\n    <button {...buttonProps} className={styles['numberField-stepper']} ref={buttonRef}>\n      {props.children}\n    </button>\n  );\n};\n\nexport { useNumberField };\nexport type { UseNumberFieldProps };\n"],"names":["suffix","label","isActive","value","isInvalid","hint","useReactAriaNumberField"],"mappings":"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"}

package/dist/index.js

@@ -10,35 +10,35 @@ const button = require("@react-aria/button");
 const i18n = require("@react-aria/i18n");
 const numberfield$1 = require("@react-aria/numberfield");
 const numberfield = require("@react-stately/numberfield");
-const formGroup = "_formGroup_1u9hb_10";
-const formIncreasedErrorMargin = "_formIncreasedErrorMargin_1u9hb_18";
-const formInline = "_formInline_1u9hb_22";
-const form = "_form_1u9hb_10";
-const formInput = "_formInput_1u9hb_36";
-const isFocused = "_isFocused_1u9hb_56";
-const iconField = "_iconField_1u9hb_73";
-const suffixContainer = "_suffixContainer_1u9hb_77";
-const isInvalid = "_isInvalid_1u9hb_82";
-const inlineForm = "_inlineForm_1u9hb_93";
-const label = "_label_1u9hb_98";
-const labelDisabled = "_labelDisabled_1u9hb_104";
-const labelOptional = "_labelOptional_1u9hb_108";
-const compactTextField = "_compactTextField_1u9hb_114";
-const fieldError = "_fieldError_1u9hb_138";
-const hint = "_hint_1u9hb_184";
-const field = "_field_1u9hb_138";
-const fieldErrorMessage = "_fieldErrorMessage_1u9hb_204";
-const isDisabled = "_isDisabled_1u9hb_217";
-const checkbox = "_checkbox_1u9hb_284";
-const radio = "_radio_1u9hb_291";
-const number = "_number_1u9hb_295";
-const suffix = "_suffix_1u9hb_77";
-const iconFieldIcon = "_iconFieldIcon_1u9hb_333";
-const formInputTiny = "_formInputTiny_1u9hb_341";
-const requiredAsterisk = "_requiredAsterisk_1u9hb_350";
-const fieldSet = "_fieldSet_1u9hb_354";
-const isActive = "_isActive_1u9hb_365";
-const numberField = "_numberField_1u9hb_372";
+const formGroup = "_formGroup_19syx_10";
+const formIncreasedErrorMargin = "_formIncreasedErrorMargin_19syx_18";
+const formInline = "_formInline_19syx_22";
+const form = "_form_19syx_10";
+const formInput = "_formInput_19syx_36";
+const isFocused = "_isFocused_19syx_56";
+const iconField = "_iconField_19syx_75";
+const suffixContainer = "_suffixContainer_19syx_79";
+const isInvalid = "_isInvalid_19syx_84";
+const inlineForm = "_inlineForm_19syx_95";
+const label = "_label_19syx_100";
+const labelDisabled = "_labelDisabled_19syx_106";
+const labelOptional = "_labelOptional_19syx_110";
+const compactTextField = "_compactTextField_19syx_116";
+const fieldError = "_fieldError_19syx_140";
+const hint = "_hint_19syx_186";
+const field = "_field_19syx_140";
+const fieldErrorMessage = "_fieldErrorMessage_19syx_206";
+const isDisabled = "_isDisabled_19syx_219";
+const checkbox = "_checkbox_19syx_286";
+const radio = "_radio_19syx_293";
+const number = "_number_19syx_297";
+const suffix = "_suffix_19syx_79";
+const iconFieldIcon = "_iconFieldIcon_19syx_335";
+const formInputTiny = "_formInputTiny_19syx_343";
+const requiredAsterisk = "_requiredAsterisk_19syx_352";
+const fieldSet = "_fieldSet_19syx_356";
+const isActive = "_isActive_19syx_367";
+const numberField = "_numberField_19syx_374";
 const styles = {
   formGroup,
   formIncreasedErrorMargin,
@@ -69,9 +69,9 @@ const styles = {
   fieldSet,
   isActive,
   numberField,
-  "numberField-input": "_numberField-input_1u9hb_376",
-  "numberField-stepperContainer": "_numberField-stepperContainer_1u9hb_380",
-  "numberField-stepper": "_numberField-stepper_1u9hb_380"
+  "numberField-input": "_numberField-input_19syx_378",
+  "numberField-stepperContainer": "_numberField-stepperContainer_19syx_382",
+  "numberField-stepper": "_numberField-stepper_19syx_382"
 };
 const RequiredAsterisk = ({
   className,
@@ -275,7 +275,7 @@ const FieldError = ({
       "aria-label": "Error",
       id: createFieldErrorId(name),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(icons.AlertRhombus, { size: "small" }),
+        /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "alert-rhombus", size: "small" }),
         " ",
         errorMessage
       ]
@@ -387,11 +387,11 @@ const IconField = ({
   "data-test-id": testId = "icon-field",
   ...rest
 }) => {
-  const Icon = icon;
+  const renderIcon = react.cloneElement(icon, { size: "small", className: styles.iconFieldIcon });
   const classes = classix.cx(styles.iconField, className);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes, "data-test-id": testId, ...rest, children: [
     children,
-    /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: "small", className: styles.iconFieldIcon })
+    renderIcon
   ] });
 };
 const Radio = ({
@@ -560,8 +560,8 @@ const useNumberField = ({
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles["numberField-stepperContainer"], children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Stepper, { ...incrementButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(icons.ExpandLess, {}) }),
-        /* @__PURE__ */ jsxRuntime.jsx(Stepper, { ...decrementButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(icons.ExpandMore, {}) })
+        /* @__PURE__ */ jsxRuntime.jsx(Stepper, { ...incrementButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "expand-less" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(Stepper, { ...decrementButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Icon, { name: "expand-more" }) })
       ] })
     ] })
   };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/RequiredAsterisk.tsx","../src/Label.tsx","../src/Checkbox.tsx","../src/utils/index.ts","../src/TextField.tsx","../src/CompactTextField.tsx","../src/FieldError.tsx","../src/FieldSet.tsx","../src/Form.tsx","../src/FormGroup.tsx","../src/FormHint.tsx","../src/FormField.tsx","../src/IconField.tsx","../src/Radio.tsx","../src/RadioGroup.tsx","../src/SelectField.tsx","../src/TextArea.tsx","../src/useNumberField.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype RequiredAsteriskProps = ComponentProps<'span'> & {\n  'data-test-id'?: string;\n};\n\nconst RequiredAsterisk = ({\n  className,\n  'data-test-id': testId = 'required-asterisk',\n  ...rest\n}: RequiredAsteriskProps) => {\n  const classes = cx(styles.requiredAsterisk, className);\n\n  return (\n    <span {...rest} data-test-id={testId} className={classes}>\n      *\n    </span>\n  );\n};\n\nexport { RequiredAsterisk };\nexport type { RequiredAsteriskProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { RequiredAsterisk } from './RequiredAsterisk';\nimport styles from './styles/Form.module.css';\n\ntype LabelProps = ComponentProps<'label'> & {\n  required?: boolean;\n  optional?: boolean;\n  disabled?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Label = ({\n  disabled,\n  className,\n  children,\n  required = false,\n  optional = false,\n  'data-test-id': testId = 'label',\n  ...rest\n}: LabelProps) => {\n  const classes = cx(styles.label, className, disabled && styles.labelDisabled);\n\n  return (\n    <label {...rest} data-test-id={testId} className={classes}>\n      {children}\n      {optional && !required && <small className={styles.labelOptional}>(optional)</small>}\n      {required && !optional && <RequiredAsterisk />}\n    </label>\n  );\n};\n\nexport { Label };\nexport type { LabelProps };\n","import type { ComponentProps } from 'react';\n\nimport { forwardRef } from 'react';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype CheckboxProps = ComponentProps<'input'> & {\n  /**\n   * The className to pass into the Checkbox's Label component\n   */\n  labelClassName?: string;\n  'data-test-id'?: string;\n};\n\nconst Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      children,\n      disabled,\n      checked,\n      labelClassName,\n      'data-test-id': testId = 'checkbox',\n      ...rest\n    },\n    ref\n  ) => {\n    const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n    if (!children && !hasAriaLabel) {\n      console.warn(\n        'If you do not provide children, you must specify an aria-label for accessibility'\n      );\n    }\n\n    return (\n      <Label className={labelClassName}>\n        <input\n          {...rest}\n          ref={ref}\n          checked={checked}\n          aria-checked={checked ? 'true' : 'false'}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={styles.checkbox}\n          disabled={disabled}\n          type=\"checkbox\"\n          data-test-id={testId}\n        />{' '}\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport { Checkbox };\nexport type { CheckboxProps };\n","import { useMemo, useRef } from 'react';\n\ntype FieldPath = string | string[];\n\nconst createFieldErrorId = (fieldIdentifier?: FieldPath) =>\n  fieldIdentifier ? `${[...fieldIdentifier].join('')}-err` : undefined;\n\nfunction hasObjectChanged<T extends object>(obj1: T, obj2: T): boolean {\n  return (\n    Object.keys(obj1).length !== Object.keys(obj2).length ||\n    Object.keys(obj1).some((k) => {\n      const key = k as keyof T;\n      return typeof obj1[key] === 'object' && typeof obj2[key] === 'object'\n        ? hasObjectChanged(obj1[key] as T, obj2[key] as T)\n        : obj1[key] !== obj2[key];\n    })\n  );\n}\n\nfunction useObjectMemo<T extends object>(obj: T) {\n  const objRef = useRef(obj);\n\n  return useMemo(() => {\n    if (hasObjectChanged(obj, objRef.current)) {\n      objRef.current = obj;\n    }\n\n    return objRef.current;\n  }, [obj]);\n}\n\nexport { createFieldErrorId, useObjectMemo };\nexport type { FieldPath };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextFieldProps = ComponentProps<'input'> & {\n  suffix?: string;\n  tiny?: boolean;\n  overrideWidth?: string;\n  'data-test-id'?: string;\n};\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      className,\n      type = 'text',\n      tiny = false,\n      readOnly,\n      tabIndex = 0,\n      suffix,\n      overrideWidth,\n      'data-test-id': testId = 'text-field',\n      autoComplete,\n      ...rest\n    },\n    ref\n  ) => {\n    const classes = overrideWidth\n      ? className\n      : cx(styles.formInput, tiny && styles.formInputTiny, className);\n\n    const disablePasswordManagers = autoComplete === 'off';\n\n    if (suffix) {\n      return (\n        <div className={styles.suffixContainer}>\n          <input\n            {...rest}\n            type={type}\n            data-test-id={testId}\n            autoComplete={autoComplete}\n            className={classes}\n            readOnly={readOnly}\n            ref={ref}\n            aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n          />\n          <label className={styles.suffix} htmlFor={rest.id}>\n            {suffix}\n          </label>\n        </div>\n      );\n    }\n\n    return (\n      <input\n        {...rest}\n        data-1p-ignore={disablePasswordManagers} // \"data-1p-ignore\" is added to prevent 1Password from injecting a password autofill icon\n        type={type}\n        className={classes}\n        readOnly={readOnly}\n        tabIndex={tabIndex}\n        autoComplete={autoComplete}\n        ref={ref}\n        data-test-id={testId}\n        style={\n          overrideWidth\n            ? {\n                width: overrideWidth,\n              }\n            : undefined\n        }\n        aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n      />\n    );\n  }\n);\n\nTextField.displayName = 'TextField';\n\nexport { TextField };\nexport type { TextFieldProps };\n","import type { TextFieldProps } from './TextField';\nimport type { FocusEvent } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef, useState } from 'react';\n\nimport { Label } from './Label';\nimport { TextField } from './TextField';\nimport styles from './styles/Form.module.css';\n\ntype CompactTextFieldProps = TextFieldProps & {\n  label: string;\n  needsErrorFeedback?: boolean;\n};\n\nconst CompactTextField = forwardRef<HTMLInputElement, CompactTextFieldProps>(\n  (\n    {\n      className,\n      id,\n      label,\n      needsErrorFeedback,\n      value,\n      onFocus,\n      onBlur,\n      'data-test-id': testId = 'compact-text-field',\n      ...rest\n    },\n    ref\n  ) => {\n    const [isActive, setIsActive] = useState(\n      (typeof value === 'boolean' || value ? value.toString() : '').trim().length !== 0\n    );\n\n    const isActiveState = isActive || needsErrorFeedback;\n\n    const classes = cx(styles.compactTextField, className, isActiveState && styles.isActive);\n\n    const placeholder = isActiveState ? '' : label;\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      setIsActive(true);\n      if (onFocus) {\n        onFocus(event);\n      }\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      const value = event.target.value || '';\n      setIsActive(value.trim().length !== 0);\n      if (onBlur) {\n        onBlur(event);\n      }\n    };\n\n    return (\n      <div className={classes} data-test-id={testId}>\n        <Label htmlFor={id}>{label}</Label>\n        <TextField\n          {...rest}\n          id={id}\n          placeholder={placeholder}\n          value={value}\n          ref={ref}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n        />\n      </div>\n    );\n  }\n);\n\nCompactTextField.displayName = 'CompactTextField';\n\nexport { CompactTextField };\nexport type { CompactTextFieldProps };\n","import type { FieldPath } from './utils';\nimport type { ComponentProps } from 'react';\n\nimport { AlertRhombus } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype FieldErrorProps = ComponentProps<'span'> & {\n  name: FieldPath;\n  errorMessage?: string;\n  'data-test-id'?: string;\n};\n\nconst FieldError = ({\n  name,\n  errorMessage,\n  className,\n  'data-test-id': testId = 'field-error',\n  ...rest\n}: FieldErrorProps) => {\n  if (!errorMessage) {\n    return null;\n  }\n\n  return (\n    <span\n      {...rest}\n      className={cx(styles.fieldError, className)}\n      aria-live=\"polite\"\n      data-test-id={testId}\n      aria-label=\"Error\"\n      id={createFieldErrorId(name)}\n    >\n      <AlertRhombus size=\"small\" /> {errorMessage}\n    </span>\n  );\n};\n\nexport { FieldError };\nexport type { FieldErrorProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FieldSetProps = ComponentProps<'fieldset'> & {\n  'data-test-id'?: string;\n};\n\nconst FieldSet = ({\n  children,\n  className,\n  'data-test-id': testId = 'field-set',\n  ...rest\n}: FieldSetProps) => {\n  const classes = cx(styles.fieldSet, className);\n\n  return (\n    <fieldset data-test-id={testId} className={classes} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FieldSet };\nexport type { FieldSetProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormProps = ComponentProps<'form'> & {\n  inline?: boolean;\n  // Increases margin between form fields to make room for error messages.\n  // This prevents the form from shifting when rendering a field error.\n  // This may be desired when the form contains external links that will\n  // shift while clicking if the form shifts from validation.\n  hasIncreasedErrorMargin?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Form = (props: FormProps) => {\n  const {\n    className,\n    inline,\n    children,\n    hasIncreasedErrorMargin,\n    'data-test-id': testId = 'form',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.form,\n    className,\n    inline && styles.formInline,\n    !!hasIncreasedErrorMargin && styles.formIncreasedErrorMargin\n  );\n\n  return (\n    <form {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </form>\n  );\n};\n\nexport { Form };\nexport type { FormProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormGroupProps = ComponentProps<'fieldset'> & {\n  name?: string | string[];\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  'data-test-id'?: string;\n};\n\nconst FormGroup = (props: FormGroupProps) => {\n  const {\n    className,\n    name,\n    ignoreValidation,\n    isInvalid,\n    children,\n    'data-test-id': testId = 'form-group',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.formGroup,\n    className,\n    !ignoreValidation && isInvalid && styles.isInvalid\n  );\n\n  return (\n    <fieldset className={classes} data-test-id={testId} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FormGroup };\nexport type { FormGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormHintProps = ComponentProps<'div'> & {\n  'data-test-id'?: string;\n};\n\nconst FormHint = ({\n  className,\n  children,\n  'data-test-id': testId = 'form-hint',\n  ...rest\n}: FormHintProps) => {\n  const classes = cx(styles.hint, className);\n\n  return (\n    <div {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </div>\n  );\n};\n\nexport { FormHint };\nexport type { FormHintProps };\n","import type { FieldErrorProps } from './FieldError';\nimport type { FormHintProps } from './FormHint';\nimport type { LabelProps } from './Label';\n\nimport { cx } from 'classix';\n\nimport { FieldError } from './FieldError';\nimport { FormGroup } from './FormGroup';\nimport { FormHint } from './FormHint';\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype FormFieldProps = {\n  isRequired: boolean;\n  label?: string;\n  name: string;\n  htmlFor: string;\n  hint?: string;\n  errorMessage?: string;\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  children: JSX.Element;\n  className?: string;\n  onBlur?: (field: string) => void;\n  'data-test-id'?: string;\n  LabelProps?: Partial<LabelProps>;\n  FormHintProps?: Partial<FormHintProps>;\n  FieldErrorProps?: Partial<FieldErrorProps>;\n};\n\nconst FormField = ({\n  isRequired,\n  label,\n  name,\n  htmlFor,\n  hint,\n  errorMessage,\n  ignoreValidation,\n  isInvalid,\n  children,\n  className,\n  onBlur,\n  'data-test-id': testId = 'form-field',\n  LabelProps = {},\n  FormHintProps = {},\n  FieldErrorProps = {},\n}: FormFieldProps) => {\n  const handleBlur = () => {\n    onBlur && onBlur(name);\n  };\n\n  return (\n    <FormGroup\n      className={cx(styles.field, className)}\n      name={name}\n      ignoreValidation={ignoreValidation}\n      isInvalid={isInvalid}\n      onBlur={handleBlur}\n      data-test-id={testId}\n    >\n      {label && (\n        <Label htmlFor={htmlFor} required={isRequired} {...LabelProps}>\n          {label}\n        </Label>\n      )}\n      {hint && (\n        <FormHint className={styles.hint} {...FormHintProps}>\n          {hint}\n        </FormHint>\n      )}\n      {children}\n      <FieldError\n        className={styles.fieldErrorMessage}\n        name={name}\n        errorMessage={errorMessage}\n        {...FieldErrorProps}\n      />\n    </FormGroup>\n  );\n};\n\nexport type { FormFieldProps };\nexport { FormField };\n","import type { IconProps } from '@launchpad-ui/icons';\nimport type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype IconFieldProps = ComponentProps<'div'> & {\n  icon(args: IconProps): JSX.Element;\n  children: JSX.Element | JSX.Element[];\n  'data-test-id'?: string;\n};\n\nconst IconField = ({\n  icon,\n  children,\n  className,\n  'data-test-id': testId = 'icon-field',\n  ...rest\n}: IconFieldProps) => {\n  const Icon = icon;\n\n  const classes = cx(styles.iconField, className);\n\n  return (\n    <div className={classes} data-test-id={testId} {...rest}>\n      {children}\n      <Icon size=\"small\" className={styles.iconFieldIcon} />\n    </div>\n  );\n};\n\nexport { IconField };\nexport type { IconFieldProps };\n","import type { CSSProperties, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype RadioProps = Omit<ComponentProps<'input'>, 'type'> & {\n  labelClassName?: string;\n  labelStyle?: CSSProperties;\n  'data-test-id'?: string;\n};\n\nconst Radio = ({\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  checked = false,\n  children,\n  className,\n  disabled = false,\n  id,\n  labelClassName,\n  labelStyle,\n  'data-test-id': testId = 'radio',\n  ...rest\n}: RadioProps) => {\n  const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n\n  if (!children && !hasAriaLabel) {\n    console.warn(\n      'If you do not provide children, you must specify an aria-label for accessibility'\n    );\n  }\n\n  return (\n    <>\n      <input\n        {...rest}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        className={cx(styles.radio, className)}\n        checked={checked}\n        disabled={disabled}\n        id={id}\n        data-test-id={testId}\n        type=\"radio\"\n      />\n      <Label className={labelClassName} htmlFor={id} style={labelStyle}>\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    </>\n  );\n};\n\nexport { Radio };\nexport type { RadioProps };\n","import type { ChangeEvent, FormEvent, ReactElement, ReactNode } from 'react';\n\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { Children, cloneElement, isValidElement, useRef } from 'react';\n\nimport { Label } from './Label';\nimport { Radio } from './Radio';\n\ntype RadioGroupProps = {\n  /**\n   * The legend that describes this groups of radio buttons. The legend\n   * is important for screen reader users.\n   */\n  legend?: string;\n  /**\n   * The children passed into the RadioGroup.\n   */\n  children?: ReactNode;\n  /**\n   * Custom classname(s) passed to the fieldset inner div.\n   */\n  className?: string;\n  /**\n   * Set the underlying Radio to disabled if the Radio's disabled prop is undefined.\n   */\n  disabled?: boolean;\n  /**\n   * The RadioGroup's id.\n   */\n  id?: string;\n  /**\n   * Name to apply to the underlying Radio. The same name value is passed to each Radio when grouping in a RadioGroup for screen reader support.\n   */\n  name: string;\n  /**\n   * This function is passed into each Radio onChange synthetic event handler.\n   */\n  onChange?(e: ChangeEvent | FormEvent<HTMLInputElement>): void;\n  /**\n   * The value to compare against the Radio's value to determine if the Radio will be checked.\n   */\n  value: string;\n\n  'data-test-id'?: string;\n};\n\nconst RadioGroup = (props: RadioGroupProps) => {\n  const {\n    name,\n    value,\n    onChange,\n    children,\n    disabled,\n    legend,\n    'data-test-id': testId = 'radio-group',\n    ...rest\n  } = props;\n  const fieldsetRef = useRef<HTMLFieldSetElement>(null);\n\n  function updateRadioElems(elem: ReactNode): ReactNode {\n    if (!isValidElement(elem)) {\n      return elem;\n    }\n\n    const item = elem as ReactElement;\n\n    if (item?.type && item.type === Radio) {\n      return cloneElement(item, {\n        ...item.props,\n        name,\n        checked: item.props.value === value,\n        onChange,\n        disabled: typeof item.props?.disabled !== 'undefined' ? item.props.disabled : disabled,\n      });\n    }\n\n    if (item?.type && item.type === Label) {\n      return cloneElement(item, {\n        ...item.props,\n        onChange,\n        disabled,\n      });\n    }\n\n    const elemChildren = item?.props?.children;\n    if (elemChildren) {\n      if (Array.isArray(elemChildren)) {\n        return cloneElement(item, {\n          children: Children.map(elemChildren, (elemChild) => updateRadioElems(elemChild)),\n        });\n      }\n      return cloneElement(item, {\n        children: updateRadioElems(elemChildren),\n      });\n    }\n\n    if (item?.type && item.type !== Radio && item.type !== Label) {\n      return item;\n    }\n\n    return null;\n  }\n\n  const radios = Children.map(children, (child) => updateRadioElems(child));\n  return (\n    <fieldset data-test-id={testId} ref={fieldsetRef}>\n      {legend && (\n        <legend>\n          <VisuallyHidden>{legend}</VisuallyHidden>\n        </legend>\n      )}\n      <div {...rest}>{radios}</div>\n    </fieldset>\n  );\n};\n\nexport { RadioGroup };\nexport type { RadioGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype SelectFieldProps = ComponentProps<'select'> & {\n  'data-test-id'?: string;\n};\n\nconst SelectField = forwardRef<HTMLSelectElement, SelectFieldProps>(\n  ({ className, children, 'data-test-id': testId = 'select', ...rest }: SelectFieldProps, ref) => {\n    const classes = cx(styles.formInput, className);\n\n    return (\n      <select {...rest} data-test-id={testId} className={classes} ref={ref}>\n        {children}\n      </select>\n    );\n  }\n);\n\nSelectField.displayName = 'SelectField';\n\nexport { SelectField };\nexport type { SelectFieldProps };\n","import type { KeyboardEvent, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextAreaProps = ComponentProps<'textarea'> & {\n  'data-test-id'?: string;\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  ({ className, 'data-test-id': testId = 'text-area', ...props }, ref) => {\n    const onKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n      if (\n        e.key === 'ArrowRight' ||\n        e.key === 'ArrowDown' ||\n        e.key === 'ArrowUp' ||\n        e.key === 'ArrowLeft'\n      ) {\n        e.stopPropagation();\n      }\n      if (e.key === 'Escape') {\n        e.nativeEvent.stopImmediatePropagation();\n      }\n    };\n\n    return (\n      <textarea\n        {...props}\n        className={cx(styles.formInput, className)}\n        ref={ref}\n        data-test-id={testId}\n        aria-describedby={props['aria-describedby'] || createFieldErrorId(props.id)}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport { TextArea };\nexport type { TextAreaProps };\n","import type { AriaButtonProps } from '@react-aria/button';\nimport type { AriaNumberFieldProps } from '@react-aria/numberfield';\n\nimport { ExpandLess, ExpandMore } from '@launchpad-ui/icons';\nimport { useButton } from '@react-aria/button';\nimport { useLocale } from '@react-aria/i18n';\nimport { useNumberField as useReactAriaNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport { cx } from 'classix';\nimport { useRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { useObjectMemo } from './utils';\n\ntype UseNumberFieldProps = AriaNumberFieldProps & {\n  className?: string;\n  'data-test-id'?: string;\n  id?: string;\n  name?: string;\n};\n\nconst defaultFormatOptions: Intl.NumberFormatOptions = {\n  maximumFractionDigits: 6,\n};\n\nconst useNumberField = ({\n  className: rootClassName,\n  'data-test-id': testId = 'input',\n  id,\n  name,\n  ...otherProps\n}: UseNumberFieldProps = {}): {\n  fieldErrorProps: ReturnType<typeof useReactAriaNumberField>['errorMessageProps'];\n  formHintProps: ReturnType<typeof useReactAriaNumberField>['descriptionProps'];\n  labelProps: ReturnType<typeof useReactAriaNumberField>['labelProps'];\n  renderNumberField: () => JSX.Element;\n} => {\n  // @react-aria's hooks have a state-updating effect somewhere that depends on \"formatOptions\",\n  // so we need to memoize it to prevent an infinite render loop.\n  const formatOptions = useObjectMemo({\n    ...defaultFormatOptions,\n    ...otherProps.formatOptions,\n  });\n  const { locale } = useLocale();\n  const numberFieldState = useNumberFieldState({ ...otherProps, locale, formatOptions });\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    descriptionProps: formHintProps,\n    errorMessageProps: fieldErrorProps,\n    labelProps,\n    groupProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n  } = useReactAriaNumberField({ ...otherProps, formatOptions, id }, numberFieldState, inputRef);\n\n  return {\n    fieldErrorProps,\n    formHintProps,\n    labelProps,\n    renderNumberField: () => (\n      <div {...groupProps} className={styles.numberField}>\n        <input\n          {...inputProps}\n          className={cx(styles.formInput, styles['numberField-input'])}\n          data-test-id={testId}\n          name={name}\n          ref={inputRef}\n        />\n        <div className={styles['numberField-stepperContainer']}>\n          <Stepper {...incrementButtonProps}>\n            <ExpandLess />\n          </Stepper>\n          <Stepper {...decrementButtonProps}>\n            <ExpandMore />\n          </Stepper>\n        </div>\n      </div>\n    ),\n  };\n};\n\nconst Stepper = (props: AriaButtonProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(props, buttonRef);\n\n  return (\n    <button {...buttonProps} className={styles['numberField-stepper']} ref={buttonRef}>\n      {props.children}\n    </button>\n  );\n};\n\nexport { useNumberField };\nexport type { UseNumberFieldProps };\n"],"names":["cx","jsx","forwardRef","jsxs","useRef","useMemo","suffix","label","isActive","useState","value","AlertRhombus","isInvalid","hint","Fragment","isValidElement","cloneElement","Children","VisuallyHidden","useLocale","useNumberFieldState","useReactAriaNumberField","ExpandLess","ExpandMore","useButton"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/RequiredAsterisk.tsx","../src/Label.tsx","../src/Checkbox.tsx","../src/utils/index.ts","../src/TextField.tsx","../src/CompactTextField.tsx","../src/FieldError.tsx","../src/FieldSet.tsx","../src/Form.tsx","../src/FormGroup.tsx","../src/FormHint.tsx","../src/FormField.tsx","../src/IconField.tsx","../src/Radio.tsx","../src/RadioGroup.tsx","../src/SelectField.tsx","../src/TextArea.tsx","../src/useNumberField.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype RequiredAsteriskProps = ComponentProps<'span'> & {\n  'data-test-id'?: string;\n};\n\nconst RequiredAsterisk = ({\n  className,\n  'data-test-id': testId = 'required-asterisk',\n  ...rest\n}: RequiredAsteriskProps) => {\n  const classes = cx(styles.requiredAsterisk, className);\n\n  return (\n    <span {...rest} data-test-id={testId} className={classes}>\n      *\n    </span>\n  );\n};\n\nexport { RequiredAsterisk };\nexport type { RequiredAsteriskProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { RequiredAsterisk } from './RequiredAsterisk';\nimport styles from './styles/Form.module.css';\n\ntype LabelProps = ComponentProps<'label'> & {\n  required?: boolean;\n  optional?: boolean;\n  disabled?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Label = ({\n  disabled,\n  className,\n  children,\n  required = false,\n  optional = false,\n  'data-test-id': testId = 'label',\n  ...rest\n}: LabelProps) => {\n  const classes = cx(styles.label, className, disabled && styles.labelDisabled);\n\n  return (\n    <label {...rest} data-test-id={testId} className={classes}>\n      {children}\n      {optional && !required && <small className={styles.labelOptional}>(optional)</small>}\n      {required && !optional && <RequiredAsterisk />}\n    </label>\n  );\n};\n\nexport { Label };\nexport type { LabelProps };\n","import type { ComponentProps } from 'react';\n\nimport { forwardRef } from 'react';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype CheckboxProps = ComponentProps<'input'> & {\n  /**\n   * The className to pass into the Checkbox's Label component\n   */\n  labelClassName?: string;\n  'data-test-id'?: string;\n};\n\nconst Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  (\n    {\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledby,\n      children,\n      disabled,\n      checked,\n      labelClassName,\n      'data-test-id': testId = 'checkbox',\n      ...rest\n    },\n    ref\n  ) => {\n    const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n    if (!children && !hasAriaLabel) {\n      console.warn(\n        'If you do not provide children, you must specify an aria-label for accessibility'\n      );\n    }\n\n    return (\n      <Label className={labelClassName}>\n        <input\n          {...rest}\n          ref={ref}\n          checked={checked}\n          aria-checked={checked ? 'true' : 'false'}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={styles.checkbox}\n          disabled={disabled}\n          type=\"checkbox\"\n          data-test-id={testId}\n        />{' '}\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport { Checkbox };\nexport type { CheckboxProps };\n","import { useMemo, useRef } from 'react';\n\ntype FieldPath = string | string[];\n\nconst createFieldErrorId = (fieldIdentifier?: FieldPath) =>\n  fieldIdentifier ? `${[...fieldIdentifier].join('')}-err` : undefined;\n\nfunction hasObjectChanged<T extends object>(obj1: T, obj2: T): boolean {\n  return (\n    Object.keys(obj1).length !== Object.keys(obj2).length ||\n    Object.keys(obj1).some((k) => {\n      const key = k as keyof T;\n      return typeof obj1[key] === 'object' && typeof obj2[key] === 'object'\n        ? hasObjectChanged(obj1[key] as T, obj2[key] as T)\n        : obj1[key] !== obj2[key];\n    })\n  );\n}\n\nfunction useObjectMemo<T extends object>(obj: T) {\n  const objRef = useRef(obj);\n\n  return useMemo(() => {\n    if (hasObjectChanged(obj, objRef.current)) {\n      objRef.current = obj;\n    }\n\n    return objRef.current;\n  }, [obj]);\n}\n\nexport { createFieldErrorId, useObjectMemo };\nexport type { FieldPath };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextFieldProps = ComponentProps<'input'> & {\n  suffix?: string;\n  tiny?: boolean;\n  overrideWidth?: string;\n  'data-test-id'?: string;\n};\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      className,\n      type = 'text',\n      tiny = false,\n      readOnly,\n      tabIndex = 0,\n      suffix,\n      overrideWidth,\n      'data-test-id': testId = 'text-field',\n      autoComplete,\n      ...rest\n    },\n    ref\n  ) => {\n    const classes = overrideWidth\n      ? className\n      : cx(styles.formInput, tiny && styles.formInputTiny, className);\n\n    const disablePasswordManagers = autoComplete === 'off';\n\n    if (suffix) {\n      return (\n        <div className={styles.suffixContainer}>\n          <input\n            {...rest}\n            type={type}\n            data-test-id={testId}\n            autoComplete={autoComplete}\n            className={classes}\n            readOnly={readOnly}\n            ref={ref}\n            aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n          />\n          <label className={styles.suffix} htmlFor={rest.id}>\n            {suffix}\n          </label>\n        </div>\n      );\n    }\n\n    return (\n      <input\n        {...rest}\n        data-1p-ignore={disablePasswordManagers} // \"data-1p-ignore\" is added to prevent 1Password from injecting a password autofill icon\n        type={type}\n        className={classes}\n        readOnly={readOnly}\n        tabIndex={tabIndex}\n        autoComplete={autoComplete}\n        ref={ref}\n        data-test-id={testId}\n        style={\n          overrideWidth\n            ? {\n                width: overrideWidth,\n              }\n            : undefined\n        }\n        aria-describedby={rest['aria-describedby'] || createFieldErrorId(rest.id)}\n      />\n    );\n  }\n);\n\nTextField.displayName = 'TextField';\n\nexport { TextField };\nexport type { TextFieldProps };\n","import type { TextFieldProps } from './TextField';\nimport type { FocusEvent } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef, useState } from 'react';\n\nimport { Label } from './Label';\nimport { TextField } from './TextField';\nimport styles from './styles/Form.module.css';\n\ntype CompactTextFieldProps = TextFieldProps & {\n  label: string;\n  needsErrorFeedback?: boolean;\n};\n\nconst CompactTextField = forwardRef<HTMLInputElement, CompactTextFieldProps>(\n  (\n    {\n      className,\n      id,\n      label,\n      needsErrorFeedback,\n      value,\n      onFocus,\n      onBlur,\n      'data-test-id': testId = 'compact-text-field',\n      ...rest\n    },\n    ref\n  ) => {\n    const [isActive, setIsActive] = useState(\n      (typeof value === 'boolean' || value ? value.toString() : '').trim().length !== 0\n    );\n\n    const isActiveState = isActive || needsErrorFeedback;\n\n    const classes = cx(styles.compactTextField, className, isActiveState && styles.isActive);\n\n    const placeholder = isActiveState ? '' : label;\n\n    const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n      setIsActive(true);\n      if (onFocus) {\n        onFocus(event);\n      }\n    };\n\n    const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n      const value = event.target.value || '';\n      setIsActive(value.trim().length !== 0);\n      if (onBlur) {\n        onBlur(event);\n      }\n    };\n\n    return (\n      <div className={classes} data-test-id={testId}>\n        <Label htmlFor={id}>{label}</Label>\n        <TextField\n          {...rest}\n          id={id}\n          placeholder={placeholder}\n          value={value}\n          ref={ref}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n        />\n      </div>\n    );\n  }\n);\n\nCompactTextField.displayName = 'CompactTextField';\n\nexport { CompactTextField };\nexport type { CompactTextFieldProps };\n","import type { FieldPath } from './utils';\nimport type { ComponentProps } from 'react';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype FieldErrorProps = ComponentProps<'span'> & {\n  name: FieldPath;\n  errorMessage?: string;\n  'data-test-id'?: string;\n};\n\nconst FieldError = ({\n  name,\n  errorMessage,\n  className,\n  'data-test-id': testId = 'field-error',\n  ...rest\n}: FieldErrorProps) => {\n  if (!errorMessage) {\n    return null;\n  }\n\n  return (\n    <span\n      {...rest}\n      className={cx(styles.fieldError, className)}\n      aria-live=\"polite\"\n      data-test-id={testId}\n      aria-label=\"Error\"\n      id={createFieldErrorId(name)}\n    >\n      <Icon name=\"alert-rhombus\" size=\"small\" /> {errorMessage}\n    </span>\n  );\n};\n\nexport { FieldError };\nexport type { FieldErrorProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FieldSetProps = ComponentProps<'fieldset'> & {\n  'data-test-id'?: string;\n};\n\nconst FieldSet = ({\n  children,\n  className,\n  'data-test-id': testId = 'field-set',\n  ...rest\n}: FieldSetProps) => {\n  const classes = cx(styles.fieldSet, className);\n\n  return (\n    <fieldset data-test-id={testId} className={classes} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FieldSet };\nexport type { FieldSetProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormProps = ComponentProps<'form'> & {\n  inline?: boolean;\n  // Increases margin between form fields to make room for error messages.\n  // This prevents the form from shifting when rendering a field error.\n  // This may be desired when the form contains external links that will\n  // shift while clicking if the form shifts from validation.\n  hasIncreasedErrorMargin?: boolean;\n  'data-test-id'?: string;\n};\n\nconst Form = (props: FormProps) => {\n  const {\n    className,\n    inline,\n    children,\n    hasIncreasedErrorMargin,\n    'data-test-id': testId = 'form',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.form,\n    className,\n    inline && styles.formInline,\n    !!hasIncreasedErrorMargin && styles.formIncreasedErrorMargin\n  );\n\n  return (\n    <form {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </form>\n  );\n};\n\nexport { Form };\nexport type { FormProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormGroupProps = ComponentProps<'fieldset'> & {\n  name?: string | string[];\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  'data-test-id'?: string;\n};\n\nconst FormGroup = (props: FormGroupProps) => {\n  const {\n    className,\n    name,\n    ignoreValidation,\n    isInvalid,\n    children,\n    'data-test-id': testId = 'form-group',\n    ...rest\n  } = props;\n\n  const classes = cx(\n    styles.formGroup,\n    className,\n    !ignoreValidation && isInvalid && styles.isInvalid\n  );\n\n  return (\n    <fieldset className={classes} data-test-id={testId} {...rest}>\n      {children}\n    </fieldset>\n  );\n};\n\nexport { FormGroup };\nexport type { FormGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport styles from './styles/Form.module.css';\n\ntype FormHintProps = ComponentProps<'div'> & {\n  'data-test-id'?: string;\n};\n\nconst FormHint = ({\n  className,\n  children,\n  'data-test-id': testId = 'form-hint',\n  ...rest\n}: FormHintProps) => {\n  const classes = cx(styles.hint, className);\n\n  return (\n    <div {...rest} data-test-id={testId} className={classes}>\n      {children}\n    </div>\n  );\n};\n\nexport { FormHint };\nexport type { FormHintProps };\n","import type { FieldErrorProps } from './FieldError';\nimport type { FormHintProps } from './FormHint';\nimport type { LabelProps } from './Label';\n\nimport { cx } from 'classix';\n\nimport { FieldError } from './FieldError';\nimport { FormGroup } from './FormGroup';\nimport { FormHint } from './FormHint';\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype FormFieldProps = {\n  isRequired: boolean;\n  label?: string;\n  name: string;\n  htmlFor: string;\n  hint?: string;\n  errorMessage?: string;\n  ignoreValidation?: boolean;\n  isInvalid?: boolean;\n  children: JSX.Element;\n  className?: string;\n  onBlur?: (field: string) => void;\n  'data-test-id'?: string;\n  LabelProps?: Partial<LabelProps>;\n  FormHintProps?: Partial<FormHintProps>;\n  FieldErrorProps?: Partial<FieldErrorProps>;\n};\n\nconst FormField = ({\n  isRequired,\n  label,\n  name,\n  htmlFor,\n  hint,\n  errorMessage,\n  ignoreValidation,\n  isInvalid,\n  children,\n  className,\n  onBlur,\n  'data-test-id': testId = 'form-field',\n  LabelProps = {},\n  FormHintProps = {},\n  FieldErrorProps = {},\n}: FormFieldProps) => {\n  const handleBlur = () => {\n    onBlur && onBlur(name);\n  };\n\n  return (\n    <FormGroup\n      className={cx(styles.field, className)}\n      name={name}\n      ignoreValidation={ignoreValidation}\n      isInvalid={isInvalid}\n      onBlur={handleBlur}\n      data-test-id={testId}\n    >\n      {label && (\n        <Label htmlFor={htmlFor} required={isRequired} {...LabelProps}>\n          {label}\n        </Label>\n      )}\n      {hint && (\n        <FormHint className={styles.hint} {...FormHintProps}>\n          {hint}\n        </FormHint>\n      )}\n      {children}\n      <FieldError\n        className={styles.fieldErrorMessage}\n        name={name}\n        errorMessage={errorMessage}\n        {...FieldErrorProps}\n      />\n    </FormGroup>\n  );\n};\n\nexport type { FormFieldProps };\nexport { FormField };\n","import type { IconProps } from '@launchpad-ui/icons';\nimport type { ComponentProps, ReactElement } from 'react';\n\nimport { cx } from 'classix';\nimport { cloneElement } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype IconFieldProps = ComponentProps<'div'> & {\n  icon: ReactElement<IconProps>;\n  children: JSX.Element | JSX.Element[];\n  'data-test-id'?: string;\n};\n\nconst IconField = ({\n  icon,\n  children,\n  className,\n  'data-test-id': testId = 'icon-field',\n  ...rest\n}: IconFieldProps) => {\n  const renderIcon = cloneElement(icon, { size: 'small', className: styles.iconFieldIcon });\n\n  const classes = cx(styles.iconField, className);\n\n  return (\n    <div className={classes} data-test-id={testId} {...rest}>\n      {children}\n      {renderIcon}\n    </div>\n  );\n};\n\nexport { IconField };\nexport type { IconFieldProps };\n","import type { CSSProperties, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\n\nimport { Label } from './Label';\nimport styles from './styles/Form.module.css';\n\ntype RadioProps = Omit<ComponentProps<'input'>, 'type'> & {\n  labelClassName?: string;\n  labelStyle?: CSSProperties;\n  'data-test-id'?: string;\n};\n\nconst Radio = ({\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledby,\n  checked = false,\n  children,\n  className,\n  disabled = false,\n  id,\n  labelClassName,\n  labelStyle,\n  'data-test-id': testId = 'radio',\n  ...rest\n}: RadioProps) => {\n  const hasAriaLabel = ariaLabel !== undefined || ariaLabelledby !== undefined;\n\n  if (!children && !hasAriaLabel) {\n    console.warn(\n      'If you do not provide children, you must specify an aria-label for accessibility'\n    );\n  }\n\n  return (\n    <>\n      <input\n        {...rest}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        className={cx(styles.radio, className)}\n        checked={checked}\n        disabled={disabled}\n        id={id}\n        data-test-id={testId}\n        type=\"radio\"\n      />\n      <Label className={labelClassName} htmlFor={id} style={labelStyle}>\n        {disabled ? <span className={styles.labelDisabled}>{children}</span> : children}\n      </Label>\n    </>\n  );\n};\n\nexport { Radio };\nexport type { RadioProps };\n","import type { ChangeEvent, FormEvent, ReactElement, ReactNode } from 'react';\n\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { Children, cloneElement, isValidElement, useRef } from 'react';\n\nimport { Label } from './Label';\nimport { Radio } from './Radio';\n\ntype RadioGroupProps = {\n  /**\n   * The legend that describes this groups of radio buttons. The legend\n   * is important for screen reader users.\n   */\n  legend?: string;\n  /**\n   * The children passed into the RadioGroup.\n   */\n  children?: ReactNode;\n  /**\n   * Custom classname(s) passed to the fieldset inner div.\n   */\n  className?: string;\n  /**\n   * Set the underlying Radio to disabled if the Radio's disabled prop is undefined.\n   */\n  disabled?: boolean;\n  /**\n   * The RadioGroup's id.\n   */\n  id?: string;\n  /**\n   * Name to apply to the underlying Radio. The same name value is passed to each Radio when grouping in a RadioGroup for screen reader support.\n   */\n  name: string;\n  /**\n   * This function is passed into each Radio onChange synthetic event handler.\n   */\n  onChange?(e: ChangeEvent | FormEvent<HTMLInputElement>): void;\n  /**\n   * The value to compare against the Radio's value to determine if the Radio will be checked.\n   */\n  value: string;\n\n  'data-test-id'?: string;\n};\n\nconst RadioGroup = (props: RadioGroupProps) => {\n  const {\n    name,\n    value,\n    onChange,\n    children,\n    disabled,\n    legend,\n    'data-test-id': testId = 'radio-group',\n    ...rest\n  } = props;\n  const fieldsetRef = useRef<HTMLFieldSetElement>(null);\n\n  function updateRadioElems(elem: ReactNode): ReactNode {\n    if (!isValidElement(elem)) {\n      return elem;\n    }\n\n    const item = elem as ReactElement;\n\n    if (item?.type && item.type === Radio) {\n      return cloneElement(item, {\n        ...item.props,\n        name,\n        checked: item.props.value === value,\n        onChange,\n        disabled: typeof item.props?.disabled !== 'undefined' ? item.props.disabled : disabled,\n      });\n    }\n\n    if (item?.type && item.type === Label) {\n      return cloneElement(item, {\n        ...item.props,\n        onChange,\n        disabled,\n      });\n    }\n\n    const elemChildren = item?.props?.children;\n    if (elemChildren) {\n      if (Array.isArray(elemChildren)) {\n        return cloneElement(item, {\n          children: Children.map(elemChildren, (elemChild) => updateRadioElems(elemChild)),\n        });\n      }\n      return cloneElement(item, {\n        children: updateRadioElems(elemChildren),\n      });\n    }\n\n    if (item?.type && item.type !== Radio && item.type !== Label) {\n      return item;\n    }\n\n    return null;\n  }\n\n  const radios = Children.map(children, (child) => updateRadioElems(child));\n  return (\n    <fieldset data-test-id={testId} ref={fieldsetRef}>\n      {legend && (\n        <legend>\n          <VisuallyHidden>{legend}</VisuallyHidden>\n        </legend>\n      )}\n      <div {...rest}>{radios}</div>\n    </fieldset>\n  );\n};\n\nexport { RadioGroup };\nexport type { RadioGroupProps };\n","import type { ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\n\ntype SelectFieldProps = ComponentProps<'select'> & {\n  'data-test-id'?: string;\n};\n\nconst SelectField = forwardRef<HTMLSelectElement, SelectFieldProps>(\n  ({ className, children, 'data-test-id': testId = 'select', ...rest }: SelectFieldProps, ref) => {\n    const classes = cx(styles.formInput, className);\n\n    return (\n      <select {...rest} data-test-id={testId} className={classes} ref={ref}>\n        {children}\n      </select>\n    );\n  }\n);\n\nSelectField.displayName = 'SelectField';\n\nexport { SelectField };\nexport type { SelectFieldProps };\n","import type { KeyboardEvent, ComponentProps } from 'react';\n\nimport { cx } from 'classix';\nimport { forwardRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { createFieldErrorId } from './utils';\n\ntype TextAreaProps = ComponentProps<'textarea'> & {\n  'data-test-id'?: string;\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n  ({ className, 'data-test-id': testId = 'text-area', ...props }, ref) => {\n    const onKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n      if (\n        e.key === 'ArrowRight' ||\n        e.key === 'ArrowDown' ||\n        e.key === 'ArrowUp' ||\n        e.key === 'ArrowLeft'\n      ) {\n        e.stopPropagation();\n      }\n      if (e.key === 'Escape') {\n        e.nativeEvent.stopImmediatePropagation();\n      }\n    };\n\n    return (\n      <textarea\n        {...props}\n        className={cx(styles.formInput, className)}\n        ref={ref}\n        data-test-id={testId}\n        aria-describedby={props['aria-describedby'] || createFieldErrorId(props.id)}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTextArea.displayName = 'TextArea';\n\nexport { TextArea };\nexport type { TextAreaProps };\n","import type { AriaButtonProps } from '@react-aria/button';\nimport type { AriaNumberFieldProps } from '@react-aria/numberfield';\n\nimport { Icon } from '@launchpad-ui/icons';\nimport { useButton } from '@react-aria/button';\nimport { useLocale } from '@react-aria/i18n';\nimport { useNumberField as useReactAriaNumberField } from '@react-aria/numberfield';\nimport { useNumberFieldState } from '@react-stately/numberfield';\nimport { cx } from 'classix';\nimport { useRef } from 'react';\n\nimport styles from './styles/Form.module.css';\nimport { useObjectMemo } from './utils';\n\ntype UseNumberFieldProps = AriaNumberFieldProps & {\n  className?: string;\n  'data-test-id'?: string;\n  id?: string;\n  name?: string;\n};\n\nconst defaultFormatOptions: Intl.NumberFormatOptions = {\n  maximumFractionDigits: 6,\n};\n\nconst useNumberField = ({\n  className: rootClassName,\n  'data-test-id': testId = 'input',\n  id,\n  name,\n  ...otherProps\n}: UseNumberFieldProps = {}): {\n  fieldErrorProps: ReturnType<typeof useReactAriaNumberField>['errorMessageProps'];\n  formHintProps: ReturnType<typeof useReactAriaNumberField>['descriptionProps'];\n  labelProps: ReturnType<typeof useReactAriaNumberField>['labelProps'];\n  renderNumberField: () => JSX.Element;\n} => {\n  // @react-aria's hooks have a state-updating effect somewhere that depends on \"formatOptions\",\n  // so we need to memoize it to prevent an infinite render loop.\n  const formatOptions = useObjectMemo({\n    ...defaultFormatOptions,\n    ...otherProps.formatOptions,\n  });\n  const { locale } = useLocale();\n  const numberFieldState = useNumberFieldState({ ...otherProps, locale, formatOptions });\n  const inputRef = useRef<HTMLInputElement>(null);\n  const {\n    descriptionProps: formHintProps,\n    errorMessageProps: fieldErrorProps,\n    labelProps,\n    groupProps,\n    inputProps,\n    incrementButtonProps,\n    decrementButtonProps,\n  } = useReactAriaNumberField({ ...otherProps, formatOptions, id }, numberFieldState, inputRef);\n\n  return {\n    fieldErrorProps,\n    formHintProps,\n    labelProps,\n    renderNumberField: () => (\n      <div {...groupProps} className={styles.numberField}>\n        <input\n          {...inputProps}\n          className={cx(styles.formInput, styles['numberField-input'])}\n          data-test-id={testId}\n          name={name}\n          ref={inputRef}\n        />\n        <div className={styles['numberField-stepperContainer']}>\n          <Stepper {...incrementButtonProps}>\n            <Icon name=\"expand-less\" />\n          </Stepper>\n          <Stepper {...decrementButtonProps}>\n            <Icon name=\"expand-more\" />\n          </Stepper>\n        </div>\n      </div>\n    ),\n  };\n};\n\nconst Stepper = (props: AriaButtonProps) => {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const { buttonProps } = useButton(props, buttonRef);\n\n  return (\n    <button {...buttonProps} className={styles['numberField-stepper']} ref={buttonRef}>\n      {props.children}\n    </button>\n  );\n};\n\nexport { useNumberField };\nexport type { UseNumberFieldProps };\n"],"names":["cx","jsx","forwardRef","jsxs","useRef","useMemo","suffix","label","isActive","useState","value","Icon","isInvalid","hint","cloneElement","Fragment","isValidElement","Children","VisuallyHidden","useLocale","useNumberFieldState","useReactAriaNumberField","useButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,mBAAmB,CAAC;AAAA,EACxB;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAA6B;AAC3B,QAAM,UAAUA,QAAA,GAAG,OAAO,kBAAkB,SAAS;AAGnD,SAAAC,+BAAC,UAAM,GAAG,MAAM,gBAAc,QAAQ,WAAW,SAAS,UAE1D,IAAA,CAAA;AAEJ;ACRA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAkB;AAChB,QAAM,UAAUD,QAAG,GAAA,OAAO,OAAO,WAAW,YAAY,OAAO,aAAa;AAE5E,yCACG,SAAO,EAAA,GAAG,MAAM,gBAAc,QAAQ,WAAW,SAC/C,UAAA;AAAA,IAAA;AAAA,IACA,YAAY,CAAC,YAAYC,2BAAA,IAAC,WAAM,WAAW,OAAO,eAAe,UAAU,cAAA;AAAA,IAC3E,YAAY,CAAC,YAAYA,+BAAC,kBAAiB,CAAA,CAAA;AAAA,EAC9C,EAAA,CAAA;AAEJ;ACjBA,MAAM,WAAWC,MAAA;AAAA,EACf,CACE;AAAA,IACE,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,eAAe,cAAc,UAAa,mBAAmB;AAC/D,QAAA,CAAC,YAAY,CAAC,cAAc;AACtB,cAAA;AAAA,QACN;AAAA,MAAA;AAAA,IAEJ;AAGE,WAAAC,2BAAA,KAAC,OAAM,EAAA,WAAW,gBAChB,UAAA;AAAA,MAAAF,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACE,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UACA,gBAAc,UAAU,SAAS;AAAA,UACjC,cAAY;AAAA,UACZ,mBAAiB;AAAA,UACjB,WAAW,OAAO;AAAA,UAClB;AAAA,UACA,MAAK;AAAA,UACL,gBAAc;AAAA,QAAA;AAAA,MAChB;AAAA,MAAG;AAAA,MACF,WAAYA,2BAAAA,IAAA,QAAA,EAAK,WAAW,OAAO,eAAgB,SAAS,CAAA,IAAU;AAAA,IACzE,EAAA,CAAA;AAAA,EAEJ;AACF;AAEA,SAAS,cAAc;ACpDvB,MAAM,qBAAqB,CAAC,oBAC1B,kBAAkB,GAAG,CAAC,GAAG,eAAe,EAAE,KAAK,EAAE,CAAC,SAAS;AAE7D,SAAS,iBAAmC,MAAS,MAAkB;AACrE,SACE,OAAO,KAAK,IAAI,EAAE,WAAW,OAAO,KAAK,IAAI,EAAE,UAC/C,OAAO,KAAK,IAAI,EAAE,KAAK,CAAC,MAAM;AAC5B,UAAM,MAAM;AACL,WAAA,OAAO,KAAK,GAAG,MAAM,YAAY,OAAO,KAAK,GAAG,MAAM,WACzD,iBAAiB,KAAK,GAAG,GAAQ,KAAK,GAAG,CAAM,IAC/C,KAAK,GAAG,MAAM,KAAK,GAAG;AAAA,EAAA,CAC3B;AAEL;AAEA,SAAS,cAAgC,KAAQ;AACzC,QAAA,SAASG,aAAO,GAAG;AAEzB,SAAOC,cAAQ,MAAM;AACnB,QAAI,iBAAiB,KAAK,OAAO,OAAO,GAAG;AACzC,aAAO,UAAU;AAAA,IACnB;AAEA,WAAO,OAAO;AAAA,EAAA,GACb,CAAC,GAAG,CAAC;AACV;ACdA,MAAM,YAAYH,MAAA;AAAA,EAChB,CACE;AAAA,IACE;AAAA,IACA,OAAO;AAAA,IACP,OAAO;AAAA,IACP;AAAA,IACA,WAAW;AAAA,IACX,QAAAI;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACG,UAAA,UAAU,gBACZ,YACAN,WAAG,OAAO,WAAW,QAAQ,OAAO,eAAe,SAAS;AAEhE,UAAM,0BAA0B,iBAAiB;AAEjD,QAAIM,SAAQ;AACV,aACGH,2BAAAA,KAAA,OAAA,EAAI,WAAW,OAAO,iBACrB,UAAA;AAAA,QAAAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACE,GAAG;AAAA,YACJ;AAAA,YACA,gBAAc;AAAA,YACd;AAAA,YACA,WAAW;AAAA,YACX;AAAA,YACA;AAAA,YACA,oBAAkB,KAAK,kBAAkB,KAAK,mBAAmB,KAAK,EAAE;AAAA,UAAA;AAAA,QAC1E;AAAA,QACAA,2BAAAA,IAAC,WAAM,WAAW,OAAO,QAAQ,SAAS,KAAK,IAC5C,UACHK,QAAA,CAAA;AAAA,MACF,EAAA,CAAA;AAAA,IAEJ;AAGE,WAAAL,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ,kBAAgB;AAAA,QAChB;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,OACE,gBACI;AAAA,UACE,OAAO;AAAA,QAET,IAAA;AAAA,QAEN,oBAAkB,KAAK,kBAAkB,KAAK,mBAAmB,KAAK,EAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAG9E;AACF;AAEA,UAAU,cAAc;AClExB,MAAM,mBAAmBC,MAAA;AAAA,EACvB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAAK;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,GAAG;AAAA,KAEL,QACG;AACG,UAAA,CAACC,WAAU,WAAW,IAAIC,MAAA;AAAA,OAC7B,OAAO,UAAU,aAAa,QAAQ,MAAM,SAAa,IAAA,IAAI,OAAO,WAAW;AAAA,IAAA;AAGlF,UAAM,gBAAgBD,aAAY;AAElC,UAAM,UAAUR,QAAG,GAAA,OAAO,kBAAkB,WAAW,iBAAiB,OAAO,QAAQ;AAEjF,UAAA,cAAc,gBAAgB,KAAKO;AAEnC,UAAA,cAAc,CAAC,UAAwC;AAC3D,kBAAY,IAAI;AAChB,UAAI,SAAS;AACX,gBAAQ,KAAK;AAAA,MACf;AAAA,IAAA;AAGI,UAAA,aAAa,CAAC,UAAwC;AACpDG,YAAAA,SAAQ,MAAM,OAAO,SAAS;AACpC,kBAAYA,OAAM,KAAO,EAAA,WAAW,CAAC;AACrC,UAAI,QAAQ;AACV,eAAO,KAAK;AAAA,MACd;AAAA,IAAA;AAGF,WACGP,2BAAAA,KAAA,OAAA,EAAI,WAAW,SAAS,gBAAc,QACrC,UAAA;AAAA,MAACF,2BAAA,IAAA,OAAA,EAAM,SAAS,IAAK,UAAMM,QAAA;AAAA,MAC3BN,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACE,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,QAAQ;AAAA,QAAA;AAAA,MACV;AAAA,IACF,EAAA,CAAA;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;ACzD/B,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAuB;AACrB,MAAI,CAAC,cAAc;AACV,WAAA;AAAA,EACT;AAGE,SAAAE,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAWH,QAAA,GAAG,OAAO,YAAY,SAAS;AAAA,MAC1C,aAAU;AAAA,MACV,gBAAc;AAAA,MACd,cAAW;AAAA,MACX,IAAI,mBAAmB,IAAI;AAAA,MAE3B,UAAA;AAAA,QAAAC,2BAAA,IAACU,MAAK,MAAA,EAAA,MAAK,iBAAgB,MAAK,SAAQ;AAAA,QAAE;AAAA,QAAE;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlD;AC5BA,MAAM,WAAW,CAAC;AAAA,EAChB;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAqB;AACnB,QAAM,UAAUX,QAAA,GAAG,OAAO,UAAU,SAAS;AAG3C,SAAAC,+BAAC,cAAS,gBAAc,QAAQ,WAAW,SAAU,GAAG,MACrD,SACH,CAAA;AAEJ;ACPM,MAAA,OAAO,CAAC,UAAqB;AAC3B,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,GAAG;AAAA,EACD,IAAA;AAEJ,QAAM,UAAUD,QAAA;AAAA,IACd,OAAO;AAAA,IACP;AAAA,IACA,UAAU,OAAO;AAAA,IACjB,CAAC,CAAC,2BAA2B,OAAO;AAAA,EAAA;AAIpC,SAAAC,+BAAC,UAAM,GAAG,MAAM,gBAAc,QAAQ,WAAW,SAC9C,SACH,CAAA;AAEJ;ACzBM,MAAA,YAAY,CAAC,UAA0B;AACrC,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAAW;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,GAAG;AAAA,EACD,IAAA;AAEJ,QAAM,UAAUZ,QAAA;AAAA,IACd,OAAO;AAAA,IACP;AAAA,IACA,CAAC,oBAAoBY,cAAa,OAAO;AAAA,EAAA;AAIzC,SAAAX,+BAAC,cAAS,WAAW,SAAS,gBAAc,QAAS,GAAG,MACrD,SACH,CAAA;AAEJ;ACzBA,MAAM,WAAW,CAAC;AAAA,EAChB;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAqB;AACnB,QAAM,UAAUD,QAAA,GAAG,OAAO,MAAM,SAAS;AAGvC,SAAAC,+BAAC,SAAK,GAAG,MAAM,gBAAc,QAAQ,WAAW,SAC7C,SACH,CAAA;AAEJ;ACOA,MAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA,OAAAM;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAAM;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAAD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,aAAa,CAAC;AAAA,EACd,gBAAgB,CAAC;AAAA,EACjB,kBAAkB,CAAC;AACrB,MAAsB;AACpB,QAAM,aAAa,MAAM;AACvB,cAAU,OAAO,IAAI;AAAA,EAAA;AAIrB,SAAAT,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWH,QAAA,GAAG,OAAO,OAAO,SAAS;AAAA,MACrC;AAAA,MACA;AAAA,MACA,WAAAY;AAAA,MACA,QAAQ;AAAA,MACR,gBAAc;AAAA,MAEb,UAAA;AAAA,QAAAL,yCACE,OAAM,EAAA,SAAkB,UAAU,YAAa,GAAG,YAChD,UACHA,QAAA;AAAA,QAEDM,wCACE,UAAS,EAAA,WAAW,OAAO,MAAO,GAAG,eACnC,UACHA,OAAA;AAAA,QAED;AAAA,QACDZ,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,OAAO;AAAA,YAClB;AAAA,YACA;AAAA,YACC,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;ACjEA,MAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAsB;AACd,QAAA,aAAaa,mBAAa,MAAM,EAAE,MAAM,SAAS,WAAW,OAAO,cAAA,CAAe;AAExF,QAAM,UAAUd,QAAA,GAAG,OAAO,WAAW,SAAS;AAE9C,yCACG,OAAI,EAAA,WAAW,SAAS,gBAAc,QAAS,GAAG,MAChD,UAAA;AAAA,IAAA;AAAA,IACA;AAAA,EACH,EAAA,CAAA;AAEJ;AClBA,MAAM,QAAQ,CAAC;AAAA,EACb,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,SAAS;AAAA,EACzB,GAAG;AACL,MAAkB;AACV,QAAA,eAAe,cAAc,UAAa,mBAAmB;AAE/D,MAAA,CAAC,YAAY,CAAC,cAAc;AACtB,YAAA;AAAA,MACN;AAAA,IAAA;AAAA,EAEJ;AAEA,SAEIG,2BAAA,KAAAY,qBAAA,EAAA,UAAA;AAAA,IAAAd,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,WAAWD,QAAA,GAAG,OAAO,OAAO,SAAS;AAAA,QACrC;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,MAAK;AAAA,MAAA;AAAA,IACP;AAAA,mCACC,OAAM,EAAA,WAAW,gBAAgB,SAAS,IAAI,OAAO,YACnD,UAAW,WAAAC,+BAAC,UAAK,WAAW,OAAO,eAAgB,SAAA,CAAS,IAAU,UACzE;AAAA,EACF,EAAA,CAAA;AAEJ;ACNM,MAAA,aAAa,CAAC,UAA2B;AACvC,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,SAAS;AAAA,IACzB,GAAG;AAAA,EACD,IAAA;AACE,QAAA,cAAcG,aAA4B,IAAI;AAEpD,WAAS,iBAAiB,MAA4B;;AAChD,QAAA,CAACY,MAAAA,eAAe,IAAI,GAAG;AAClB,aAAA;AAAA,IACT;AAEA,UAAM,OAAO;AAEb,SAAI,6BAAM,SAAQ,KAAK,SAAS,OAAO;AACrC,aAAOF,MAAAA,aAAa,MAAM;AAAA,QACxB,GAAG,KAAK;AAAA,QACR;AAAA,QACA,SAAS,KAAK,MAAM,UAAU;AAAA,QAC9B;AAAA,QACA,UAAU,SAAO,UAAK,UAAL,mBAAY,cAAa,cAAc,KAAK,MAAM,WAAW;AAAA,MAAA,CAC/E;AAAA,IACH;AAEA,SAAI,6BAAM,SAAQ,KAAK,SAAS,OAAO;AACrC,aAAOA,MAAAA,aAAa,MAAM;AAAA,QACxB,GAAG,KAAK;AAAA,QACR;AAAA,QACA;AAAA,MAAA,CACD;AAAA,IACH;AAEM,UAAA,gBAAe,kCAAM,UAAN,mBAAa;AAClC,QAAI,cAAc;AACZ,UAAA,MAAM,QAAQ,YAAY,GAAG;AAC/B,eAAOA,MAAAA,aAAa,MAAM;AAAA,UACxB,UAAUG,eAAS,IAAI,cAAc,CAAC,cAAc,iBAAiB,SAAS,CAAC;AAAA,QAAA,CAChF;AAAA,MACH;AACA,aAAOH,MAAAA,aAAa,MAAM;AAAA,QACxB,UAAU,iBAAiB,YAAY;AAAA,MAAA,CACxC;AAAA,IACH;AAEA,SAAI,6BAAM,SAAQ,KAAK,SAAS,SAAS,KAAK,SAAS,OAAO;AACrD,aAAA;AAAA,IACT;AAEO,WAAA;AAAA,EACT;AAEM,QAAA,SAASG,eAAS,IAAI,UAAU,CAAC,UAAU,iBAAiB,KAAK,CAAC;AACxE,SACGd,2BAAAA,KAAA,YAAA,EAAS,gBAAc,QAAQ,KAAK,aAClC,UAAA;AAAA,IAAA,UACEF,2BAAA,IAAA,UAAA,EACC,UAACA,2BAAAA,IAAAiB,eAAA,gBAAA,EAAgB,iBAAO,CAAA,GAC1B;AAAA,IAEDjB,2BAAA,IAAA,OAAA,EAAK,GAAG,MAAO,UAAO,OAAA,CAAA;AAAA,EACzB,EAAA,CAAA;AAEJ;ACvGA,MAAM,cAAcC,MAAA;AAAA,EAClB,CAAC,EAAE,WAAW,UAAU,gBAAgB,SAAS,UAAU,GAAG,KAAK,GAAqB,QAAQ;AAC9F,UAAM,UAAUF,QAAA,GAAG,OAAO,WAAW,SAAS;AAG5C,WAAAC,+BAAC,YAAQ,GAAG,MAAM,gBAAc,QAAQ,WAAW,SAAS,KACzD,SACH,CAAA;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;ACX1B,MAAM,WAAWC,MAAA;AAAA,EACf,CAAC,EAAE,WAAW,gBAAgB,SAAS,aAAa,GAAG,MAAM,GAAG,QAAQ;AAChE,UAAA,YAAY,CAAC,MAA0C;AAEzD,UAAA,EAAE,QAAQ,gBACV,EAAE,QAAQ,eACV,EAAE,QAAQ,aACV,EAAE,QAAQ,aACV;AACA,UAAE,gBAAgB;AAAA,MACpB;AACI,UAAA,EAAE,QAAQ,UAAU;AACtB,UAAE,YAAY;MAChB;AAAA,IAAA;AAIA,WAAAD,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ,WAAWD,QAAA,GAAG,OAAO,WAAW,SAAS;AAAA,QACzC;AAAA,QACA,gBAAc;AAAA,QACd,oBAAkB,MAAM,kBAAkB,KAAK,mBAAmB,MAAM,EAAE;AAAA,QAC1E;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,SAAS,cAAc;ACpBvB,MAAM,uBAAiD;AAAA,EACrD,uBAAuB;AACzB;AAEA,MAAM,iBAAiB,CAAC;AAAA,EACtB,WAAW;AAAA,EACX,gBAAgB,SAAS;AAAA,EACzB;AAAA,EACA;AAAA,EACA,GAAG;AACL,IAAyB,OAKpB;AAGH,QAAM,gBAAgB,cAAc;AAAA,IAClC,GAAG;AAAA,IACH,GAAG,WAAW;AAAA,EAAA,CACf;AACK,QAAA,EAAE,WAAWmB,KAAAA;AACnB,QAAM,mBAAmBC,YAAAA,oBAAoB,EAAE,GAAG,YAAY,QAAQ,eAAe;AAC/E,QAAA,WAAWhB,aAAyB,IAAI;AACxC,QAAA;AAAA,IACJ,kBAAkB;AAAA,IAClB,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACEiB,6BAAwB,EAAE,GAAG,YAAY,eAAe,MAAM,kBAAkB,QAAQ;AAErF,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAChBlB,gCAAA,OAAA,EAAK,GAAG,YAAY,WAAW,OAAO,aACrC,UAAA;AAAA,MAAAF,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACE,GAAG;AAAA,UACJ,WAAWD,QAAG,GAAA,OAAO,WAAW,OAAO,mBAAmB,CAAC;AAAA,UAC3D,gBAAc;AAAA,UACd;AAAA,UACA,KAAK;AAAA,QAAA;AAAA,MACP;AAAA,MACCG,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,8BAA8B,GACnD,UAAA;AAAA,QAAAF,2BAAAA,IAAC,WAAS,GAAG,sBACX,yCAACU,MAAAA,MAAK,EAAA,MAAK,eAAc,EAC3B,CAAA;AAAA,QACAV,2BAAAA,IAAC,WAAS,GAAG,sBACX,yCAACU,MAAAA,MAAK,EAAA,MAAK,eAAc,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,IAAA,GACF;AAAA,EAAA;AAGN;AAEA,MAAM,UAAU,CAAC,UAA2B;AACpC,QAAA,YAAYP,aAA0B,IAAI;AAChD,QAAM,EAAE,YAAgB,IAAAkB,OAAA,UAAU,OAAO,SAAS;AAGhD,SAAArB,2BAAA,IAAC,UAAQ,EAAA,GAAG,aAAa,WAAW,OAAO,qBAAqB,GAAG,KAAK,WACrE,UAAA,MAAM,SACT,CAAA;AAEJ;;;;;;;;;;;;;;;;;;"}

package/dist/style.css

@@ -7,7 +7,7 @@
   --lp-component-form-color-text-label-disabled: var(--lp-color-gray-400);
 }
 
-._formGroup_1u9hb_10 {
+._formGroup_19syx_10 {
   margin: 2rem 0;
   padding: 0;
   border: none;
@@ -16,57 +16,57 @@
 /* The margin for .formGroup and the min-height of .form-fieldError
   should be equal to avoid content shift when errors are shown */
 
-._formIncreasedErrorMargin_1u9hb_18 ._formGroup_1u9hb_10 {
+._formIncreasedErrorMargin_19syx_18 ._formGroup_19syx_10 {
   margin: 2.8rem 0;
 }
 
-._formInline_1u9hb_22 ._formGroup_1u9hb_10 {
+._formInline_19syx_22 ._formGroup_19syx_10 {
   display: inline-block;
   vertical-align: middle;
   margin: 0;
 }
 
-._form_1u9hb_10 ._formGroup_1u9hb_10:first-child {
+._form_19syx_10 ._formGroup_19syx_10:first-child {
   margin-top: 0;
 }
 
-._form_1u9hb_10 ._formGroup_1u9hb_10:last-child {
+._form_19syx_10 ._formGroup_19syx_10:last-child {
   margin-bottom: 0;
 }
 
-._formInput_1u9hb_36 {
+._formInput_19syx_36 {
   display: block;
   width: 100%;
   padding: 0.6rem 1rem;
   font-size: 1.3rem;
   font-family: var(--lp-font-family-base);
   line-height: var(--lp-line-height-300);
-  background-color: var(--lp-color-bg-field);
-  color: var(--lp-color-text-ui-primary);
-  border: 1px solid var(--lp-color-border-field);
+  background-color: var(--lp-color-bg-field-base);
+  color: var(--lp-color-text-ui-primary-base);
+  border: 1px solid var(--lp-color-border-field-base);
   border-radius: var(--lp-border-radius-regular);
   transition: all var(--lp-duration-100) linear;
   height: 3.2rem;
 }
 
-._formInput_1u9hb_36:-moz-placeholder-shown {
+._formInput_19syx_36:-moz-placeholder-shown {
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-._formInput_1u9hb_36:placeholder-shown {
+._formInput_19syx_36:placeholder-shown {
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-._formInput_1u9hb_36._isFocused_1u9hb_56,
-._formInput_1u9hb_36:focus {
+._formInput_19syx_36._isFocused_19syx_56,
+._formInput_19syx_36:focus {
   outline: 0;
   border-color: var(--lp-color-border-field-focus);
   box-shadow: 0 0 0 3px hsla(231.5, 100%, 62.5%, 0.1);
 }
 
-select._formInput_1u9hb_36 {
+select._formInput_19syx_36 {
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
@@ -74,58 +74,60 @@ select._formInput_1u9hb_36 {
   background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.84L12 13.42l4.59-4.58L18 10.25l-6 6-6-6 1.41-1.41z" fill="%23646f7a"/></svg>');
   background-size: 2rem;
   background-repeat: no-repeat;
-  background-position: right 0.4em top 50%, 0 0;
+  background-position:
+    right 0.4em top 50%,
+    0 0;
   padding-right: 2rem;
 }
 
-._iconField_1u9hb_73 ._formInput_1u9hb_36 {
+._iconField_19syx_75 ._formInput_19syx_36 {
   padding-left: 3rem;
 }
 
-._suffixContainer_1u9hb_77 ._formInput_1u9hb_36 {
+._suffixContainer_19syx_79 ._formInput_19syx_36 {
   border: none;
   border-radius: var(--lp-border-radius-regular) 0 0 var(--lp-border-radius-regular);
 }
 
-._isInvalid_1u9hb_82 ._formInput_1u9hb_36,
-._form_1u9hb_10 ._isInvalid_1u9hb_82 .Select-control,
-._form_1u9hb_10 ._isInvalid_1u9hb_82 .CustomSelect > div,
-._form_1u9hb_10 ._isInvalid_1u9hb_82 ._formInput_1u9hb_36 {
+._isInvalid_19syx_84 ._formInput_19syx_36,
+._form_19syx_10 ._isInvalid_19syx_84 .Select-control,
+._form_19syx_10 ._isInvalid_19syx_84 .CustomSelect > div,
+._form_19syx_10 ._isInvalid_19syx_84 ._formInput_19syx_36 {
   border-color: var(--lp-color-border-field-error);
 }
 
-._suffixContainer_1u9hb_77 ._formInput_1u9hb_36:focus {
+._suffixContainer_19syx_79 ._formInput_19syx_36:focus {
   box-shadow: none;
 }
 
-._inlineForm_1u9hb_93 ._formGroup_1u9hb_10 + ._formGroup_1u9hb_10,
-._inlineForm_1u9hb_93 ._formGroup_1u9hb_10 + .Button {
+._inlineForm_19syx_95 ._formGroup_19syx_10 + ._formGroup_19syx_10,
+._inlineForm_19syx_95 ._formGroup_19syx_10 + .Button {
   margin-left: 1rem;
 }
 
-._label_1u9hb_98 {
+._label_19syx_100 {
   font-size: 1.3rem;
   font-family: var(--lp-font-family-base);
   word-break: break-word;
 }
 
-._labelDisabled_1u9hb_104 {
+._labelDisabled_19syx_106 {
   color: var(--lp-color-gray-800);
   color: var(--lp-component-form-color-text-label-disabled);
 }
 
-._labelOptional_1u9hb_108 {
+._labelOptional_19syx_110 {
   margin-left: 0.4em;
   color: var(--lp-color-text-ui-secondary);
   fill: var(--lp-color-text-ui-secondary);
 }
 
-._compactTextField_1u9hb_114 ._label_1u9hb_98 {
+._compactTextField_19syx_116 ._label_19syx_100 {
   position: absolute;
   top: -2px;
   left: 10px;
   padding: 0 3px;
-  color: var(--lp-color-text-ui-primary);
+  color: var(--lp-color-text-ui-primary-base);
   opacity: 0;
   pointer-events: none;
   background-color: var(--lp-color-bg-ui-primary);
@@ -134,68 +136,68 @@ select._formInput_1u9hb_36 {
   z-index: 1; /* Fixes layout issue in Firefox */
 }
 
-._formGroup_1u9hb_10 ._label_1u9hb_98 {
+._formGroup_19syx_10 ._label_19syx_100 {
   display: flex;
   align-items: center;
   margin-bottom: 0.2rem;
 }
 
-._formGroup_1u9hb_10 ._label_1u9hb_98 + ._label_1u9hb_98 {
+._formGroup_19syx_10 ._label_19syx_100 + ._label_19syx_100 {
   margin-top: 0.5rem;
 }
 
-._fieldError_1u9hb_138 {
+._fieldError_19syx_140 {
   color: var(--lp-color-text-feedback-error);
   font-size: 1.3rem;
 }
 
-._fieldError_1u9hb_138 svg {
+._fieldError_19syx_140 svg {
     transform: translateY(-1px);
   }
 
 /* The margin for .formGroup and the min-height of .form-fieldError
   should be equal to avoid content shift when errors are shown */
 
-._formIncreasedErrorMargin_1u9hb_18 ._fieldError_1u9hb_138 {
+._formIncreasedErrorMargin_19syx_18 ._fieldError_19syx_140 {
   min-height: 2.8rem;
 }
 
-._label_1u9hb_98 ._fieldError_1u9hb_138 {
+._label_19syx_100 ._fieldError_19syx_140 {
   float: right;
 }
 
-._form_1u9hb_10:not(._inlineForm_1u9hb_93) ._fieldError_1u9hb_138 {
+._form_19syx_10:not(._inlineForm_19syx_95) ._fieldError_19syx_140 {
   display: block;
   padding-top: 0.5rem;
   text-align: left;
 }
 
-._formIncreasedErrorMargin_1u9hb_18:not(._inlineForm_1u9hb_93) ._fieldError_1u9hb_138 {
+._formIncreasedErrorMargin_19syx_18:not(._inlineForm_19syx_95) ._fieldError_19syx_140 {
   padding-top: 0.1rem;
   padding-bottom: 0.5rem;
 }
 
-._form_1u9hb_10 ._isInvalid_1u9hb_82 ._label_1u9hb_98 {
+._form_19syx_10 ._isInvalid_19syx_84 ._label_19syx_100 {
   color: var(--lp-color-text-feedback-error);
 }
 
-._formInput_1u9hb_36::-moz-placeholder {
+._formInput_19syx_36::-moz-placeholder {
   color: var(--lp-color-text-field-placeholder);
 }
 
-._formInput_1u9hb_36::placeholder {
+._formInput_19syx_36::placeholder {
   color: var(--lp-color-text-field-placeholder);
 }
 
-._formIncreasedErrorMargin_1u9hb_18 ._formGroup_1u9hb_10._isInvalid_1u9hb_82 {
+._formIncreasedErrorMargin_19syx_18 ._formGroup_19syx_10._isInvalid_19syx_84 {
   margin-bottom: 0;
 }
 
-._formIncreasedErrorMargin_1u9hb_18 ._formGroup_1u9hb_10._isInvalid_1u9hb_82 + ._formGroup_1u9hb_10 {
+._formIncreasedErrorMargin_19syx_18 ._formGroup_19syx_10._isInvalid_19syx_84 + ._formGroup_19syx_10 {
   margin-top: 0;
 }
 
-._hint_1u9hb_184 {
+._hint_19syx_186 {
   display: block;
   margin-top: 0.3rem;
   font-size: 1.3rem;
@@ -203,76 +205,76 @@ select._formInput_1u9hb_36 {
   color: var(--lp-color-text-ui-secondary);
 }
 
-._field_1u9hb_138 ._hint_1u9hb_184 {
+._field_19syx_140 ._hint_19syx_186 {
   margin: 0;
   font-size: 1.3rem;
   color: var(--lp-color-text-ui-secondary);
   fill: var(--lp-color-text-ui-secondary);
 }
 
-._form_1u9hb_10 ._field_1u9hb_138 label,
-._form_1u9hb_10 ._field_1u9hb_138 ._isInvalid_1u9hb_82 label {
-  color: var(--lp-color-text-ui-primary);
+._form_19syx_10 ._field_19syx_140 label,
+._form_19syx_10 ._field_19syx_140 ._isInvalid_19syx_84 label {
+  color: var(--lp-color-text-ui-primary-base);
 }
 
-._fieldErrorMessage_1u9hb_204 {
+._fieldErrorMessage_19syx_206 {
   color: var(--lp-color-text-feedback-error);
   font-size: 1.3rem;
 }
 
-._field_1u9hb_138._formGroup_1u9hb_10 {
+._field_19syx_140._formGroup_19syx_10 {
   margin: 1rem 0;
 }
 
-._field_1u9hb_138._formGroup_1u9hb_10:first-child {
+._field_19syx_140._formGroup_19syx_10:first-child {
   margin-top: 0;
 }
 
-input._formInput_1u9hb_36:-moz-read-only {
+input._formInput_19syx_36:-moz-read-only {
   opacity: 1;
   background-color: var(--lp-color-bg-field-disabled);
   color: var(--lp-color-text-field-disabled);
   border-color: var(--lp-color-border-field-disabled);
 }
 
-._formInput_1u9hb_36._isDisabled_1u9hb_217,
-input._formInput_1u9hb_36:disabled,
-select._formInput_1u9hb_36:disabled,
-input._formInput_1u9hb_36:read-only {
+._formInput_19syx_36._isDisabled_19syx_219,
+input._formInput_19syx_36:disabled,
+select._formInput_19syx_36:disabled,
+input._formInput_19syx_36:read-only {
   opacity: 1;
   background-color: var(--lp-color-bg-field-disabled);
   color: var(--lp-color-text-field-disabled);
   border-color: var(--lp-color-border-field-disabled);
 }
 
-._formInput_1u9hb_36._isDisabled_1u9hb_217:hover,
-._formInput_1u9hb_36:disabled:hover {
+._formInput_19syx_36._isDisabled_19syx_219:hover,
+._formInput_19syx_36:disabled:hover {
   cursor: not-allowed;
 }
 
-textarea._formInput_1u9hb_36 {
+textarea._formInput_19syx_36 {
   min-height: 2.5em;
   height: auto;
   resize: none;
 }
 
-textarea._formInput_1u9hb_36:-moz-read-only {
+textarea._formInput_19syx_36:-moz-read-only {
   opacity: 1;
   color: var(--lp-color-text-field-disabled);
   background-color: var(--lp-color-bg-field-disabled);
   border-color: var(--lp-color-border-field-disabled);
 }
 
-textarea._formInput_1u9hb_36:disabled,
-textarea._formInput_1u9hb_36:read-only {
+textarea._formInput_19syx_36:disabled,
+textarea._formInput_19syx_36:read-only {
   opacity: 1;
   color: var(--lp-color-text-field-disabled);
   background-color: var(--lp-color-bg-field-disabled);
   border-color: var(--lp-color-border-field-disabled);
 }
 
-input._formInput_1u9hb_36::-webkit-autofill {
-  box-shadow: 0 0 0 50px var(--lp-color-bg-field) inset;
+input._formInput_19syx_36::-webkit-autofill {
+  box-shadow: 0 0 0 50px var(--lp-color-bg-field-base) inset;
 }
 
 /* Hide the type=search cancel button in Webkit for consistency */
@@ -304,42 +306,42 @@ input[type='checkbox']:disabled {
   pointer-events: none;
 }
 
-._formInput_1u9hb_36[readonly],
-._formInput_1u9hb_36[readonly]:focus {
+._formInput_19syx_36[readonly],
+._formInput_19syx_36[readonly]:focus {
   color: var(--lp-color-text-ui-secondary);
   border-color: var(--lp-color-gray-500);
   box-shadow: none;
 }
 
-._checkbox_1u9hb_284 {
+._checkbox_19syx_286 {
   align-self: flex-start; /* Default for .label is center, but this looks bad on multi-line checkbox labels */
   flex-shrink: 0; /* Make sure the input itself doesn't shrink in flex layouts */
   margin-right: 0.5rem;
   margin-top: 0.4rem;
 }
 
-._radio_1u9hb_291 {
+._radio_19syx_293 {
   margin-right: 0.5rem;
 }
 
-._number_1u9hb_295 {
+._number_19syx_297 {
   min-width: 4.5rem;
 }
 
-._suffixContainer_1u9hb_77 {
+._suffixContainer_19syx_79 {
   display: inline-flex;
-  border: 1px solid var(--lp-color-border-field);
+  border: 1px solid var(--lp-color-border-field-base);
   border-radius: var(--lp-border-radius-regular);
   overflow: hidden;
   transition: all 0.1s linear;
 }
 
-._suffixContainer_1u9hb_77:focus-within {
+._suffixContainer_19syx_79:focus-within {
   border-color: var(--lp-color-border-field-focus);
   box-shadow: 0 0 0 3px hsla(231.5, 100%, 62.5%, 0.1);
 }
 
-._suffixContainer_1u9hb_77 ._suffix_1u9hb_77 {
+._suffixContainer_19syx_79 ._suffix_19syx_79 {
   padding: 0 2px;
   background-color: var(--lp-color-bg-field-aside);
   color: var(--lp-color-text-ui-secondary);
@@ -350,8 +352,8 @@ input[type='checkbox']:disabled {
   position: initial;
 }
 
-._suffix_1u9hb_77::-webkit-outer-spin-button,
-._suffix_1u9hb_77::-webkit-inner-spin-button {
+._suffix_19syx_79::-webkit-outer-spin-button,
+._suffix_19syx_79::-webkit-inner-spin-button {
   -webkit-appearance: none;
           appearance: none;
   margin: 0;
@@ -359,61 +361,61 @@ input[type='checkbox']:disabled {
 
 /* Firefox */
 
-._suffix_1u9hb_77[type='number'] {
+._suffix_19syx_79[type='number'] {
   -webkit-appearance: textfield;
      -moz-appearance: textfield;
           appearance: textfield;
 }
 
-._iconFieldIcon_1u9hb_333 {
+._iconFieldIcon_19syx_335 {
   position: absolute;
-  fill: var(--lp-color-fill-field);
+  fill: var(--lp-color-fill-field-base);
   top: 50%;
   transform: translateY(-50%);
   left: 1rem;
 }
 
-._formInputTiny_1u9hb_341 {
+._formInputTiny_19syx_343 {
   padding: 0.1rem 0.6rem;
   height: 2.4rem;
 }
 
-._iconField_1u9hb_73 {
+._iconField_19syx_75 {
   position: relative;
 }
 
-._requiredAsterisk_1u9hb_350 {
+._requiredAsterisk_19syx_352 {
   color: var(--lp-color-text-feedback-error);
 }
 
-._fieldSet_1u9hb_354 {
+._fieldSet_19syx_356 {
   border: none;
   margin: 2rem 0;
   padding: 0;
 }
 
-._compactTextField_1u9hb_114 {
+._compactTextField_19syx_116 {
   position: relative;
   width: 100%;
 }
 
-._compactTextField_1u9hb_114._isActive_1u9hb_365 ._label_1u9hb_98 {
+._compactTextField_19syx_116._isActive_19syx_367 ._label_19syx_100 {
   border-radius: var(--lp-border-radius-regular);
   opacity: 1;
   pointer-events: auto;
   transform: translate(0, -8px) scale(0.9); /* 2d transform to avoid webkit blurry text */
 }
 
-._numberField_1u9hb_372 {
+._numberField_19syx_374 {
   display: flex;
   position: relative;
 }
 
-._numberField_1u9hb_372 ._numberField-input_1u9hb_376 {
+._numberField_19syx_374 ._numberField-input_19syx_378 {
     padding-right: 2.4rem;
   }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 {
     display: flex;
     opacity: 0;
     flex-direction: column;
@@ -425,11 +427,11 @@ input[type='checkbox']:disabled {
     transition: all var(--lp-duration-100) linear;
   }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380 {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382 {
       --numberField-stepper-padding: 0.4rem;
       --numberField-stepper-border-radius: calc(var(--lp-border-radius-regular) - 0.1rem);
 
-      background-color: var(--lp-color-bg-field);
+      background-color: var(--lp-color-bg-field-base);
       flex: auto;
       display: flex;
       justify-content: center;
@@ -443,29 +445,29 @@ input[type='checkbox']:disabled {
       overflow: hidden;
     }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380:first-child {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382:first-child {
         border-top-right-radius: var(--numberField-stepper-border-radius);
         padding-top: var(--numberField-stepper-padding);
       }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380:last-child {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382:last-child {
         border-bottom-right-radius: var(--numberField-stepper-border-radius);
         padding-bottom: var(--numberField-stepper-padding);
       }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380:hover {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382:hover {
         background-color: var(--lp-color-bg-interactive-secondary-hover);
       }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380:active {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382:active {
         background-color: var(--lp-color-bg-interactive-secondary-active);
       }
 
-._numberField_1u9hb_372 ._numberField-stepperContainer_1u9hb_380 ._numberField-stepper_1u9hb_380 span:has(svg) {
+._numberField_19syx_374 ._numberField-stepperContainer_19syx_382 ._numberField-stepper_19syx_382 span:has(svg) {
         width: 100%;
-        color: var(--lp-color-text-ui-primary);
+        color: var(--lp-color-text-ui-primary-base);
       }
 
-._numberField_1u9hb_372:hover ._numberField-stepperContainer_1u9hb_380, ._numberField_1u9hb_372:has(input:focus) ._numberField-stepperContainer_1u9hb_380 {
+._numberField_19syx_374:hover ._numberField-stepperContainer_19syx_382, ._numberField_19syx_374:has(input:focus) ._numberField-stepperContainer_19syx_382 {
       opacity: 1;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@launchpad-ui/form",
-  "version": "0.8.18",
+  "version": "0.9.0",
   "status": "beta",
   "publishConfig": {
     "access": "public"
@@ -32,8 +32,8 @@
     "@react-aria/visually-hidden": "3.8.1",
     "@react-stately/numberfield": "3.5.0",
     "classix": "2.1.17",
-    "@launchpad-ui/icons": "~0.8.8",
-    "@launchpad-ui/tokens": "~0.5.8"
+    "@launchpad-ui/icons": "~0.9.0",
+    "@launchpad-ui/tokens": "~0.6.0"
   },
   "peerDependencies": {
     "react": "18.2.0",