@okta/odyssey-react-mui 1.13.11 → 1.14.2

package/dist/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useImperativeHandle","Field","CheckIcon","ComponentControlledState","useInputValues","getControlState","normalizedKey","jsx","_jsx","jsxs","_jsxs","CONTROLLED","Select","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","options","testId","translate","value","undefined","controlledStateRef","controlledValue","uncontrolledValue","internalSelectedValues","setInternalSelectedValues","current","localInputRef","focus","inputValues","controlState","event","child","target","split","normalizedOptions","map","option","text","type","renderValue","selected","renderedChips","item","selectedOption","find","_Chip","filter","Boolean","length","_Box","children","index","_ListSubheader","_MenuItem","_Checkbox","checked","includes","_ListItemSecondaryAction","toString","renderFieldComponent","errorMessageElementId","labelElementId","_Select","displayEmpty","inputProps","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.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  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  useImperativeHandle,\n} from \"react\";\nimport {\n  Box,\n  Checkbox as MuiCheckbox,\n  Chip,\n  ListItemSecondaryAction,\n  ListSubheader,\n  MenuItem,\n  Select as MuiSelect,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\n\nimport { Field } from \"./Field\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { CheckIcon } from \"./icons.generated\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n  ComponentControlledState,\n  FocusHandle,\n  useInputValues,\n  getControlState,\n} from \"./inputUtils\";\nimport { normalizedKey } from \"./useNormalizedKey\";\n\nexport type SelectOption = {\n  text: string;\n  type?: \"heading\" | \"option\";\n  value?: string;\n};\n\nexport type SelectValueType<HasMultipleChoices> =\n  HasMultipleChoices extends true ? string[] : string;\n\nexport type SelectProps<\n  Value extends SelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean\n> = {\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: MuiSelectProps<Value>[\"defaultValue\"];\n  /**\n   * If `true`, the Select allows multiple selections\n   */\n  hasMultipleChoices?: HasMultipleChoices;\n  /**\n   * The ref forwarded to the Select\n   */\n  inputRef?: React.RefObject<FocusHandle>;\n  /**\n   * @deprecated Use `hasMultipleChoices` instead.\n   */\n  /** **Deprecated:** use `hasMultipleChoices` */\n  isMultiSelect?: HasMultipleChoices;\n  /**\n   * The label text for the Select\n   */\n  label: string;\n  /**\n   * Callback fired when the Select loses focus\n   */\n  onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n  /**\n   * Callback fired when the value of the Select changes\n   */\n  onChange?: MuiSelectProps<Value>[\"onChange\"];\n  /**\n   * Callback fired when the Select gains focus\n   */\n  onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n  /**\n   * The options for the Select\n   */\n  options: (string | SelectOption)[];\n  /**\n   * The value or values selected in the Select\n   */\n  value?: Value;\n} & Pick<\n  FieldComponentProps,\n  | \"ariaDescribedBy\"\n  | \"errorMessage\"\n  | \"errorMessageList\"\n  | \"hint\"\n  | \"HintLinkComponent\"\n  | \"id\"\n  | \"isDisabled\"\n  | \"isFullWidth\"\n  | \"isOptional\"\n  | \"name\"\n> &\n  HtmlProps;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n *   - string —                            A simple string. The string will be both the text and the value of the resulting option.\n *                                         <option value=\"string\">string</option>\n *\n *   - { text: string } —                  Same as above, but the string is contained within an object.\n *                                         <option value=\"text\">text</option>\n *\n *   - { text: string, value: string } —   The option text will be text, and the option value will be value.\n *                                         <option value=\"value\">text</option>\n *\n *   - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst { CONTROLLED } = ComponentControlledState;\nconst Select = <\n  Value extends SelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean\n>({\n  ariaDescribedBy,\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  hasMultipleChoices: hasMultipleChoicesProp,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  inputRef,\n  isDisabled = false,\n  isFullWidth = false,\n  isMultiSelect,\n  isOptional = false,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange: onChangeProp,\n  onFocus,\n  options,\n  testId,\n  translate,\n  value,\n}: SelectProps<Value, HasMultipleChoices>) => {\n  const hasMultipleChoices = useMemo(\n    () =>\n      hasMultipleChoicesProp === undefined\n        ? isMultiSelect\n        : hasMultipleChoicesProp,\n    [hasMultipleChoicesProp, isMultiSelect]\n  );\n  const controlledStateRef = useRef(\n    getControlState({ controlledValue: value, uncontrolledValue: defaultValue })\n  );\n  const [internalSelectedValues, setInternalSelectedValues] = useState(\n    controlledStateRef.current === CONTROLLED ? value : defaultValue\n  );\n  const localInputRef = useRef<HTMLSelectElement>(null);\n\n  useImperativeHandle(\n    inputRef,\n    () => {\n      return {\n        focus: () => {\n          localInputRef.current?.focus();\n        },\n      };\n    },\n    []\n  );\n\n  useEffect(() => {\n    if (controlledStateRef.current === CONTROLLED) {\n      setInternalSelectedValues(value);\n    }\n  }, [value]);\n\n  const inputValues = useInputValues({\n    defaultValue,\n    value,\n    controlState: controlledStateRef.current,\n  });\n\n  const onChange = useCallback<NonNullable<MuiSelectProps<Value>[\"onChange\"]>>(\n    (event, child) => {\n      const {\n        target: { value },\n      } = event;\n      if (controlledStateRef.current !== CONTROLLED) {\n        setInternalSelectedValues(\n          (typeof value === \"string\" ? value.split(\",\") : value) as Value\n        );\n      }\n      onChangeProp?.(event, child);\n    },\n    [onChangeProp]\n  );\n\n  // Normalize the options array to accommodate the various\n  // data types that might be passed\n  const normalizedOptions = useMemo(\n    () =>\n      options.map((option) => {\n        if (typeof option === \"object\") {\n          /**\n           * If the value of `option?.value is an empty string, we need to make sure that we\n           * set an empty string to `value` in the normalized option so that the select component\n           * can potentially set it as the selected one in the text input\n           */\n          const value =\n            option?.value === \"\" ? option.value : option.value || option.text;\n          return {\n            text: option.text,\n            value,\n            type: option.type === \"heading\" ? \"heading\" : \"option\",\n          };\n        }\n        return { text: option, value: option, type: \"option\" };\n      }),\n    [options]\n  );\n\n  const renderValue = useCallback(\n    (selected: Value) => {\n      // If the selected value isn't an array, then we don't need to display\n      // chips and should fall back to the default render behavior\n      if (typeof selected === \"string\") {\n        return undefined;\n      }\n\n      // Convert the selected options array into <Chip>s\n      const renderedChips = selected\n        .map((item: string) => {\n          const selectedOption = normalizedOptions.find(\n            (option) => option.value === item\n          );\n\n          if (!selectedOption) {\n            return null;\n          }\n\n          return <Chip key={item} label={selectedOption.text} />;\n        })\n        .filter(Boolean);\n\n      if (renderedChips.length === 0) {\n        return null;\n      }\n\n      // We need the <Box> to surround the <Chip>s for\n      // proper styling\n      return <Box>{renderedChips}</Box>;\n    },\n    [normalizedOptions]\n  );\n\n  // Convert the options into the ReactNode children\n  // that will populate the <Select>\n  const children = useMemo(\n    () =>\n      normalizedOptions.map((option, index) => {\n        if (option.type === \"heading\") {\n          return <ListSubheader key={option.text}>{option.text}</ListSubheader>;\n        }\n        return (\n          <MenuItem\n            key={normalizedKey(option.text, index.toString())}\n            value={option.value}\n          >\n            {hasMultipleChoices && (\n              <MuiCheckbox\n                checked={\n                  option.value !== undefined &&\n                  internalSelectedValues?.includes(option.value)\n                }\n              />\n            )}\n            {option.text}\n            {!hasMultipleChoices &&\n              (internalSelectedValues?.includes(option.value) ||\n                internalSelectedValues === option.value) && (\n                <ListItemSecondaryAction>\n                  <CheckIcon />\n                </ListItemSecondaryAction>\n              )}\n          </MenuItem>\n        );\n      }),\n    [hasMultipleChoices, normalizedOptions, internalSelectedValues]\n  );\n\n  const renderFieldComponent = useCallback(\n    ({ ariaDescribedBy, errorMessageElementId, id, labelElementId }) => (\n      <MuiSelect\n        {...inputValues}\n        aria-describedby={ariaDescribedBy}\n        aria-errormessage={errorMessageElementId}\n        children={children}\n        data-se={testId}\n        displayEmpty={\n          inputValues?.value === \"\" || inputValues?.defaultValue === \"\"\n        }\n        id={id}\n        inputProps={{ \"data-se\": testId }}\n        inputRef={localInputRef}\n        labelId={labelElementId}\n        multiple={hasMultipleChoices}\n        name={nameOverride ?? id}\n        onBlur={onBlur}\n        onChange={onChange}\n        onFocus={onFocus}\n        renderValue={hasMultipleChoices ? renderValue : undefined}\n        translate={translate}\n      />\n    ),\n    [\n      children,\n      inputValues,\n      hasMultipleChoices,\n      nameOverride,\n      onBlur,\n      onChange,\n      onFocus,\n      renderValue,\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      HintLinkComponent={HintLinkComponent}\n      id={idOverride}\n      isDisabled={isDisabled}\n      isFullWidth={isFullWidth}\n      isOptional={isOptional}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}
+{"version":3,"file":"Select.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useImperativeHandle","Field","CheckIcon","CloseCircleFilledIcon","ComponentControlledState","useInputValues","getControlState","normalizedKey","styled","useOdysseyDesignTokens","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","SelectContainer","div","ChipsPositioningContainer","shouldForwardProp","prop","odysseyDesignTokens","Spacing0","Spacing5","Spacing1","BorderWidthMain","NonInteractiveIcon","Spacing2","ChipsInnerContainer","_Box","isInteractive","ChipsSpacer","Spacing6","CONTROLLED","Select","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","options","testId","translate","value","undefined","controlledStateRef","controlledValue","uncontrolledValue","internalSelectedValues","setInternalSelectedValues","current","localInputRef","focus","inputValues","controlState","event","child","target","split","normalizedOptions","map","option","text","type","Chips","selection","removeSelection","itemToRemove","Array","isArray","newValue","filter","item","syntheticEvent","stopPropagation","children","length","_Chip","tabIndex","onDelete","deleteIcon","sx","pointerEvents","onMouseDown","index","_ListSubheader","isSelected","includes","_MenuItem","selected","_Checkbox","checked","_ListItemSecondaryAction","toString","renderValue","renderFieldComponent","errorMessageElementId","labelElementId","_Select","inputProps","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.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  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  useImperativeHandle,\n  MouseEvent,\n} from \"react\";\nimport {\n  Box as MuiBox,\n  Checkbox as MuiCheckbox,\n  Chip as MuiChip,\n  ListItemSecondaryAction,\n  ListSubheader,\n  MenuItem as MuiMenuItem,\n  Select as MuiSelect,\n  SelectChangeEvent,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\n\nimport { Field } from \"./Field\";\nimport {\n  FieldComponentProps,\n  FieldComponentRenderProps,\n} from \"./FieldComponentProps\";\nimport { CheckIcon, CloseCircleFilledIcon } from \"./icons.generated\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n  ComponentControlledState,\n  FocusHandle,\n  useInputValues,\n  getControlState,\n} from \"./inputUtils\";\nimport { normalizedKey } from \"./useNormalizedKey\";\nimport styled from \"@emotion/styled\";\n\nimport {\n  useOdysseyDesignTokens,\n  DesignTokens,\n} from \"./OdysseyDesignTokensContext\";\n\nexport type SelectOption = {\n  text: string;\n  type?: \"heading\" | \"option\";\n  value?: string;\n};\n\nconst SelectContainer = styled.div`\n  position: relative;\n  width: 100%;\n  display: flex;\n`;\n\nconst ChipsPositioningContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n}>`\n  display: flex;\n  align-items: center;\n  position: absolute;\n  top: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n  right: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing5};\n  bottom: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n  left: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n  margin-inline-start: ${({ odysseyDesignTokens }) =>\n    odysseyDesignTokens.BorderWidthMain};\n  opacity: 1;\n  pointer-events: none;\n`;\n\nconst NonInteractiveIcon = styled(CloseCircleFilledIcon, {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n}>`\n  font-size: 1em;\n  margin-inline-start: ${({ odysseyDesignTokens }) =>\n    odysseyDesignTokens.Spacing2};\n  margin-inline-end: -${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n`;\n\nconst ChipsInnerContainer = styled(MuiBox, {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"isInteractive\",\n})<{\n  isInteractive?: boolean;\n  odysseyDesignTokens: DesignTokens;\n}>`\n  display: flex;\n  flex-wrap: wrap;\n  gap: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n  pointer-events: ${({ isInteractive }) => (isInteractive ? \"auto\" : \"none\")};\n  opacity: ${({ isInteractive }) => (isInteractive ? 1 : 0)};\n`;\n\nconst ChipsSpacer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n}>`\n  display: inline-block;\n  border-color: transparent;\n  border-style: solid none;\n  border-width: 1px;\n  height: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing6};\n`;\n\nexport type SelectValueType<HasMultipleChoices> =\n  HasMultipleChoices extends true ? string[] : string;\n\nexport type SelectProps<\n  Value extends SelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean,\n> = {\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: MuiSelectProps<Value>[\"defaultValue\"];\n  /**\n   * If `true`, the Select allows multiple selections\n   */\n  hasMultipleChoices?: HasMultipleChoices;\n  /**\n   * The ref forwarded to the Select\n   */\n  inputRef?: React.RefObject<FocusHandle>;\n  /**\n   * @deprecated Use `hasMultipleChoices` instead.\n   */\n  /** **Deprecated:** use `hasMultipleChoices` */\n  isMultiSelect?: HasMultipleChoices;\n  /**\n   * The label text for the Select\n   */\n  label: string;\n  /**\n   * Callback fired when the Select loses focus\n   */\n  onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n  /**\n   * Callback fired when the value of the Select changes\n   */\n  onChange?: MuiSelectProps<Value>[\"onChange\"];\n  /**\n   * Callback fired when the Select gains focus\n   */\n  onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n  /**\n   * The options for the Select\n   */\n  options: (string | SelectOption)[];\n  /**\n   * The value or values selected in the Select\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  | \"name\"\n> &\n  Pick<HtmlProps, \"ariaDescribedBy\" | \"testId\" | \"translate\">;\n\ntype SelectRenderProps = Partial<\n  Pick<FieldComponentRenderProps, \"ariaDescribedBy\" | \"errorMessageElementId\">\n> &\n  Pick<FieldComponentRenderProps, \"id\" | \"labelElementId\">;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n *   - string —                            A simple string. The string will be both the text and the value of the resulting option.\n *                                         <option value=\"string\">string</option>\n *\n *   - { text: string } —                  Same as above, but the string is contained within an object.\n *                                         <option value=\"text\">text</option>\n *\n *   - { text: string, value: string } —   The option text will be text, and the option value will be value.\n *                                         <option value=\"value\">text</option>\n *\n *   - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst { CONTROLLED } = ComponentControlledState;\nconst Select = <\n  Value extends SelectValueType<HasMultipleChoices>,\n  HasMultipleChoices extends boolean,\n>({\n  ariaDescribedBy,\n  defaultValue,\n  errorMessage,\n  errorMessageList,\n  hasMultipleChoices: hasMultipleChoicesProp,\n  hint,\n  HintLinkComponent,\n  id: idOverride,\n  inputRef,\n  isDisabled = false,\n  isFullWidth = false,\n  isMultiSelect,\n  isOptional = false,\n  label,\n  name: nameOverride,\n  onBlur,\n  onChange: onChangeProp,\n  onFocus,\n  options,\n  testId,\n  translate,\n  value,\n}: SelectProps<Value, HasMultipleChoices>) => {\n  const hasMultipleChoices = useMemo(\n    () =>\n      hasMultipleChoicesProp === undefined\n        ? isMultiSelect\n        : hasMultipleChoicesProp,\n    [hasMultipleChoicesProp, isMultiSelect],\n  );\n  const controlledStateRef = useRef(\n    getControlState({\n      controlledValue: value,\n      uncontrolledValue: defaultValue,\n    }),\n  );\n  const [internalSelectedValues, setInternalSelectedValues] = useState(\n    controlledStateRef.current === CONTROLLED ? value : defaultValue,\n  );\n  const localInputRef = useRef<HTMLSelectElement>(null);\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  useImperativeHandle(\n    inputRef,\n    () => {\n      return {\n        focus: () => {\n          localInputRef.current?.focus();\n        },\n      };\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (controlledStateRef.current === CONTROLLED) {\n      setInternalSelectedValues(value);\n    }\n  }, [value]);\n\n  const inputValues = useInputValues({\n    defaultValue,\n    value,\n    controlState: controlledStateRef.current,\n  });\n\n  const onChange = useCallback<NonNullable<MuiSelectProps<Value>[\"onChange\"]>>(\n    (event, child) => {\n      const {\n        target: { value },\n      } = event;\n      if (controlledStateRef.current !== CONTROLLED) {\n        setInternalSelectedValues(\n          (typeof value === \"string\" ? value.split(\",\") : value) as Value,\n        );\n      }\n      onChangeProp?.(event, child);\n    },\n    [onChangeProp],\n  );\n\n  // Normalize the options array to accommodate the various\n  // data types that might be passed\n  const normalizedOptions = useMemo(\n    () =>\n      options.map((option) => {\n        if (typeof option === \"object\") {\n          /**\n           * If the value of `option?.value is an empty string, we need to make sure that we\n           * set an empty string to `value` in the normalized option so that the select component\n           * can potentially set it as the selected one in the text input\n           */\n          const value =\n            option?.value === \"\" ? option.value : option.value || option.text;\n          return {\n            text: option.text,\n            value,\n            type: option.type === \"heading\" ? \"heading\" : \"option\",\n          };\n        }\n        return { text: option, value: option, type: \"option\" };\n      }),\n    [options],\n  );\n\n  const Chips = useCallback(\n    ({\n      selection,\n      isInteractive,\n    }: {\n      selection: string[];\n      isInteractive: boolean;\n    }) => {\n      const removeSelection = (itemToRemove: string) => {\n        if (Array.isArray(internalSelectedValues)) {\n          const newValue = internalSelectedValues.filter(\n            (item: string) => item !== itemToRemove,\n          );\n\n          const syntheticEvent = {\n            target: { value: newValue },\n          } as SelectChangeEvent<Value>;\n\n          onChange(syntheticEvent, null);\n        }\n      };\n\n      const stopPropagation = (event: MouseEvent<SVGSVGElement>) =>\n        event.stopPropagation();\n\n      return (\n        <ChipsInnerContainer\n          isInteractive={isInteractive}\n          odysseyDesignTokens={odysseyDesignTokens}\n        >\n          <ChipsSpacer odysseyDesignTokens={odysseyDesignTokens} />\n          {selection.map(\n            (item: string) =>\n              item?.length > 0 && (\n                <MuiChip\n                  key={item}\n                  label={\n                    <>\n                      {item}\n                      {!isInteractive &&\n                        controlledStateRef.current === CONTROLLED &&\n                        hasMultipleChoices && (\n                          <NonInteractiveIcon\n                            odysseyDesignTokens={odysseyDesignTokens}\n                          />\n                        )}\n                    </>\n                  }\n                  tabIndex={-1}\n                  onDelete={\n                    isInteractive && controlledStateRef.current === CONTROLLED\n                      ? () => removeSelection(item)\n                      : undefined\n                  }\n                  deleteIcon={\n                    <CloseCircleFilledIcon\n                      sx={{ pointerEvents: \"auto\" }}\n                      // We need to stop event propagation on mouse down to prevent the deletion\n                      // from being blocked by the Select list opening, and also ensure that\n                      // the pointerEvent is registered even when the parent's are not\n                      onMouseDown={stopPropagation}\n                    />\n                  }\n                />\n              ),\n          )}\n        </ChipsInnerContainer>\n      );\n    },\n    [\n      controlledStateRef,\n      hasMultipleChoices,\n      internalSelectedValues,\n      odysseyDesignTokens,\n      onChange,\n    ],\n  );\n\n  // Convert the options into the ReactNode children\n  // that will populate the <Select>\n  const children = useMemo(\n    () =>\n      normalizedOptions.map((option, index) => {\n        if (option.type === \"heading\") {\n          return (\n            <ListSubheader key={option.text}> {option.text} </ListSubheader>\n          );\n        }\n\n        const isSelected = hasMultipleChoices\n          ? internalSelectedValues?.includes(option.value)\n          : internalSelectedValues === option.value;\n\n        return (\n          <MuiMenuItem\n            key={normalizedKey(option.text, index.toString())}\n            value={option.value}\n            selected={isSelected}\n          >\n            {hasMultipleChoices && <MuiCheckbox checked={isSelected} />}\n            {option.text}\n            {!hasMultipleChoices &&\n              (internalSelectedValues?.includes(option.value) ||\n                internalSelectedValues === option.value) && (\n                <ListItemSecondaryAction>\n                  <CheckIcon />\n                </ListItemSecondaryAction>\n              )}\n          </MuiMenuItem>\n        );\n      }),\n    [hasMultipleChoices, normalizedOptions, internalSelectedValues],\n  );\n\n  const renderValue = useCallback(\n    (value: Value) =>\n      Array.isArray(value) && <Chips selection={value} isInteractive={false} />,\n    [Chips],\n  );\n\n  const renderFieldComponent = useCallback(\n    ({\n      ariaDescribedBy,\n      errorMessageElementId,\n      id,\n      labelElementId,\n    }: SelectRenderProps) => (\n      <SelectContainer>\n        <MuiSelect\n          {...inputValues}\n          aria-describedby={ariaDescribedBy}\n          aria-errormessage={errorMessageElementId}\n          children={children}\n          id={id}\n          inputProps={{ \"data-se\": testId }}\n          inputRef={localInputRef}\n          labelId={labelElementId}\n          multiple={hasMultipleChoices}\n          name={nameOverride ?? id}\n          onBlur={onBlur}\n          onChange={onChange}\n          onFocus={onFocus}\n          renderValue={hasMultipleChoices ? renderValue : undefined}\n          translate={translate}\n        />\n        {hasMultipleChoices && Array.isArray(value) && (\n          <ChipsPositioningContainer odysseyDesignTokens={odysseyDesignTokens}>\n            <Chips selection={value} isInteractive={true} />\n          </ChipsPositioningContainer>\n        )}\n      </SelectContainer>\n    ),\n    [\n      children,\n      Chips,\n      inputValues,\n      hasMultipleChoices,\n      nameOverride,\n      odysseyDesignTokens,\n      onBlur,\n      onChange,\n      onFocus,\n      renderValue,\n      testId,\n      translate,\n      value,\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      HintLinkComponent={HintLinkComponent}\n      id={idOverride}\n      isDisabled={isDisabled}\n      isFullWidth={isFullWidth}\n      isOptional={isOptional}\n      label={label}\n      renderFieldComponent={renderFieldComponent}\n    />\n  );\n};\n\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}

package/dist/Status.js

@@ -10,10 +10,12 @@ import _Chip from "@mui/material/Chip";
  *
  * See the License for the specific language governing permissions and limitations under the License.
  */
+
+import { memo } from "react";
 import { useMuiProps } from "./MuiPropsContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const statusSeverityValues = ["default", "error", "success", "warning"];
-export const Status = ({
+const Status = ({
   label,
   severity,
   testId,
@@ -29,4 +31,7 @@ export const Status = ({
     variant: "pill"
   });
 };
+const MemoizedStatus = memo(Status);
+MemoizedStatus.displayName = "Status";
+export { MemoizedStatus as Status };
 //# sourceMappingURL=Status.js.map

package/dist/Status.js.map

@@ -1 +1 @@
-{"version":3,"file":"Status.js","names":["useMuiProps","jsx","_jsx","statusSeverityValues","Status","label","severity","testId","translate","muiProps","_Chip","color","variant"],"sources":["../src/Status.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 { Chip } from \"@mui/material\";\n\nimport { useMuiProps } from \"./MuiPropsContext\";\nimport type { HtmlProps } from \"./HtmlProps\";\n\nexport const statusSeverityValues = [\n  \"default\",\n  \"error\",\n  \"success\",\n  \"warning\",\n] as const;\n\nexport type StatusProps = {\n  /**\n   * The text content of the Status\n   */\n  label: string;\n  /**\n   * Determine the color and icon of the Status\n   */\n  severity: (typeof statusSeverityValues)[number];\n} & HtmlProps;\n\nexport const Status = ({ label, severity, testId, translate }: StatusProps) => {\n  const muiProps = useMuiProps();\n\n  return (\n    <Chip\n      {...muiProps}\n      color={severity}\n      data-se={testId}\n      label={label}\n      translate={translate}\n      variant=\"pill\"\n    />\n  );\n};\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAcSA,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGpB,OAAO,MAAMC,oBAAoB,GAAG,CAClC,SAAS,EACT,OAAO,EACP,SAAS,EACT,SAAS,CACD;AAaV,OAAO,MAAMC,MAAM,GAAGA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;EAAEC;AAAuB,CAAC,KAAK;EAC7E,MAAMC,QAAQ,GAAGT,WAAW,CAAC,CAAC;EAE9B,OACEE,IAAA,CAAAQ,KAAA;IAAA,GACMD,QAAQ;IACZE,KAAK,EAAEL,QAAS;IAChB,WAASC,MAAO;IAChBF,KAAK,EAAEA,KAAM;IACbG,SAAS,EAAEA,SAAU;IACrBI,OAAO,EAAC;EAAM,CACf,CAAC;AAEN,CAAC"}
+{"version":3,"file":"Status.js","names":["memo","useMuiProps","jsx","_jsx","statusSeverityValues","Status","label","severity","testId","translate","muiProps","_Chip","color","variant","MemoizedStatus","displayName"],"sources":["../src/Status.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 } from \"react\";\nimport { Chip } from \"@mui/material\";\n\nimport { useMuiProps } from \"./MuiPropsContext\";\nimport type { HtmlProps } from \"./HtmlProps\";\n\nexport const statusSeverityValues = [\n  \"default\",\n  \"error\",\n  \"success\",\n  \"warning\",\n] as const;\n\nexport type StatusProps = {\n  /**\n   * The text content of the Status\n   */\n  label: string;\n  /**\n   * Determine the color and icon of the Status\n   */\n  severity: (typeof statusSeverityValues)[number];\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst Status = ({ label, severity, testId, translate }: StatusProps) => {\n  const muiProps = useMuiProps();\n\n  return (\n    <Chip\n      {...muiProps}\n      color={severity}\n      data-se={testId}\n      label={label}\n      translate={translate}\n      variant=\"pill\"\n    />\n  );\n};\n\nconst MemoizedStatus = memo(Status);\nMemoizedStatus.displayName = \"Status\";\n\nexport { MemoizedStatus as Status };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAQ,OAAO;AAAC,SAGpBC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGpB,OAAO,MAAMC,oBAAoB,GAAG,CAClC,SAAS,EACT,OAAO,EACP,SAAS,EACT,SAAS,CACD;AAaV,MAAMC,MAAM,GAAGA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;EAAEC;AAAuB,CAAC,KAAK;EACtE,MAAMC,QAAQ,GAAGT,WAAW,CAAC,CAAC;EAE9B,OACEE,IAAA,CAAAQ,KAAA;IAAA,GACMD,QAAQ;IACZE,KAAK,EAAEL,QAAS;IAChB,WAASC,MAAO;IAChBF,KAAK,EAAEA,KAAM;IACbG,SAAS,EAAEA,SAAU;IACrBI,OAAO,EAAC;EAAM,CACf,CAAC;AAEN,CAAC;AAED,MAAMC,cAAc,GAAGd,IAAI,CAACK,MAAM,CAAC;AACnCS,cAAc,CAACC,WAAW,GAAG,QAAQ;AAErC,SAASD,cAAc,IAAIT,MAAM"}

package/dist/Tabs.js

@@ -13,9 +13,9 @@ import _Tab from "@mui/material/Tab";
 
 import { memo, useCallback, useEffect, useState } from "react";
 import { TabContext as MuiTabContext, TabList as MuiTabList, TabPanel as MuiTabPanel } from "@mui/lab";
-import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
 import { Badge } from "./Badge.js";
 import { Box } from "./Box.js";
+import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";

package/dist/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","names":["memo","useCallback","useEffect","useState","TabContext","MuiTabContext","TabList","MuiTabList","TabPanel","MuiTabPanel","useOdysseyDesignTokens","Badge","Box","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","TabLabel","label","notificationCount","notificationCountMax","tabState","value","odysseyDesignTokens","children","undefined","sx","marginInlineStart","Spacing2","badgeContent","badgeContentMax","type","Tabs","ariaLabel","initialValue","tabs","onChange","onChangeProp","setTabState","event","renderTab","tab","index","testId","isDisabled","startIcon","_Tab","disabled","icon","tabIndex","toString","variant","map","MemoizedTabs","displayName"],"sources":["../src/Tabs.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  ReactElement,\n  ReactNode,\n  memo,\n  useCallback,\n  useEffect,\n  useState,\n} from \"react\";\nimport {\n  TabContext as MuiTabContext,\n  TabList as MuiTabList,\n  TabListProps as MuiTabListProps,\n  TabPanel as MuiTabPanel,\n} from \"@mui/lab\";\nimport { Tab as MuiTab } from \"@mui/material\";\n\nimport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { Box } from \"./Box\";\n\nexport type TabItemProps = {\n  /**\n   * The content of the Tab itself\n   */\n  children: ReactNode;\n  /**\n   * If `true`, the TabItem is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * The label text for the TabItem\n   */\n  label: string;\n  /**\n   * An optional icon to display at the start of the TabItem\n   */\n  startIcon?: ReactElement;\n  /**\n   * The value associated with the TabItem\n   */\n  value?: string;\n} & {\n  notificationCount?: BadgeProps[\"badgeContent\"];\n  notificationCountMax?: BadgeProps[\"badgeContentMax\"];\n} & HtmlProps;\n\nexport type TabsProps = {\n  /**\n   * The ARIA label for the full Tabs group\n   */\n  ariaLabel?: string;\n  /**\n   * @deprecated please use the `value` prop instead\n   * When `value` is provided, `initialValue` isn't used.\n   */\n  initialValue?: string;\n  /**\n   * The TabItems to be included in the Tabs group\n   */\n  tabs: TabItemProps[];\n  /**\n   * Identifier for the selected tab.\n   */\n  value?: string;\n  /**\n   * Callback fired when the active tab is changed.\n   */\n  onChange?: MuiTabListProps[\"onChange\"];\n};\n\nconst TabLabel = ({\n  label,\n  notificationCount,\n  notificationCountMax,\n  tabState,\n  value,\n}: Pick<\n  TabItemProps,\n  \"label\" | \"notificationCount\" | \"notificationCountMax\" | \"value\"\n> & {\n  tabState: string;\n}) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  return (\n    <>\n      {label}\n      {notificationCount !== undefined && notificationCount > 0 && (\n        <Box\n          sx={{\n            marginInlineStart: notificationCount\n              ? odysseyDesignTokens.Spacing2\n              : 0,\n          }}\n        >\n          <Badge\n            badgeContent={notificationCount}\n            badgeContentMax={notificationCountMax}\n            type={value === tabState ? \"attention\" : \"default\"}\n          />\n        </Box>\n      )}\n    </>\n  );\n};\n\nconst Tabs = ({\n  ariaLabel,\n  initialValue,\n  tabs,\n  value,\n  onChange: onChangeProp,\n}: TabsProps) => {\n  const [tabState, setTabState] = useState(initialValue ?? value ?? \"0\");\n\n  const onChange = useCallback<NonNullable<MuiTabListProps[\"onChange\"]>>(\n    (event, value: string) => {\n      setTabState(value);\n      onChangeProp?.(event, value);\n    },\n    [onChangeProp]\n  );\n\n  useEffect(() => {\n    if (value !== undefined) {\n      setTabState(value);\n    }\n  }, [value]);\n\n  const renderTab = useCallback(\n    (tab, index) => {\n      const {\n        testId,\n        isDisabled,\n        label,\n        startIcon,\n        value,\n        notificationCount,\n        notificationCountMax,\n      } = tab;\n\n      return (\n        <MuiTab\n          data-se={testId}\n          disabled={isDisabled}\n          icon={startIcon}\n          tabIndex={0}\n          label={\n            <TabLabel\n              label={label}\n              notificationCount={notificationCount}\n              notificationCountMax={notificationCountMax}\n              tabState={tabState}\n              value={value}\n            />\n          }\n          value={value ? value : index.toString()}\n          key={value ? value : index.toString()}\n        />\n      );\n    },\n    [tabState]\n  );\n\n  return (\n    <MuiTabContext value={tabState}>\n      <MuiTabList\n        onChange={onChange}\n        aria-label={ariaLabel}\n        variant=\"scrollable\"\n      >\n        {tabs.map((tab, index) => renderTab(tab, index))}\n      </MuiTabList>\n      {tabs.map((tab, index) => (\n        <MuiTabPanel\n          value={tab.value ? tab.value : index.toString()}\n          key={tab.value ? tab.value : index.toString()}\n        >\n          {tab.children}\n        </MuiTabPanel>\n      ))}\n    </MuiTabContext>\n  );\n};\n\nconst MemoizedTabs = memo(Tabs);\nMemoizedTabs.displayName = \"Tabs\";\n\nexport { MemoizedTabs as Tabs };\n"],"mappings":"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"}
+{"version":3,"file":"Tabs.js","names":["memo","useCallback","useEffect","useState","TabContext","MuiTabContext","TabList","MuiTabList","TabPanel","MuiTabPanel","Badge","Box","useOdysseyDesignTokens","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","TabLabel","label","notificationCount","notificationCountMax","tabState","value","odysseyDesignTokens","children","undefined","sx","marginInlineStart","Spacing2","badgeContent","badgeContentMax","type","Tabs","ariaLabel","initialValue","tabs","onChange","onChangeProp","setTabState","event","renderTab","tab","index","testId","isDisabled","startIcon","_Tab","disabled","icon","tabIndex","toString","variant","map","MemoizedTabs","displayName"],"sources":["../src/Tabs.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  ReactElement,\n  ReactNode,\n  memo,\n  useCallback,\n  useEffect,\n  useState,\n} from \"react\";\nimport {\n  TabContext as MuiTabContext,\n  TabList as MuiTabList,\n  TabListProps as MuiTabListProps,\n  TabPanel as MuiTabPanel,\n} from \"@mui/lab\";\nimport { Tab as MuiTab } from \"@mui/material\";\n\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { Box } from \"./Box\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport type TabItemProps = {\n  /**\n   * The content of the Tab itself\n   */\n  children: ReactNode;\n  /**\n   * If `true`, the TabItem is disabled\n   */\n  isDisabled?: boolean;\n  /**\n   * The label text for the TabItem\n   */\n  label: string;\n  /**\n   * An optional icon to display at the start of the TabItem\n   */\n  startIcon?: ReactElement;\n  /**\n   * The value associated with the TabItem\n   */\n  value?: string;\n} & {\n  notificationCount?: BadgeProps[\"badgeContent\"];\n  notificationCountMax?: BadgeProps[\"badgeContentMax\"];\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nexport type TabsProps = {\n  /**\n   * @deprecated please use the `value` prop instead\n   * When `value` is provided, `initialValue` isn't used.\n   */\n  initialValue?: string;\n  /**\n   * The TabItems to be included in the Tabs group\n   */\n  tabs: TabItemProps[];\n  /**\n   * Identifier for the selected tab.\n   */\n  value?: string;\n  /**\n   * Callback fired when the active tab is changed.\n   */\n  onChange?: MuiTabListProps[\"onChange\"];\n};\n\nconst TabLabel = ({\n  label,\n  notificationCount,\n  notificationCountMax,\n  tabState,\n  value,\n}: Pick<\n  TabItemProps,\n  \"label\" | \"notificationCount\" | \"notificationCountMax\" | \"value\"\n> & {\n  tabState: string;\n}) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  return (\n    <>\n      {label}\n      {notificationCount !== undefined && notificationCount > 0 && (\n        <Box\n          sx={{\n            marginInlineStart: notificationCount\n              ? odysseyDesignTokens.Spacing2\n              : 0,\n          }}\n        >\n          <Badge\n            badgeContent={notificationCount}\n            badgeContentMax={notificationCountMax}\n            type={value === tabState ? \"attention\" : \"default\"}\n          />\n        </Box>\n      )}\n    </>\n  );\n};\n\nconst Tabs = ({\n  ariaLabel,\n  initialValue,\n  tabs,\n  value,\n  onChange: onChangeProp,\n}: TabsProps & Pick<HtmlProps, \"ariaLabel\">) => {\n  const [tabState, setTabState] = useState(initialValue ?? value ?? \"0\");\n\n  const onChange = useCallback<NonNullable<MuiTabListProps[\"onChange\"]>>(\n    (event, value: string) => {\n      setTabState(value);\n      onChangeProp?.(event, value);\n    },\n    [onChangeProp],\n  );\n\n  useEffect(() => {\n    if (value !== undefined) {\n      setTabState(value);\n    }\n  }, [value]);\n\n  const renderTab = useCallback(\n    (tab: TabItemProps, index: number) => {\n      const {\n        testId,\n        isDisabled,\n        label,\n        startIcon,\n        value,\n        notificationCount,\n        notificationCountMax,\n      } = tab;\n\n      return (\n        <MuiTab\n          data-se={testId}\n          disabled={isDisabled}\n          icon={startIcon}\n          tabIndex={0}\n          label={\n            <TabLabel\n              label={label}\n              notificationCount={notificationCount}\n              notificationCountMax={notificationCountMax}\n              tabState={tabState}\n              value={value}\n            />\n          }\n          value={value ? value : index.toString()}\n          key={value ? value : index.toString()}\n        />\n      );\n    },\n    [tabState],\n  );\n\n  return (\n    <MuiTabContext value={tabState}>\n      <MuiTabList\n        onChange={onChange}\n        aria-label={ariaLabel}\n        variant=\"scrollable\"\n      >\n        {tabs.map((tab, index) => renderTab(tab, index))}\n      </MuiTabList>\n      {tabs.map((tab, index) => (\n        <MuiTabPanel\n          value={tab.value ? tab.value : index.toString()}\n          key={tab.value ? tab.value : index.toString()}\n        >\n          {tab.children}\n        </MuiTabPanel>\n      ))}\n    </MuiTabContext>\n  );\n};\n\nconst MemoizedTabs = memo(Tabs);\nMemoizedTabs.displayName = \"Tabs\";\n\nexport { MemoizedTabs as Tabs };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAGEA,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,QAAQ,QACH,OAAO;AACd,SACEC,UAAU,IAAIC,aAAa,EAC3BC,OAAO,IAAIC,UAAU,EAErBC,QAAQ,IAAIC,WAAW,QAClB,UAAU;AAAC,SAGTC,KAAK;AAAA,SACLC,GAAG;AAAA,SAEHC,sBAAsB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAgD/B,MAAMC,QAAQ,GAAGA,CAAC;EAChBC,KAAK;EACLC,iBAAiB;EACjBC,oBAAoB;EACpBC,QAAQ;EACRC;AAMF,CAAC,KAAK;EACJ,MAAMC,mBAAmB,GAAGb,sBAAsB,CAAC,CAAC;EAEpD,OACEM,KAAA,CAAAF,SAAA;IAAAU,QAAA,GACGN,KAAK,EACLC,iBAAiB,KAAKM,SAAS,IAAIN,iBAAiB,GAAG,CAAC,IACvDP,IAAA,CAACH,GAAG;MACFiB,EAAE,EAAE;QACFC,iBAAiB,EAAER,iBAAiB,GAChCI,mBAAmB,CAACK,QAAQ,GAC5B;MACN,CAAE;MAAAJ,QAAA,EAEFZ,IAAA,CAACJ,KAAK;QACJqB,YAAY,EAAEV,iBAAkB;QAChCW,eAAe,EAAEV,oBAAqB;QACtCW,IAAI,EAAET,KAAK,KAAKD,QAAQ,GAAG,WAAW,GAAG;MAAU,CACpD;IAAC,CACC,CACN;EAAA,CACD,CAAC;AAEP,CAAC;AAED,MAAMW,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,YAAY;EACZC,IAAI;EACJb,KAAK;EACLc,QAAQ,EAAEC;AAC8B,CAAC,KAAK;EAC9C,MAAM,CAAChB,QAAQ,EAAEiB,WAAW,CAAC,GAAGrC,QAAQ,CAACiC,YAAY,IAAIZ,KAAK,IAAI,GAAG,CAAC;EAEtE,MAAMc,QAAQ,GAAGrC,WAAW,CAC1B,CAACwC,KAAK,EAAEjB,KAAa,KAAK;IACxBgB,WAAW,CAAChB,KAAK,CAAC;IAClBe,YAAY,GAAGE,KAAK,EAAEjB,KAAK,CAAC;EAC9B,CAAC,EACD,CAACe,YAAY,CACf,CAAC;EAEDrC,SAAS,CAAC,MAAM;IACd,IAAIsB,KAAK,KAAKG,SAAS,EAAE;MACvBa,WAAW,CAAChB,KAAK,CAAC;IACpB;EACF,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,MAAMkB,SAAS,GAAGzC,WAAW,CAC3B,CAAC0C,GAAiB,EAAEC,KAAa,KAAK;IACpC,MAAM;MACJC,MAAM;MACNC,UAAU;MACV1B,KAAK;MACL2B,SAAS;MACTvB,KAAK;MACLH,iBAAiB;MACjBC;IACF,CAAC,GAAGqB,GAAG;IAEP,OACE7B,IAAA,CAAAkC,IAAA;MACE,WAASH,MAAO;MAChBI,QAAQ,EAAEH,UAAW;MACrBI,IAAI,EAAEH,SAAU;MAChBI,QAAQ,EAAE,CAAE;MACZ/B,KAAK,EACHN,IAAA,CAACK,QAAQ;QACPC,KAAK,EAAEA,KAAM;QACbC,iBAAiB,EAAEA,iBAAkB;QACrCC,oBAAoB,EAAEA,oBAAqB;QAC3CC,QAAQ,EAAEA,QAAS;QACnBC,KAAK,EAAEA;MAAM,CACd,CACF;MACDA,KAAK,EAAEA,KAAK,GAAGA,KAAK,GAAGoB,KAAK,CAACQ,QAAQ,CAAC;IAAE,GACnC5B,KAAK,GAAGA,KAAK,GAAGoB,KAAK,CAACQ,QAAQ,CAAC,CACrC,CAAC;EAEN,CAAC,EACD,CAAC7B,QAAQ,CACX,CAAC;EAED,OACEL,KAAA,CAACb,aAAa;IAACmB,KAAK,EAAED,QAAS;IAAAG,QAAA,GAC7BZ,IAAA,CAACP,UAAU;MACT+B,QAAQ,EAAEA,QAAS;MACnB,cAAYH,SAAU;MACtBkB,OAAO,EAAC,YAAY;MAAA3B,QAAA,EAEnBW,IAAI,CAACiB,GAAG,CAAC,CAACX,GAAG,EAAEC,KAAK,KAAKF,SAAS,CAACC,GAAG,EAAEC,KAAK,CAAC;IAAC,CACtC,CAAC,EACZP,IAAI,CAACiB,GAAG,CAAC,CAACX,GAAG,EAAEC,KAAK,KACnB9B,IAAA,CAACL,WAAW;MACVe,KAAK,EAAEmB,GAAG,CAACnB,KAAK,GAAGmB,GAAG,CAACnB,KAAK,GAAGoB,KAAK,CAACQ,QAAQ,CAAC,CAAE;MAAA1B,QAAA,EAG/CiB,GAAG,CAACjB;IAAQ,GAFRiB,GAAG,CAACnB,KAAK,GAAGmB,GAAG,CAACnB,KAAK,GAAGoB,KAAK,CAACQ,QAAQ,CAAC,CAGjC,CACd,CAAC;EAAA,CACW,CAAC;AAEpB,CAAC;AAED,MAAMG,YAAY,GAAGvD,IAAI,CAACkC,IAAI,CAAC;AAC/BqB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIrB,IAAI"}

package/dist/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","names":["memo","useCallback","useContext","TagListContext","MuiPropsContext","jsx","_jsx","Tag","icon","isDisabled","label","onClick","onRemove","testId","translate","chipElementType","renderTag","muiProps","_Chip","clickable","component","disabled","onDelete","Consumer","children","MemoizedTag","displayName"],"sources":["../src/Tag.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 { Chip as MuiChip, ChipProps as MuiChipProps } from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useContext } from \"react\";\nimport { TagListContext } from \"./TagListContext\";\nimport { MuiPropsContext } from \"./MuiPropsContext\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TagProps = {\n  icon?: ReactElement;\n  isDisabled?: boolean;\n  /**\n   * The label text for the Tag\n   */\n  label: string;\n  /**\n   * Callback fired when the Tag is clicked\n   */\n  onClick?: MuiChipProps[\"onClick\"];\n  /**\n   * Callback fired when the remove button of the Tag is clicked\n   */\n  onRemove?: MuiChipProps[\"onDelete\"];\n} & HtmlProps;\n\nconst Tag = ({\n  icon,\n  isDisabled,\n  label,\n  onClick,\n  onRemove,\n  testId,\n  translate,\n}: TagProps) => {\n  const { chipElementType } = useContext(TagListContext);\n\n  const renderTag = useCallback(\n    (muiProps) => (\n      <MuiChip\n        {...muiProps}\n        aria-disabled={isDisabled}\n        clickable={onClick ? true : false}\n        component={chipElementType}\n        data-se={testId}\n        disabled={isDisabled}\n        icon={icon}\n        label={label}\n        onClick={onClick}\n        onDelete={onRemove}\n        translate={translate}\n      />\n    ),\n    [\n      chipElementType,\n      icon,\n      isDisabled,\n      label,\n      onClick,\n      onRemove,\n      testId,\n      translate,\n    ]\n  );\n\n  return <MuiPropsContext.Consumer>{renderTag}</MuiPropsContext.Consumer>;\n};\n\nconst MemoizedTag = memo(Tag);\nMemoizedTag.displayName = \"Tag\";\n\nexport { MemoizedTag as Tag };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AAAC,SAC3DC,cAAc;AAAA,SACdC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoBxB,MAAMC,GAAG,GAAGA,CAAC;EACXC,IAAI;EACJC,UAAU;EACVC,KAAK;EACLC,OAAO;EACPC,QAAQ;EACRC,MAAM;EACNC;AACQ,CAAC,KAAK;EACd,MAAM;IAAEC;EAAgB,CAAC,GAAGb,UAAU,CAACC,cAAc,CAAC;EAEtD,MAAMa,SAAS,GAAGf,WAAW,CAC1BgB,QAAQ,IACPX,IAAA,CAAAY,KAAA;IAAA,GACMD,QAAQ;IACZ,iBAAeR,UAAW;IAC1BU,SAAS,EAAER,OAAO,GAAG,IAAI,GAAG,KAAM;IAClCS,SAAS,EAAEL,eAAgB;IAC3B,WAASF,MAAO;IAChBQ,QAAQ,EAAEZ,UAAW;IACrBD,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA,KAAM;IACbC,OAAO,EAAEA,OAAQ;IACjBW,QAAQ,EAAEV,QAAS;IACnBE,SAAS,EAAEA;EAAU,CACtB,CACF,EACD,CACEC,eAAe,EACfP,IAAI,EACJC,UAAU,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,SAAS,CAEb,CAAC;EAED,OAAOR,IAAA,CAACF,eAAe,CAACmB,QAAQ;IAAAC,QAAA,EAAER;EAAS,CAA2B,CAAC;AACzE,CAAC;AAED,MAAMS,WAAW,GAAGzB,IAAI,CAACO,GAAG,CAAC;AAC7BkB,WAAW,CAACC,WAAW,GAAG,KAAK;AAE/B,SAASD,WAAW,IAAIlB,GAAG"}
+{"version":3,"file":"Tag.js","names":["memo","useCallback","useContext","TagListContext","MuiPropsContext","jsx","_jsx","Tag","icon","isDisabled","label","onClick","onRemove","testId","translate","chipElementType","renderTag","muiProps","_Chip","clickable","component","disabled","onDelete","Consumer","children","MemoizedTag","displayName"],"sources":["../src/Tag.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 { Chip as MuiChip, ChipProps as MuiChipProps } from \"@mui/material\";\nimport { memo, ReactElement, useCallback, useContext } from \"react\";\nimport { TagListContext } from \"./TagListContext\";\nimport { MuiPropsContext, MuiPropsContextType } from \"./MuiPropsContext\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TagProps = {\n  icon?: ReactElement;\n  isDisabled?: boolean;\n  /**\n   * The label text for the Tag\n   */\n  label: string;\n  /**\n   * Callback fired when the Tag is clicked\n   */\n  onClick?: MuiChipProps[\"onClick\"];\n  /**\n   * Callback fired when the remove button of the Tag is clicked\n   */\n  onRemove?: MuiChipProps[\"onDelete\"];\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst Tag = ({\n  icon,\n  isDisabled,\n  label,\n  onClick,\n  onRemove,\n  testId,\n  translate,\n}: TagProps) => {\n  const { chipElementType } = useContext(TagListContext);\n\n  const renderTag = useCallback(\n    (muiProps: MuiPropsContextType) => (\n      <MuiChip\n        {...muiProps}\n        aria-disabled={isDisabled}\n        clickable={onClick ? true : false}\n        component={chipElementType}\n        data-se={testId}\n        disabled={isDisabled}\n        icon={icon}\n        label={label}\n        onClick={onClick}\n        onDelete={onRemove}\n        translate={translate}\n      />\n    ),\n    [\n      chipElementType,\n      icon,\n      isDisabled,\n      label,\n      onClick,\n      onRemove,\n      testId,\n      translate,\n    ],\n  );\n\n  return <MuiPropsContext.Consumer>{renderTag}</MuiPropsContext.Consumer>;\n};\n\nconst MemoizedTag = memo(Tag);\nMemoizedTag.displayName = \"Tag\";\n\nexport { MemoizedTag as Tag };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAgBC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AAAC,SAC3DC,cAAc;AAAA,SACdC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoBxB,MAAMC,GAAG,GAAGA,CAAC;EACXC,IAAI;EACJC,UAAU;EACVC,KAAK;EACLC,OAAO;EACPC,QAAQ;EACRC,MAAM;EACNC;AACQ,CAAC,KAAK;EACd,MAAM;IAAEC;EAAgB,CAAC,GAAGb,UAAU,CAACC,cAAc,CAAC;EAEtD,MAAMa,SAAS,GAAGf,WAAW,CAC1BgB,QAA6B,IAC5BX,IAAA,CAAAY,KAAA;IAAA,GACMD,QAAQ;IACZ,iBAAeR,UAAW;IAC1BU,SAAS,EAAER,OAAO,GAAG,IAAI,GAAG,KAAM;IAClCS,SAAS,EAAEL,eAAgB;IAC3B,WAASF,MAAO;IAChBQ,QAAQ,EAAEZ,UAAW;IACrBD,IAAI,EAAEA,IAAK;IACXE,KAAK,EAAEA,KAAM;IACbC,OAAO,EAAEA,OAAQ;IACjBW,QAAQ,EAAEV,QAAS;IACnBE,SAAS,EAAEA;EAAU,CACtB,CACF,EACD,CACEC,eAAe,EACfP,IAAI,EACJC,UAAU,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,SAAS,CAEb,CAAC;EAED,OAAOR,IAAA,CAACF,eAAe,CAACmB,QAAQ;IAAAC,QAAA,EAAER;EAAS,CAA2B,CAAC;AACzE,CAAC;AAED,MAAMS,WAAW,GAAGzB,IAAI,CAACO,GAAG,CAAC;AAC7BkB,WAAW,CAACC,WAAW,GAAG,KAAK;AAE/B,SAASD,WAAW,IAAIlB,GAAG"}

package/dist/TagList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagList.js","names":["memo","useMemo","TagListContext","jsx","_jsx","TagList","children","testId","providerValue","chipElementType","_Stack","component","direction","spacing","useFlexGap","flexWrap","Provider","value","MemoizedTagList","displayName"],"sources":["../src/TagList.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 { Tag } from \"./Tag\";\nimport { Stack } from \"@mui/material\";\nimport { memo, ReactElement, useMemo } from \"react\";\nimport { ChipElementType, TagListContext } from \"./TagListContext\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TagListProps = {\n  /**\n   * The Tag or array of Tags within the TagList\n   */\n  children: ReactElement<typeof Tag> | Array<ReactElement<typeof Tag>>;\n} & HtmlProps;\n\nconst TagList = ({ children, testId }: TagListProps) => {\n  const providerValue = useMemo<{\n    chipElementType: ChipElementType;\n  }>(\n    () => ({\n      chipElementType: \"li\",\n    }),\n    []\n  );\n\n  return (\n    <Stack\n      component=\"ul\"\n      data-se={testId}\n      direction=\"row\"\n      spacing={2}\n      useFlexGap\n      flexWrap=\"wrap\"\n    >\n      <TagListContext.Provider value={providerValue}>\n        {children}\n      </TagListContext.Provider>\n    </Stack>\n  );\n};\n\nconst MemoizedTagList = memo(TagList);\nMemoizedTagList.displayName = \"TagList\";\n\nexport { MemoizedTagList as TagList };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAAC,SAC1BC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAUxC,MAAMC,OAAO,GAAGA,CAAC;EAAEC,QAAQ;EAAEC;AAAqB,CAAC,KAAK;EACtD,MAAMC,aAAa,GAAGP,OAAO,CAG3B,OAAO;IACLQ,eAAe,EAAE;EACnB,CAAC,CAAC,EACF,EACF,CAAC;EAED,OACEL,IAAA,CAAAM,MAAA;IACEC,SAAS,EAAC,IAAI;IACd,WAASJ,MAAO;IAChBK,SAAS,EAAC,KAAK;IACfC,OAAO,EAAE,CAAE;IACXC,UAAU;IACVC,QAAQ,EAAC,MAAM;IAAAT,QAAA,EAEfF,IAAA,CAACF,cAAc,CAACc,QAAQ;MAACC,KAAK,EAAET,aAAc;MAAAF,QAAA,EAC3CA;IAAQ,CACc;EAAC,CACrB,CAAC;AAEZ,CAAC;AAED,MAAMY,eAAe,GAAGlB,IAAI,CAACK,OAAO,CAAC;AACrCa,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIb,OAAO"}
+{"version":3,"file":"TagList.js","names":["memo","useMemo","TagListContext","jsx","_jsx","TagList","children","testId","providerValue","chipElementType","_Stack","component","direction","spacing","useFlexGap","flexWrap","Provider","value","MemoizedTagList","displayName"],"sources":["../src/TagList.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 { Tag } from \"./Tag\";\nimport { Stack } from \"@mui/material\";\nimport { memo, ReactElement, useMemo } from \"react\";\nimport { ChipElementType, TagListContext } from \"./TagListContext\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TagListProps = {\n  /**\n   * The Tag or array of Tags within the TagList\n   */\n  children: ReactElement<typeof Tag> | Array<ReactElement<typeof Tag>>;\n} & Pick<HtmlProps, \"testId\">;\n\nconst TagList = ({ children, testId }: TagListProps) => {\n  const providerValue = useMemo<{\n    chipElementType: ChipElementType;\n  }>(\n    () => ({\n      chipElementType: \"li\",\n    }),\n    [],\n  );\n\n  return (\n    <Stack\n      component=\"ul\"\n      data-se={testId}\n      direction=\"row\"\n      spacing={2}\n      useFlexGap\n      flexWrap=\"wrap\"\n    >\n      <TagListContext.Provider value={providerValue}>\n        {children}\n      </TagListContext.Provider>\n    </Stack>\n  );\n};\n\nconst MemoizedTagList = memo(TagList);\nMemoizedTagList.displayName = \"TagList\";\n\nexport { MemoizedTagList as TagList };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAAC,SAC1BC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAUxC,MAAMC,OAAO,GAAGA,CAAC;EAAEC,QAAQ;EAAEC;AAAqB,CAAC,KAAK;EACtD,MAAMC,aAAa,GAAGP,OAAO,CAG3B,OAAO;IACLQ,eAAe,EAAE;EACnB,CAAC,CAAC,EACF,EACF,CAAC;EAED,OACEL,IAAA,CAAAM,MAAA;IACEC,SAAS,EAAC,IAAI;IACd,WAASJ,MAAO;IAChBK,SAAS,EAAC,KAAK;IACfC,OAAO,EAAE,CAAE;IACXC,UAAU;IACVC,QAAQ,EAAC,MAAM;IAAAT,QAAA,EAEfF,IAAA,CAACF,cAAc,CAACc,QAAQ;MAACC,KAAK,EAAET,aAAc;MAAAF,QAAA,EAC3CA;IAAQ,CACc;EAAC,CACrB,CAAC;AAEZ,CAAC;AAED,MAAMY,eAAe,GAAGlB,IAAI,CAACK,OAAO,CAAC;AACrCa,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIb,OAAO"}

package/dist/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","useImperativeHandle","useRef","Field","useInputValues","getControlState","jsx","_jsx","textFieldTypeValues","TextField","ariaDescribedBy","autoCompleteType","defaultValue","hasInitialFocus","endAdornment","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","inputRef","inputMode","isDisabled","isFullWidth","isMultiline","isOptional","isReadOnly","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","placeholder","startAdornment","testId","translate","type","value","ref","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","localInputRef","focus","event","renderFieldComponent","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","_InputAdornment","position","children","inputProps","multiline","readOnly","required","fieldType","hasVisibleLabel","MemoizedTextField","displayName"],"sources":["../src/TextField.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  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n} from \"react\";\nimport { InputAdornment, InputBase } from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { Field } from \"./Field\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { FocusHandle, useInputValues, getControlState } from \"./inputUtils\";\n\nexport const textFieldTypeValues = [\n  \"email\",\n  \"number\",\n  \"tel\",\n  \"text\",\n  \"url\",\n] as const;\n\nexport type TextFieldProps = {\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   * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n   */\n  autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: string;\n  /**\n   * End `InputAdornment` for this component.\n   */\n  endAdornment?: string | ReactElement;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * The ref forwarded to the TextField\n   */\n  inputRef?: React.RefObject<FocusHandle>;\n  /**\n   * Hints at the type of data that might be entered by the user while editing the element or its contents\n   * @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute\n   */\n  inputMode?: InputHTMLAttributes<HTMLInputElement>[\"inputMode\"];\n  /**\n   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n   */\n  isMultiline?: boolean;\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   * Start `InputAdornment` for this component.\n   */\n  startAdornment?: string | ReactElement;\n  /**\n   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n   */\n  type?: (typeof textFieldTypeValues)[number];\n  /**\n   * The value of the `input` element, required for a controlled component.\n   */\n  value?: string;\n} & FieldComponentProps &\n  HtmlProps;\n\nconst TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      ariaDescribedBy,\n      autoCompleteType,\n      defaultValue,\n      hasInitialFocus,\n      endAdornment,\n      errorMessage,\n      errorMessageList,\n      hint,\n      HintLinkComponent,\n      id: idOverride,\n      inputRef,\n      inputMode,\n      isDisabled = false,\n      isFullWidth = false,\n      isMultiline = false,\n      isOptional = false,\n      isReadOnly,\n      label,\n      name: nameOverride,\n      onBlur,\n      onChange: onChangeProp,\n      onFocus,\n      placeholder,\n      startAdornment,\n      testId,\n      translate,\n      type = \"text\",\n      value: value,\n    },\n    ref\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(\n      inputRef,\n      () => {\n        return {\n          focus: () => {\n            localInputRef.current?.focus();\n          },\n        };\n      },\n      []\n    );\n\n    const onChange = useCallback<\n      NonNullable<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={autoCompleteType}\n          /* eslint-disable-next-line jsx-a11y/no-autofocus */\n          autoFocus={hasInitialFocus}\n          endAdornment={\n            endAdornment && (\n              <InputAdornment position=\"end\" translate={translate}>\n                {endAdornment}\n              </InputAdornment>\n            )\n          }\n          id={id}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n            \"data-se\": testId,\n            inputMode,\n          }}\n          inputRef={localInputRef}\n          multiline={isMultiline}\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          startAdornment={\n            startAdornment && (\n              <InputAdornment position=\"start\" translate={translate}>\n                {startAdornment}\n              </InputAdornment>\n            )\n          }\n          type={type}\n          translate={translate}\n        />\n      ),\n      [\n        autoCompleteType,\n        inputValues,\n        hasInitialFocus,\n        endAdornment,\n        inputMode,\n        isMultiline,\n        nameOverride,\n        onBlur,\n        onChange,\n        onFocus,\n        placeholder,\n        isOptional,\n        isReadOnly,\n        ref,\n        startAdornment,\n        testId,\n        translate,\n        type,\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        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 MemoizedTextField = memo(TextField);\nMemoizedTextField.displayName = \"TextField\";\n\nexport { MemoizedTextField as TextField };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAGEA,UAAU,EAEVC,IAAI,EAEJC,WAAW,EACXC,mBAAmB,EACnBC,MAAM,QACD,OAAO;AAAC,SAINC,KAAK;AAAA,SAEQC,cAAc,EAAEC,eAAe;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAErD,OAAO,MAAMC,mBAAmB,GAAG,CACjC,OAAO,EACP,QAAQ,EACR,KAAK,EACL,MAAM,EACN,KAAK,CACG;AAqEV,MAAMC,SAAS,GAAGX,UAAU,CAC1B,CACE;EACEY,eAAe;EACfC,gBAAgB;EAChBC,YAAY;EACZC,eAAe;EACfC,YAAY;EACZC,YAAY;EACZC,gBAAgB;EAChBC,IAAI;EACJC,iBAAiB;EACjBC,EAAE,EAAEC,UAAU;EACdC,QAAQ;EACRC,SAAS;EACTC,UAAU,GAAG,KAAK;EAClBC,WAAW,GAAG,KAAK;EACnBC,WAAW,GAAG,KAAK;EACnBC,UAAU,GAAG,KAAK;EAClBC,UAAU;EACVC,KAAK;EACLC,IAAI,EAAEC,YAAY;EAClBC,MAAM;EACNC,QAAQ,EAAEC,YAAY;EACtBC,OAAO;EACPC,WAAW;EACXC,cAAc;EACdC,MAAM;EACNC,SAAS;EACTC,IAAI,GAAG,MAAM;EACbC,KAAK,EAAEA;AACT,CAAC,EACDC,GAAG,KACA;EACH,MAAMC,kBAAkB,GAAGxC,MAAM,CAC/BG,eAAe,CAAC;IACdsC,eAAe,EAAEH,KAAK;IACtBI,iBAAiB,EAAEhC;EACrB,CAAC,CACH,CAAC;EACD,MAAMiC,WAAW,GAAGzC,cAAc,CAAC;IACjCQ,YAAY;IACZ4B,KAAK;IACLM,YAAY,EAAEJ,kBAAkB,CAACK;EACnC,CAAC,CAAC;EAEF,MAAMC,aAAa,GAAG9C,MAAM,CAAmB,IAAI,CAAC;EACpDD,mBAAmB,CACjBoB,QAAQ,EACR,MAAM;IACJ,OAAO;MACL4B,KAAK,EAAEA,CAAA,KAAM;QACXD,aAAa,CAACD,OAAO,EAAEE,KAAK,CAAC,CAAC;MAChC;IACF,CAAC;EACH,CAAC,EACD,EACF,CAAC;EAED,MAAMjB,QAAQ,GAAGhC,WAAW,CAGzBkD,KAAK,IAAK;IACTjB,YAAY,GAAGiB,KAAK,CAAC;EACvB,CAAC,EACD,CAACjB,YAAY,CACf,CAAC;EAED,MAAMkB,oBAAoB,GAAGnD,WAAW,CACtC,CAAC;IAAEU,eAAe;IAAE0C,qBAAqB;IAAEjC,EAAE;IAAEkC;EAAe,CAAC,KAC7D9C,IAAA,CAAA+C,UAAA;IAAA,GACMT,WAAW;IACf,oBAAkBnC,eAAgB;IAClC6C,YAAY,EAAE5C,gBAAiB;IAE/B6C,SAAS,EAAE3C,eAAgB;IAC3BC,YAAY,EACVA,YAAY,IACVP,IAAA,CAAAkD,eAAA;MAAgBC,QAAQ,EAAC,KAAK;MAACpB,SAAS,EAAEA,SAAU;MAAAqB,QAAA,EACjD7C;IAAY,CACC,CAEnB;IACDK,EAAE,EAAEA,EAAG;IACPyC,UAAU,EAAE;MACV,mBAAmB,EAAER,qBAAqB;MAC1C,iBAAiB,EAAEC,cAAc;MACjC,SAAS,EAAEhB,MAAM;MACjBf;IACF,CAAE;IACFD,QAAQ,EAAE2B,aAAc;IACxBa,SAAS,EAAEpC,WAAY;IACvBI,IAAI,EAAEC,YAAY,IAAIX,EAAG;IACzBY,MAAM,EAAEA,MAAO;IACfC,QAAQ,EAAEA,QAAS;IACnBE,OAAO,EAAEA,OAAQ;IACjBC,WAAW,EAAEA,WAAY;IACzB2B,QAAQ,EAAEnC,UAAW;IACrBc,GAAG,EAAEA,GAAI;IACTsB,QAAQ,EAAE,CAACrC,UAAW;IACtBU,cAAc,EACZA,cAAc,IACZ7B,IAAA,CAAAkD,eAAA;MAAgBC,QAAQ,EAAC,OAAO;MAACpB,SAAS,EAAEA,SAAU;MAAAqB,QAAA,EACnDvB;IAAc,CACD,CAEnB;IACDG,IAAI,EAAEA,IAAK;IACXD,SAAS,EAAEA;EAAU,CACtB,CACF,EACD,CACE3B,gBAAgB,EAChBkC,WAAW,EACXhC,eAAe,EACfC,YAAY,EACZQ,SAAS,EACTG,WAAW,EACXK,YAAY,EACZC,MAAM,EACNC,QAAQ,EACRE,OAAO,EACPC,WAAW,EACXT,UAAU,EACVC,UAAU,EACVc,GAAG,EACHL,cAAc,EACdC,MAAM,EACNC,SAAS,EACTC,IAAI,CAER,CAAC;EAED,OACEhC,IAAA,CAACJ,KAAK;IACJO,eAAe,EAAEA,eAAgB;IACjCK,YAAY,EAAEA,YAAa;IAC3BC,gBAAgB,EAAEA,gBAAiB;IACnCgD,SAAS,EAAC,QAAQ;IAClBC,eAAe;IACfhD,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfG,UAAU,EAAEA,UAAW;IACvBC,WAAW,EAAEA,WAAY;IACzBE,UAAU,EAAEA,UAAW;IACvBE,KAAK,EAAEA,KAAM;IACbuB,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CACF,CAAC;AAED,MAAMe,iBAAiB,GAAGnE,IAAI,CAACU,SAAS,CAAC;AACzCyD,iBAAiB,CAACC,WAAW,GAAG,WAAW;AAE3C,SAASD,iBAAiB,IAAIzD,SAAS"}
+{"version":3,"file":"TextField.js","names":["forwardRef","memo","useCallback","useImperativeHandle","useRef","Field","useInputValues","getControlState","jsx","_jsx","textFieldTypeValues","TextField","ariaDescribedBy","autoCompleteType","defaultValue","hasInitialFocus","endAdornment","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","inputRef","inputMode","isDisabled","isFullWidth","isMultiline","isOptional","isReadOnly","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","placeholder","startAdornment","testId","translate","type","value","ref","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","localInputRef","focus","event","renderFieldComponent","errorMessageElementId","labelElementId","_InputBase","autoComplete","autoFocus","_InputAdornment","position","children","inputProps","multiline","readOnly","required","fieldType","hasVisibleLabel","MemoizedTextField","displayName"],"sources":["../src/TextField.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  ChangeEventHandler,\n  FocusEventHandler,\n  forwardRef,\n  InputHTMLAttributes,\n  memo,\n  ReactElement,\n  useCallback,\n  useImperativeHandle,\n  useRef,\n} from \"react\";\nimport { InputAdornment, InputBase } from \"@mui/material\";\n\nimport {\n  FieldComponentProps,\n  FieldComponentRenderProps,\n} from \"./FieldComponentProps\";\nimport { Field } from \"./Field\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { FocusHandle, useInputValues, getControlState } from \"./inputUtils\";\n\nexport const textFieldTypeValues = [\n  \"email\",\n  \"number\",\n  \"tel\",\n  \"text\",\n  \"url\",\n] as const;\n\nexport type TextFieldProps = {\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   * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n   */\n  autoCompleteType?: InputHTMLAttributes<HTMLInputElement>[\"autoComplete\"];\n  /**\n   * The default value. Use when the component is not controlled.\n   */\n  defaultValue?: string;\n  /**\n   * End `InputAdornment` for this component.\n   */\n  endAdornment?: string | ReactElement;\n  /**\n   * If `true`, the component will receive focus automatically.\n   */\n  hasInitialFocus?: boolean;\n  /**\n   * The ref forwarded to the TextField\n   */\n  inputRef?: React.RefObject<FocusHandle>;\n  /**\n   * Hints at the type of data that might be entered by the user while editing the element or its contents\n   * @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute\n   */\n  inputMode?: InputHTMLAttributes<HTMLInputElement>[\"inputMode\"];\n  /**\n   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.\n   */\n  isMultiline?: boolean;\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   * Start `InputAdornment` for this component.\n   */\n  startAdornment?: string | ReactElement;\n  /**\n   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n   */\n  type?: (typeof textFieldTypeValues)[number];\n  /**\n   * The value of the `input` element, required for a controlled component.\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 TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n  (\n    {\n      ariaDescribedBy,\n      autoCompleteType,\n      defaultValue,\n      hasInitialFocus,\n      endAdornment,\n      errorMessage,\n      errorMessageList,\n      hint,\n      HintLinkComponent,\n      id: idOverride,\n      inputRef,\n      inputMode,\n      isDisabled = false,\n      isFullWidth = false,\n      isMultiline = false,\n      isOptional = false,\n      isReadOnly,\n      label,\n      name: nameOverride,\n      onBlur,\n      onChange: onChangeProp,\n      onFocus,\n      placeholder,\n      startAdornment,\n      testId,\n      translate,\n      type = \"text\",\n      value: value,\n    },\n    ref,\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(\n      inputRef,\n      () => {\n        return {\n          focus: () => {\n            localInputRef.current?.focus();\n          },\n        };\n      },\n      [],\n    );\n\n    const onChange = useCallback<\n      NonNullable<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={autoCompleteType}\n          /* eslint-disable-next-line jsx-a11y/no-autofocus */\n          autoFocus={hasInitialFocus}\n          endAdornment={\n            endAdornment && (\n              <InputAdornment position=\"end\" translate={translate}>\n                {endAdornment}\n              </InputAdornment>\n            )\n          }\n          id={id}\n          inputProps={{\n            \"aria-errormessage\": errorMessageElementId,\n            \"aria-labelledby\": labelElementId,\n            \"data-se\": testId,\n            inputMode,\n          }}\n          inputRef={localInputRef}\n          multiline={isMultiline}\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          startAdornment={\n            startAdornment && (\n              <InputAdornment position=\"start\" translate={translate}>\n                {startAdornment}\n              </InputAdornment>\n            )\n          }\n          type={type}\n          translate={translate}\n        />\n      ),\n      [\n        autoCompleteType,\n        inputValues,\n        hasInitialFocus,\n        endAdornment,\n        inputMode,\n        isMultiline,\n        nameOverride,\n        onBlur,\n        onChange,\n        onFocus,\n        placeholder,\n        isOptional,\n        isReadOnly,\n        ref,\n        startAdornment,\n        testId,\n        translate,\n        type,\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        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 MemoizedTextField = memo(TextField);\nMemoizedTextField.displayName = \"TextField\";\n\nexport { MemoizedTextField as TextField };\n"],"mappings":"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"}

package/dist/Tile.js

@@ -14,68 +14,81 @@ import _CardActions from "@mui/material/CardActions";
  */
 
 import { memo, useMemo } from "react";
+import styled from "@emotion/styled";
 import { ButtonContext } from "./ButtonContext.js";
-import { Heading5, Paragraph, Support } from "./Typography.js";
 import { MoreIcon } from "./icons.generated/index.js";
-import styled from "@emotion/styled";
-import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
 import { MenuButton } from "./MenuButton.js";
+import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
+import { Heading5, Paragraph, Support } from "./Typography.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-const ImageContainer = styled.div`
+export const TILE_IMAGE_HEIGHT = "64px";
+const ImageContainer = styled("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "hasMenuButtonChildren"
+})`
   display: flex;
   align-items: flex-start;
-  max-height: 64px;
-  margin-block-end: ${props => props.odysseyDesignTokens.Spacing5};
-  padding-right: ${props => props.hasMenuItems ? props.odysseyDesignTokens.Spacing5 : 0};
+  max-height: ${TILE_IMAGE_HEIGHT};
+  margin-block-end: ${({
+  odysseyDesignTokens
+}) => odysseyDesignTokens.Spacing5};
+  padding-right: ${({
+  odysseyDesignTokens,
+  hasMenuButtonChildren
+}) => hasMenuButtonChildren ? odysseyDesignTokens.Spacing5 : 0};
 `;
-const MenuButtonContainer = styled.div`
+const MenuButtonContainer = styled("div", {
+  shouldForwardProp: prop => prop !== "odysseyDesignTokens"
+})`
   position: absolute;
-  right: ${props => props.odysseyDesignTokens.Spacing3};
-  top: ${props => props.odysseyDesignTokens.Spacing3};
+  right: ${({
+  odysseyDesignTokens
+}) => odysseyDesignTokens.Spacing3};
+  top: ${({
+  odysseyDesignTokens
+}) => odysseyDesignTokens.Spacing3};
 `;
+const buttonProviderValue = {
+  isFullWidth: true
+};
 const Tile = ({
   button,
   description,
   image,
-  menuItems,
+  menuButtonChildren,
   onClick,
   overline,
   title
 }) => {
   const odysseyDesignTokens = useOdysseyDesignTokens();
-  const cardContent = useMemo(() => {
-    return _jsxs(_Fragment, {
-      children: [image && _jsx(ImageContainer, {
-        odysseyDesignTokens: odysseyDesignTokens,
-        hasMenuItems: Boolean(menuItems),
-        children: image
-      }), overline && _jsx(Support, {
-        component: "div",
-        children: overline
-      }), title && _jsx(Heading5, {
-        component: "div",
-        children: title
-      }), description && _jsx(Paragraph, {
-        color: "textSecondary",
-        children: description
-      }), button && _jsx(_CardActions, {
-        children: _jsx(ButtonContext.Provider, {
-          value: {
-            isFullWidth: true
-          },
-          children: button
-        })
-      })]
-    });
-  }, [button, description, image, menuItems, overline, title, odysseyDesignTokens]);
+  const cardContent = useMemo(() => _jsxs(_Fragment, {
+    children: [image && _jsx(ImageContainer, {
+      odysseyDesignTokens: odysseyDesignTokens,
+      hasMenuButtonChildren: Boolean(menuButtonChildren),
+      children: image
+    }), overline && _jsx(Support, {
+      component: "div",
+      children: overline
+    }), title && _jsx(Heading5, {
+      component: "div",
+      children: title
+    }), description && _jsx(Paragraph, {
+      color: "textSecondary",
+      children: description
+    }), button && _jsx(_CardActions, {
+      children: _jsx(ButtonContext.Provider, {
+        value: buttonProviderValue,
+        children: button
+      })
+    })]
+  }), [button, description, image, menuButtonChildren, overline, title, odysseyDesignTokens]);
   return _jsxs(_Card, {
     className: onClick ? "isClickable" : "",
-    children: [onClick && _jsx(_CardActionArea, {
+    children: [onClick ? _jsx(_CardActionArea, {
       onClick: onClick,
       children: cardContent
-    }), !onClick && cardContent, menuItems && _jsx(MenuButtonContainer, {
+    }) : cardContent, menuButtonChildren && _jsx(MenuButtonContainer, {
       odysseyDesignTokens: odysseyDesignTokens,
       children: _jsx(MenuButton, {
         endIcon: _jsx(MoreIcon, {}),
@@ -83,7 +96,8 @@ const Tile = ({
         buttonVariant: "floating",
         menuAlignment: "right",
         size: "small",
-        children: menuItems
+        tooltipText: "Actions",
+        children: menuButtonChildren
       })
     })]
   });

package/dist/Tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tile.js","names":["memo","useMemo","ButtonContext","Heading5","Paragraph","Support","MoreIcon","styled","useOdysseyDesignTokens","MenuButton","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","ImageContainer","div","props","odysseyDesignTokens","Spacing5","hasMenuItems","MenuButtonContainer","Spacing3","Tile","button","description","image","menuItems","onClick","overline","title","cardContent","children","Boolean","component","color","_CardActions","Provider","value","isFullWidth","_Card","className","_CardActionArea","endIcon","ariaLabel","buttonVariant","menuAlignment","size","MemoizedTile","displayName"],"sources":["../src/Tile.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 { ReactElement, memo, useMemo } from \"react\";\n\nimport { NullElement } from \"./NullElement\";\nimport {\n  Card as MuiCard,\n  CardActions as MuiCardActions,\n  CardActionArea as MuiCardActionArea,\n} from \"@mui/material\";\nimport { Button } from \"./Button\";\nimport { ButtonContext } from \"./ButtonContext\";\nimport { Heading5, Paragraph, Support } from \"./Typography\";\nimport { MoreIcon } from \"./icons.generated\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport styled from \"@emotion/styled\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext\";\nimport { MenuButton } from \"./MenuButton\";\n\nexport type TileProps = {\n  description?: string;\n  image?: ReactElement | NullElement; // Icon or image\n  menuItems?: ReactElement;\n  overline?: string;\n  title?: string;\n} & ( // You can't have actions and onClick at the same time\n  | {\n      onClick: () => void;\n      button?: never;\n      menuItems?: never;\n    }\n  | {\n      onClick?: never;\n      button?: ReactElement<typeof Button> | NullElement;\n      menuItems?: ReactElement;\n    }\n) &\n  HtmlProps;\n\nconst ImageContainer = styled.div<{\n  odysseyDesignTokens: DesignTokens;\n  hasMenuItems: boolean;\n}>`\n  display: flex;\n  align-items: flex-start;\n  max-height: 64px;\n  margin-block-end: ${(props) => props.odysseyDesignTokens.Spacing5};\n  padding-right: ${(props) =>\n    props.hasMenuItems ? props.odysseyDesignTokens.Spacing5 : 0};\n`;\n\nconst MenuButtonContainer = styled.div<{ odysseyDesignTokens: DesignTokens }>`\n  position: absolute;\n  right: ${(props) => props.odysseyDesignTokens.Spacing3};\n  top: ${(props) => props.odysseyDesignTokens.Spacing3};\n`;\n\nconst Tile = ({\n  button,\n  description,\n  image,\n  menuItems,\n  onClick,\n  overline,\n  title,\n}: TileProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const cardContent = useMemo(() => {\n    return (\n      <>\n        {image && (\n          <ImageContainer\n            odysseyDesignTokens={odysseyDesignTokens}\n            hasMenuItems={Boolean(menuItems)}\n          >\n            {image}\n          </ImageContainer>\n        )}\n\n        {overline && <Support component=\"div\">{overline}</Support>}\n        {title && <Heading5 component=\"div\">{title}</Heading5>}\n        {description && (\n          <Paragraph color=\"textSecondary\">{description}</Paragraph>\n        )}\n\n        {button && (\n          <MuiCardActions>\n            <ButtonContext.Provider value={{ isFullWidth: true }}>\n              {button}\n            </ButtonContext.Provider>\n          </MuiCardActions>\n        )}\n      </>\n    );\n  }, [\n    button,\n    description,\n    image,\n    menuItems,\n    overline,\n    title,\n    odysseyDesignTokens,\n  ]);\n\n  return (\n    <MuiCard className={onClick ? \"isClickable\" : \"\"}>\n      {onClick && (\n        <MuiCardActionArea onClick={onClick}>{cardContent}</MuiCardActionArea>\n      )}\n\n      {!onClick && cardContent}\n\n      {menuItems && (\n        <MenuButtonContainer odysseyDesignTokens={odysseyDesignTokens}>\n          <MenuButton\n            endIcon={<MoreIcon />}\n            ariaLabel=\"Tile menu\"\n            buttonVariant=\"floating\"\n            menuAlignment=\"right\"\n            size=\"small\"\n          >\n            {menuItems}\n          </MenuButton>\n        </MenuButtonContainer>\n      )}\n    </MuiCard>\n  );\n};\n\nconst MemoizedTile = memo(Tile);\nMemoizedTile.displayName = \"Tile\";\n\nexport { MemoizedTile as Tile };\n"],"mappings":"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"}
+{"version":3,"file":"Tile.js","names":["memo","useMemo","styled","ButtonContext","MoreIcon","MenuButton","useOdysseyDesignTokens","Heading5","Paragraph","Support","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","TILE_IMAGE_HEIGHT","ImageContainer","shouldForwardProp","prop","odysseyDesignTokens","Spacing5","hasMenuButtonChildren","MenuButtonContainer","Spacing3","buttonProviderValue","isFullWidth","Tile","button","description","image","menuButtonChildren","onClick","overline","title","cardContent","children","Boolean","component","color","_CardActions","Provider","value","_Card","className","_CardActionArea","endIcon","ariaLabel","buttonVariant","menuAlignment","size","tooltipText","MemoizedTile","displayName"],"sources":["../src/Tile.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 { MouseEventHandler, ReactElement, memo, useMemo } from \"react\";\n\nimport {\n  Card as MuiCard,\n  CardActions as MuiCardActions,\n  CardActionArea as MuiCardActionArea,\n} from \"@mui/material\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \"./Button\";\nimport { ButtonContext } from \"./ButtonContext\";\nimport { MoreIcon } from \"./icons.generated\";\nimport { MenuButton, MenuButtonProps } from \"./MenuButton\";\nimport {\n  DesignTokens,\n  useOdysseyDesignTokens,\n} from \"./OdysseyDesignTokensContext\";\nimport { Heading5, Paragraph, Support } from \"./Typography\";\n\nexport const TILE_IMAGE_HEIGHT = \"64px\";\n\nexport type TileProps = {\n  /**\n   * The body text of the tile. The consumer is responsible for truncating this string.\n   */\n  description?: string;\n  /**\n   * An optional image or icon at the top of the tile, preferably as an <img> or <svg> element.\n   */\n  image?: ReactElement; // Icon or image\n  /**\n   * The \"eyebrow\" text above the tile title.\n   */\n  overline?: string;\n  /**\n   * The heading of the tile.\n   */\n  title?: string;\n} & ( // You can't have actions and onClick at the same time\n  | {\n      /**\n       * The event handler for when the user clicks the tile.\n       */\n      onClick: MouseEventHandler;\n      button?: never;\n      menuButtonChildren?: never;\n    }\n  | {\n      onClick?: never;\n      /**\n       * The main action button for the tile. Not valid if the tile itself is clickable.\n       */\n      button?: ReactElement<typeof Button>;\n      /**\n       * Menu items to be rendered in the tile's optional menu button. If this prop is undefined, the\n       * menu button will not be shown. Not valid if the tile itself is clickable.\n       */\n      menuButtonChildren?: MenuButtonProps[\"children\"];\n    }\n);\n\nconst ImageContainer = styled(\"div\", {\n  shouldForwardProp: (prop) =>\n    prop !== \"odysseyDesignTokens\" && prop !== \"hasMenuButtonChildren\",\n})<{\n  odysseyDesignTokens: DesignTokens;\n  hasMenuButtonChildren: boolean;\n}>`\n  display: flex;\n  align-items: flex-start;\n  max-height: ${TILE_IMAGE_HEIGHT};\n  margin-block-end: ${({ odysseyDesignTokens }) =>\n    odysseyDesignTokens.Spacing5};\n  padding-right: ${({ odysseyDesignTokens, hasMenuButtonChildren }) =>\n    hasMenuButtonChildren ? odysseyDesignTokens.Spacing5 : 0};\n`;\n\nconst MenuButtonContainer = styled(\"div\", {\n  shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>`\n  position: absolute;\n  right: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing3};\n  top: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing3};\n`;\n\nconst buttonProviderValue = { isFullWidth: true };\n\nconst Tile = ({\n  button,\n  description,\n  image,\n  menuButtonChildren,\n  onClick,\n  overline,\n  title,\n}: TileProps) => {\n  const odysseyDesignTokens = useOdysseyDesignTokens();\n\n  const cardContent = useMemo(\n    () => (\n      <>\n        {image && (\n          <ImageContainer\n            odysseyDesignTokens={odysseyDesignTokens}\n            hasMenuButtonChildren={Boolean(menuButtonChildren)}\n          >\n            {image}\n          </ImageContainer>\n        )}\n\n        {overline && <Support component=\"div\">{overline}</Support>}\n        {title && <Heading5 component=\"div\">{title}</Heading5>}\n        {description && (\n          <Paragraph color=\"textSecondary\">{description}</Paragraph>\n        )}\n\n        {button && (\n          <MuiCardActions>\n            <ButtonContext.Provider value={buttonProviderValue}>\n              {button}\n            </ButtonContext.Provider>\n          </MuiCardActions>\n        )}\n      </>\n    ),\n    [\n      button,\n      description,\n      image,\n      menuButtonChildren,\n      overline,\n      title,\n      odysseyDesignTokens,\n    ],\n  );\n\n  return (\n    <MuiCard className={onClick ? \"isClickable\" : \"\"}>\n      {onClick ? (\n        <MuiCardActionArea onClick={onClick}>{cardContent}</MuiCardActionArea>\n      ) : (\n        cardContent\n      )}\n\n      {menuButtonChildren && (\n        <MenuButtonContainer odysseyDesignTokens={odysseyDesignTokens}>\n          <MenuButton\n            endIcon={<MoreIcon />}\n            ariaLabel=\"Tile menu\"\n            buttonVariant=\"floating\"\n            menuAlignment=\"right\"\n            size=\"small\"\n            tooltipText=\"Actions\"\n          >\n            {menuButtonChildren}\n          </MenuButton>\n        </MenuButtonContainer>\n      )}\n    </MuiCard>\n  );\n};\n\nconst MemoizedTile = memo(Tile);\nMemoizedTile.displayName = \"Tile\";\n\nexport { MemoizedTile as Tile };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAA0CA,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAOtE,OAAOC,MAAM,MAAM,iBAAiB;AAAC,SAG5BC,aAAa;AAAA,SACbC,QAAQ;AAAA,SACRC,UAAU;AAAA,SAGjBC,sBAAsB;AAAA,SAEfC,QAAQ,EAAEC,SAAS,EAAEC,OAAO;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAErC,OAAO,MAAMC,iBAAiB,GAAG,MAAM;AA0CvC,MAAMC,cAAc,GAAGf,MAAM,CAAC,KAAK,EAAE;EACnCgB,iBAAiB,EAAGC,IAAI,IACtBA,IAAI,KAAK,qBAAqB,IAAIA,IAAI,KAAK;AAC/C,CAAC,CAGE;AACH;AACA;AACA,gBAAgBH,iBAAkB;AAClC,sBAAsB,CAAC;EAAEI;AAAoB,CAAC,KAC1CA,mBAAmB,CAACC,QAAS;AACjC,mBAAmB,CAAC;EAAED,mBAAmB;EAAEE;AAAsB,CAAC,KAC9DA,qBAAqB,GAAGF,mBAAmB,CAACC,QAAQ,GAAG,CAAE;AAC7D,CAAC;AAED,MAAME,mBAAmB,GAAGrB,MAAM,CAAC,KAAK,EAAE;EACxCgB,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAyC;AAC1C;AACA,WAAW,CAAC;EAAEC;AAAoB,CAAC,KAAKA,mBAAmB,CAACI,QAAS;AACrE,SAAS,CAAC;EAAEJ;AAAoB,CAAC,KAAKA,mBAAmB,CAACI,QAAS;AACnE,CAAC;AAED,MAAMC,mBAAmB,GAAG;EAAEC,WAAW,EAAE;AAAK,CAAC;AAEjD,MAAMC,IAAI,GAAGA,CAAC;EACZC,MAAM;EACNC,WAAW;EACXC,KAAK;EACLC,kBAAkB;EAClBC,OAAO;EACPC,QAAQ;EACRC;AACS,CAAC,KAAK;EACf,MAAMd,mBAAmB,GAAGd,sBAAsB,CAAC,CAAC;EAEpD,MAAM6B,WAAW,GAAGlC,OAAO,CACzB,MACEc,KAAA,CAAAF,SAAA;IAAAuB,QAAA,GACGN,KAAK,IACJnB,IAAA,CAACM,cAAc;MACbG,mBAAmB,EAAEA,mBAAoB;MACzCE,qBAAqB,EAAEe,OAAO,CAACN,kBAAkB,CAAE;MAAAK,QAAA,EAElDN;IAAK,CACQ,CACjB,EAEAG,QAAQ,IAAItB,IAAA,CAACF,OAAO;MAAC6B,SAAS,EAAC,KAAK;MAAAF,QAAA,EAAEH;IAAQ,CAAU,CAAC,EACzDC,KAAK,IAAIvB,IAAA,CAACJ,QAAQ;MAAC+B,SAAS,EAAC,KAAK;MAAAF,QAAA,EAAEF;IAAK,CAAW,CAAC,EACrDL,WAAW,IACVlB,IAAA,CAACH,SAAS;MAAC+B,KAAK,EAAC,eAAe;MAAAH,QAAA,EAAEP;IAAW,CAAY,CAC1D,EAEAD,MAAM,IACLjB,IAAA,CAAA6B,YAAA;MAAAJ,QAAA,EACEzB,IAAA,CAACR,aAAa,CAACsC,QAAQ;QAACC,KAAK,EAAEjB,mBAAoB;QAAAW,QAAA,EAChDR;MAAM,CACe;IAAC,CACX,CACjB;EAAA,CACD,CACH,EACD,CACEA,MAAM,EACNC,WAAW,EACXC,KAAK,EACLC,kBAAkB,EAClBE,QAAQ,EACRC,KAAK,EACLd,mBAAmB,CAEvB,CAAC;EAED,OACEL,KAAA,CAAA4B,KAAA;IAASC,SAAS,EAAEZ,OAAO,GAAG,aAAa,GAAG,EAAG;IAAAI,QAAA,GAC9CJ,OAAO,GACNrB,IAAA,CAAAkC,eAAA;MAAmBb,OAAO,EAAEA,OAAQ;MAAAI,QAAA,EAAED;IAAW,CAAoB,CAAC,GAEtEA,WACD,EAEAJ,kBAAkB,IACjBpB,IAAA,CAACY,mBAAmB;MAACH,mBAAmB,EAAEA,mBAAoB;MAAAgB,QAAA,EAC5DzB,IAAA,CAACN,UAAU;QACTyC,OAAO,EAAEnC,IAAA,CAACP,QAAQ,IAAE,CAAE;QACtB2C,SAAS,EAAC,WAAW;QACrBC,aAAa,EAAC,UAAU;QACxBC,aAAa,EAAC,OAAO;QACrBC,IAAI,EAAC,OAAO;QACZC,WAAW,EAAC,SAAS;QAAAf,QAAA,EAEpBL;MAAkB,CACT;IAAC,CACM,CACtB;EAAA,CACM,CAAC;AAEd,CAAC;AAED,MAAMqB,YAAY,GAAGpD,IAAI,CAAC2B,IAAI,CAAC;AAC/ByB,YAAY,CAACC,WAAW,GAAG,MAAM;AAEjC,SAASD,YAAY,IAAIzB,IAAI"}

package/dist/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","names":["useEffect","memo","useState","useCallback","visuallyHidden","Link","CloseIcon","Button","useTranslation","jsx","_jsx","jsxs","_jsxs","toastRoleValues","toastSeverityValues","ClickAwayListenerProps","onClickAway","Toast","autoHideDuration","isDismissable","linkText","linkUrl","isVisible","isVisibleProp","onHide","onHideProp","role","severity","testId","text","translate","t","setIsVisible","_Snackbar","open","undefined","onClose","className","children","_Alert","action","ariaLabel","onClick","size","startIcon","variant","_AlertTitle","style","href","MemoizedToast","displayName"],"sources":["../src/Toast.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 { useEffect, memo, useState, useCallback } from \"react\";\nimport { Alert, AlertTitle, Snackbar } from \"@mui/material\";\nimport { visuallyHidden } from \"@mui/utils\";\nimport { Link } from \"./Link\";\nimport { CloseIcon } from \"./icons.generated\";\nimport { Button } from \"./Button\";\nimport { useTranslation } from \"react-i18next\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport const toastRoleValues = [\"status\", \"alert\"] as const;\nexport const toastSeverityValues = [\n  \"success\",\n  \"info\",\n  \"warning\",\n  \"error\",\n] as const;\n\nexport type ToastProps = {\n  /**\n   * If set, this determines how long the Toast should appear before automatically disappearing in milliseconds.\n   * It will only take effect if the Toast is not dismissible.\n   * If left blank, it defaults to 6000.\n   */\n  autoHideDuration?: number;\n  /**\n   * If `true`, the Toast will include a close button.\n   */\n  isDismissable?: boolean;\n  /**\n   * If true, the Toast is visible\n   */\n  isVisible?: boolean;\n  /**\n   * If linkUrl is not undefined, this is the text of the link.\n   * If left blank, it defaults to \"Learn more\".\n   * Note that linkText does nothing if linkUrl is not defined\n   */\n  linkText?: string;\n  /**\n   * If defined, the Toast will include a link to the URL\n   */\n  linkUrl?: string;\n  /**\n   * An optional function to run when the Toast is closed.\n   */\n  onHide?: () => void;\n  /**\n   * Sets the ARIA role of the Toast\n   * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n   * unchanging)\n   */\n  role?: (typeof toastRoleValues)[number];\n  /**\n   * Determine the color and icon of the Toast\n   */\n  severity: (typeof toastSeverityValues)[number];\n  /**\n   * The text content of the Toast\n   */\n  text: string;\n} & HtmlProps;\n\nconst ClickAwayListenerProps = { onClickAway: () => false };\n\nconst Toast = ({\n  autoHideDuration = 6000,\n  isDismissable,\n  linkText,\n  linkUrl,\n  isVisible: isVisibleProp,\n  onHide: onHideProp,\n  role,\n  severity,\n  testId,\n  text,\n  translate,\n}: ToastProps) => {\n  const { t } = useTranslation();\n\n  const [isVisible, setIsVisible] = useState(isVisibleProp);\n\n  useEffect(() => {\n    setIsVisible(isVisibleProp);\n  }, [isVisibleProp]);\n\n  const onHide = useCallback(() => {\n    setIsVisible(false);\n    onHideProp?.();\n  }, [onHideProp]);\n\n  return (\n    <Snackbar\n      open={isVisible}\n      autoHideDuration={\n        isDismissable || autoHideDuration <= 0 ? undefined : autoHideDuration\n      }\n      onClose={onHide}\n      className=\"Toast\"\n      ClickAwayListenerProps={ClickAwayListenerProps}\n    >\n      <Alert\n        action={\n          isDismissable === true && (\n            <Button\n              ariaLabel={t(\"close.text\")}\n              onClick={onHide}\n              size=\"small\"\n              startIcon={<CloseIcon />}\n              variant=\"floating\"\n            />\n          )\n        }\n        data-se={testId}\n        role={role}\n        severity={severity}\n        variant=\"toast\"\n      >\n        <AlertTitle translate={translate}>\n          <span style={visuallyHidden}>{severity}:</span>\n          {text}\n        </AlertTitle>\n        {linkUrl && (\n          <Link href={linkUrl} variant=\"monochrome\" translate={translate}>\n            {linkText}\n          </Link>\n        )}\n      </Alert>\n    </Snackbar>\n  );\n};\n\nconst MemoizedToast = memo(Toast);\nMemoizedToast.displayName = \"Toast\";\n\nexport { MemoizedToast as Toast };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,OAAO;AAE9D,SAASC,cAAc,QAAQ,YAAY;AAAC,SACnCC,IAAI;AAAA,SACJC,SAAS;AAAA,SACTC,MAAM;AACf,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAG/C,OAAO,MAAMC,eAAe,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;AAC3D,OAAO,MAAMC,mBAAmB,GAAG,CACjC,SAAS,EACT,MAAM,EACN,SAAS,EACT,OAAO,CACC;AA+CV,MAAMC,sBAAsB,GAAG;EAAEC,WAAW,EAAEA,CAAA,KAAM;AAAM,CAAC;AAE3D,MAAMC,KAAK,GAAGA,CAAC;EACbC,gBAAgB,GAAG,IAAI;EACvBC,aAAa;EACbC,QAAQ;EACRC,OAAO;EACPC,SAAS,EAAEC,aAAa;EACxBC,MAAM,EAAEC,UAAU;EAClBC,IAAI;EACJC,QAAQ;EACRC,MAAM;EACNC,IAAI;EACJC;AACU,CAAC,KAAK;EAChB,MAAM;IAAEC;EAAE,CAAC,GAAGvB,cAAc,CAAC,CAAC;EAE9B,MAAM,CAACc,SAAS,EAAEU,YAAY,CAAC,GAAG9B,QAAQ,CAACqB,aAAa,CAAC;EAEzDvB,SAAS,CAAC,MAAM;IACdgC,YAAY,CAACT,aAAa,CAAC;EAC7B,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,MAAMC,MAAM,GAAGrB,WAAW,CAAC,MAAM;IAC/B6B,YAAY,CAAC,KAAK,CAAC;IACnBP,UAAU,GAAG,CAAC;EAChB,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhB,OACEf,IAAA,CAAAuB,SAAA;IACEC,IAAI,EAAEZ,SAAU;IAChBJ,gBAAgB,EACdC,aAAa,IAAID,gBAAgB,IAAI,CAAC,GAAGiB,SAAS,GAAGjB,gBACtD;IACDkB,OAAO,EAAEZ,MAAO;IAChBa,SAAS,EAAC,OAAO;IACjBtB,sBAAsB,EAAEA,sBAAuB;IAAAuB,QAAA,EAE/C1B,KAAA,CAAA2B,MAAA;MACEC,MAAM,EACJrB,aAAa,KAAK,IAAI,IACpBT,IAAA,CAACH,MAAM;QACLkC,SAAS,EAAEV,CAAC,CAAC,YAAY,CAAE;QAC3BW,OAAO,EAAElB,MAAO;QAChBmB,IAAI,EAAC,OAAO;QACZC,SAAS,EAAElC,IAAA,CAACJ,SAAS,IAAE,CAAE;QACzBuC,OAAO,EAAC;MAAU,CACnB,CAEJ;MACD,WAASjB,MAAO;MAChBF,IAAI,EAAEA,IAAK;MACXC,QAAQ,EAAEA,QAAS;MACnBkB,OAAO,EAAC,OAAO;MAAAP,QAAA,GAEf1B,KAAA,CAAAkC,WAAA;QAAYhB,SAAS,EAAEA,SAAU;QAAAQ,QAAA,GAC/B1B,KAAA;UAAMmC,KAAK,EAAE3C,cAAe;UAAAkC,QAAA,GAAEX,QAAQ,EAAC,GAAC;QAAA,CAAM,CAAC,EAC9CE,IAAI;MAAA,CACK,CAAC,EACZR,OAAO,IACNX,IAAA,CAACL,IAAI;QAAC2C,IAAI,EAAE3B,OAAQ;QAACwB,OAAO,EAAC,YAAY;QAACf,SAAS,EAAEA,SAAU;QAAAQ,QAAA,EAC5DlB;MAAQ,CACL,CACP;IAAA,CACI;EAAC,CACA,CAAC;AAEf,CAAC;AAED,MAAM6B,aAAa,GAAGhD,IAAI,CAACgB,KAAK,CAAC;AACjCgC,aAAa,CAACC,WAAW,GAAG,OAAO;AAEnC,SAASD,aAAa,IAAIhC,KAAK"}
+{"version":3,"file":"Toast.js","names":["useEffect","memo","useState","useCallback","visuallyHidden","Link","CloseIcon","Button","useTranslation","jsx","_jsx","jsxs","_jsxs","toastRoleValues","toastSeverityValues","ClickAwayListenerProps","onClickAway","Toast","autoHideDuration","isDismissable","linkText","linkUrl","isVisible","isVisibleProp","onHide","onHideProp","role","severity","testId","text","translate","t","setIsVisible","_Snackbar","open","undefined","onClose","className","children","_Alert","action","ariaLabel","onClick","size","startIcon","variant","_AlertTitle","style","href","MemoizedToast","displayName"],"sources":["../src/Toast.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 { useEffect, memo, useState, useCallback } from \"react\";\nimport { Alert, AlertTitle, Snackbar } from \"@mui/material\";\nimport { visuallyHidden } from \"@mui/utils\";\nimport { Link } from \"./Link\";\nimport { CloseIcon } from \"./icons.generated\";\nimport { Button } from \"./Button\";\nimport { useTranslation } from \"react-i18next\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport const toastRoleValues = [\"status\", \"alert\"] as const;\nexport const toastSeverityValues = [\n  \"success\",\n  \"info\",\n  \"warning\",\n  \"error\",\n] as const;\n\nexport type ToastProps = {\n  /**\n   * If set, this determines how long the Toast should appear before automatically disappearing in milliseconds.\n   * It will only take effect if the Toast is not dismissible.\n   * If left blank, it defaults to 6000.\n   */\n  autoHideDuration?: number;\n  /**\n   * If `true`, the Toast will include a close button.\n   */\n  isDismissable?: boolean;\n  /**\n   * If true, the Toast is visible\n   */\n  isVisible?: boolean;\n  /**\n   * If linkUrl is not undefined, this is the text of the link.\n   * If left blank, it defaults to \"Learn more\".\n   * Note that linkText does nothing if linkUrl is not defined\n   */\n  linkText?: string;\n  /**\n   * If defined, the Toast will include a link to the URL\n   */\n  linkUrl?: string;\n  /**\n   * An optional function to run when the Toast is closed.\n   */\n  onHide?: () => void;\n  /**\n   * Sets the ARIA role of the Toast\n   * (\"status\" for something that dynamically updates, \"alert\" for errors, null for something\n   * unchanging)\n   */\n  role?: (typeof toastRoleValues)[number];\n  /**\n   * Determine the color and icon of the Toast\n   */\n  severity: (typeof toastSeverityValues)[number];\n  /**\n   * The text content of the Toast\n   */\n  text: string;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst ClickAwayListenerProps = { onClickAway: () => false };\n\nconst Toast = ({\n  autoHideDuration = 6000,\n  isDismissable,\n  linkText,\n  linkUrl,\n  isVisible: isVisibleProp,\n  onHide: onHideProp,\n  role,\n  severity,\n  testId,\n  text,\n  translate,\n}: ToastProps) => {\n  const { t } = useTranslation();\n\n  const [isVisible, setIsVisible] = useState(isVisibleProp);\n\n  useEffect(() => {\n    setIsVisible(isVisibleProp);\n  }, [isVisibleProp]);\n\n  const onHide = useCallback(() => {\n    setIsVisible(false);\n    onHideProp?.();\n  }, [onHideProp]);\n\n  return (\n    <Snackbar\n      open={isVisible}\n      autoHideDuration={\n        isDismissable || autoHideDuration <= 0 ? undefined : autoHideDuration\n      }\n      onClose={onHide}\n      className=\"Toast\"\n      ClickAwayListenerProps={ClickAwayListenerProps}\n    >\n      <Alert\n        action={\n          isDismissable === true && (\n            <Button\n              ariaLabel={t(\"close.text\")}\n              onClick={onHide}\n              size=\"small\"\n              startIcon={<CloseIcon />}\n              variant=\"floating\"\n            />\n          )\n        }\n        data-se={testId}\n        role={role}\n        severity={severity}\n        variant=\"toast\"\n      >\n        <AlertTitle translate={translate}>\n          <span style={visuallyHidden}>{severity}:</span>\n          {text}\n        </AlertTitle>\n        {linkUrl && (\n          <Link href={linkUrl} variant=\"monochrome\" translate={translate}>\n            {linkText}\n          </Link>\n        )}\n      </Alert>\n    </Snackbar>\n  );\n};\n\nconst MemoizedToast = memo(Toast);\nMemoizedToast.displayName = \"Toast\";\n\nexport { MemoizedToast as Toast };\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,OAAO;AAE9D,SAASC,cAAc,QAAQ,YAAY;AAAC,SACnCC,IAAI;AAAA,SACJC,SAAS;AAAA,SACTC,MAAM;AACf,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAG/C,OAAO,MAAMC,eAAe,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;AAC3D,OAAO,MAAMC,mBAAmB,GAAG,CACjC,SAAS,EACT,MAAM,EACN,SAAS,EACT,OAAO,CACC;AA+CV,MAAMC,sBAAsB,GAAG;EAAEC,WAAW,EAAEA,CAAA,KAAM;AAAM,CAAC;AAE3D,MAAMC,KAAK,GAAGA,CAAC;EACbC,gBAAgB,GAAG,IAAI;EACvBC,aAAa;EACbC,QAAQ;EACRC,OAAO;EACPC,SAAS,EAAEC,aAAa;EACxBC,MAAM,EAAEC,UAAU;EAClBC,IAAI;EACJC,QAAQ;EACRC,MAAM;EACNC,IAAI;EACJC;AACU,CAAC,KAAK;EAChB,MAAM;IAAEC;EAAE,CAAC,GAAGvB,cAAc,CAAC,CAAC;EAE9B,MAAM,CAACc,SAAS,EAAEU,YAAY,CAAC,GAAG9B,QAAQ,CAACqB,aAAa,CAAC;EAEzDvB,SAAS,CAAC,MAAM;IACdgC,YAAY,CAACT,aAAa,CAAC;EAC7B,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,MAAMC,MAAM,GAAGrB,WAAW,CAAC,MAAM;IAC/B6B,YAAY,CAAC,KAAK,CAAC;IACnBP,UAAU,GAAG,CAAC;EAChB,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhB,OACEf,IAAA,CAAAuB,SAAA;IACEC,IAAI,EAAEZ,SAAU;IAChBJ,gBAAgB,EACdC,aAAa,IAAID,gBAAgB,IAAI,CAAC,GAAGiB,SAAS,GAAGjB,gBACtD;IACDkB,OAAO,EAAEZ,MAAO;IAChBa,SAAS,EAAC,OAAO;IACjBtB,sBAAsB,EAAEA,sBAAuB;IAAAuB,QAAA,EAE/C1B,KAAA,CAAA2B,MAAA;MACEC,MAAM,EACJrB,aAAa,KAAK,IAAI,IACpBT,IAAA,CAACH,MAAM;QACLkC,SAAS,EAAEV,CAAC,CAAC,YAAY,CAAE;QAC3BW,OAAO,EAAElB,MAAO;QAChBmB,IAAI,EAAC,OAAO;QACZC,SAAS,EAAElC,IAAA,CAACJ,SAAS,IAAE,CAAE;QACzBuC,OAAO,EAAC;MAAU,CACnB,CAEJ;MACD,WAASjB,MAAO;MAChBF,IAAI,EAAEA,IAAK;MACXC,QAAQ,EAAEA,QAAS;MACnBkB,OAAO,EAAC,OAAO;MAAAP,QAAA,GAEf1B,KAAA,CAAAkC,WAAA;QAAYhB,SAAS,EAAEA,SAAU;QAAAQ,QAAA,GAC/B1B,KAAA;UAAMmC,KAAK,EAAE3C,cAAe;UAAAkC,QAAA,GAAEX,QAAQ,EAAC,GAAC;QAAA,CAAM,CAAC,EAC9CE,IAAI;MAAA,CACK,CAAC,EACZR,OAAO,IACNX,IAAA,CAACL,IAAI;QAAC2C,IAAI,EAAE3B,OAAQ;QAACwB,OAAO,EAAC,YAAY;QAACf,SAAS,EAAEA,SAAU;QAAAQ,QAAA,EAC5DlB;MAAQ,CACL,CACP;IAAA,CACI;EAAC,CACA,CAAC;AAEf,CAAC;AAED,MAAM6B,aAAa,GAAGhD,IAAI,CAACgB,KAAK,CAAC;AACjCgC,aAAa,CAACC,WAAW,GAAG,OAAO;AAEnC,SAASD,aAAa,IAAIhC,KAAK"}

package/dist/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["MuiPropsChild","memo","jsx","_jsx","Tooltip","ariaType","children","placement","testId","text","translate","_Tooltip","describeChild","title","MemoizedTooltip","displayName"],"sources":["../src/Tooltip.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 { Tooltip as MuiTooltip } from \"@mui/material\";\nimport type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport { MuiPropsChild } from \"./MuiPropsChild\";\nimport { ReactElement, memo } from \"react\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TooltipProps = {\n  /**\n   * The type of ARIA attribute to use\n   */\n  ariaType: \"description\" | \"label\";\n  /**\n   * The content that triggers the Tooltip when hovered\n   */\n  children: ReactElement;\n  /**\n   * The placement of the Tooltip\n   */\n  placement?: MuiTooltipProps[\"placement\"];\n  /**\n   * The text to display in the Tooltip\n   */\n  text: string;\n} & HtmlProps;\n\nconst Tooltip = ({\n  ariaType,\n  children,\n  placement = \"top\",\n  testId,\n  text,\n  translate,\n}: TooltipProps) => (\n  <MuiTooltip\n    data-se={testId}\n    describeChild={ariaType === \"description\"}\n    placement={placement}\n    title={text}\n    translate={translate}\n  >\n    <MuiPropsChild>{children}</MuiPropsChild>\n  </MuiTooltip>\n);\n\nconst MemoizedTooltip = memo(Tooltip);\nMemoizedTooltip.displayName = \"Tooltip\";\n\nexport { MemoizedTooltip as Tooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AACtB,SAAuBC,IAAI,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAsB3C,MAAMC,OAAO,GAAGA,CAAC;EACfC,QAAQ;EACRC,QAAQ;EACRC,SAAS,GAAG,KAAK;EACjBC,MAAM;EACNC,IAAI;EACJC;AACY,CAAC,KACbP,IAAA,CAAAQ,QAAA;EACE,WAASH,MAAO;EAChBI,aAAa,EAAEP,QAAQ,KAAK,aAAc;EAC1CE,SAAS,EAAEA,SAAU;EACrBM,KAAK,EAAEJ,IAAK;EACZC,SAAS,EAAEA,SAAU;EAAAJ,QAAA,EAErBH,IAAA,CAACH,aAAa;IAAAM,QAAA,EAAEA;EAAQ,CAAgB;AAAC,CAC/B,CACb;AAED,MAAMQ,eAAe,GAAGb,IAAI,CAACG,OAAO,CAAC;AACrCU,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIV,OAAO"}
+{"version":3,"file":"Tooltip.js","names":["MuiPropsChild","memo","jsx","_jsx","Tooltip","ariaType","children","placement","testId","text","translate","_Tooltip","describeChild","title","MemoizedTooltip","displayName"],"sources":["../src/Tooltip.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 { Tooltip as MuiTooltip } from \"@mui/material\";\nimport type { TooltipProps as MuiTooltipProps } from \"@mui/material\";\n\nimport { MuiPropsChild } from \"./MuiPropsChild\";\nimport { ReactElement, memo } from \"react\";\nimport { HtmlProps } from \"./HtmlProps\";\n\nexport type TooltipProps = {\n  /**\n   * The type of ARIA attribute to use\n   */\n  ariaType: \"description\" | \"label\";\n  /**\n   * The content that triggers the Tooltip when hovered\n   */\n  children: ReactElement;\n  /**\n   * The placement of the Tooltip\n   */\n  placement?: MuiTooltipProps[\"placement\"];\n  /**\n   * The text to display in the Tooltip\n   */\n  text: string;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nconst Tooltip = ({\n  ariaType,\n  children,\n  placement = \"top\",\n  testId,\n  text,\n  translate,\n}: TooltipProps) => (\n  <MuiTooltip\n    data-se={testId}\n    describeChild={ariaType === \"description\"}\n    placement={placement}\n    title={text}\n    translate={translate}\n  >\n    <MuiPropsChild>{children}</MuiPropsChild>\n  </MuiTooltip>\n);\n\nconst MemoizedTooltip = memo(Tooltip);\nMemoizedTooltip.displayName = \"Tooltip\";\n\nexport { MemoizedTooltip as Tooltip };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVA,SAeSA,aAAa;AACtB,SAAuBC,IAAI,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAsB3C,MAAMC,OAAO,GAAGA,CAAC;EACfC,QAAQ;EACRC,QAAQ;EACRC,SAAS,GAAG,KAAK;EACjBC,MAAM;EACNC,IAAI;EACJC;AACY,CAAC,KACbP,IAAA,CAAAQ,QAAA;EACE,WAASH,MAAO;EAChBI,aAAa,EAAEP,QAAQ,KAAK,aAAc;EAC1CE,SAAS,EAAEA,SAAU;EACrBM,KAAK,EAAEJ,IAAK;EACZC,SAAS,EAAEA,SAAU;EAAAJ,QAAA,EAErBH,IAAA,CAACH,aAAa;IAAAM,QAAA,EAAEA;EAAQ,CAAgB;AAAC,CAC/B,CACb;AAED,MAAMQ,eAAe,GAAGb,IAAI,CAACG,OAAO,CAAC;AACrCU,eAAe,CAACC,WAAW,GAAG,SAAS;AAEvC,SAASD,eAAe,IAAIV,OAAO"}