@okta/odyssey-react-mui 1.9.22 → 1.10.0

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.10.0](https://github.com/okta/odyssey/compare/v1.9.23...v1.10.0) (2024-01-19)
+
+### Features
+
+- support inputmode prop in TextField ([#2091](https://github.com/okta/odyssey/issues/2091)) ([ac9f17f](https://github.com/okta/odyssey/commit/ac9f17f87e324b9861e794409e72e77f20d267c8))
+
+## [1.9.23](https://github.com/okta/odyssey/compare/v1.9.22...v1.9.23) (2024-01-17)
+
+**Note:** Version bump only for package @okta/odyssey-react-mui
+
 ## [1.9.22](https://github.com/okta/odyssey/compare/v1.9.21...v1.9.22) (2024-01-17)
 
 **Note:** Version bump only for package @okta/odyssey-react-mui

package/dist/Autocomplete.js

@@ -19,6 +19,7 @@ const Autocomplete = _ref => {
   let {
     defaultValue,
     errorMessage,
+    errorMessageList,
     hasMultipleChoices,
     id: idOverride,
     inputValue,
@@ -76,6 +77,7 @@ const Autocomplete = _ref => {
     } = _ref2;
     return _jsx(Field, {
       errorMessage: errorMessage,
+      errorMessageList: errorMessageList,
       fieldType: "single",
       hasVisibleLabel: true,
       id: InputLabelProps.htmlFor,
@@ -105,7 +107,7 @@ const Autocomplete = _ref => {
         });
       }
     });
-  }, [errorMessage, hint, HintLinkComponent, isOptional, label, nameOverride]);
+  }, [errorMessage, errorMessageList, hint, HintLinkComponent, isOptional, label, nameOverride]);
   const onChange = useCallback((event, value, reason, details) => {
     onChangeProp?.(event, value, reason, details);
   }, [onChangeProp]);

package/dist/Autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.js","names":["memo","useCallback","useMemo","useRef","Field","ComponentControlledState","useInputValues","getControlState","jsx","_jsx","Autocomplete","_ref","defaultValue","errorMessage","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","hint","HintLinkComponent","label","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","value","getIsOptionEqualToValue","testId","translate","controlledStateRef","controlledValue","uncontrolledValue","defaultValueProp","undefined","valueProps","controlState","current","inputValueProp","CONTROLLED","renderInput","_ref2","InputLabelProps","InputProps","params","fieldType","hasVisibleLabel","htmlFor","renderFieldComponent","_ref3","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","inputProps","required","event","reason","details","_Autocomplete","disableCloseOnSelect","disabled","freeSolo","filterSelectedOptions","fullWidth","loading","multiple","readOnly","isOptionEqualToValue","MemoizedAutocomplete","displayName"],"sources":["../src/Autocomplete.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n  InputBase,\n  UseAutocompleteProps,\n  AutocompleteValue,\n} from \"@mui/material\";\nimport { memo, useCallback, useMemo, useRef } from \"react\";\n\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport {\n  ComponentControlledState,\n  useInputValues,\n  getControlState,\n} from \"./inputUtils\";\n\nexport type AutocompleteProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n> = {\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"defaultValue\"];\n  /**\n   * Enables multiple choice selection\n   */\n  hasMultipleChoices?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"multiple\"];\n  /**\n   * The value for the input\n   */\n  inputValue?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"inputValue\"];\n  /**\n   * Allows the input of custom values\n   */\n  isCustomValueAllowed?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"freeSolo\"];\n  /**\n   * Disables the Autocomplete input\n   */\n  isDisabled?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"disabled\"];\n  /**\n   * Displays a loading indicator\n   */\n  isLoading?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"loading\"];\n  /**\n   * Makes the Autocomplete input read-only\n   */\n  isReadOnly?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"readOnly\"];\n  /**\n   * The label text for the autocomplete input\n   */\n  label: string;\n  /**\n   * Callback fired when the autocomplete loses focus.\n   */\n  onBlur?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onBlur\"];\n  /**\n   * Callback fired when a selection is made.\n   */\n  onChange?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onChange\"];\n  /**\n   * Callback fired when the textbox receives typed characters.\n   */\n  onInputChange?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onInputChange\"];\n  /**\n   * Callback fired when the autocomplete gains focus.\n   */\n  onFocus?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onFocus\"];\n  /**\n   * The options for the Autocomplete input\n   */\n  options: ReadonlyArray<OptionType>;\n  /**\n   * The value of the Autocomplete input\n   */\n  value?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"value\"];\n\n  /**\n   * Used to determine if the option represents the given value. Uses strict equality by default if none provided.\n   * Both arguments need to be handled, an option can only match with one value.\n   * option: the option to test\n   * value: the value to test against\n   *\n   * You will need to implement this function if your `option` items are objects.\n   */\n  getIsOptionEqualToValue?: (option: OptionType, value: OptionType) => boolean;\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isFullWidth\"\n  | \"isOptional\"\n  | \"name\"\n> &\n  AllowedProps;\n\nconst Autocomplete = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n>({\n  defaultValue,\n  errorMessage,\n  hasMultipleChoices,\n  id: idOverride,\n  inputValue,\n  isCustomValueAllowed,\n  isDisabled,\n  isFullWidth = false,\n  isLoading,\n  isOptional = false,\n  isReadOnly,\n  hint,\n  HintLinkComponent,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange: onChangeProp,\n  onInputChange: onInputChangeProp,\n  onFocus,\n  options,\n  value,\n  getIsOptionEqualToValue,\n  testId,\n  translate,\n}: AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>) => {\n  const controlledStateRef = useRef(\n    getControlState({ controlledValue: value, uncontrolledValue: defaultValue })\n  );\n  const defaultValueProp = useMemo<\n    | AutocompleteValue<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >\n    | undefined\n  >(() => {\n    if (hasMultipleChoices) {\n      if (value === undefined) {\n        return defaultValue;\n      }\n      return [] as AutocompleteValue<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >;\n    }\n    return value === undefined ? defaultValue : undefined;\n  }, [defaultValue, hasMultipleChoices, value]);\n\n  const valueProps = useInputValues({\n    defaultValue: defaultValueProp,\n    value: value,\n    controlState: controlledStateRef.current,\n  });\n\n  const inputValueProp = useMemo(() => {\n    if (controlledStateRef.current === ComponentControlledState.CONTROLLED) {\n      return { inputValue };\n    }\n    return undefined;\n  }, [inputValue]);\n\n  const renderInput = useCallback(\n    ({ InputLabelProps, InputProps, ...params }) => (\n      <Field\n        errorMessage={errorMessage}\n        fieldType=\"single\"\n        hasVisibleLabel\n        id={InputLabelProps.htmlFor}\n        hint={hint}\n        HintLinkComponent={HintLinkComponent}\n        label={label}\n        isOptional={isOptional}\n        renderFieldComponent={({\n          ariaDescribedBy,\n          id,\n          errorMessageElementId,\n          labelElementId,\n        }) => (\n          <InputBase\n            {...params}\n            {...InputProps}\n            inputProps={{\n              ...params.inputProps,\n              \"aria-errormessage\": errorMessageElementId,\n              \"aria-labelledby\": labelElementId,\n            }}\n            aria-describedby={ariaDescribedBy}\n            id={id}\n            name={nameOverride ?? id}\n            required={!isOptional}\n          />\n        )}\n      />\n    ),\n    [errorMessage, hint, HintLinkComponent, isOptional, label, nameOverride]\n  );\n  const onChange = useCallback<\n    NonNullable<\n      UseAutocompleteProps<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >[\"onChange\"]\n    >\n  >(\n    (event, value, reason, details) => {\n      onChangeProp?.(event, value, reason, details);\n    },\n    [onChangeProp]\n  );\n\n  const onInputChange = useCallback<\n    NonNullable<\n      UseAutocompleteProps<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >[\"onInputChange\"]\n    >\n  >(\n    (event, value, reason) => {\n      onInputChangeProp?.(event, value, reason);\n    },\n    [onInputChangeProp]\n  );\n\n  return (\n    <MuiAutocomplete\n      {...valueProps}\n      {...inputValueProp}\n      // AutoComplete is wrapped in a div within MUI which does not get the disabled attr. So this aria-disabled gets set in the div\n      aria-disabled={isDisabled}\n      data-se={testId}\n      disableCloseOnSelect={hasMultipleChoices}\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      filterSelectedOptions={true}\n      id={idOverride}\n      fullWidth={isFullWidth}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      onBlur={onBlur}\n      onChange={onChange}\n      onInputChange={onInputChange}\n      onFocus={onFocus}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      isOptionEqualToValue={getIsOptionEqualToValue}\n      translate={translate}\n    />\n  );\n};\n\n// Need the `typeof Autocomplete` because generics don't get passed through\nconst MemoizedAutocomplete = memo(Autocomplete) as typeof Autocomplete;\n// @ts-expect-error displayName is expected to not be on `typeof Autocomplete`\nMemoizedAutocomplete.displayName = \"Autocomplete\";\n\nexport { MemoizedAutocomplete as Autocomplete };\n"],"mappings":"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"}
+{"version":3,"file":"Autocomplete.js","names":["memo","useCallback","useMemo","useRef","Field","ComponentControlledState","useInputValues","getControlState","jsx","_jsx","Autocomplete","_ref","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","hint","HintLinkComponent","label","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","value","getIsOptionEqualToValue","testId","translate","controlledStateRef","controlledValue","uncontrolledValue","defaultValueProp","undefined","valueProps","controlState","current","inputValueProp","CONTROLLED","renderInput","_ref2","InputLabelProps","InputProps","params","fieldType","hasVisibleLabel","htmlFor","renderFieldComponent","_ref3","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","inputProps","required","event","reason","details","_Autocomplete","disableCloseOnSelect","disabled","freeSolo","filterSelectedOptions","fullWidth","loading","multiple","readOnly","isOptionEqualToValue","MemoizedAutocomplete","displayName"],"sources":["../src/Autocomplete.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  Autocomplete as MuiAutocomplete,\n  AutocompleteProps as MuiAutocompleteProps,\n  InputBase,\n  UseAutocompleteProps,\n  AutocompleteValue,\n} from \"@mui/material\";\nimport { memo, useCallback, useMemo, useRef } from \"react\";\n\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport {\n  ComponentControlledState,\n  useInputValues,\n  getControlState,\n} from \"./inputUtils\";\n\nexport type AutocompleteProps<\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n> = {\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"defaultValue\"];\n  /**\n   * Enables multiple choice selection\n   */\n  hasMultipleChoices?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"multiple\"];\n  /**\n   * The value for the input\n   */\n  inputValue?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"inputValue\"];\n  /**\n   * Allows the input of custom values\n   */\n  isCustomValueAllowed?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"freeSolo\"];\n  /**\n   * Disables the Autocomplete input\n   */\n  isDisabled?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"disabled\"];\n  /**\n   * Displays a loading indicator\n   */\n  isLoading?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"loading\"];\n  /**\n   * Makes the Autocomplete input read-only\n   */\n  isReadOnly?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"readOnly\"];\n  /**\n   * The label text for the autocomplete input\n   */\n  label: string;\n  /**\n   * Callback fired when the autocomplete loses focus.\n   */\n  onBlur?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onBlur\"];\n  /**\n   * Callback fired when a selection is made.\n   */\n  onChange?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onChange\"];\n  /**\n   * Callback fired when the textbox receives typed characters.\n   */\n  onInputChange?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onInputChange\"];\n  /**\n   * Callback fired when the autocomplete gains focus.\n   */\n  onFocus?: MuiAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"onFocus\"];\n  /**\n   * The options for the Autocomplete input\n   */\n  options: ReadonlyArray<OptionType>;\n  /**\n   * The value of the Autocomplete input\n   */\n  value?: UseAutocompleteProps<\n    OptionType,\n    HasMultipleChoices,\n    undefined,\n    IsCustomValueAllowed\n  >[\"value\"];\n\n  /**\n   * Used to determine if the option represents the given value. Uses strict equality by default if none provided.\n   * Both arguments need to be handled, an option can only match with one value.\n   * option: the option to test\n   * value: the value to test against\n   *\n   * You will need to implement this function if your `option` items are objects.\n   */\n  getIsOptionEqualToValue?: (option: OptionType, value: OptionType) => boolean;\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"errorMessageList\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isFullWidth\"\n  | \"isOptional\"\n  | \"name\"\n> &\n  AllowedProps;\n\nconst Autocomplete = <\n  OptionType,\n  HasMultipleChoices extends boolean | undefined,\n  IsCustomValueAllowed extends boolean | undefined\n>({\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  hasMultipleChoices,\n  id: idOverride,\n  inputValue,\n  isCustomValueAllowed,\n  isDisabled,\n  isFullWidth = false,\n  isLoading,\n  isOptional = false,\n  isReadOnly,\n  hint,\n  HintLinkComponent,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange: onChangeProp,\n  onInputChange: onInputChangeProp,\n  onFocus,\n  options,\n  value,\n  getIsOptionEqualToValue,\n  testId,\n  translate,\n}: AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>) => {\n  const controlledStateRef = useRef(\n    getControlState({ controlledValue: value, uncontrolledValue: defaultValue })\n  );\n  const defaultValueProp = useMemo<\n    | AutocompleteValue<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >\n    | undefined\n  >(() => {\n    if (hasMultipleChoices) {\n      if (value === undefined) {\n        return defaultValue;\n      }\n      return [] as AutocompleteValue<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >;\n    }\n    return value === undefined ? defaultValue : undefined;\n  }, [defaultValue, hasMultipleChoices, value]);\n\n  const valueProps = useInputValues({\n    defaultValue: defaultValueProp,\n    value: value,\n    controlState: controlledStateRef.current,\n  });\n\n  const inputValueProp = useMemo(() => {\n    if (controlledStateRef.current === ComponentControlledState.CONTROLLED) {\n      return { inputValue };\n    }\n    return undefined;\n  }, [inputValue]);\n\n  const renderInput = useCallback(\n    ({ InputLabelProps, InputProps, ...params }) => (\n      <Field\n        errorMessage={errorMessage}\n        errorMessageList={errorMessageList}\n        fieldType=\"single\"\n        hasVisibleLabel\n        id={InputLabelProps.htmlFor}\n        hint={hint}\n        HintLinkComponent={HintLinkComponent}\n        label={label}\n        isOptional={isOptional}\n        renderFieldComponent={({\n          ariaDescribedBy,\n          id,\n          errorMessageElementId,\n          labelElementId,\n        }) => (\n          <InputBase\n            {...params}\n            {...InputProps}\n            inputProps={{\n              ...params.inputProps,\n              \"aria-errormessage\": errorMessageElementId,\n              \"aria-labelledby\": labelElementId,\n            }}\n            aria-describedby={ariaDescribedBy}\n            id={id}\n            name={nameOverride ?? id}\n            required={!isOptional}\n          />\n        )}\n      />\n    ),\n    [\n      errorMessage,\n      errorMessageList,\n      hint,\n      HintLinkComponent,\n      isOptional,\n      label,\n      nameOverride,\n    ]\n  );\n  const onChange = useCallback<\n    NonNullable<\n      UseAutocompleteProps<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >[\"onChange\"]\n    >\n  >(\n    (event, value, reason, details) => {\n      onChangeProp?.(event, value, reason, details);\n    },\n    [onChangeProp]\n  );\n\n  const onInputChange = useCallback<\n    NonNullable<\n      UseAutocompleteProps<\n        OptionType,\n        HasMultipleChoices,\n        undefined,\n        IsCustomValueAllowed\n      >[\"onInputChange\"]\n    >\n  >(\n    (event, value, reason) => {\n      onInputChangeProp?.(event, value, reason);\n    },\n    [onInputChangeProp]\n  );\n\n  return (\n    <MuiAutocomplete\n      {...valueProps}\n      {...inputValueProp}\n      // AutoComplete is wrapped in a div within MUI which does not get the disabled attr. So this aria-disabled gets set in the div\n      aria-disabled={isDisabled}\n      data-se={testId}\n      disableCloseOnSelect={hasMultipleChoices}\n      disabled={isDisabled}\n      freeSolo={isCustomValueAllowed}\n      filterSelectedOptions={true}\n      id={idOverride}\n      fullWidth={isFullWidth}\n      loading={isLoading}\n      multiple={hasMultipleChoices}\n      onBlur={onBlur}\n      onChange={onChange}\n      onInputChange={onInputChange}\n      onFocus={onFocus}\n      options={options}\n      readOnly={isReadOnly}\n      renderInput={renderInput}\n      isOptionEqualToValue={getIsOptionEqualToValue}\n      translate={translate}\n    />\n  );\n};\n\n// Need the `typeof Autocomplete` because generics don't get passed through\nconst MemoizedAutocomplete = memo(Autocomplete) as typeof Autocomplete;\n// @ts-expect-error displayName is expected to not be on `typeof Autocomplete`\nMemoizedAutocomplete.displayName = \"Autocomplete\";\n\nexport { MemoizedAutocomplete as Autocomplete };\n"],"mappings":"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"}

package/dist/CheckboxGroup.js

@@ -17,6 +17,7 @@ const CheckboxGroup = _ref => {
   let {
     children,
     errorMessage,
+    errorMessageList,
     hint,
     HintLinkComponent,
     isDisabled,
@@ -42,6 +43,7 @@ const CheckboxGroup = _ref => {
   }, [children, testId, translate]);
   return _jsx(Field, {
     errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
     fieldType: "group",
     hasVisibleLabel: true,
     hint: hint,

package/dist/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","names":["memo","useCallback","Field","jsx","_jsx","CheckboxGroup","_ref","children","errorMessage","hint","HintLinkComponent","isDisabled","isRequired","label","testId","translate","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_FormGroup","fieldType","hasVisibleLabel","isOptional","MemoizedCheckboxGroup","displayName"],"sources":["../src/CheckboxGroup.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { FormGroup as MuiFormGroup } from \"@mui/material\";\nimport { memo, ReactElement, useCallback } from \"react\";\n\nimport { Checkbox } from \"./Checkbox\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\n\nexport type CheckboxGroupProps = {\n  /**\n   * A single Checkbox element or an array of Checkbox elements\n   */\n  children:\n    | ReactElement<typeof Checkbox>\n    | Array<ReactElement<typeof Checkbox>>;\n  /**\n   * If `true`, the CheckboxGroup is required\n   */\n  isRequired?: boolean;\n  /**\n   * The label text for the CheckboxGroup\n   */\n  label: string;\n} & Pick<\n  FieldComponentProps,\n  \"errorMessage\" | \"hint\" | \"HintLinkComponent\" | \"isDisabled\"\n> &\n  AllowedProps;\n\nconst CheckboxGroup = ({\n  children,\n  errorMessage,\n  hint,\n  HintLinkComponent,\n  isDisabled,\n  isRequired = false,\n  label,\n  testId,\n  translate,\n}: CheckboxGroupProps) => {\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, errorMessageElementId, labelElementId }) => (\n      <MuiFormGroup\n        aria-describedby={ariaDescribedBy}\n        aria-errormessage={errorMessageElementId}\n        aria-labelledby={labelElementId}\n        data-se={testId}\n        translate={translate}\n      >\n        {children}\n      </MuiFormGroup>\n    ),\n    [children, testId, translate]\n  );\n\n  return (\n    <Field\n      errorMessage={errorMessage}\n      fieldType=\"group\"\n      hasVisibleLabel={true}\n      hint={hint}\n      HintLinkComponent={HintLinkComponent}\n      isDisabled={isDisabled}\n      isOptional={!isRequired}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedCheckboxGroup = memo(CheckboxGroup);\nMemoizedCheckboxGroup.displayName = \"CheckboxGroup\";\n\nexport { MemoizedCheckboxGroup as CheckboxGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,QAAQ,OAAO;AAAC,SAG/CC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAyBd,MAAMC,aAAa,GAAGC,IAAA,IAUI;EAAA,IAVH;IACrBC,QAAQ;IACRC,YAAY;IACZC,IAAI;IACJC,iBAAiB;IACjBC,UAAU;IACVC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,MAAM;IACNC;EACkB,CAAC,GAAAT,IAAA;EACnB,MAAMU,oBAAoB,GAAGf,WAAW,CACtCgB,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAEC;IAAe,CAAC,GAAAH,KAAA;IAAA,OACzDb,IAAA,CAAAiB,UAAA;MACE,oBAAkBH,eAAgB;MAClC,qBAAmBC,qBAAsB;MACzC,mBAAiBC,cAAe;MAChC,WAASN,MAAO;MAChBC,SAAS,EAAEA,SAAU;MAAAR,QAAA,EAEpBA;IAAQ,CACG,CAAC;EAAA,CAChB,EACD,CAACA,QAAQ,EAAEO,MAAM,EAAEC,SAAS,CAC9B,CAAC;EAED,OACEX,IAAA,CAACF,KAAK;IACJM,YAAY,EAAEA,YAAa;IAC3Bc,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,IAAK;IACtBd,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,UAAU,EAAEA,UAAW;IACvBa,UAAU,EAAE,CAACZ,UAAW;IACxBC,KAAK,EAAEA,KAAM;IACbG,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMS,qBAAqB,GAAGzB,IAAI,CAACK,aAAa,CAAC;AACjDoB,qBAAqB,CAACC,WAAW,GAAG,eAAe;AAEnD,SAASD,qBAAqB,IAAIpB,aAAa"}
+{"version":3,"file":"CheckboxGroup.js","names":["memo","useCallback","Field","jsx","_jsx","CheckboxGroup","_ref","children","errorMessage","errorMessageList","hint","HintLinkComponent","isDisabled","isRequired","label","testId","translate","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_FormGroup","fieldType","hasVisibleLabel","isOptional","MemoizedCheckboxGroup","displayName"],"sources":["../src/CheckboxGroup.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { FormGroup as MuiFormGroup } from \"@mui/material\";\nimport { memo, ReactElement, useCallback } from \"react\";\n\nimport { Checkbox } from \"./Checkbox\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\n\nexport type CheckboxGroupProps = {\n  /**\n   * A single Checkbox element or an array of Checkbox elements\n   */\n  children:\n    | ReactElement<typeof Checkbox>\n    | Array<ReactElement<typeof Checkbox>>;\n  /**\n   * If `true`, the CheckboxGroup is required\n   */\n  isRequired?: boolean;\n  /**\n   * The label text for the CheckboxGroup\n   */\n  label: string;\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"errorMessageList\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"isDisabled\"\n> &\n  AllowedProps;\n\nconst CheckboxGroup = ({\n  children,\n  errorMessage,\n  errorMessageList,\n  hint,\n  HintLinkComponent,\n  isDisabled,\n  isRequired = false,\n  label,\n  testId,\n  translate,\n}: CheckboxGroupProps) => {\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, errorMessageElementId, labelElementId }) => (\n      <MuiFormGroup\n        aria-describedby={ariaDescribedBy}\n        aria-errormessage={errorMessageElementId}\n        aria-labelledby={labelElementId}\n        data-se={testId}\n        translate={translate}\n      >\n        {children}\n      </MuiFormGroup>\n    ),\n    [children, testId, translate]\n  );\n\n  return (\n    <Field\n      errorMessage={errorMessage}\n      errorMessageList={errorMessageList}\n      fieldType=\"group\"\n      hasVisibleLabel={true}\n      hint={hint}\n      HintLinkComponent={HintLinkComponent}\n      isDisabled={isDisabled}\n      isOptional={!isRequired}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedCheckboxGroup = memo(CheckboxGroup);\nMemoizedCheckboxGroup.displayName = \"CheckboxGroup\";\n\nexport { MemoizedCheckboxGroup as CheckboxGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,QAAQ,OAAO;AAAC,SAG/CC,KAAK;AAAA,SAAAC,GAAA,IAAAC,IAAA;AA6Bd,MAAMC,aAAa,GAAGC,IAAA,IAWI;EAAA,IAXH;IACrBC,QAAQ;IACRC,YAAY;IACZC,gBAAgB;IAChBC,IAAI;IACJC,iBAAiB;IACjBC,UAAU;IACVC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,MAAM;IACNC;EACkB,CAAC,GAAAV,IAAA;EACnB,MAAMW,oBAAoB,GAAGhB,WAAW,CACtCiB,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAEC;IAAe,CAAC,GAAAH,KAAA;IAAA,OACzDd,IAAA,CAAAkB,UAAA;MACE,oBAAkBH,eAAgB;MAClC,qBAAmBC,qBAAsB;MACzC,mBAAiBC,cAAe;MAChC,WAASN,MAAO;MAChBC,SAAS,EAAEA,SAAU;MAAAT,QAAA,EAEpBA;IAAQ,CACG,CAAC;EAAA,CAChB,EACD,CAACA,QAAQ,EAAEQ,MAAM,EAAEC,SAAS,CAC9B,CAAC;EAED,OACEZ,IAAA,CAACF,KAAK;IACJM,YAAY,EAAEA,YAAa;IAC3BC,gBAAgB,EAAEA,gBAAiB;IACnCc,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,IAAK;IACtBd,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,UAAU,EAAEA,UAAW;IACvBa,UAAU,EAAE,CAACZ,UAAW;IACxBC,KAAK,EAAEA,KAAM;IACbG,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMS,qBAAqB,GAAG1B,IAAI,CAACK,aAAa,CAAC;AACjDqB,qBAAqB,CAACC,WAAW,GAAG,eAAe;AAEnD,SAASD,qBAAqB,IAAIrB,aAAa"}

package/dist/ErrorMessageList.js

@@ -0,0 +1,45 @@
+import _List from "@mui/material/List";
+import _ListItem from "@mui/material/ListItem";
+/*!
+ * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
+ *
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and limitations under the License.
+ */
+import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
+import { memo, useMemo } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+const listItemStyles = {
+  display: "list-item",
+  paddingInlineStart: 0
+};
+const ErrorMessageList = _ref => {
+  let {
+    errorMessages
+  } = _ref;
+  const odysseyDesignTokens = useOdysseyDesignTokens();
+  const listStyles = useMemo(() => ({
+    listStyle: "disc",
+    paddingInlineStart: odysseyDesignTokens.Spacing4
+  }), [odysseyDesignTokens]);
+  return _jsx(_List, {
+    disablePadding: true,
+    dense: true,
+    sx: listStyles,
+    children: errorMessages.map(errorMessage => _jsx(_ListItem, {
+      disablePadding: true,
+      dense: true,
+      sx: listItemStyles,
+      children: errorMessage
+    }))
+  });
+};
+const MemoizedErrorMessageList = memo(ErrorMessageList);
+MemoizedErrorMessageList.displayName = "ErrorMessageList";
+export { MemoizedErrorMessageList as ErrorMessageList };
+//# sourceMappingURL=ErrorMessageList.js.map

package/dist/ErrorMessageList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessageList.js","names":["useOdysseyDesignTokens","memo","useMemo","jsx","_jsx","listItemStyles","display","paddingInlineStart","ErrorMessageList","_ref","errorMessages","odysseyDesignTokens","listStyles","listStyle","Spacing4","_List","disablePadding","dense","sx","children","map","errorMessage","_ListItem","MemoizedErrorMessageList","displayName"],"sources":["../src/ErrorMessageList.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { List as MuiList, ListItem as MuiListItem } from \"@mui/material\";\nimport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\nimport { memo, useMemo } from \"react\";\n\nexport type ErrorMessageListProps = {\n  errorMessages: string[];\n};\n\nconst listItemStyles = {\n  display: \"list-item\",\n  paddingInlineStart: 0,\n};\n\nconst ErrorMessageList = ({ errorMessages }: ErrorMessageListProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const listStyles = useMemo(\n    () => ({\n      listStyle: \"disc\",\n      paddingInlineStart: odysseyDesignTokens.Spacing4,\n    }),\n    [odysseyDesignTokens]\n  );\n\n  return (\n    <MuiList disablePadding dense sx={listStyles}>\n      {errorMessages.map((errorMessage) => (\n        <MuiListItem disablePadding dense sx={listItemStyles}>\n          {errorMessage}\n        </MuiListItem>\n      ))}\n    </MuiList>\n  );\n};\n\nconst MemoizedErrorMessageList = memo(ErrorMessageList);\nMemoizedErrorMessageList.displayName = \"ErrorMessageList\";\n\nexport { MemoizedErrorMessageList as ErrorMessageList };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAaSA,sBAAsB;AAC/B,SAASC,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAMtC,MAAMC,cAAc,GAAG;EACrBC,OAAO,EAAE,WAAW;EACpBC,kBAAkB,EAAE;AACtB,CAAC;AAED,MAAMC,gBAAgB,GAAGC,IAAA,IAA8C;EAAA,IAA7C;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAChE,MAAME,mBAAmB,GAAGX,sBAAsB,CAAC,CAAC;EAEpD,MAAMY,UAAU,GAAGV,OAAO,CACxB,OAAO;IACLW,SAAS,EAAE,MAAM;IACjBN,kBAAkB,EAAEI,mBAAmB,CAACG;EAC1C,CAAC,CAAC,EACF,CAACH,mBAAmB,CACtB,CAAC;EAED,OACEP,IAAA,CAAAW,KAAA;IAASC,cAAc;IAACC,KAAK;IAACC,EAAE,EAAEN,UAAW;IAAAO,QAAA,EAC1CT,aAAa,CAACU,GAAG,CAAEC,YAAY,IAC9BjB,IAAA,CAAAkB,SAAA;MAAaN,cAAc;MAACC,KAAK;MAACC,EAAE,EAAEb,cAAe;MAAAc,QAAA,EAClDE;IAAY,CACF,CACd;EAAC,CACK,CAAC;AAEd,CAAC;AAED,MAAME,wBAAwB,GAAGtB,IAAI,CAACO,gBAAgB,CAAC;AACvDe,wBAAwB,CAACC,WAAW,GAAG,kBAAkB;AAEzD,SAASD,wBAAwB,IAAIf,gBAAgB"}

package/dist/Field.js

@@ -26,6 +26,7 @@ export const fieldTypeValues = ["single", "group"];
 const Field = _ref => {
   let {
     errorMessage,
+    errorMessageList,
     fieldType,
     hasVisibleLabel,
     hint,
@@ -43,7 +44,7 @@ const Field = _ref => {
   } = useTranslation();
   const id = useUniqueId(idOverride);
   const hintId = hint ? `${id}-hint` : undefined;
-  const errorMessageElementId = errorMessage ? `${id}-error` : undefined;
+  const errorMessageElementId = errorMessage || errorMessageList ? `${id}-error` : undefined;
   const labelElementId = `${id}-label`;
   const ariaDescribedBy = useMemo(() => [hintId, errorMessageElementId].join(" ").trim() || undefined, [errorMessageElementId, hintId]);
   const {
@@ -53,7 +54,7 @@ const Field = _ref => {
   return _jsxs(_FormControl, {
     component: fieldType === "group" ? "fieldset" : "div",
     disabled: isDisabled,
-    error: Boolean(errorMessage),
+    error: Boolean(errorMessage) || Array.isArray(errorMessageList) && errorMessageList.length > 0,
     role: isRadioGroup ? "radiogroup" : undefined,
     fullWidth: isFullWidth,
     children: [fieldType === "group" ? _jsxs(_FormLabel, {
@@ -78,9 +79,10 @@ const Field = _ref => {
       errorMessageElementId,
       id,
       labelElementId
-    }), errorMessage && _jsx(FieldError, {
+    }), (errorMessage || errorMessageList) && _jsx(FieldError, {
       id: errorMessageElementId,
-      text: errorMessage
+      message: errorMessage,
+      messageList: errorMessageList
     })]
   });
 };

package/dist/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","names":["memo","useMemo","FieldError","FieldHint","FieldLabel","Typography","useFieldset","useTranslation","useUniqueId","jsxs","_jsxs","jsx","_jsx","fieldTypeValues","Field","_ref","errorMessage","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","label","renderFieldComponent","t","hintId","undefined","errorMessageElementId","labelElementId","ariaDescribedBy","join","trim","isFieldsetDisabled","_FormControl","component","disabled","error","Boolean","role","fullWidth","children","_FormLabel","color","inputId","text","LinkComponent","MemoizedField","displayName"],"sources":["../src/Field.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, ReactElement, useMemo } from \"react\";\n\nimport {\n  FormControl as MuiFormControl,\n  FormLabel as MuiFormLabel,\n} from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { FieldError } from \"./FieldError\";\nimport { FieldHint } from \"./FieldHint\";\nimport { FieldLabel } from \"./FieldLabel\";\nimport { Typography } from \"./Typography\";\nimport { useFieldset } from \"./FieldsetContext\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type FieldProps = {\n  /**\n   * The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n   */\n  fieldType: (typeof fieldTypeValues)[number];\n  /**\n   * If `true`, the Field label will be shown\n   */\n  hasVisibleLabel: boolean;\n  /**\n   * Important for narrowing down the `fieldset` role to \"radiogroup\".\n   */\n  isRadioGroup?: boolean;\n  /**\n   * Important for determining if children inherit error state\n   */\n  isCheckboxGroup?: boolean;\n  /**\n   * The label for the `input` element.\n   */\n  label: string;\n  /**\n   * The short hint displayed in the `input` before the user enters a value.\n   */\n  placeholder?: string;\n  /**\n   * Render-props function that sends back ARIA props to your field component.\n   */\n  renderFieldComponent: ({\n    ariaDescribedBy,\n    dataSe,\n    errorMessageElementId,\n    id,\n    labelElementId,\n  }: {\n    ariaDescribedBy?: string;\n    dataSe?: string;\n    errorMessageElementId?: string;\n    id: string;\n    labelElementId: string;\n  }) => ReactElement;\n};\n\nconst Field = ({\n  errorMessage,\n  fieldType,\n  hasVisibleLabel,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  isDisabled: isDisabledProp = false,\n  isFullWidth = false,\n  isRadioGroup = false,\n  isOptional = false,\n  label,\n  renderFieldComponent,\n}: FieldProps &\n  Pick<\n    FieldComponentProps,\n    | \"errorMessage\"\n    | \"hint\"\n    | \"HintLinkComponent\"\n    | \"id\"\n    | \"isDisabled\"\n    | \"isFullWidth\"\n    | \"isOptional\"\n  >) => {\n  const { t } = useTranslation();\n\n  const id = useUniqueId(idOverride);\n  const hintId = hint ? `${id}-hint` : undefined;\n  const errorMessageElementId = errorMessage ? `${id}-error` : undefined;\n  const labelElementId = `${id}-label`;\n\n  const ariaDescribedBy = useMemo(\n    () => [hintId, errorMessageElementId].join(\" \").trim() || undefined,\n    [errorMessageElementId, hintId]\n  );\n\n  const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n  const isDisabled = useMemo(\n    () => isDisabledProp || isFieldsetDisabled,\n    [isDisabledProp, isFieldsetDisabled]\n  );\n\n  return (\n    <MuiFormControl\n      component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n      disabled={isDisabled}\n      error={Boolean(errorMessage)}\n      role={isRadioGroup ? \"radiogroup\" : undefined}\n      fullWidth={isFullWidth}\n    >\n      {fieldType === \"group\" ? (\n        <MuiFormLabel component=\"legend\">\n          {label}{\" \"}\n          {isOptional && label && (\n            <Typography component=\"span\" color=\"textSecondary\">\n              ({t(\"fieldlabel.optional.text\")})\n            </Typography>\n          )}\n        </MuiFormLabel>\n      ) : (\n        <FieldLabel\n          hasVisibleLabel={hasVisibleLabel}\n          id={labelElementId}\n          inputId={id}\n          isOptional={isOptional}\n          text={label}\n        />\n      )}\n\n      {hint && (\n        <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n      )}\n\n      {renderFieldComponent({\n        ariaDescribedBy,\n        errorMessageElementId,\n        id,\n        labelElementId,\n      })}\n\n      {errorMessage && (\n        <FieldError id={errorMessageElementId} text={errorMessage} />\n      )}\n    </MuiFormControl>\n  );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":"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"}
+{"version":3,"file":"Field.js","names":["memo","useMemo","FieldError","FieldHint","FieldLabel","Typography","useFieldset","useTranslation","useUniqueId","jsxs","_jsxs","jsx","_jsx","fieldTypeValues","Field","_ref","errorMessage","errorMessageList","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","label","renderFieldComponent","t","hintId","undefined","errorMessageElementId","labelElementId","ariaDescribedBy","join","trim","isFieldsetDisabled","_FormControl","component","disabled","error","Boolean","Array","isArray","length","role","fullWidth","children","_FormLabel","color","inputId","text","LinkComponent","message","messageList","MemoizedField","displayName"],"sources":["../src/Field.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, ReactElement, useMemo } from \"react\";\n\nimport {\n  FormControl as MuiFormControl,\n  FormLabel as MuiFormLabel,\n} from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { FieldError } from \"./FieldError\";\nimport { FieldHint } from \"./FieldHint\";\nimport { FieldLabel } from \"./FieldLabel\";\nimport { Typography } from \"./Typography\";\nimport { useFieldset } from \"./FieldsetContext\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type FieldProps = {\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessage?: string;\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessageList?: string[];\n  /**\n   * The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n   */\n  fieldType: (typeof fieldTypeValues)[number];\n  /**\n   * If `true`, the Field label will be shown\n   */\n  hasVisibleLabel: boolean;\n  /**\n   * Important for narrowing down the `fieldset` role to \"radiogroup\".\n   */\n  isRadioGroup?: boolean;\n  /**\n   * Important for determining if children inherit error state\n   */\n  isCheckboxGroup?: boolean;\n  /**\n   * The label for the `input` element.\n   */\n  label: string;\n  /**\n   * The short hint displayed in the `input` before the user enters a value.\n   */\n  placeholder?: string;\n  /**\n   * Render-props function that sends back ARIA props to your field component.\n   */\n  renderFieldComponent: ({\n    ariaDescribedBy,\n    dataSe,\n    errorMessageElementId,\n    id,\n    labelElementId,\n  }: {\n    ariaDescribedBy?: string;\n    dataSe?: string;\n    errorMessageElementId?: string;\n    id: string;\n    labelElementId: string;\n  }) => ReactElement;\n};\n\nconst Field = ({\n  errorMessage,\n  errorMessageList,\n  fieldType,\n  hasVisibleLabel,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  isDisabled: isDisabledProp = false,\n  isFullWidth = false,\n  isRadioGroup = false,\n  isOptional = false,\n  label,\n  renderFieldComponent,\n}: FieldProps &\n  Pick<\n    FieldComponentProps,\n    | \"errorMessage\"\n    | \"errorMessageList\"\n    | \"hint\"\n    | \"HintLinkComponent\"\n    | \"id\"\n    | \"isDisabled\"\n    | \"isFullWidth\"\n    | \"isOptional\"\n  >) => {\n  const { t } = useTranslation();\n\n  const id = useUniqueId(idOverride);\n  const hintId = hint ? `${id}-hint` : undefined;\n  const errorMessageElementId =\n    errorMessage || errorMessageList ? `${id}-error` : undefined;\n  const labelElementId = `${id}-label`;\n\n  const ariaDescribedBy = useMemo(\n    () => [hintId, errorMessageElementId].join(\" \").trim() || undefined,\n    [errorMessageElementId, hintId]\n  );\n\n  const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n  const isDisabled = useMemo(\n    () => isDisabledProp || isFieldsetDisabled,\n    [isDisabledProp, isFieldsetDisabled]\n  );\n\n  return (\n    <MuiFormControl\n      component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n      disabled={isDisabled}\n      error={\n        Boolean(errorMessage) ||\n        (Array.isArray(errorMessageList) && errorMessageList.length > 0)\n      }\n      role={isRadioGroup ? \"radiogroup\" : undefined}\n      fullWidth={isFullWidth}\n    >\n      {fieldType === \"group\" ? (\n        <MuiFormLabel component=\"legend\">\n          {label}{\" \"}\n          {isOptional && label && (\n            <Typography component=\"span\" color=\"textSecondary\">\n              ({t(\"fieldlabel.optional.text\")})\n            </Typography>\n          )}\n        </MuiFormLabel>\n      ) : (\n        <FieldLabel\n          hasVisibleLabel={hasVisibleLabel}\n          id={labelElementId}\n          inputId={id}\n          isOptional={isOptional}\n          text={label}\n        />\n      )}\n\n      {hint && (\n        <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n      )}\n\n      {renderFieldComponent({\n        ariaDescribedBy,\n        errorMessageElementId,\n        id,\n        labelElementId,\n      })}\n\n      {(errorMessage || errorMessageList) && (\n        <FieldError\n          id={errorMessageElementId}\n          message={errorMessage}\n          messageList={errorMessageList}\n        />\n      )}\n    </MuiFormControl>\n  );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":"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"}

package/dist/FieldComponentProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldComponentProps.js","names":[],"sources":["../src/FieldComponentProps.ts"],"sourcesContent":["/*!\n * Copyright (c) 2021-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ReactElement } from \"react\";\n\nimport { HintLink } from \"./HintLink\";\n\nexport type FieldComponentProps = {\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessage?: string;\n  /**\n   * The helper text content.\n   */\n  hint?: string;\n  /**\n   * A `Link` component to provide greater context that is rendered at the end of the `hint` text\n   */\n  HintLinkComponent?: ReactElement<typeof HintLink>;\n  /**\n   * The id of the `input` element.\n   */\n  id?: string;\n  /**\n   * If `true`, the component is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, the component can stretch to fill the width of the container.\n   */\n  isFullWidth?: boolean;\n  /**\n   * If `true`, the `input` element is not required.\n   */\n  isOptional?: boolean;\n  /**\n   * It prevents the user from changing the value of the field\n   */\n  isReadOnly?: boolean;\n  /**\n   * The name of the `input` element. Defaults to the `id` if not set.\n   */\n  name?: string;\n};\n"],"mappings":""}
+{"version":3,"file":"FieldComponentProps.js","names":[],"sources":["../src/FieldComponentProps.ts"],"sourcesContent":["/*!\n * Copyright (c) 2021-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { ReactElement } from \"react\";\n\nimport { HintLink } from \"./HintLink\";\n\nexport type FieldComponentProps = {\n  /**\n   * If `error` is not undefined, the `input` will indicate an error.\n   */\n  errorMessage?: string;\n  /**\n   * If `error` is not undefined, the `input` will indicate multiple errors.\n   */\n  errorMessageList?: string[];\n  /**\n   * The helper text content.\n   */\n  hint?: string;\n  /**\n   * A `Link` component to provide greater context that is rendered at the end of the `hint` text\n   */\n  HintLinkComponent?: ReactElement<typeof HintLink>;\n  /**\n   * The id of the `input` element.\n   */\n  id?: string;\n  /**\n   * If `true`, the component is disabled.\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, the component can stretch to fill the width of the container.\n   */\n  isFullWidth?: boolean;\n  /**\n   * If `true`, the `input` element is not required.\n   */\n  isOptional?: boolean;\n  /**\n   * It prevents the user from changing the value of the field\n   */\n  isReadOnly?: boolean;\n  /**\n   * The name of the `input` element. Defaults to the `id` if not set.\n   */\n  name?: string;\n};\n"],"mappings":""}

package/dist/FieldError.js

@@ -13,14 +13,17 @@ import _FormHelperText from "@mui/material/FormHelperText";
 
 import { memo } from "react";
 import { ScreenReaderText } from "./ScreenReaderText.js";
+import { ErrorMessageList } from "./ErrorMessageList.js";
 import { useTranslation } from "react-i18next";
+import { Box } from "./Box.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const FieldError = _ref => {
   let {
     id,
+    message,
+    messageList,
     testId,
-    text,
     translate
   } = _ref;
   const {
@@ -34,7 +37,11 @@ const FieldError = _ref => {
     children: [_jsx(ScreenReaderText, {
       translate: translate,
       children: `${t("fielderror.screenreader.text")}:`
-    }), text]
+    }), _jsxs(Box, {
+      children: [message, messageList && _jsx(ErrorMessageList, {
+        errorMessages: messageList
+      })]
+    })]
   });
 };
 const MemoizedFieldError = memo(FieldError);

package/dist/FieldError.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldError.js","names":["memo","ScreenReaderText","useTranslation","jsx","_jsx","jsxs","_jsxs","FieldError","_ref","id","testId","text","translate","t","_FormHelperText","error","children","MemoizedFieldError","displayName"],"sources":["../src/FieldError.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo } from \"react\";\n\nimport { FormHelperText } from \"@mui/material\";\nimport { ScreenReaderText } from \"./ScreenReaderText\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type { AllowedProps } from \"./AllowedProps\";\n\nexport type FieldErrorProps = {\n  id?: string;\n  text: string;\n} & AllowedProps;\n\nconst FieldError = ({ id, testId, text, translate }: FieldErrorProps) => {\n  const { t } = useTranslation();\n\n  return (\n    <FormHelperText data-se={testId} error id={id} translate={translate}>\n      <ScreenReaderText translate={translate}>{`${t(\n        \"fielderror.screenreader.text\"\n      )}:`}</ScreenReaderText>\n      {text}\n    </FormHelperText>\n  );\n};\n\nconst MemoizedFieldError = memo(FieldError);\nMemoizedFieldError.displayName = \"FieldError\";\n\nexport { MemoizedFieldError as FieldError };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAQ,OAAO;AAAC,SAGpBC,gBAAgB;AACzB,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAS/C,MAAMC,UAAU,GAAGC,IAAA,IAAsD;EAAA,IAArD;IAAEC,EAAE;IAAEC,MAAM;IAAEC,IAAI;IAAEC;EAA2B,CAAC,GAAAJ,IAAA;EAClE,MAAM;IAAEK;EAAE,CAAC,GAAGX,cAAc,CAAC,CAAC;EAE9B,OACEI,KAAA,CAAAQ,eAAA;IAAgB,WAASJ,MAAO;IAACK,KAAK;IAACN,EAAE,EAAEA,EAAG;IAACG,SAAS,EAAEA,SAAU;IAAAI,QAAA,GAClEZ,IAAA,CAACH,gBAAgB;MAACW,SAAS,EAAEA,SAAU;MAAAI,QAAA,EAAG,GAAEH,CAAC,CAC3C,8BACF,CAAE;IAAE,CAAmB,CAAC,EACvBF,IAAI;EAAA,CACS,CAAC;AAErB,CAAC;AAED,MAAMM,kBAAkB,GAAGjB,IAAI,CAACO,UAAU,CAAC;AAC3CU,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIV,UAAU"}
+{"version":3,"file":"FieldError.js","names":["memo","ScreenReaderText","ErrorMessageList","useTranslation","Box","jsx","_jsx","jsxs","_jsxs","FieldError","_ref","id","message","messageList","testId","translate","t","_FormHelperText","error","children","errorMessages","MemoizedFieldError","displayName"],"sources":["../src/FieldError.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo } from \"react\";\n\nimport { FormHelperText } from \"@mui/material\";\nimport { ScreenReaderText } from \"./ScreenReaderText\";\nimport { ErrorMessageList } from \"./ErrorMessageList\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { Box } from \"./Box\";\n\nexport type FieldErrorProps = {\n  id?: string;\n  message?: string;\n  messageList?: string[];\n} & AllowedProps;\n\nconst FieldError = ({\n  id,\n  message,\n  messageList,\n  testId,\n  translate,\n}: FieldErrorProps) => {\n  const { t } = useTranslation();\n\n  return (\n    <FormHelperText data-se={testId} error id={id} translate={translate}>\n      <ScreenReaderText translate={translate}>{`${t(\n        \"fielderror.screenreader.text\"\n      )}:`}</ScreenReaderText>\n      <Box>\n        {message}\n        {messageList && <ErrorMessageList errorMessages={messageList} />}\n      </Box>\n    </FormHelperText>\n  );\n};\n\nconst MemoizedFieldError = memo(FieldError);\nMemoizedFieldError.displayName = \"FieldError\";\n\nexport { MemoizedFieldError as FieldError };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAQ,OAAO;AAAC,SAGpBC,gBAAgB;AAAA,SAChBC,gBAAgB;AACzB,SAASC,cAAc,QAAQ,eAAe;AAAC,SAGtCC,GAAG;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAQZ,MAAMC,UAAU,GAAGC,IAAA,IAMI;EAAA,IANH;IAClBC,EAAE;IACFC,OAAO;IACPC,WAAW;IACXC,MAAM;IACNC;EACe,CAAC,GAAAL,IAAA;EAChB,MAAM;IAAEM;EAAE,CAAC,GAAGb,cAAc,CAAC,CAAC;EAE9B,OACEK,KAAA,CAAAS,eAAA;IAAgB,WAASH,MAAO;IAACI,KAAK;IAACP,EAAE,EAAEA,EAAG;IAACI,SAAS,EAAEA,SAAU;IAAAI,QAAA,GAClEb,IAAA,CAACL,gBAAgB;MAACc,SAAS,EAAEA,SAAU;MAAAI,QAAA,EAAG,GAAEH,CAAC,CAC3C,8BACF,CAAE;IAAE,CAAmB,CAAC,EACxBR,KAAA,CAACJ,GAAG;MAAAe,QAAA,GACDP,OAAO,EACPC,WAAW,IAAIP,IAAA,CAACJ,gBAAgB;QAACkB,aAAa,EAAEP;MAAY,CAAE,CAAC;IAAA,CAC7D,CAAC;EAAA,CACQ,CAAC;AAErB,CAAC;AAED,MAAMQ,kBAAkB,GAAGrB,IAAI,CAACS,UAAU,CAAC;AAC3CY,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIZ,UAAU"}

package/dist/NativeSelect.js

@@ -19,6 +19,7 @@ const NativeSelect = forwardRef((_ref, ref) => {
   let {
     defaultValue,
     errorMessage,
+    errorMessageList,
     hasMultipleChoices: hasMultipleChoicesProp,
     hint,
     HintLinkComponent,
@@ -77,6 +78,7 @@ const NativeSelect = forwardRef((_ref, ref) => {
   }, [children, idOverride, inputValues, hasMultipleChoices, onBlur, onChange, onFocus, ref, testId, translate]);
   return _jsx(Field, {
     errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
     fieldType: "single",
     hasVisibleLabel: true,
     hint: hint,

package/dist/NativeSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"NativeSelect.js","names":["React","forwardRef","memo","useCallback","useMemo","useRef","Field","getControlState","useInputValues","jsx","_jsx","NativeSelect","_ref","ref","defaultValue","errorMessage","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","isDisabled","isFullWidth","isMultiSelect","isOptional","label","onBlur","onChange","onChangeProp","onFocus","testId","translate","value","children","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","child","undefined","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_Select","inputProps","name","multiple","native","fieldType","hasVisibleLabel","MemoizedNativeSelect","displayName"],"sources":["../src/NativeSelect.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport React, {\n  ReactElement,\n  forwardRef,\n  memo,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport {\n  Select as MuiSelect,\n  SelectProps as MuiSelectProps,\n} from \"@mui/material\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\nimport { ForwardRefWithType } from \"./@types/react-augment\";\n\nexport type NativeSelectOption = {\n  text: string;\n  value?: string;\n  type?: \"heading\" | \"option\";\n};\n\nexport type NativeSelectValueType<HasMultipleChoices> =\n  HasMultipleChoices extends true ? string[] : string;\n\nexport type NativeSelectProps<\n  Value extends NativeSelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean\n> = {\n  /**\n   * The options or optgroup elements within the NativeSelect\n   */\n  children?: ReactElement<\"option\"> | ReactElement<\"optgroup\">;\n  /**\n   * The default value of the NativeSelect. Use when component is uncontrolled\n   */\n  defaultValue?: Value;\n  /**\n   * If `true`, the Select allows multiple selections\n   */\n  hasMultipleChoices?: HasMultipleChoices;\n  /**\n   * @deprecated Use `hasMultipleChoices` instead\n   */\n  /** **Deprecated:** use `hasMultipleChoices` */\n  isMultiSelect?: HasMultipleChoices;\n  /**\n   * The label text for the NativeSelect\n   */\n  label: string;\n  /**\n   * Callback fired when the NativeSelect loses focus\n   */\n  onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n  /**\n   * Callback fired when the value of the NativeSelect changes\n   */\n  onChange?: MuiSelectProps<Value>[\"onChange\"];\n  /**\n   * Callback fired when the NativeSelect gains focus\n   */\n  onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n  options: Value;\n  /**\n   * The value or values selected in the NativeSelect. Use when component is controlled\n   */\n  value?: Value;\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isDisabled\"\n  | \"isFullWidth\"\n  | \"isOptional\"\n> &\n  AllowedProps;\n\nconst NativeSelect: ForwardRefWithType = forwardRef(\n  <\n    Value extends NativeSelectValueType<HasMultipleChoices>,\n    HasMultipleChoices extends boolean\n  >(\n    {\n      defaultValue,\n      errorMessage,\n      hasMultipleChoices: hasMultipleChoicesProp,\n      hint,\n      HintLinkComponent,\n      id: idOverride,\n      isDisabled = false,\n      isFullWidth = false,\n      isMultiSelect,\n      isOptional = false,\n      label,\n      onBlur,\n      onChange: onChangeProp,\n      onFocus,\n      testId,\n      translate,\n      value,\n      children,\n    }: NativeSelectProps<Value, HasMultipleChoices>,\n    ref?: React.Ref<ReactElement>\n  ) => {\n    const controlledStateRef = useRef(\n      getControlState({\n        controlledValue: value,\n        uncontrolledValue: defaultValue,\n      })\n    );\n    const inputValues = useInputValues({\n      defaultValue,\n      value,\n      controlState: controlledStateRef.current,\n    });\n\n    const onChange = useCallback<\n      NonNullable<MuiSelectProps<Value>[\"onChange\"]>\n    >(\n      (event, child) => {\n        onChangeProp?.(event, child);\n      },\n      [onChangeProp]\n    );\n\n    const hasMultipleChoices = useMemo(\n      () =>\n        hasMultipleChoicesProp === undefined\n          ? isMultiSelect\n          : hasMultipleChoicesProp,\n      [hasMultipleChoicesProp, isMultiSelect]\n    );\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, errorMessageElementId, labelElementId }) => (\n        <MuiSelect\n          {...inputValues}\n          aria-describedby={ariaDescribedBy}\n          children={children}\n          data-se={testId}\n          id={idOverride}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n          }}\n          name={idOverride}\n          multiple={hasMultipleChoices}\n          native={true}\n          onBlur={onBlur}\n          onChange={onChange}\n          onFocus={onFocus}\n          ref={ref}\n          translate={translate}\n        />\n      ),\n      [\n        children,\n        idOverride,\n        inputValues,\n        hasMultipleChoices,\n        onBlur,\n        onChange,\n        onFocus,\n        ref,\n        testId,\n        translate,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        HintLinkComponent={HintLinkComponent}\n        id={idOverride}\n        isDisabled={isDisabled}\n        isFullWidth={isFullWidth}\n        isOptional={isOptional}\n        label={label}\n        renderFieldComponent={renderFieldComponent}\n      />\n    );\n  }\n);\n\nconst MemoizedNativeSelect = memo(NativeSelect);\nMemoizedNativeSelect.displayName = \"NativeSelect\";\n\nexport { MemoizedNativeSelect as NativeSelect };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAEVC,UAAU,EACVC,IAAI,EACJC,WAAW,EACXC,OAAO,EACPC,MAAM,QACD,OAAO;AAAC,SAKNC,KAAK;AAAA,SAGLC,eAAe,EAAEC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAkExC,MAAMC,YAAgC,GAAGV,UAAU,CACjD,CAAAW,IAAA,EAwBEC,GAA6B,KAC1B;EAAA,IArBH;IACEC,YAAY;IACZC,YAAY;IACZC,kBAAkB,EAAEC,sBAAsB;IAC1CC,IAAI;IACJC,iBAAiB;IACjBC,EAAE,EAAEC,UAAU;IACdC,UAAU,GAAG,KAAK;IAClBC,WAAW,GAAG,KAAK;IACnBC,aAAa;IACbC,UAAU,GAAG,KAAK;IAClBC,KAAK;IACLC,MAAM;IACNC,QAAQ,EAAEC,YAAY;IACtBC,OAAO;IACPC,MAAM;IACNC,SAAS;IACTC,KAAK;IACLC;EAC4C,CAAC,GAAAtB,IAAA;EAG/C,MAAMuB,kBAAkB,GAAG9B,MAAM,CAC/BE,eAAe,CAAC;IACd6B,eAAe,EAAEH,KAAK;IACtBI,iBAAiB,EAAEvB;EACrB,CAAC,CACH,CAAC;EACD,MAAMwB,WAAW,GAAG9B,cAAc,CAAC;IACjCM,YAAY;IACZmB,KAAK;IACLM,YAAY,EAAEJ,kBAAkB,CAACK;EACnC,CAAC,CAAC;EAEF,MAAMZ,QAAQ,GAAGzB,WAAW,CAG1B,CAACsC,KAAK,EAAEC,KAAK,KAAK;IAChBb,YAAY,GAAGY,KAAK,EAAEC,KAAK,CAAC;EAC9B,CAAC,EACD,CAACb,YAAY,CACf,CAAC;EAED,MAAMb,kBAAkB,GAAGZ,OAAO,CAChC,MACEa,sBAAsB,KAAK0B,SAAS,GAChCnB,aAAa,GACbP,sBAAsB,EAC5B,CAACA,sBAAsB,EAAEO,aAAa,CACxC,CAAC;EACD,MAAMoB,oBAAoB,GAAGzC,WAAW,CACtC0C,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAEC;IAAe,CAAC,GAAAH,KAAA;IAAA,OACzDnC,IAAA,CAAAuC,OAAA;MAAA,GACMX,WAAW;MACf,oBAAkBQ,eAAgB;MAClCZ,QAAQ,EAAEA,QAAS;MACnB,WAASH,MAAO;MAChBX,EAAE,EAAEC,UAAW;MACf6B,UAAU,EAAE;QACV,mBAAmB,EAAEH,qBAAqB;QAC1C,iBAAiB,EAAEC;MACrB,CAAE;MACFG,IAAI,EAAE9B,UAAW;MACjB+B,QAAQ,EAAEpC,kBAAmB;MAC7BqC,MAAM,EAAE,IAAK;MACb1B,MAAM,EAAEA,MAAO;MACfC,QAAQ,EAAEA,QAAS;MACnBE,OAAO,EAAEA,OAAQ;MACjBjB,GAAG,EAAEA,GAAI;MACTmB,SAAS,EAAEA;IAAU,CACtB,CAAC;EAAA,CACH,EACD,CACEE,QAAQ,EACRb,UAAU,EACViB,WAAW,EACXtB,kBAAkB,EAClBW,MAAM,EACNC,QAAQ,EACRE,OAAO,EACPjB,GAAG,EACHkB,MAAM,EACNC,SAAS,CAEb,CAAC;EAED,OACEtB,IAAA,CAACJ,KAAK;IACJS,YAAY,EAAEA,YAAa;IAC3BuC,SAAS,EAAC,QAAQ;IAClBC,eAAe;IACfrC,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBC,WAAW,EAAEA,WAAY;IACzBE,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA,KAAM;IACbkB,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CACF,CAAC;AAED,MAAMY,oBAAoB,GAAGtD,IAAI,CAACS,YAAY,CAAC;AAC/C6C,oBAAoB,CAACC,WAAW,GAAG,cAAc;AAEjD,SAASD,oBAAoB,IAAI7C,YAAY"}
+{"version":3,"file":"NativeSelect.js","names":["React","forwardRef","memo","useCallback","useMemo","useRef","Field","getControlState","useInputValues","jsx","_jsx","NativeSelect","_ref","ref","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","isDisabled","isFullWidth","isMultiSelect","isOptional","label","onBlur","onChange","onChangeProp","onFocus","testId","translate","value","children","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","child","undefined","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_Select","inputProps","name","multiple","native","fieldType","hasVisibleLabel","MemoizedNativeSelect","displayName"],"sources":["../src/NativeSelect.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport React, {\n  ReactElement,\n  forwardRef,\n  memo,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport {\n  Select as MuiSelect,\n  SelectProps as MuiSelectProps,\n} from \"@mui/material\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\nimport { ForwardRefWithType } from \"./@types/react-augment\";\n\nexport type NativeSelectOption = {\n  text: string;\n  value?: string;\n  type?: \"heading\" | \"option\";\n};\n\nexport type NativeSelectValueType<HasMultipleChoices> =\n  HasMultipleChoices extends true ? string[] : string;\n\nexport type NativeSelectProps<\n  Value extends NativeSelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean\n> = {\n  /**\n   * The options or optgroup elements within the NativeSelect\n   */\n  children?: ReactElement<\"option\"> | ReactElement<\"optgroup\">;\n  /**\n   * The default value of the NativeSelect. Use when component is uncontrolled\n   */\n  defaultValue?: Value;\n  /**\n   * If `true`, the Select allows multiple selections\n   */\n  hasMultipleChoices?: HasMultipleChoices;\n  /**\n   * @deprecated Use `hasMultipleChoices` instead\n   */\n  /** **Deprecated:** use `hasMultipleChoices` */\n  isMultiSelect?: HasMultipleChoices;\n  /**\n   * The label text for the NativeSelect\n   */\n  label: string;\n  /**\n   * Callback fired when the NativeSelect loses focus\n   */\n  onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n  /**\n   * Callback fired when the value of the NativeSelect changes\n   */\n  onChange?: MuiSelectProps<Value>[\"onChange\"];\n  /**\n   * Callback fired when the NativeSelect gains focus\n   */\n  onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n  options: Value;\n  /**\n   * The value or values selected in the NativeSelect. Use when component is controlled\n   */\n  value?: Value;\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"errorMessageList\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isDisabled\"\n  | \"isFullWidth\"\n  | \"isOptional\"\n> &\n  AllowedProps;\n\nconst NativeSelect: ForwardRefWithType = forwardRef(\n  <\n    Value extends NativeSelectValueType<HasMultipleChoices>,\n    HasMultipleChoices extends boolean\n  >(\n    {\n      defaultValue,\n      errorMessage,\n      errorMessageList,\n      hasMultipleChoices: hasMultipleChoicesProp,\n      hint,\n      HintLinkComponent,\n      id: idOverride,\n      isDisabled = false,\n      isFullWidth = false,\n      isMultiSelect,\n      isOptional = false,\n      label,\n      onBlur,\n      onChange: onChangeProp,\n      onFocus,\n      testId,\n      translate,\n      value,\n      children,\n    }: NativeSelectProps<Value, HasMultipleChoices>,\n    ref?: React.Ref<ReactElement>\n  ) => {\n    const controlledStateRef = useRef(\n      getControlState({\n        controlledValue: value,\n        uncontrolledValue: defaultValue,\n      })\n    );\n    const inputValues = useInputValues({\n      defaultValue,\n      value,\n      controlState: controlledStateRef.current,\n    });\n\n    const onChange = useCallback<\n      NonNullable<MuiSelectProps<Value>[\"onChange\"]>\n    >(\n      (event, child) => {\n        onChangeProp?.(event, child);\n      },\n      [onChangeProp]\n    );\n\n    const hasMultipleChoices = useMemo(\n      () =>\n        hasMultipleChoicesProp === undefined\n          ? isMultiSelect\n          : hasMultipleChoicesProp,\n      [hasMultipleChoicesProp, isMultiSelect]\n    );\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, errorMessageElementId, labelElementId }) => (\n        <MuiSelect\n          {...inputValues}\n          aria-describedby={ariaDescribedBy}\n          children={children}\n          data-se={testId}\n          id={idOverride}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n          }}\n          name={idOverride}\n          multiple={hasMultipleChoices}\n          native={true}\n          onBlur={onBlur}\n          onChange={onChange}\n          onFocus={onFocus}\n          ref={ref}\n          translate={translate}\n        />\n      ),\n      [\n        children,\n        idOverride,\n        inputValues,\n        hasMultipleChoices,\n        onBlur,\n        onChange,\n        onFocus,\n        ref,\n        testId,\n        translate,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        errorMessageList={errorMessageList}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        HintLinkComponent={HintLinkComponent}\n        id={idOverride}\n        isDisabled={isDisabled}\n        isFullWidth={isFullWidth}\n        isOptional={isOptional}\n        label={label}\n        renderFieldComponent={renderFieldComponent}\n      />\n    );\n  }\n);\n\nconst MemoizedNativeSelect = memo(NativeSelect);\nMemoizedNativeSelect.displayName = \"NativeSelect\";\n\nexport { MemoizedNativeSelect as NativeSelect };\n"],"mappings":"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"}

package/dist/PasswordField.js

@@ -23,6 +23,7 @@ const PasswordField = forwardRef((_ref, ref) => {
     autoCompleteType,
     defaultValue,
     errorMessage,
+    errorMessageList,
     hasInitialFocus,
     hint,
     id: idOverride,
@@ -112,6 +113,7 @@ const PasswordField = forwardRef((_ref, ref) => {
   }, [autoCompleteType, hasInitialFocus, inputValues, t, togglePasswordVisibility, inputType, nameOverride, onChange, onFocus, onBlur, placeholder, isOptional, isReadOnly, hasShowPassword, ref, testId, translate]);
   return _jsx(Field, {
     errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
     fieldType: "single",
     hasVisibleLabel: true,
     hint: hint,

package/dist/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.js","names":["forwardRef","memo","useCallback","useImperativeHandle","useRef","useState","ShowIcon","HideIcon","Field","useTranslation","getControlState","useInputValues","jsx","_jsx","PasswordField","_ref","ref","autoCompleteType","defaultValue","errorMessage","hasInitialFocus","hint","id","idOverride","inputFocusRef","isDisabled","isFullWidth","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","placeholder","testId","translate","value","t","inputType","setInputType","togglePasswordVisibility","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","inputRef","element","focus","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","endAdornment","_InputAdornment","position","children","_IconButton","onClick","inputProps","role","readOnly","required","type","fieldType","hasVisibleLabel","MemoizedPasswordField","displayName"],"sources":["../src/PasswordField.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { InputAdornment, InputBase, IconButton } from \"@mui/material\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  memo,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { ShowIcon, HideIcon } from \"./icons.generated\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { useTranslation } from \"react-i18next\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\nimport { FocusHandle } from \"./@types/react-augment\";\n\nexport type PasswordFieldProps = {\n  /**\n   * This prop helps users to fill forms faster, especially on mobile devices.\n   * The name can be confusing, as it's more like an autofill.\n   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n   */\n  autoCompleteType?: \"current-password\" | \"new-password\";\n  /**\n   * initial value for input. Use when component in uncontrolled.\n   */\n  defaultValue?: string;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * If `true`, the show/hide icon is not shown to the user\n   */\n  hasShowPassword?: boolean;\n  /**\n   * The ref forwarded to the TextField to expose focus()\n   */\n  inputFocusRef?: React.RefObject<FocusHandle>;\n  /**\n   * The label for the `input` element.\n   */\n  label: string;\n  /**\n   * Callback fired when the `input` element loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n  /**\n   * Callback fired when the value is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;\n  /**\n   * Callback fired when the `input` element get focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n  /**\n   * The short hint displayed in the `input` before the user enters a value.\n   */\n  placeholder?: string;\n  /**\n   * The value of the `input` element. Use when component is controlled.\n   */\n  value?: string;\n} & FieldComponentProps &\n  AllowedProps;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n  (\n    {\n      autoCompleteType,\n      defaultValue,\n      errorMessage,\n      hasInitialFocus,\n      hint,\n      id: idOverride,\n      inputFocusRef,\n      isDisabled = false,\n      isFullWidth = false,\n      isOptional = false,\n      hasShowPassword = true,\n      isReadOnly,\n      label,\n      name: nameOverride,\n      onChange: onChangeProp,\n      onFocus,\n      onBlur,\n      placeholder,\n      testId,\n      translate,\n      value,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [inputType, setInputType] = useState(\"password\");\n\n    const togglePasswordVisibility = useCallback(() => {\n      setInputType((inputType) =>\n        inputType === \"password\" ? \"text\" : \"password\"\n      );\n    }, []);\n\n    const controlledStateRef = useRef(\n      getControlState({\n        controlledValue: value,\n        uncontrolledValue: defaultValue,\n      })\n    );\n    const inputValues = useInputValues({\n      defaultValue,\n      value,\n      controlState: controlledStateRef.current,\n    });\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle(\n      inputFocusRef,\n      () => {\n        const element = inputRef.current;\n        return {\n          focus: () => {\n            element && element.focus();\n          },\n        };\n      },\n      []\n    );\n\n    const onChange = useCallback<\n      ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>\n    >(\n      (event) => {\n        onChangeProp?.(event);\n      },\n      [onChangeProp]\n    );\n\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n        <InputBase\n          {...inputValues}\n          aria-describedby={ariaDescribedBy}\n          autoComplete={inputType === \"password\" ? autoCompleteType : \"off\"}\n          /* eslint-disable-next-line jsx-a11y/no-autofocus */\n          autoFocus={hasInitialFocus}\n          data-se={testId}\n          endAdornment={\n            hasShowPassword && (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  aria-label={\n                    inputType === \"password\"\n                      ? t(\"passwordfield.icon.label.show\")\n                      : t(\"passwordfield.icon.label.hide\")\n                  }\n                  onClick={togglePasswordVisibility}\n                >\n                  {inputType === \"password\" ? <ShowIcon /> : <HideIcon />}\n                </IconButton>\n              </InputAdornment>\n            )\n          }\n          id={id}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n            // role: \"textbox\" Added because password inputs don't have an implicit role assigned. This causes problems with element selection.\n            role: \"textbox\",\n          }}\n          inputRef={inputRef}\n          name={nameOverride ?? id}\n          onChange={onChange}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          placeholder={placeholder}\n          readOnly={isReadOnly}\n          ref={ref}\n          required={!isOptional}\n          translate={translate}\n          type={inputType}\n        />\n      ),\n      [\n        autoCompleteType,\n        hasInitialFocus,\n        inputValues,\n        t,\n        togglePasswordVisibility,\n        inputType,\n        nameOverride,\n        onChange,\n        onFocus,\n        onBlur,\n        placeholder,\n        isOptional,\n        isReadOnly,\n        hasShowPassword,\n        ref,\n        testId,\n        translate,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        id={idOverride}\n        isDisabled={isDisabled}\n        isFullWidth={isFullWidth}\n        isOptional={isOptional}\n        label={label}\n        renderFieldComponent={renderFieldComponent}\n      />\n    );\n  }\n);\n\nconst MemoizedPasswordField = memo(PasswordField);\nMemoizedPasswordField.displayName = \"PasswordField\";\n\nexport { MemoizedPasswordField as PasswordField };\n"],"mappings":"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"}
+{"version":3,"file":"PasswordField.js","names":["forwardRef","memo","useCallback","useImperativeHandle","useRef","useState","ShowIcon","HideIcon","Field","useTranslation","getControlState","useInputValues","jsx","_jsx","PasswordField","_ref","ref","autoCompleteType","defaultValue","errorMessage","errorMessageList","hasInitialFocus","hint","id","idOverride","inputFocusRef","isDisabled","isFullWidth","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","placeholder","testId","translate","value","t","inputType","setInputType","togglePasswordVisibility","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","inputRef","element","focus","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","endAdornment","_InputAdornment","position","children","_IconButton","onClick","inputProps","role","readOnly","required","type","fieldType","hasVisibleLabel","MemoizedPasswordField","displayName"],"sources":["../src/PasswordField.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { InputAdornment, InputBase, IconButton } from \"@mui/material\";\nimport {\n  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  memo,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { ShowIcon, HideIcon } from \"./icons.generated\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { useTranslation } from \"react-i18next\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\nimport { FocusHandle } from \"./@types/react-augment\";\n\nexport type PasswordFieldProps = {\n  /**\n   * This prop helps users to fill forms faster, especially on mobile devices.\n   * The name can be confusing, as it's more like an autofill.\n   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n   */\n  autoCompleteType?: \"current-password\" | \"new-password\";\n  /**\n   * initial value for input. Use when component in uncontrolled.\n   */\n  defaultValue?: string;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * If `true`, the show/hide icon is not shown to the user\n   */\n  hasShowPassword?: boolean;\n  /**\n   * The ref forwarded to the TextField to expose focus()\n   */\n  inputFocusRef?: React.RefObject<FocusHandle>;\n  /**\n   * The label for the `input` element.\n   */\n  label: string;\n  /**\n   * Callback fired when the `input` element loses focus.\n   */\n  onBlur?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n  /**\n   * Callback fired when the value is changed.\n   */\n  onChange?: ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;\n  /**\n   * Callback fired when the `input` element get focus.\n   */\n  onFocus?: FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;\n  /**\n   * The short hint displayed in the `input` before the user enters a value.\n   */\n  placeholder?: string;\n  /**\n   * The value of the `input` element. Use when component is controlled.\n   */\n  value?: string;\n} & FieldComponentProps &\n  AllowedProps;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n  (\n    {\n      autoCompleteType,\n      defaultValue,\n      errorMessage,\n      errorMessageList,\n      hasInitialFocus,\n      hint,\n      id: idOverride,\n      inputFocusRef,\n      isDisabled = false,\n      isFullWidth = false,\n      isOptional = false,\n      hasShowPassword = true,\n      isReadOnly,\n      label,\n      name: nameOverride,\n      onChange: onChangeProp,\n      onFocus,\n      onBlur,\n      placeholder,\n      testId,\n      translate,\n      value,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [inputType, setInputType] = useState(\"password\");\n\n    const togglePasswordVisibility = useCallback(() => {\n      setInputType((inputType) =>\n        inputType === \"password\" ? \"text\" : \"password\"\n      );\n    }, []);\n\n    const controlledStateRef = useRef(\n      getControlState({\n        controlledValue: value,\n        uncontrolledValue: defaultValue,\n      })\n    );\n    const inputValues = useInputValues({\n      defaultValue,\n      value,\n      controlState: controlledStateRef.current,\n    });\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle(\n      inputFocusRef,\n      () => {\n        const element = inputRef.current;\n        return {\n          focus: () => {\n            element && element.focus();\n          },\n        };\n      },\n      []\n    );\n\n    const onChange = useCallback<\n      ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>\n    >(\n      (event) => {\n        onChangeProp?.(event);\n      },\n      [onChangeProp]\n    );\n\n    const renderFieldComponent = useCallback(\n      ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n        <InputBase\n          {...inputValues}\n          aria-describedby={ariaDescribedBy}\n          autoComplete={inputType === \"password\" ? autoCompleteType : \"off\"}\n          /* eslint-disable-next-line jsx-a11y/no-autofocus */\n          autoFocus={hasInitialFocus}\n          data-se={testId}\n          endAdornment={\n            hasShowPassword && (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  aria-label={\n                    inputType === \"password\"\n                      ? t(\"passwordfield.icon.label.show\")\n                      : t(\"passwordfield.icon.label.hide\")\n                  }\n                  onClick={togglePasswordVisibility}\n                >\n                  {inputType === \"password\" ? <ShowIcon /> : <HideIcon />}\n                </IconButton>\n              </InputAdornment>\n            )\n          }\n          id={id}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n            // role: \"textbox\" Added because password inputs don't have an implicit role assigned. This causes problems with element selection.\n            role: \"textbox\",\n          }}\n          inputRef={inputRef}\n          name={nameOverride ?? id}\n          onChange={onChange}\n          onFocus={onFocus}\n          onBlur={onBlur}\n          placeholder={placeholder}\n          readOnly={isReadOnly}\n          ref={ref}\n          required={!isOptional}\n          translate={translate}\n          type={inputType}\n        />\n      ),\n      [\n        autoCompleteType,\n        hasInitialFocus,\n        inputValues,\n        t,\n        togglePasswordVisibility,\n        inputType,\n        nameOverride,\n        onChange,\n        onFocus,\n        onBlur,\n        placeholder,\n        isOptional,\n        isReadOnly,\n        hasShowPassword,\n        ref,\n        testId,\n        translate,\n      ]\n    );\n\n    return (\n      <Field\n        errorMessage={errorMessage}\n        errorMessageList={errorMessageList}\n        fieldType=\"single\"\n        hasVisibleLabel\n        hint={hint}\n        id={idOverride}\n        isDisabled={isDisabled}\n        isFullWidth={isFullWidth}\n        isOptional={isOptional}\n        label={label}\n        renderFieldComponent={renderFieldComponent}\n      />\n    );\n  }\n);\n\nconst MemoizedPasswordField = memo(PasswordField);\nMemoizedPasswordField.displayName = \"PasswordField\";\n\nexport { MemoizedPasswordField as PasswordField };\n"],"mappings":"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"}

package/dist/RadioGroup.js

@@ -19,6 +19,7 @@ const RadioGroup = _ref => {
     children,
     defaultValue,
     errorMessage,
+    errorMessageList,
     hint,
     HintLinkComponent,
     id: idOverride,
@@ -64,6 +65,7 @@ const RadioGroup = _ref => {
   }, [children, inputValues, nameOverride, onChange, testId, translate]);
   return _jsx(Field, {
     errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
     fieldType: "group",
     hasVisibleLabel: false,
     hint: hint,

package/dist/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["memo","useCallback","useRef","Field","getControlState","useInputValues","jsx","_jsx","RadioGroup","_ref","children","defaultValue","errorMessage","hint","HintLinkComponent","id","idOverride","isDisabled","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_RadioGroup","fieldType","hasVisibleLabel","MemoizedRadioGroup","displayName"],"sources":["../src/RadioGroup.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  RadioGroup as MuiRadioGroup,\n  type RadioGroupProps as MuiRadioGroupProps,\n} from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useRef } from \"react\";\n\nimport { Radio, RadioProps } from \"./Radio\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\n\nexport type RadioGroupProps = {\n  /**\n   * The Radio components within the group. Must include two or more.\n   */\n  children: Array<ReactElement<typeof Radio>>;\n  /**\n   * The text value of the Radio that should be selected by default\n   */\n  defaultValue?: string;\n  /**\n   * The text label for the RadioGroup\n   */\n  label: string;\n  /**\n   * Listen for changes in the browser that change `value`\n   */\n  onChange?: MuiRadioGroupProps[\"onChange\"];\n  /**\n   * The `value` on the selected Radio\n   */\n  value?: RadioProps[\"value\"];\n} & Pick<\n  FieldComponentProps,\n  \"errorMessage\" | \"hint\" | \"HintLinkComponent\" | \"id\" | \"isDisabled\" | \"name\"\n> &\n  AllowedProps;\n\nconst RadioGroup = ({\n  children,\n  defaultValue,\n  errorMessage,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  isDisabled,\n  label,\n  name: nameOverride,\n  onChange: onChangeProp,\n  testId,\n  translate,\n  value,\n}: RadioGroupProps) => {\n  const controlledStateRef = useRef(\n    getControlState({ controlledValue: value, uncontrolledValue: defaultValue })\n  );\n  const inputValues = useInputValues({\n    defaultValue,\n    value,\n    controlState: controlledStateRef.current,\n  });\n\n  const onChange = useCallback<NonNullable<MuiRadioGroupProps[\"onChange\"]>>(\n    (event, value) => {\n      onChangeProp?.(event, value);\n    },\n    [onChangeProp]\n  );\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n      <MuiRadioGroup\n        {...inputValues}\n        aria-describedby={ariaDescribedBy}\n        aria-errormessage={errorMessageElementId}\n        aria-labelledby={labelElementId}\n        data-se={testId}\n        id={id}\n        name={nameOverride ?? id}\n        onChange={onChange}\n        translate={translate}\n      >\n        {children}\n      </MuiRadioGroup>\n    ),\n    [children, inputValues, nameOverride, onChange, testId, translate]\n  );\n\n  return (\n    <Field\n      errorMessage={errorMessage}\n      fieldType=\"group\"\n      hasVisibleLabel={false}\n      hint={hint}\n      HintLinkComponent={HintLinkComponent}\n      id={idOverride}\n      isDisabled={isDisabled}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedRadioGroup = memo(RadioGroup);\nMemoizedRadioGroup.displayName = \"RadioGroup\";\n\nexport { MemoizedRadioGroup as RadioGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAAC,SAGvDC,KAAK;AAAA,SAGLC,eAAe,EAAEC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AA6BxC,MAAMC,UAAU,GAAGC,IAAA,IAcI;EAAA,IAdH;IAClBC,QAAQ;IACRC,YAAY;IACZC,YAAY;IACZC,IAAI;IACJC,iBAAiB;IACjBC,EAAE,EAAEC,UAAU;IACdC,UAAU;IACVC,KAAK;IACLC,IAAI,EAAEC,YAAY;IAClBC,QAAQ,EAAEC,YAAY;IACtBC,MAAM;IACNC,SAAS;IACTC;EACe,CAAC,GAAAhB,IAAA;EAChB,MAAMiB,kBAAkB,GAAGxB,MAAM,CAC/BE,eAAe,CAAC;IAAEuB,eAAe,EAAEF,KAAK;IAAEG,iBAAiB,EAAEjB;EAAa,CAAC,CAC7E,CAAC;EACD,MAAMkB,WAAW,GAAGxB,cAAc,CAAC;IACjCM,YAAY;IACZc,KAAK;IACLK,YAAY,EAAEJ,kBAAkB,CAACK;EACnC,CAAC,CAAC;EAEF,MAAMV,QAAQ,GAAGpB,WAAW,CAC1B,CAAC+B,KAAK,EAAEP,KAAK,KAAK;IAChBH,YAAY,GAAGU,KAAK,EAAEP,KAAK,CAAC;EAC9B,CAAC,EACD,CAACH,YAAY,CACf,CAAC;EACD,MAAMW,oBAAoB,GAAGhC,WAAW,CACtCiC,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAErB,EAAE;MAAEsB;IAAe,CAAC,GAAAH,KAAA;IAAA,OAC7D3B,IAAA,CAAA+B,WAAA;MAAA,GACMT,WAAW;MACf,oBAAkBM,eAAgB;MAClC,qBAAmBC,qBAAsB;MACzC,mBAAiBC,cAAe;MAChC,WAASd,MAAO;MAChBR,EAAE,EAAEA,EAAG;MACPI,IAAI,EAAEC,YAAY,IAAIL,EAAG;MACzBM,QAAQ,EAAEA,QAAS;MACnBG,SAAS,EAAEA,SAAU;MAAAd,QAAA,EAEpBA;IAAQ,CACI,CAAC;EAAA,CACjB,EACD,CAACA,QAAQ,EAAEmB,WAAW,EAAET,YAAY,EAAEC,QAAQ,EAAEE,MAAM,EAAEC,SAAS,CACnE,CAAC;EAED,OACEjB,IAAA,CAACJ,KAAK;IACJS,YAAY,EAAEA,YAAa;IAC3B2B,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,KAAM;IACvB3B,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA,KAAM;IACbe,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMQ,kBAAkB,GAAGzC,IAAI,CAACQ,UAAU,CAAC;AAC3CiC,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIjC,UAAU"}
+{"version":3,"file":"RadioGroup.js","names":["memo","useCallback","useRef","Field","getControlState","useInputValues","jsx","_jsx","RadioGroup","_ref","children","defaultValue","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","isDisabled","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","renderFieldComponent","_ref2","ariaDescribedBy","errorMessageElementId","labelElementId","_RadioGroup","fieldType","hasVisibleLabel","MemoizedRadioGroup","displayName"],"sources":["../src/RadioGroup.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n  RadioGroup as MuiRadioGroup,\n  type RadioGroupProps as MuiRadioGroupProps,\n} from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useRef } from \"react\";\n\nimport { Radio, RadioProps } from \"./Radio\";\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport type { AllowedProps } from \"./AllowedProps\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\n\nexport type RadioGroupProps = {\n  /**\n   * The Radio components within the group. Must include two or more.\n   */\n  children: Array<ReactElement<typeof Radio>>;\n  /**\n   * The text value of the Radio that should be selected by default\n   */\n  defaultValue?: string;\n  /**\n   * The text label for the RadioGroup\n   */\n  label: string;\n  /**\n   * Listen for changes in the browser that change `value`\n   */\n  onChange?: MuiRadioGroupProps[\"onChange\"];\n  /**\n   * The `value` on the selected Radio\n   */\n  value?: RadioProps[\"value\"];\n} & Pick<\n  FieldComponentProps,\n  | \"errorMessage\"\n  | \"errorMessageList\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isDisabled\"\n  | \"name\"\n> &\n  AllowedProps;\n\nconst RadioGroup = ({\n  children,\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  isDisabled,\n  label,\n  name: nameOverride,\n  onChange: onChangeProp,\n  testId,\n  translate,\n  value,\n}: RadioGroupProps) => {\n  const controlledStateRef = useRef(\n    getControlState({ controlledValue: value, uncontrolledValue: defaultValue })\n  );\n  const inputValues = useInputValues({\n    defaultValue,\n    value,\n    controlState: controlledStateRef.current,\n  });\n\n  const onChange = useCallback<NonNullable<MuiRadioGroupProps[\"onChange\"]>>(\n    (event, value) => {\n      onChangeProp?.(event, value);\n    },\n    [onChangeProp]\n  );\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n      <MuiRadioGroup\n        {...inputValues}\n        aria-describedby={ariaDescribedBy}\n        aria-errormessage={errorMessageElementId}\n        aria-labelledby={labelElementId}\n        data-se={testId}\n        id={id}\n        name={nameOverride ?? id}\n        onChange={onChange}\n        translate={translate}\n      >\n        {children}\n      </MuiRadioGroup>\n    ),\n    [children, inputValues, nameOverride, onChange, testId, translate]\n  );\n\n  return (\n    <Field\n      errorMessage={errorMessage}\n      errorMessageList={errorMessageList}\n      fieldType=\"group\"\n      hasVisibleLabel={false}\n      hint={hint}\n      HintLinkComponent={HintLinkComponent}\n      id={idOverride}\n      isDisabled={isDisabled}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedRadioGroup = memo(RadioGroup);\nMemoizedRadioGroup.displayName = \"RadioGroup\";\n\nexport { MemoizedRadioGroup as RadioGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAAC,SAGvDC,KAAK;AAAA,SAGLC,eAAe,EAAEC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAmCxC,MAAMC,UAAU,GAAGC,IAAA,IAeI;EAAA,IAfH;IAClBC,QAAQ;IACRC,YAAY;IACZC,YAAY;IACZC,gBAAgB;IAChBC,IAAI;IACJC,iBAAiB;IACjBC,EAAE,EAAEC,UAAU;IACdC,UAAU;IACVC,KAAK;IACLC,IAAI,EAAEC,YAAY;IAClBC,QAAQ,EAAEC,YAAY;IACtBC,MAAM;IACNC,SAAS;IACTC;EACe,CAAC,GAAAjB,IAAA;EAChB,MAAMkB,kBAAkB,GAAGzB,MAAM,CAC/BE,eAAe,CAAC;IAAEwB,eAAe,EAAEF,KAAK;IAAEG,iBAAiB,EAAElB;EAAa,CAAC,CAC7E,CAAC;EACD,MAAMmB,WAAW,GAAGzB,cAAc,CAAC;IACjCM,YAAY;IACZe,KAAK;IACLK,YAAY,EAAEJ,kBAAkB,CAACK;EACnC,CAAC,CAAC;EAEF,MAAMV,QAAQ,GAAGrB,WAAW,CAC1B,CAACgC,KAAK,EAAEP,KAAK,KAAK;IAChBH,YAAY,GAAGU,KAAK,EAAEP,KAAK,CAAC;EAC9B,CAAC,EACD,CAACH,YAAY,CACf,CAAC;EACD,MAAMW,oBAAoB,GAAGjC,WAAW,CACtCkC,KAAA;IAAA,IAAC;MAAEC,eAAe;MAAEC,qBAAqB;MAAErB,EAAE;MAAEsB;IAAe,CAAC,GAAAH,KAAA;IAAA,OAC7D5B,IAAA,CAAAgC,WAAA;MAAA,GACMT,WAAW;MACf,oBAAkBM,eAAgB;MAClC,qBAAmBC,qBAAsB;MACzC,mBAAiBC,cAAe;MAChC,WAASd,MAAO;MAChBR,EAAE,EAAEA,EAAG;MACPI,IAAI,EAAEC,YAAY,IAAIL,EAAG;MACzBM,QAAQ,EAAEA,QAAS;MACnBG,SAAS,EAAEA,SAAU;MAAAf,QAAA,EAEpBA;IAAQ,CACI,CAAC;EAAA,CACjB,EACD,CAACA,QAAQ,EAAEoB,WAAW,EAAET,YAAY,EAAEC,QAAQ,EAAEE,MAAM,EAAEC,SAAS,CACnE,CAAC;EAED,OACElB,IAAA,CAACJ,KAAK;IACJS,YAAY,EAAEA,YAAa;IAC3BC,gBAAgB,EAAEA,gBAAiB;IACnC2B,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,KAAM;IACvB3B,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA,KAAM;IACbe,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMQ,kBAAkB,GAAG1C,IAAI,CAACQ,UAAU,CAAC;AAC3CkC,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIlC,UAAU"}

package/dist/Select.js

@@ -30,6 +30,7 @@ const Select = _ref => {
   let {
     defaultValue,
     errorMessage,
+    errorMessageList,
     hasMultipleChoices: hasMultipleChoicesProp,
     hint,
     HintLinkComponent,
@@ -156,6 +157,7 @@ const Select = _ref => {
   }, [children, inputValues, hasMultipleChoices, nameOverride, onBlur, onChange, onFocus, renderValue, testId, translate]);
   return _jsx(Field, {
     errorMessage: errorMessage,
+    errorMessageList: errorMessageList,
     fieldType: "single",
     hasVisibleLabel: true,
     hint: hint,