npm - @okta/odyssey-react-mui - Versions diffs - 1.42.0 → 1.44.0 - Mend

@okta/odyssey-react-mui 1.42.0 → 1.44.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1482) hide show

package/dist/cjs/PasswordField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordField.cjs","names":["_react","require","_index","_Field","_reactI18next","_inputUtils","_jsxRuntime","_interopRequireDefault","e","__esModule","default","PasswordField","forwardRef","ariaDescribedBy","autoCompleteType","defaultValue","errorMessage","errorMessageList","hasInitialFocus","hint","id","idOverride","inputRef","isDisabled","isFullWidth","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","placeholder","testId","translate","value","ref","t","useTranslation","inputType","setInputType","useState","togglePasswordVisibility","useCallback","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","localInputRef","useImperativeHandle","focus","event","renderFieldComponent","errorMessageElementId","labelElementId","jsx","_InputBase2","autoComplete","autoFocus","endAdornment","_InputAdornment2","position","children","_IconButton2","onClick","ShowIcon","HideIcon","inputProps","role","readOnly","required","type","Field","fieldType","hasVisibleLabel","MemoizedPasswordField","exports","memo","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/index.js\";\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport type { HtmlProps } from \"./HtmlProps.js\";\nimport { useTranslation } from \"react-i18next\";\nimport { FocusHandle, getControlState, useInputValues } from \"./inputUtils.js\";\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\n /\n inputRef?: 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 Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" \| \"labelElementId\">;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n (\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasInitialFocus,\n hint,\n id: idOverride,\n inputRef,\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 localInputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\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 ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: FieldRenderProps) => (\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 endAdornment={\n hasShowPassword && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-controls={id}\n aria-label={\n inputType === \"password\"\n ? t(\"passwordfield.icon.label.show\")\n : t(\"passwordfield.icon.label.hide\")\n }\n aria-pressed={inputType === \"text\"}\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 \"data-se\": testId,\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={localInputRef}\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 ariaDescribedBy={ariaDescribedBy}\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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","ignoreList":[]}
1	+ {"version":3,"file":"PasswordField.cjs","names":["_react","require","_reactI18next","_Field","_index","_inputUtils","_jsxRuntime","_interopRequireDefault","e","__esModule","default","PasswordField","forwardRef","ariaDescribedBy","autoCompleteType","defaultValue","errorMessage","errorMessageList","hasInitialFocus","hint","id","idOverride","inputRef","isDisabled","isFullWidth","isOptional","hasShowPassword","isReadOnly","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","placeholder","testId","translate","value","ref","t","useTranslation","inputType","setInputType","useState","togglePasswordVisibility","useCallback","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","localInputRef","useImperativeHandle","focus","event","renderFieldComponent","errorMessageElementId","labelElementId","jsx","_InputBase2","autoComplete","autoFocus","endAdornment","_InputAdornment2","position","children","_IconButton2","onClick","ShowIcon","HideIcon","inputProps","role","readOnly","required","type","Field","fieldType","hasVisibleLabel","MemoizedPasswordField","exports","memo","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 { IconButton, InputAdornment, InputBase } from \"@mui/material\";\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n memo,\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport { HideIcon, ShowIcon } from \"./icons.generated/index.js\";\nimport { FocusHandle, getControlState, useInputValues } from \"./inputUtils.js\";\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\n /\n inputRef?: 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 Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" \| \"labelElementId\">;\n\nconst PasswordField = forwardRef<HTMLInputElement, PasswordFieldProps>(\n (\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasInitialFocus,\n hint,\n id: idOverride,\n inputRef,\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 localInputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\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 ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: FieldRenderProps) => (\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 endAdornment={\n hasShowPassword && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-controls={id}\n aria-label={t(\"passwordfield.icon.label.show\")}\n aria-pressed={inputType === \"text\"}\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 \"data-se\": testId,\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={localInputRef}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\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 ariaDescribedBy={ariaDescribedBy}\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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","ignoreList":[]}

package/dist/cjs/Radio.cjs CHANGED Viewed

@@ -7,8 +7,8 @@ exports.Radio = void 0;
 var _FormHelperText2 = _interopRequireDefault(require("@mui/material/FormHelperText"));
 var _FormControlLabel2 = _interopRequireDefault(require("@mui/material/FormControlLabel"));
 var _Radio2 = _interopRequireDefault(require("@mui/material/Radio"));
-var _react = require("react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _react = require("react");
 var _OdysseyDesignTokensContext = require("./OdysseyDesignTokensContext.cjs");
 var _Typography = require("./Typography.cjs");
 var _useUniqueId = require("./useUniqueId.cjs");
@@ -88,6 +88,7 @@ const Radio = ({
       checked: isChecked,
       className: isInvalid ? "Mui-error" : "",
       control: (0, _jsxRuntime.jsx)(_Radio2.default, {
+        disabled: isDisabled,
         inputProps: {
           "aria-describedby": hintId,
           "aria-disabled": isDisabled || isReadOnly,
@@ -97,15 +98,12 @@ const Radio = ({
         },
         inputRef: localInputRef,
         onChange: onChange,
-        onClick: onClick || handleClick,
-        disabled: isDisabled
+        onClick: onClick || handleClick
       }),
+      disabled: isDisabled,
       label: label,
       name: name,
-      translate: translate,
-      value: value,
       onBlur: onBlur,
-      disabled: isDisabled,
       sx: {
         ...(isReadOnly && {
           cursor: "default",
@@ -118,7 +116,9 @@ const Radio = ({
             marginBlockEnd: 0
           }
         })
-      }
+      },
+      translate: translate,
+      value: value
     }), hint && (0, _jsxRuntime.jsx)(HintContainerWithInlineStartSpacing, {
       odysseyDesignTokens: odysseyDesignTokens,
       children: (0, _jsxRuntime.jsx)(_FormHelperText2.default, {

package/dist/cjs/Radio.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Radio.cjs","names":["_react","require","_styled","_interopRequireDefault","_OdysseyDesignTokensContext","_Typography","_useUniqueId","_jsxRuntime","e","__esModule","default","HintContainerWithInlineStartSpacing","styled","div","odysseyDesignTokens","paddingInlineStart","TypographyLineHeightUi","Spacing2","marginBlockEnd","color","TypographyColorSubordinate","Radio","hint","id","idOverride","inputRef","isChecked","isDisabled","isInvalid","label","labelProp","name","testId","translate","value","isReadOnly","onChange","onChangeProp","onBlur","onBlurProp","onClick","localInputRef","useRef","useOdysseyDesignTokens","useUniqueId","hintId","undefined","useImperativeHandle","focus","current","useMemo","jsx","Typography","component","children","useCallback","event","checked","preventDefault","handleClick","stopPropagation","jsxs","Fragment","_FormControlLabel2","className","control","_Radio2","inputProps","readOnly","tabIndex","disabled","sx","cursor","_FormHelperText2","MemoizedRadio","exports","memo","displayName"],"sources":["../../src/Radio.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, useCallback, useMemo, useRef, useImperativeHandle } from \"react\";\nimport {\n FormControlLabel,\n FormControlLabelProps as MuiFormControlLabelProps,\n FormHelperText,\n Radio as MuiRadio,\n RadioProps as MuiRadioProps,\n} from \"@mui/material\";\nimport styled from \"@emotion/styled\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport type { HtmlProps } from \"./HtmlProps.js\";\nimport { FocusHandle } from \"./inputUtils.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\nimport { Typography } from \"./Typography.js\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nconst HintContainerWithInlineStartSpacing = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n paddingInlineStart: `calc(${odysseyDesignTokens.TypographyLineHeightUi}em + ${odysseyDesignTokens.Spacing2})`,\n marginBlockEnd: odysseyDesignTokens.Spacing2,\n\n // MUI applies the '.Mui-error' class to this hint text when the checkbox is invalid which turns the copy red\n // We want to keep the hint text gray in the error state\n \".Mui-error\": {\n color: odysseyDesignTokens.TypographyColorSubordinate,\n },\n}));\n\nexport type RadioProps = {\n /\n The ref forwarded to the Radio\n /\n inputRef?: React.RefObject<FocusHandle>;\n /\n Determines whether the Radio button is checked\n /\n isChecked?: boolean;\n /\n If `true`, the radio button has an invalid value\n /\n isInvalid?: boolean;\n /\n The label text for the Radio\n /\n label: string;\n /\n The value attribute of the Radio\n /\n value: string;\n /\n Callback fired when the blur event happens. Provides event value.\n */\n onChange?: MuiRadioProps[\"onChange\"];\n onBlur?: MuiFormControlLabelProps[\"onBlur\"];\n onClick?: React.MouseEventHandler<HTMLSpanElement>;\n} & Pick<\n FieldComponentProps,\n \"hint\" \| \"id\" \| \"isDisabled\" \| \"isReadOnly\" \| \"name\"\n> &\n Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Radio = ({\n hint,\n id: idOverride,\n inputRef,\n isChecked,\n isDisabled,\n isInvalid,\n label: labelProp,\n name,\n testId,\n translate,\n value,\n isReadOnly,\n onChange: onChangeProp,\n onBlur: onBlurProp,\n onClick,\n}: RadioProps) => {\n const localInputRef = useRef<HTMLInputElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n }, []);\n\n const label = useMemo(\n () => <Typography component=\"span\">{labelProp}</Typography>,\n [labelProp],\n );\n\n const onChange = useCallback<NonNullable<MuiRadioProps[\"onChange\"]>>(\n (event, checked) => {\n if (isReadOnly) {\n event.preventDefault();\n } else {\n onChangeProp?.(event, checked);\n }\n },\n [onChangeProp, isReadOnly],\n );\n\n const handleClick = useCallback<React.MouseEventHandler<HTMLSpanElement>>(\n (event) => {\n if (isReadOnly) {\n event.stopPropagation();\n event.preventDefault();\n }\n },\n [isReadOnly],\n );\n const onBlur = useCallback<NonNullable<MuiFormControlLabelProps[\"onBlur\"]>>(\n (event) => {\n onBlurProp?.(event);\n },\n [onBlurProp],\n );\n\n return (\n <>\n <FormControlLabel\n checked={isChecked}\n className={isInvalid ? \"Mui-error\" : \"\"}\n control={\n <MuiRadio\n inputProps={{\n \"aria-describedby\": hintId,\n \"aria-disabled\": isDisabled \|\| isReadOnly,\n \"data-se\": testId,\n readOnly: isReadOnly,\n tabIndex: isReadOnly ? 0 : undefined,\n }}\n inputRef={localInputRef}\n onChange={onChange}\n onClick={onClick \|\| handleClick}\n disabled={isDisabled}\n />\n }\n label={label}\n name={name}\n translate={translate}\n value={value}\n onBlur={onBlur}\n disabled={isDisabled}\n sx={{\n ...(isReadOnly && {\n cursor: \"default\",\n \"& .MuiTypography-root\": {\n cursor: \"default\",\n },\n }),\n\n ...(hint && {\n // needed to override specific :not(:last-child) selector\n \":not(:last-child)\": {\n marginBlockEnd: 0,\n },\n }),\n }}\n />\n {hint && (\n <HintContainerWithInlineStartSpacing\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <FormHelperText id={hintId} translate={translate}>\n {hint}\n </FormHelperText>\n </HintContainerWithInlineStartSpacing>\n )}\n </>\n );\n};\n\nconst MemoizedRadio = memo(Radio);\nMemoizedRadio.displayName = \"Radio\";\n\nexport { MemoizedRadio as Radio };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"Radio.cjs","names":["_styled","_interopRequireDefault","require","_react","_OdysseyDesignTokensContext","_Typography","_useUniqueId","_jsxRuntime","e","__esModule","default","HintContainerWithInlineStartSpacing","styled","div","odysseyDesignTokens","paddingInlineStart","TypographyLineHeightUi","Spacing2","marginBlockEnd","color","TypographyColorSubordinate","Radio","hint","id","idOverride","inputRef","isChecked","isDisabled","isInvalid","label","labelProp","name","testId","translate","value","isReadOnly","onChange","onChangeProp","onBlur","onBlurProp","onClick","localInputRef","useRef","useOdysseyDesignTokens","useUniqueId","hintId","undefined","useImperativeHandle","focus","current","useMemo","jsx","Typography","component","children","useCallback","event","checked","preventDefault","handleClick","stopPropagation","jsxs","Fragment","_FormControlLabel2","className","control","_Radio2","disabled","inputProps","readOnly","tabIndex","sx","cursor","_FormHelperText2","MemoizedRadio","exports","memo","displayName"],"sources":["../../src/Radio.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 styled from \"@emotion/styled\";\nimport {\n FormControlLabel,\n FormHelperText,\n FormControlLabelProps as MuiFormControlLabelProps,\n Radio as MuiRadio,\n RadioProps as MuiRadioProps,\n} from \"@mui/material\";\nimport { memo, useCallback, useImperativeHandle, useMemo, useRef } from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps.js\";\nimport { FocusHandle } from \"./inputUtils.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext.js\";\nimport { Typography } from \"./Typography.js\";\nimport { useUniqueId } from \"./useUniqueId.js\";\n\nconst HintContainerWithInlineStartSpacing = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n paddingInlineStart: `calc(${odysseyDesignTokens.TypographyLineHeightUi}em + ${odysseyDesignTokens.Spacing2})`,\n marginBlockEnd: odysseyDesignTokens.Spacing2,\n\n // MUI applies the '.Mui-error' class to this hint text when the checkbox is invalid which turns the copy red\n // We want to keep the hint text gray in the error state\n \".Mui-error\": {\n color: odysseyDesignTokens.TypographyColorSubordinate,\n },\n}));\n\nexport type RadioProps = {\n /\n The ref forwarded to the Radio\n /\n inputRef?: React.RefObject<FocusHandle>;\n /\n Determines whether the Radio button is checked\n /\n isChecked?: boolean;\n /\n If `true`, the radio button has an invalid value\n /\n isInvalid?: boolean;\n /\n The label text for the Radio\n /\n label: string;\n onBlur?: MuiFormControlLabelProps[\"onBlur\"];\n /\n Callback fired when the blur event happens. Provides event value.\n /\n onChange?: MuiRadioProps[\"onChange\"];\n onClick?: React.MouseEventHandler<HTMLSpanElement>;\n /\n The value attribute of the Radio\n */\n value: string;\n} & Pick<\n FieldComponentProps,\n \"hint\" \| \"id\" \| \"isDisabled\" \| \"isReadOnly\" \| \"name\"\n> &\n Pick<HtmlProps, \"testId\" \| \"translate\">;\n\nconst Radio = ({\n hint,\n id: idOverride,\n inputRef,\n isChecked,\n isDisabled,\n isInvalid,\n label: labelProp,\n name,\n testId,\n translate,\n value,\n isReadOnly,\n onChange: onChangeProp,\n onBlur: onBlurProp,\n onClick,\n}: RadioProps) => {\n const localInputRef = useRef<HTMLInputElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n\n useImperativeHandle(inputRef, () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n }, []);\n\n const label = useMemo(\n () => <Typography component=\"span\">{labelProp}</Typography>,\n [labelProp],\n );\n\n const onChange = useCallback<NonNullable<MuiRadioProps[\"onChange\"]>>(\n (event, checked) => {\n if (isReadOnly) {\n event.preventDefault();\n } else {\n onChangeProp?.(event, checked);\n }\n },\n [onChangeProp, isReadOnly],\n );\n\n const handleClick = useCallback<React.MouseEventHandler<HTMLSpanElement>>(\n (event) => {\n if (isReadOnly) {\n event.stopPropagation();\n event.preventDefault();\n }\n },\n [isReadOnly],\n );\n const onBlur = useCallback<NonNullable<MuiFormControlLabelProps[\"onBlur\"]>>(\n (event) => {\n onBlurProp?.(event);\n },\n [onBlurProp],\n );\n\n return (\n <>\n <FormControlLabel\n checked={isChecked}\n className={isInvalid ? \"Mui-error\" : \"\"}\n control={\n <MuiRadio\n disabled={isDisabled}\n inputProps={{\n \"aria-describedby\": hintId,\n \"aria-disabled\": isDisabled \|\| isReadOnly,\n \"data-se\": testId,\n readOnly: isReadOnly,\n tabIndex: isReadOnly ? 0 : undefined,\n }}\n inputRef={localInputRef}\n onChange={onChange}\n onClick={onClick \|\| handleClick}\n />\n }\n disabled={isDisabled}\n label={label}\n name={name}\n onBlur={onBlur}\n sx={{\n ...(isReadOnly && {\n cursor: \"default\",\n \"& .MuiTypography-root\": {\n cursor: \"default\",\n },\n }),\n\n ...(hint && {\n // needed to override specific :not(:last-child) selector\n \":not(:last-child)\": {\n marginBlockEnd: 0,\n },\n }),\n }}\n translate={translate}\n value={value}\n />\n {hint && (\n <HintContainerWithInlineStartSpacing\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <FormHelperText id={hintId} translate={translate}>\n {hint}\n </FormHelperText>\n </HintContainerWithInlineStartSpacing>\n )}\n </>\n );\n};\n\nconst MemoizedRadio = memo(Radio);\nMemoizedRadio.displayName = \"Radio\";\n\nexport { MemoizedRadio as Radio };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/RadioGroup.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioGroup.cjs","names":["_react","_interopRequireWildcard","require","_Field","_inputUtils","_Radio","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_interopRequireDefault","RadioGroup","ariaDescribedBy","children","defaultValue","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","isDisabled","isReadOnly","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","useCallback","event","newValue","memoizedChildren","useMemo","React","Children","map","child","isValidElement","type","Radio","cloneElement","props","renderFieldComponent","errorMessageElementId","labelElementId","jsx","_RadioGroup2","Field","fieldType","hasVisibleLabel","MemoizedRadioGroup","exports","memo","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 React, { memo, ReactNode, useCallback, ~~useRef~~, ~~useMemo~~ } from \"react\";\n\nimport { ~~Field~~ } from \"./~~Field~~.js\";\nimport {~~\n FieldComponentProps,\n FieldComponentRenderProps,\n~~} from \"./~~FieldComponentProps~~.js\";\nimport ~~type~~ { ~~HtmlProps~~ } from \"./~~HtmlProps~~.js\";\nimport { getControlState, useInputValues } from \"./inputUtils.js\";\nimport { Radio, RadioProps } from \"./Radio.js\";\n\nexport type RadioGroupProps = {\n /\n The Radio components within the group. Must include two or more.\n /\n children: ReactNode;\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?: string;\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isReadOnly\"\n \| \"name\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" \| \"labelElementId\">;\n\nconst RadioGroup = ({\n ariaDescribedBy,\n children,\n defaultValue,\n errorMessage,\n errorMessageList,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled,\n isReadOnly = false,\n label,\n name: nameOverride,\n onChange: onChangeProp,\n testId,\n translate,\n value,\n}: RadioGroupProps) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<NonNullable<MuiRadioGroupProps[\"onChange\"]>>(\n (event, newValue) => {\n onChangeProp?.(event, newValue);\n },\n [onChangeProp],\n );\n\n const memoizedChildren = useMemo(\n () =>\n React.Children.map(children, (child) => {\n if (React.isValidElement<RadioProps>(child) && child.type === Radio) {\n return React.cloneElement(child, {\n ...child.props,\n isDisabled: isDisabled \|\| child.props.isDisabled,\n isReadOnly: isReadOnly \|\| child.props.isReadOnly,\n });\n }\n return child;\n }),\n [children, isDisabled, isReadOnly],\n );\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: FieldRenderProps) => (\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 {memoizedChildren}\n </MuiRadioGroup>\n ),\n [inputValues, nameOverride, onChange, memoizedChildren, testId, translate],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\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 isReadOnly={isReadOnly}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n};\n\nconst MemoizedRadioGroup = memo(RadioGroup);\nMemoizedRadioGroup.displayName = \"RadioGroup\";\n\nexport { MemoizedRadioGroup as RadioGroup };\n"],"mappings":";;;;;;;AAgBA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;~~AAEA~~,IAAAC,MAAA,GAAAD,OAAA;~~AAMA~~,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAA+C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,SAAAD,wBAAAM,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAR,uBAAA,YAAAA,CAAAM,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAkB,uBAAAnB,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAK,UAAA,GAAAL,CAAA,KAAAU,OAAA,EAAAV,CAAA;~~AAzB~~/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;~~AAwDA~~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","ignoreList":[]}
1	+ {"version":3,"file":"RadioGroup.cjs","names":["_react","_interopRequireWildcard","require","_Field","_inputUtils","_Radio","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_interopRequireDefault","RadioGroup","ariaDescribedBy","children","defaultValue","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","isDisabled","isReadOnly","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","useCallback","event","newValue","memoizedChildren","useMemo","React","Children","map","child","isValidElement","type","Radio","cloneElement","props","renderFieldComponent","errorMessageElementId","labelElementId","jsx","_RadioGroup2","Field","fieldType","hasVisibleLabel","MemoizedRadioGroup","exports","memo","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 React, { memo, ReactNode, useCallback, useMemo, useRef } from \"react\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport { getControlState, useInputValues } from \"./inputUtils.js\";\nimport { Radio, RadioProps } from \"./Radio.js\";\n\nexport type RadioGroupProps = {\n /\n The Radio components within the group. Must include two or more.\n /\n children: ReactNode;\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?: string;\n} & Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isReadOnly\"\n \| \"name\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" \| \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" \| \"labelElementId\">;\n\nconst RadioGroup = ({\n ariaDescribedBy,\n children,\n defaultValue,\n errorMessage,\n errorMessageList,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled,\n isReadOnly = false,\n label,\n name: nameOverride,\n onChange: onChangeProp,\n testId,\n translate,\n value,\n}: RadioGroupProps) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<NonNullable<MuiRadioGroupProps[\"onChange\"]>>(\n (event, newValue) => {\n onChangeProp?.(event, newValue);\n },\n [onChangeProp],\n );\n\n const memoizedChildren = useMemo(\n () =>\n React.Children.map(children, (child) => {\n if (React.isValidElement<RadioProps>(child) && child.type === Radio) {\n return React.cloneElement(child, {\n ...child.props,\n isDisabled: isDisabled \|\| child.props.isDisabled,\n isReadOnly: isReadOnly \|\| child.props.isReadOnly,\n });\n }\n return child;\n }),\n [children, isDisabled, isReadOnly],\n );\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: FieldRenderProps) => (\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 {memoizedChildren}\n </MuiRadioGroup>\n ),\n [inputValues, nameOverride, onChange, memoizedChildren, testId, translate],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\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 isReadOnly={isReadOnly}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n};\n\nconst MemoizedRadioGroup = memo(RadioGroup);\nMemoizedRadioGroup.displayName = \"RadioGroup\";\n\nexport { MemoizedRadioGroup as RadioGroup };\n"],"mappings":";;;;;;;AAgBA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAIA,IAAAC,MAAA,GAAAD,OAAA;AAKA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAA+C,IAAAI,WAAA,GAAAJ,OAAA;AAAA,SAAAD,wBAAAM,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAR,uBAAA,YAAAA,CAAAM,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAkB,uBAAAnB,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAK,UAAA,GAAAL,CAAA,KAAAU,OAAA,EAAAV,CAAA;AA1B/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAyDA,MAAMoB,UAAU,GAAGA,CAAC;EAClBC,eAAe;EACfC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC,gBAAgB;EAChBC,IAAI;EACJC,iBAAiB;EACjBC,EAAE,EAAEC,UAAU;EACdC,UAAU;EACVC,UAAU,GAAG,KAAK;EAClBC,KAAK;EACLC,IAAI,EAAEC,YAAY;EAClBC,QAAQ,EAAEC,YAAY;EACtBC,MAAM;EACNC,SAAS;EACTC;AACe,CAAC,KAAK;EACrB,MAAMC,kBAAkB,GAAG,IAAAC,aAAM,EAC/B,IAAAC,2BAAe,EAAC;IACdC,eAAe,EAAEJ,KAAK;IACtBK,iBAAiB,EAAErB;EACrB,CAAC,CACH,CAAC;EAED,MAAMsB,WAAW,GAAG,IAAAC,0BAAc,EAAC;IACjCvB,YAAY;IACZgB,KAAK;IACLQ,YAAY,EAAEP,kBAAkB,CAACQ;EACnC,CAAC,CAAC;EAEF,MAAMb,QAAQ,GAAG,IAAAc,kBAAW,EAC1B,CAACC,KAAK,EAAEC,QAAQ,KAAK;IACnBf,YAAY,GAAGc,KAAK,EAAEC,QAAQ,CAAC;EACjC,CAAC,EACD,CAACf,YAAY,CACf,CAAC;EAED,MAAMgB,gBAAgB,GAAG,IAAAC,cAAO,EAC9B,MACEC,cAAK,CAACC,QAAQ,CAACC,GAAG,CAAClC,QAAQ,EAAGmC,KAAK,IAAK;IACtC,IAAIH,cAAK,CAACI,cAAc,CAAaD,KAAK,CAAC,IAAIA,KAAK,CAACE,IAAI,KAAKC,YAAK,EAAE;MACnE,OAAON,cAAK,CAACO,YAAY,CAACJ,KAAK,EAAE;QAC/B,GAAGA,KAAK,CAACK,KAAK;QACdhC,UAAU,EAAEA,UAAU,IAAI2B,KAAK,CAACK,KAAK,CAAChC,UAAU;QAChDC,UAAU,EAAEA,UAAU,IAAI0B,KAAK,CAACK,KAAK,CAAC/B;MACxC,CAAC,CAAC;IACJ;IACA,OAAO0B,KAAK;EACd,CAAC,CAAC,EACJ,CAACnC,QAAQ,EAAEQ,UAAU,EAAEC,UAAU,CACnC,CAAC;EACD,MAAMgC,oBAAoB,GAAG,IAAAd,kBAAW,EACtC,CAAC;IACC5B,eAAe;IACf2C,qBAAqB;IACrBpC,EAAE;IACFqC;EACgB,CAAC,KACjB,IAAAlE,WAAA,CAAAmE,GAAA,EAAAC,YAAA,CAAAzD,OAAA;IAAA,GACMmC,WAAW;IACf,oBAAkBxB,eAAgB;IAClC,qBAAmB2C,qBAAsB;IACzC,mBAAiBC,cAAe;IAChC,WAAS5B,MAAO;IAChBT,EAAE,EAAEA,EAAG;IACPK,IAAI,EAAEC,YAAY,IAAIN,EAAG;IACzBO,QAAQ,EAAEA,QAAS;IACnBG,SAAS,EAAEA,SAAU;IAAAhB,QAAA,EAEpB8B;EAAgB,CACJ,CAChB,EACD,CAACP,WAAW,EAAEX,YAAY,EAAEC,QAAQ,EAAEiB,gBAAgB,EAAEf,MAAM,EAAEC,SAAS,CAC3E,CAAC;EAED,OACE,IAAAvC,WAAA,CAAAmE,GAAA,EAACtE,MAAA,CAAAwE,KAAK;IACJ/C,eAAe,EAAEA,eAAgB;IACjCG,YAAY,EAAEA,YAAa;IAC3BC,gBAAgB,EAAEA,gBAAiB;IACnC4C,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,KAAM;IACvB5C,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBC,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA,KAAM;IACb+B,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMQ,kBAAkB,GAAAC,OAAA,CAAApD,UAAA,GAAG,IAAAqD,WAAI,EAACrD,UAAU,CAAC;AAC3CmD,kBAAkB,CAACG,WAAW,GAAG,YAAY","ignoreList":[]}

package/dist/cjs/ScreenReaderText.cjs CHANGED Viewed

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ScreenReaderText = void 0;
 var _Box2 = _interopRequireDefault(require("@mui/material/Box"));
-var _react = require("react");
 var _utils = require("@mui/utils");
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*!
@@ -29,9 +29,9 @@ const ScreenReaderText = ({
   translate
 }) => (0, _jsxRuntime.jsx)(_Box2.default, {
   "aria-hidden": ariaHidden,
-  sx: style,
   component: "span",
   id: id,
+  sx: style,
   translate: translate,
   children: children
 });

package/dist/cjs/ScreenReaderText.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScreenReaderText.cjs","names":["~~_react~~","require","~~_utils~~","_jsxRuntime","_interopRequireDefault","e","__esModule","default","style","visuallyHidden","ScreenReaderText","ariaHidden","children","id","translate","jsx","_Box2","sx","~~component~~","MemoizedScreenReaderText","exports","memo","displayName"],"sources":["../../src/ScreenReaderText.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,~~ ~~ReactNode~~ } from \"~~react~~\";\nimport { ~~Box~~ } from \"@mui/~~material~~\";\nimport { ~~visuallyHidden~~ } from \"~~@mui/utils~~\";\nimport { HtmlProps } from \"./HtmlProps.js\";\n\nexport type ScreenReaderTextProps = {\n /\n The visually-hidden text.\n /\n children: ReactNode;\n id?: string;\n} & Pick<HtmlProps, \"ariaHidden\" \| \"translate\">;\n\n/\n MUI sx expects you pass in a CSS object, not an object with CSS.\n * They seem identical, but only if you create a new object like this will MUI be happy with the type of visuallyHidden.\n * It's otherwise a regular object with CSS properties.\n */\nconst style = { ...visuallyHidden };\n\nconst ScreenReaderText = ({\n ariaHidden,\n children,\n id,\n translate,\n}: ScreenReaderTextProps) => (\n <Box\n aria-hidden={ariaHidden}\n ~~sx={style}\n~~ component=\"span\"\n id={id}\n translate={translate}\n >\n {children}\n </Box>\n);\n\nconst MemoizedScreenReaderText = memo(ScreenReaderText);\nMemoizedScreenReaderText.displayName = \"ScreenReaderText\";\n\nexport { MemoizedScreenReaderText as ScreenReaderText };\n"],"mappings":";;;;;;;~~AAYA~~,IAAAA,MAAA,GAAAC,OAAA;~~AAEA~~,IAAAC,MAAA,GAAAD,OAAA;~~AAA4C~~,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;~~AAd5C~~;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,~~GAoBA~~,MAAMG,KAAK,GAAG;EAAE,GAAGC;AAAe,CAAC;AAEnC,MAAMC,gBAAgB,GAAGA,CAAC;EACxBC,UAAU;EACVC,QAAQ;EACRC,EAAE;EACFC;AACqB,CAAC,KACtB,IAAAX,WAAA,CAAAY,GAAA,EAAAC,KAAA,CAAAT,OAAA;EACE,eAAaI,UAAW;EACxBM,~~EAAE,EAAET,KAAM;EACVU,~~SAAS,EAAC,MAAM;~~EAChBL~~,EAAE,EAAEA,EAAG;~~EACPC~~,SAAS,EAAEA,SAAU;EAAAF,QAAA,EAEpBA;AAAQ,CACN,CACN;AAED,MAAMO,wBAAwB,GAAAC,OAAA,CAAAV,gBAAA,GAAG,IAAAW,WAAI,EAACX,gBAAgB,CAAC;AACvDS,wBAAwB,CAACG,WAAW,GAAG,kBAAkB","ignoreList":[]}
1	+ {"version":3,"file":"ScreenReaderText.cjs","names":["_utils","require","_react","_jsxRuntime","_interopRequireDefault","e","__esModule","default","style","visuallyHidden","ScreenReaderText","ariaHidden","children","id","translate","jsx","_Box2","component","sx","MemoizedScreenReaderText","exports","memo","displayName"],"sources":["../../src/ScreenReaderText.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 { Box } from \"@mui/material\";\nimport { visuallyHidden } from \"@mui/utils\";\nimport { memo, ReactNode } from \"react\";\n\nimport { HtmlProps } from \"./HtmlProps.js\";\n\nexport type ScreenReaderTextProps = {\n /\n The visually-hidden text.\n /\n children: ReactNode;\n id?: string;\n} & Pick<HtmlProps, \"ariaHidden\" \| \"translate\">;\n\n/\n MUI sx expects you pass in a CSS object, not an object with CSS.\n * They seem identical, but only if you create a new object like this will MUI be happy with the type of visuallyHidden.\n * It's otherwise a regular object with CSS properties.\n */\nconst style = { ...visuallyHidden };\n\nconst ScreenReaderText = ({\n ariaHidden,\n children,\n id,\n translate,\n}: ScreenReaderTextProps) => (\n <Box\n aria-hidden={ariaHidden}\n component=\"span\"\n id={id}\n sx={style}\n translate={translate}\n >\n {children}\n </Box>\n);\n\nconst MemoizedScreenReaderText = memo(ScreenReaderText);\nMemoizedScreenReaderText.displayName = \"ScreenReaderText\";\n\nexport { MemoizedScreenReaderText as ScreenReaderText };\n"],"mappings":";;;;;;;AAaA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAAwC,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAdxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAqBA,MAAMG,KAAK,GAAG;EAAE,GAAGC;AAAe,CAAC;AAEnC,MAAMC,gBAAgB,GAAGA,CAAC;EACxBC,UAAU;EACVC,QAAQ;EACRC,EAAE;EACFC;AACqB,CAAC,KACtB,IAAAX,WAAA,CAAAY,GAAA,EAAAC,KAAA,CAAAT,OAAA;EACE,eAAaI,UAAW;EACxBM,SAAS,EAAC,MAAM;EAChBJ,EAAE,EAAEA,EAAG;EACPK,EAAE,EAAEV,KAAM;EACVM,SAAS,EAAEA,SAAU;EAAAF,QAAA,EAEpBA;AAAQ,CACN,CACN;AAED,MAAMO,wBAAwB,GAAAC,OAAA,CAAAV,gBAAA,GAAG,IAAAW,WAAI,EAACX,gBAAgB,CAAC;AACvDS,wBAAwB,CAACG,WAAW,GAAG,kBAAkB","ignoreList":[]}

package/dist/cjs/SearchField.cjs CHANGED Viewed

@@ -7,10 +7,11 @@ exports.searchVariantValues = exports.SearchField = void 0;
 var _InputBase2 = _interopRequireDefault(require("@mui/material/InputBase"));
 var _InputAdornment2 = _interopRequireDefault(require("@mui/material/InputAdornment"));
 var _IconButton2 = _interopRequireDefault(require("@mui/material/IconButton"));
-var _react = require("react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _index = require("./icons.generated/index.cjs");
+var _react = require("react");
+var _reactI18next = require("react-i18next");
 var _Field = require("./Field.cjs");
+var _index = require("./icons.generated/index.cjs");
 var _inputUtils = require("./inputUtils.cjs");
 var _OdysseyThemeProvider = require("./OdysseyThemeProvider.cjs");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -52,6 +53,9 @@ const SearchField = (0, _react.forwardRef)(({
   value,
   variant = "outline"
 }, ref) => {
+  const {
+    t
+  } = (0, _reactI18next.useTranslation)();
   const onChange = (0, _react.useCallback)(event => {
     onChangeProp?.(event);
   }, [onChangeProp]);
@@ -72,17 +76,16 @@ const SearchField = (0, _react.forwardRef)(({
     id
   }) => (0, _jsxRuntime.jsx)(_InputBase2.default, {
     ...inputValues,
-    inputProps: {
-      tabIndex
-    },
     "aria-describedby": ariaDescribedBy,
     autoComplete: autoCompleteType,
     autoFocus: hasInitialFocus,
+    "data-ods-type": "search",
+    "data-ods-variant": variant,
     "data-se": testId,
     endAdornment: (inputValues?.defaultValue || inputValues?.value) && (0, _jsxRuntime.jsx)(_InputAdornment2.default, {
       position: "end",
       children: (0, _jsxRuntime.jsx)(_IconButton2.default, {
-        "aria-label": "Clear",
+        "aria-label": t("clear.text"),
         disabled: isDisabled,
         onClick: onClear,
         size: "small",
@@ -90,8 +93,9 @@ const SearchField = (0, _react.forwardRef)(({
       })
     }),
     id: id,
-    "data-ods-type": "search",
-    "data-ods-variant": variant,
+    inputProps: {
+      tabIndex
+    },
     name: nameOverride ?? id,
     onBlur: onBlur,
     onChange: onChange,
@@ -104,7 +108,7 @@ const SearchField = (0, _react.forwardRef)(({
     }),
     translate: translate,
     type: "search"
-  }), [autoCompleteType, hasInitialFocus, inputValues, isDisabled, nameOverride, onBlur, onChange, onClear, onFocus, placeholder, ref, tabIndex, testId, translate, variant]);
+  }), [autoCompleteType, hasInitialFocus, inputValues, isDisabled, nameOverride, onBlur, onChange, onClear, onFocus, placeholder, ref, t, tabIndex, testId, translate, variant]);
   return (0, _jsxRuntime.jsx)(StyledContainerToEnsureThemeProviderDivIsFullWidth, {
     children: (0, _jsxRuntime.jsx)(_OdysseyThemeProvider.OdysseyThemeProvider, {
       children: (0, _jsxRuntime.jsx)(_Field.Field, {

package/dist/cjs/SearchField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchField.cjs","names":["_react","require","_styled","_interopRequireDefault","_index","_Field","_inputUtils","_OdysseyThemeProvider","_jsxRuntime","e","__esModule","default","searchVariantValues","exports","StyledContainerToEnsureThemeProviderDivIsFullWidth","styled","width","SearchField","forwardRef","ariaDescribedBy","autoCompleteType","defaultValue","hasInitialFocus","id","idOverride","isDisabled","isFullWidth","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","onClear","onClearProp","placeholder","tabIndex","testId","translate","value","variant","ref","useCallback","event","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","renderFieldComponent","jsx","_InputBase2","inputProps","autoComplete","autoFocus","endAdornment","_InputAdornment2","position","children","_IconButton2","disabled","onClick","size","CloseCircleFilledIcon","startAdornment","SearchIcon","type","OdysseyThemeProvider","Field","fieldType","hasVisibleLabel","isOptional","MemoizedSearchField","memo","displayName"],"sources":["../../src/SearchField.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 HTMLAttributes,\n InputHTMLAttributes,\n memo,\n useCallback,\n useRef,\n} from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport { CloseCircleFilledIcon, SearchIcon } from \"./icons.generated/index.js\";\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport type { HtmlProps } from \"./HtmlProps.js\";\nimport { getControlState, useInputValues } from \"./inputUtils.js\";\nimport { OdysseyThemeProvider } from \"./OdysseyThemeProvider.js\";\n\nexport const searchVariantValues = [\"outline\", \"filled\"] as const;\n\nconst StyledContainerToEnsureThemeProviderDivIsFullWidth = styled(\"div\")({\n width: \"100%\",\n});\n\nexport type SearchFieldProps = {\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?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /\n The value of the `input` element to use when uncontrolled.\n /\n defaultValue?: string;\n /\n If `true`, the component will receive focus automatically.\n /\n hasInitialFocus?: boolean;\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 This label won't show up visually, but it's required for accessibility.\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 clear button is pressed.\n /\n onClear?: () => void;\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 tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /\n The value of the `input` element, to use when controlled.\n /\n value?: string;\n /\n Whether the SearchField has a gray or white background\n /\n variant?: (typeof searchVariantValues)[number];\n} & Pick<FieldComponentProps, \"id\" \| \"isDisabled\" \| \"name\" \| \"isFullWidth\"> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<Pick<HtmlProps, \"ariaDescribedBy\">> &\n Pick<FieldComponentRenderProps, \"id\">;\n\nconst SearchField = forwardRef<HTMLInputElement, SearchFieldProps>(\n (\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n hasInitialFocus,\n id: idOverride,\n isDisabled = false,\n isFullWidth = false,\n label,\n name: nameOverride,\n onChange: onChangeProp,\n onFocus,\n onBlur,\n onClear: onClearProp,\n placeholder,\n tabIndex,\n testId,\n translate,\n value,\n variant = \"outline\",\n },\n ref,\n ) => {\n const onChange: ChangeEventHandler<HTMLTextAreaElement \| HTMLInputElement> =\n useCallback(\n (event) => {\n onChangeProp?.(event);\n },\n [onChangeProp],\n );\n\n const onClear = useCallback(() => {\n onClearProp?.();\n }, [onClearProp]);\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 renderFieldComponent = useCallback(\n ({ ariaDescribedBy, id }: FieldRenderProps) => (\n <InputBase\n {...inputValues}\n inputProps={{\n tabIndex,\n }}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n / eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n data-se={testId}\n endAdornment={\n (inputValues?.defaultValue \|\| inputValues?.value) && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-label=\"Clear\"\n disabled={isDisabled}\n onClick={onClear}\n size=\"small\"\n >\n <CloseCircleFilledIcon />\n </IconButton>\n </InputAdornment>\n )\n }\n id={id}\n data-ods-type=\"search\"\n data-ods-variant={variant}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n ref={ref}\n startAdornment={\n <InputAdornment position=\"start\">\n <SearchIcon />\n </InputAdornment>\n }\n translate={translate}\n type=\"search\"\n />\n ),\n [\n autoCompleteType,\n hasInitialFocus,\n inputValues,\n isDisabled,\n nameOverride,\n onBlur,\n onChange,\n onClear,\n onFocus,\n placeholder,\n ref,\n tabIndex,\n testId,\n translate,\n variant,\n ],\n );\n\n return (\n <StyledContainerToEnsureThemeProviderDivIsFullWidth>\n <OdysseyThemeProvider>\n <Field\n ariaDescribedBy={ariaDescribedBy}\n fieldType=\"single\"\n hasVisibleLabel={false}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={true}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n </OdysseyThemeProvider>\n </StyledContainerToEnsureThemeProviderDivIsFullWidth>\n );\n },\n);\n\nconst MemoizedSearchField = memo(SearchField);\nMemoizedSearchField.displayName = \"SearchField\";\n\nexport { MemoizedSearchField as SearchField };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"SearchField.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactI18next","_Field","_index","_inputUtils","_OdysseyThemeProvider","_jsxRuntime","e","__esModule","default","searchVariantValues","exports","StyledContainerToEnsureThemeProviderDivIsFullWidth","styled","width","SearchField","forwardRef","ariaDescribedBy","autoCompleteType","defaultValue","hasInitialFocus","id","idOverride","isDisabled","isFullWidth","label","name","nameOverride","onChange","onChangeProp","onFocus","onBlur","onClear","onClearProp","placeholder","tabIndex","testId","translate","value","variant","ref","t","useTranslation","useCallback","event","controlledStateRef","useRef","getControlState","controlledValue","uncontrolledValue","inputValues","useInputValues","controlState","current","renderFieldComponent","jsx","_InputBase2","autoComplete","autoFocus","endAdornment","_InputAdornment2","position","children","_IconButton2","disabled","onClick","size","CloseCircleFilledIcon","inputProps","startAdornment","SearchIcon","type","OdysseyThemeProvider","Field","fieldType","hasVisibleLabel","isOptional","MemoizedSearchField","memo","displayName"],"sources":["../../src/SearchField.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 styled from \"@emotion/styled\";\nimport { IconButton, InputAdornment, InputBase } from \"@mui/material\";\nimport {\n ChangeEventHandler,\n FocusEventHandler,\n forwardRef,\n HTMLAttributes,\n InputHTMLAttributes,\n memo,\n useCallback,\n useRef,\n} from \"react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport type { HtmlProps } from \"./HtmlProps.js\";\n\nimport { Field } from \"./Field.js\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps.js\";\nimport { CloseCircleFilledIcon, SearchIcon } from \"./icons.generated/index.js\";\nimport { getControlState, useInputValues } from \"./inputUtils.js\";\nimport { OdysseyThemeProvider } from \"./OdysseyThemeProvider.js\";\n\nexport const searchVariantValues = [\"outline\", \"filled\"] as const;\n\nconst StyledContainerToEnsureThemeProviderDivIsFullWidth = styled(\"div\")({\n width: \"100%\",\n});\n\nexport type SearchFieldProps = {\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?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n /\n The value of the `input` element to use when uncontrolled.\n /\n defaultValue?: string;\n /\n If `true`, the component will receive focus automatically.\n /\n hasInitialFocus?: boolean;\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 This label won't show up visually, but it's required for accessibility.\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 clear button is pressed.\n /\n onClear?: () => void;\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 tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /\n The value of the `input` element, to use when controlled.\n /\n value?: string;\n /\n Whether the SearchField has a gray or white background\n /\n variant?: (typeof searchVariantValues)[number];\n} & Pick<FieldComponentProps, \"id\" \| \"isDisabled\" \| \"name\" \| \"isFullWidth\"> &\n Pick<HtmlProps, \"ariaDescribedBy\" \| \"testId\" \| \"translate\">;\n\ntype FieldRenderProps = Partial<Pick<HtmlProps, \"ariaDescribedBy\">> &\n Pick<FieldComponentRenderProps, \"id\">;\n\nconst SearchField = forwardRef<HTMLInputElement, SearchFieldProps>(\n (\n {\n ariaDescribedBy,\n autoCompleteType,\n defaultValue,\n hasInitialFocus,\n id: idOverride,\n isDisabled = false,\n isFullWidth = false,\n label,\n name: nameOverride,\n onChange: onChangeProp,\n onFocus,\n onBlur,\n onClear: onClearProp,\n placeholder,\n tabIndex,\n testId,\n translate,\n value,\n variant = \"outline\",\n },\n ref,\n ) => {\n const { t } = useTranslation();\n\n const onChange: ChangeEventHandler<HTMLTextAreaElement \| HTMLInputElement> =\n useCallback(\n (event) => {\n onChangeProp?.(event);\n },\n [onChangeProp],\n );\n\n const onClear = useCallback(() => {\n onClearProp?.();\n }, [onClearProp]);\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 renderFieldComponent = useCallback(\n ({ ariaDescribedBy, id }: FieldRenderProps) => (\n <InputBase\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n autoComplete={autoCompleteType}\n / eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n data-ods-type=\"search\"\n data-ods-variant={variant}\n data-se={testId}\n endAdornment={\n (inputValues?.defaultValue \|\| inputValues?.value) && (\n <InputAdornment position=\"end\">\n <IconButton\n aria-label={t(\"clear.text\")}\n disabled={isDisabled}\n onClick={onClear}\n size=\"small\"\n >\n <CloseCircleFilledIcon />\n </IconButton>\n </InputAdornment>\n )\n }\n id={id}\n inputProps={{\n tabIndex,\n }}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n ref={ref}\n startAdornment={\n <InputAdornment position=\"start\">\n <SearchIcon />\n </InputAdornment>\n }\n translate={translate}\n type=\"search\"\n />\n ),\n [\n autoCompleteType,\n hasInitialFocus,\n inputValues,\n isDisabled,\n nameOverride,\n onBlur,\n onChange,\n onClear,\n onFocus,\n placeholder,\n ref,\n t,\n tabIndex,\n testId,\n translate,\n variant,\n ],\n );\n\n return (\n <StyledContainerToEnsureThemeProviderDivIsFullWidth>\n <OdysseyThemeProvider>\n <Field\n ariaDescribedBy={ariaDescribedBy}\n fieldType=\"single\"\n hasVisibleLabel={false}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={true}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n </OdysseyThemeProvider>\n </StyledContainerToEnsureThemeProviderDivIsFullWidth>\n );\n },\n);\n\nconst MemoizedSearchField = memo(SearchField);\nMemoizedSearchField.displayName = \"SearchField\";\n\nexport { MemoizedSearchField as SearchField };\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/Select.cjs CHANGED Viewed

@@ -11,8 +11,8 @@ var _Checkbox2 = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _ListSubheader2 = _interopRequireDefault(require("@mui/material/ListSubheader"));
 var _Chip2 = _interopRequireDefault(require("@mui/material/Chip"));
 var _Box2 = _interopRequireDefault(require("@mui/material/Box"));
-var _react = require("react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _react = require("react");
 var _Field = require("./Field.cjs");
 var _index = require("./icons.generated/index.cjs");
 var _inputUtils = require("./inputUtils.cjs");
@@ -75,57 +75,48 @@ const SelectContainer = _styled.default.div`
 `;
 const ChipsPositioningContainer = (0, _styled.default)("div", {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens"
-})`
-  display: flex;
-  align-items: center;
-  position: absolute;
-  top: ${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing0};
-  right: ${({
+})(({
   odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing5};
-  bottom: ${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing0};
-  left: ${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing1};
-  margin-inline-start: ${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.BorderWidthMain};
-  opacity: 1;
-  pointer-events: none;
-`;
+}) => {
+  return {
+    alignItems: "center",
+    display: "flex",
+    insetBlockEnd: 0,
+    insetBlockStart: 0,
+    insetInlineEnd: "25px",
+    insetInlineStart: "4px",
+    marginInlineStart: odysseyDesignTokens.BorderWidthMain,
+    opacity: 1,
+    pointerEvents: "none",
+    position: "absolute"
+  };
+});
 const NonInteractiveIcon = (0, _styled.default)(_index.CloseCircleFilledIcon, {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens"
-})`
-  font-size: 1em;
-  margin-inline-start: ${({
+})(({
   odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing2};
-  margin-inline-end: -${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing1};
-  margin-block-end: -1px;
-`;
+}) => ({
+  fontSize: "1em",
+  marginBlockEnd: "-1px",
+  marginInlineEnd: `-${odysseyDesignTokens.Spacing1}`,
+  marginInlineStart: odysseyDesignTokens.Spacing2
+}));
 const ChipsInnerContainer = (0, _styled.default)(_Box2.default, {
   shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "isInteractive" && prop !== "isReadOnly"
-})`
-  display: flex;
-  flex-wrap: wrap;
-  gap: ${({
-  odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing1};
-  pointer-events: none;
-  opacity: ${({
+})(({
   isInteractive,
-  isReadOnly
-}) => isInteractive || isReadOnly ? 1 : 0};
-  min-height: ${({
+  isReadOnly,
   odysseyDesignTokens
-}) => odysseyDesignTokens.Spacing6};
-`;
+}) => ({
+  display: "flex",
+  flexWrap: "wrap",
+  gap: odysseyDesignTokens.Spacing1,
+  marginBlock: `-${odysseyDesignTokens.Spacing2}`,
+  marginInlineEnd: odysseyDesignTokens.Spacing1,
+  minHeight: odysseyDesignTokens.Spacing6,
+  opacity: isInteractive || isReadOnly ? 1 : 0,
+  pointerEvents: "none"
+}));
 const {
   CONTROLLED
 } = _inputUtils.ComponentControlledState;
@@ -237,19 +228,19 @@ const Select = ({
       isReadOnly: isReadOnly,
       odysseyDesignTokens: odysseyDesignTokens,
       children: internalSelectedValues.map(item => item?.length > 0 && (0, _jsxRuntime.jsx)(_Chip2.default, {
+        deleteIcon: (0, _jsxRuntime.jsx)(_index.CloseCircleFilledIcon, {
+          onMouseDown: stopPropagation,
+          sx: {
+            pointerEvents: "auto"
+          }
+        }),
         label: (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
           children: [normalizedOptionsMap.get(item)?.text, hasNonInteractiveIcon && (0, _jsxRuntime.jsx)(NonInteractiveIcon, {
             odysseyDesignTokens: odysseyDesignTokens
           })]
         }),
-        tabIndex: -1,
         onDelete: isInteractive && controlledStateRef.current === CONTROLLED ? () => removeSelectedValue(item) : undefined,
-        deleteIcon: (0, _jsxRuntime.jsx)(_index.CloseCircleFilledIcon, {
-          sx: {
-            pointerEvents: "auto"
-          },
-          onMouseDown: stopPropagation
-        })
+        tabIndex: -1
       }, item))
     });
   }, [controlledStateRef, hasMultipleChoices, internalSelectedValues, odysseyDesignTokens, removeSelectedValue, normalizedOptionsMap]);
@@ -262,9 +253,9 @@ const Select = ({
     const isSelected = hasMultipleChoices ? internalSelectedValues?.includes(option.value) : internalSelectedValues === option.value;
     return (0, _jsxRuntime.jsxs)(_MenuItem2.default, {
       "data-empty": !option.text,
-      value: option.value,
-      selected: isSelected,
       lang: option.lang,
+      selected: isSelected,
+      value: option.value,
       children: [hasMultipleChoices && (0, _jsxRuntime.jsx)(_Checkbox2.default, {
         checked: isSelected
       }), option.text, !hasMultipleChoices && internalSelectedValues === option.value && (0, _jsxRuntime.jsx)(_ListItemSecondaryAction2.default, {