@okta/odyssey-react-mui 1.33.0 → 1.34.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Buttons/BaseButton.cjs +1 -1
- package/dist/cjs/Buttons/BaseButton.cjs.map +1 -1
- package/dist/cjs/labs/DatePickers/DateTimePicker.cjs.map +1 -1
- package/dist/cjs/labs/OdysseyPickers/PickerWithOptionAdornment.cjs.map +1 -1
- package/dist/cjs/ui-shell/NarrowUiShellContent.cjs +19 -6
- package/dist/cjs/ui-shell/NarrowUiShellContent.cjs.map +1 -1
- package/dist/cjs/ui-shell/SideNav/SideNav.cjs +2 -2
- package/dist/cjs/ui-shell/SideNav/SideNav.cjs.map +1 -1
- package/dist/cjs/ui-shell/SideNav/SideNavLogo.cjs +3 -3
- package/dist/cjs/ui-shell/SideNav/SideNavLogo.cjs.map +1 -1
- package/dist/cjs/ui-shell/UiShell.cjs +6 -0
- package/dist/cjs/ui-shell/UiShell.cjs.map +1 -1
- package/dist/cjs/ui-shell/UiShellProvider.cjs +11 -8
- package/dist/cjs/ui-shell/UiShellProvider.cjs.map +1 -1
- package/dist/cjs/ui-shell/WideUiShellContent.cjs +2 -2
- package/dist/cjs/ui-shell/WideUiShellContent.cjs.map +1 -1
- package/dist/cjs/ui-shell/renderUiShell.cjs +13 -0
- package/dist/cjs/ui-shell/renderUiShell.cjs.map +1 -1
- package/dist/cjs/ui-shell/uiShellSharedConstants.cjs +2 -1
- package/dist/cjs/ui-shell/uiShellSharedConstants.cjs.map +1 -1
- package/dist/esm/Buttons/BaseButton.js +1 -1
- package/dist/esm/Buttons/BaseButton.js.map +1 -1
- package/dist/esm/labs/DatePickers/DateTimePicker.js.map +1 -1
- package/dist/esm/labs/OdysseyPickers/PickerWithOptionAdornment.js.map +1 -1
- package/dist/esm/ui-shell/NarrowUiShellContent.js +20 -7
- package/dist/esm/ui-shell/NarrowUiShellContent.js.map +1 -1
- package/dist/esm/ui-shell/SideNav/SideNav.js +2 -2
- package/dist/esm/ui-shell/SideNav/SideNav.js.map +1 -1
- package/dist/esm/ui-shell/SideNav/SideNavLogo.js +3 -3
- package/dist/esm/ui-shell/SideNav/SideNavLogo.js.map +1 -1
- package/dist/esm/ui-shell/UiShell.js +6 -0
- package/dist/esm/ui-shell/UiShell.js.map +1 -1
- package/dist/esm/ui-shell/UiShellProvider.js +9 -7
- package/dist/esm/ui-shell/UiShellProvider.js.map +1 -1
- package/dist/esm/ui-shell/WideUiShellContent.js +1 -1
- package/dist/esm/ui-shell/WideUiShellContent.js.map +1 -1
- package/dist/esm/ui-shell/renderUiShell.js +13 -0
- package/dist/esm/ui-shell/renderUiShell.js.map +1 -1
- package/dist/esm/ui-shell/uiShellSharedConstants.js +1 -0
- package/dist/esm/ui-shell/uiShellSharedConstants.js.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.scss +1 -1
- package/dist/tsconfig.production.tsbuildinfo +1 -1
- package/dist/types/Buttons/BaseButton.d.ts +1 -1
- package/dist/types/labs/DatePickers/DateTimePicker.d.ts.map +1 -1
- package/dist/types/ui-shell/NarrowUiShellContent.d.ts.map +1 -1
- package/dist/types/ui-shell/SideNav/SideNavLogo.d.ts +1 -1
- package/dist/types/ui-shell/SideNav/SideNavLogo.d.ts.map +1 -1
- package/dist/types/ui-shell/UiShell.d.ts +5 -20
- package/dist/types/ui-shell/UiShell.d.ts.map +1 -1
- package/dist/types/ui-shell/UiShellProvider.d.ts +33 -6
- package/dist/types/ui-shell/UiShellProvider.d.ts.map +1 -1
- package/dist/types/ui-shell/WideUiShellContent.d.ts.map +1 -1
- package/dist/types/ui-shell/renderUiShell.d.ts +2 -0
- package/dist/types/ui-shell/renderUiShell.d.ts.map +1 -1
- package/dist/types/ui-shell/uiShellSharedConstants.d.ts +1 -0
- package/dist/types/ui-shell/uiShellSharedConstants.d.ts.map +1 -1
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseButton.cjs","names":["_react","require","_ButtonContext","_MuiPropsContext","_Tooltip","_jsxRuntime","_interopRequireDefault","e","__esModule","default","buttonSizeValues","exports","buttonTypeValues","buttonVariantValues","BaseButton","ariaControls","ariaDescribedBy","ariaExpanded","ariaHasPopup","ariaLabel","ariaLabelledBy","buttonRef","endIcon","href","id","isDisabled","isFullWidth","isFullWidthProp","label","children","onClick","size","startIcon","tabIndex","testId","tooltipText","translate","type","variant","variantProp","muiProps","useMuiProps","localButtonRef","useRef","buttonContext","useButton","useMemo","useImperativeHandle","focus","current","renderButton","useCallback","jsx","_Button2","disabled","fullWidth","ref","element","Tooltip","ariaType","placement","text","MuiPropsContext","Consumer","MemoizedBaseButton","memo","displayName"],"sources":["../../../src/Buttons/BaseButton.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 { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport {\n HTMLAttributes,\n memo,\n ReactElement,\n ReactNode,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\n\nimport { useButton } from \"./ButtonContext.js\";\nimport type { HtmlProps } from \"../HtmlProps.js\";\nimport { FocusHandle } from \"../inputUtils.js\";\nimport {\n MuiPropsContext,\n MuiPropsContextType,\n useMuiProps,\n} from \"../MuiPropsContext.js\";\nimport { Tooltip } from \"../Tooltip.js\";\n\nexport const buttonSizeValues = [\"small\", \"medium\", \"large\"] as const;\nexport const buttonTypeValues = [\"button\", \"submit\", \"reset\"] as const;\nexport const buttonVariantValues = [\n \"primary\",\n \"secondary\",\n \"danger\",\n \"dangerSecondary\",\n \"floating\",\n \"floatingAction\",\n] as const;\n\nexport type BaseButtonProps = {\n /**\n * The ref forwarded to the Button\n */\n buttonRef?: React.RefObject<FocusHandle>;\n /**\n * Optional href to render the button as a link\n */\n href?: string;\n /**\n * The ID of the Button\n */\n id?: string;\n /**\n * Determines whether the Button is disabled\n */\n isDisabled?: boolean;\n /**\n * Determines whether the Button should take up the full available width\n */\n isFullWidth?: boolean;\n /**\n * The size of the button\n */\n size?: (typeof buttonSizeValues)[number];\n tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /**\n * The tooltip text for the Button if it's icon-only\n */\n tooltipText?: string;\n /**\n * The type of the HTML button element\n */\n type?: (typeof buttonTypeValues)[number];\n /**\n * The variant of the Button\n */\n variant: (typeof buttonVariantValues)[number] | \"tertiary\";\n /**\n * The click event handler for the Button\n */\n onClick?: MuiButtonProps[\"onClick\"];\n /**\n * The contents of the button. Only available internal to Odyssey here in BaseButton. If set, label is ignored.\n */\n children?: ReactNode;\n /**\n * The icon element to display at the end of the Button\n */\n endIcon?: ReactElement;\n /**\n * The text content of the Button\n */\n label?: string;\n /**\n * The icon element to display at the start of the Button\n */\n startIcon?: ReactElement;\n};\n\n// These are split and exported separately from the above because wrappers of this (e.g. Button) will\n// want to omit children, which they cannot do from the combined union type. Instead, they should\n// omit from BaseButtonProps, then union with the AdditionalBaseButtonProps (as seen in Button)\nexport type AdditionalBaseButtonProps = Pick<\n HtmlProps,\n | \"ariaControls\"\n | \"ariaDescribedBy\"\n | \"ariaExpanded\"\n | \"ariaHasPopup\"\n | \"ariaLabel\"\n | \"ariaLabelledBy\"\n | \"tabIndex\"\n | \"testId\"\n | \"translate\"\n>;\n\nconst BaseButton = ({\n ariaControls,\n ariaDescribedBy,\n ariaExpanded,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledBy,\n buttonRef,\n endIcon,\n href,\n id,\n isDisabled,\n isFullWidth: isFullWidthProp,\n label = \"\",\n children,\n onClick,\n size = \"medium\",\n startIcon,\n tabIndex,\n testId,\n tooltipText,\n translate,\n type = \"button\",\n variant: variantProp,\n}: BaseButtonProps & AdditionalBaseButtonProps) => {\n const muiProps = useMuiProps();\n\n // We're deprecating the \"tertiary\" variant, so map it to\n // \"secondary\" in lieu of making a breaking change\n const variant = variantProp === \"tertiary\" ? \"secondary\" : variantProp;\n const localButtonRef = useRef<HTMLButtonElement | HTMLAnchorElement>(null);\n const buttonContext = useButton();\n const isFullWidth = useMemo(\n () =>\n buttonContext.isFullWidth ? buttonContext.isFullWidth : isFullWidthProp,\n [buttonContext, isFullWidthProp],\n );\n\n useImperativeHandle(\n buttonRef,\n () => ({\n focus: () => {\n localButtonRef.current?.focus();\n },\n }),\n [],\n );\n\n const renderButton = useCallback(\n (muiProps: MuiPropsContextType) => {\n return (\n <MuiButton\n {...muiProps}\n aria-controls={ariaControls}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n data-se={testId}\n disabled={isDisabled}\n endIcon={endIcon}\n fullWidth={isFullWidth}\n href={href}\n id={id}\n onClick={onClick}\n ref={(element) => {\n if (element) {\n (\n localButtonRef as React.MutableRefObject<\n HTMLButtonElement | HTMLAnchorElement\n >\n ).current = element;\n //@ts-expect-error ref is not an optional prop on the props context type\n muiProps?.ref?.(element);\n }\n }}\n size={size}\n startIcon={startIcon}\n tabIndex={tabIndex}\n translate={translate}\n type={type}\n variant={variant}\n >\n {children ?? label}\n </MuiButton>\n );\n },\n [\n ariaControls,\n ariaDescribedBy,\n ariaExpanded,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledBy,\n endIcon,\n href,\n id,\n isDisabled,\n isFullWidth,\n label,\n children,\n onClick,\n size,\n startIcon,\n tabIndex,\n testId,\n translate,\n type,\n variant,\n ],\n );\n\n if (tooltipText) {\n return (\n <Tooltip ariaType=\"description\" placement=\"top\" text={tooltipText}>\n <MuiPropsContext.Consumer>{renderButton}</MuiPropsContext.Consumer>\n </Tooltip>\n );\n }\n\n return renderButton(muiProps);\n};\n\nconst MemoizedBaseButton = memo(BaseButton);\nMemoizedBaseButton.displayName = \"BaseButton\";\n\nexport { MemoizedBaseButton as BaseButton };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"BaseButton.cjs","names":["_react","require","_ButtonContext","_MuiPropsContext","_Tooltip","_jsxRuntime","_interopRequireDefault","e","__esModule","default","buttonSizeValues","exports","buttonTypeValues","buttonVariantValues","BaseButton","ariaControls","ariaDescribedBy","ariaExpanded","ariaHasPopup","ariaLabel","ariaLabelledBy","buttonRef","children","endIcon","href","id","isDisabled","isFullWidth","isFullWidthProp","label","onClick","size","startIcon","tabIndex","testId","tooltipText","translate","type","variant","variantProp","muiProps","useMuiProps","localButtonRef","useRef","buttonContext","useButton","useMemo","useImperativeHandle","focus","current","renderButton","useCallback","jsx","_Button2","disabled","fullWidth","ref","element","Tooltip","ariaType","placement","text","MuiPropsContext","Consumer","MemoizedBaseButton","memo","displayName"],"sources":["../../../src/Buttons/BaseButton.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 { Button as MuiButton } from \"@mui/material\";\nimport type { ButtonProps as MuiButtonProps } from \"@mui/material\";\nimport {\n HTMLAttributes,\n memo,\n ReactElement,\n ReactNode,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n} from \"react\";\n\nimport { useButton } from \"./ButtonContext.js\";\nimport type { HtmlProps } from \"../HtmlProps.js\";\nimport { FocusHandle } from \"../inputUtils.js\";\nimport {\n MuiPropsContext,\n MuiPropsContextType,\n useMuiProps,\n} from \"../MuiPropsContext.js\";\nimport { Tooltip } from \"../Tooltip.js\";\n\nexport const buttonSizeValues = [\"small\", \"medium\", \"large\"] as const;\nexport const buttonTypeValues = [\"button\", \"submit\", \"reset\"] as const;\nexport const buttonVariantValues = [\n \"primary\",\n \"secondary\",\n \"danger\",\n \"dangerSecondary\",\n \"floating\",\n \"floatingAction\",\n] as const;\n\nexport type BaseButtonProps = {\n /**\n * The ref forwarded to the Button\n */\n buttonRef?: React.RefObject<FocusHandle>;\n /**\n * Optional href to render the button as a link\n */\n href?: string;\n /**\n * The ID of the Button\n */\n id?: string;\n /**\n * Determines whether the Button is disabled\n */\n isDisabled?: boolean;\n /**\n * Determines whether the Button should take up the full available width\n */\n isFullWidth?: boolean;\n /**\n * The size of the button\n */\n size?: (typeof buttonSizeValues)[number];\n tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /**\n * The tooltip text for the Button if it's icon-only\n */\n tooltipText?: string;\n /**\n * The type of the HTML button element\n */\n type?: (typeof buttonTypeValues)[number];\n /**\n * The variant of the Button\n */\n variant: (typeof buttonVariantValues)[number] | \"tertiary\";\n /**\n * The click event handler for the Button\n */\n onClick?: MuiButtonProps[\"onClick\"];\n /**\n * The contents of the button. Only available internal to Odyssey here in BaseButton. If set, label is ignored.\n */\n children?: ReactNode;\n /**\n * The icon element to display at the end of the Button\n */\n endIcon?: ReactElement;\n /**\n * The text content of the Button\n */\n label?: string;\n /**\n * The icon element to display at the start of the Button\n */\n startIcon?: ReactElement;\n};\n\n// These are split and exported separately from the above because wrappers of this (e.g. Button) will\n// want to omit children, which they cannot do from the combined union type. Instead, they should\n// omit from BaseButtonProps, then union with the AdditionalBaseButtonProps (as seen in Button)\nexport type AdditionalBaseButtonProps = Pick<\n HtmlProps,\n | \"ariaControls\"\n | \"ariaDescribedBy\"\n | \"ariaExpanded\"\n | \"ariaHasPopup\"\n | \"ariaLabel\"\n | \"ariaLabelledBy\"\n | \"tabIndex\"\n | \"testId\"\n | \"translate\"\n>;\n\nconst BaseButton = ({\n ariaControls,\n ariaDescribedBy,\n ariaExpanded,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledBy,\n buttonRef,\n children,\n endIcon,\n href,\n id,\n isDisabled,\n isFullWidth: isFullWidthProp,\n label = \"\",\n onClick,\n size = \"medium\",\n startIcon,\n tabIndex,\n testId,\n tooltipText,\n translate,\n type = \"button\",\n variant: variantProp,\n}: BaseButtonProps & AdditionalBaseButtonProps) => {\n const muiProps = useMuiProps();\n\n // We're deprecating the \"tertiary\" variant, so map it to\n // \"secondary\" in lieu of making a breaking change\n const variant = variantProp === \"tertiary\" ? \"secondary\" : variantProp;\n const localButtonRef = useRef<HTMLButtonElement | HTMLAnchorElement>(null);\n const buttonContext = useButton();\n const isFullWidth = useMemo(\n () =>\n buttonContext.isFullWidth ? buttonContext.isFullWidth : isFullWidthProp,\n [buttonContext, isFullWidthProp],\n );\n\n useImperativeHandle(\n buttonRef,\n () => ({\n focus: () => {\n localButtonRef.current?.focus();\n },\n }),\n [],\n );\n\n const renderButton = useCallback(\n (muiProps: MuiPropsContextType) => {\n return (\n <MuiButton\n {...muiProps}\n aria-controls={ariaControls}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n data-se={testId}\n disabled={isDisabled}\n endIcon={endIcon}\n fullWidth={isFullWidth}\n href={href}\n id={id}\n onClick={onClick}\n ref={(element) => {\n if (element) {\n (\n localButtonRef as React.MutableRefObject<\n HTMLButtonElement | HTMLAnchorElement\n >\n ).current = element;\n //@ts-expect-error ref is not an optional prop on the props context type\n muiProps?.ref?.(element);\n }\n }}\n size={size}\n startIcon={startIcon}\n tabIndex={tabIndex}\n translate={translate}\n type={type}\n variant={variant}\n >\n {children ?? label}\n </MuiButton>\n );\n },\n [\n ariaControls,\n ariaDescribedBy,\n ariaExpanded,\n ariaHasPopup,\n ariaLabel,\n ariaLabelledBy,\n endIcon,\n href,\n id,\n isDisabled,\n isFullWidth,\n label,\n children,\n onClick,\n size,\n startIcon,\n tabIndex,\n testId,\n translate,\n type,\n variant,\n ],\n );\n\n if (tooltipText) {\n return (\n <Tooltip ariaType=\"description\" placement=\"top\" text={tooltipText}>\n <MuiPropsContext.Consumer>{renderButton}</MuiPropsContext.Consumer>\n </Tooltip>\n );\n }\n\n return renderButton(muiProps);\n};\n\nconst MemoizedBaseButton = memo(BaseButton);\nMemoizedBaseButton.displayName = \"BaseButton\";\n\nexport { MemoizedBaseButton as BaseButton };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimePicker.cjs","names":["_react","require","_reactI18next","_xDatePickers","_styled","_interopRequireDefault","_index","_DateFieldActionBar","_DateFieldLocalizationProvider","_TimeZonePicker","_useOdysseyDateFields","_DateTimeField","_dateTimePickerTheme","_index2","_OdysseyDesignTokensContext","_OdysseyThemeProvider","_jsxRuntime","e","__esModule","default","DatePickerContainer","styled","div","marginBlockEnd","DatePickerWidthContainer","odysseyDesignTokens","width","maxWidth","TypographyLineLengthMax","TimeZonePickerContainer","shouldForwardProp","prop","marginBlockStart","Spacing3","DateTimePicker","defaultValue","defaultValueProp","errorMessage","hint","HintLinkComponent","isDateEnabled","isDisabled","isOptional","isReadOnly","isMonthEnabled","isYearEnabled","label","minDate","minDateProp","maxDate","maxDateProp","onBlur","onCalendarDateChange","onInputChange","onInputChangeProp","timeZone","timeZonePickerLabel","timeZoneOptions","value","valueProp","i18n","t","useTranslation","inputRef","useRef","useOdysseyDesignTokens","closeCalendar","commonIcons","defaultedLanguageCode","formatDateTimeToUtcIsoDateString","formatDayOfWeek","inputValues","internalTimeZone","isOpen","localeText","onTimeZoneChange","popperElement","setPopperElement","shouldDisableDate","shouldDisableMonth","shouldDisableYear","toggleCalendarVisibility","useOdysseyDateFields","language","containerRef","useEffect","current","formatDateTimeToJsDateStringOnCalendarSelection","useCallback","dateStringFromDateTime","renderDateTimeField","jsx","DateTimeField","endAdornment","Button","ariaLabel","onClick","size","startIcon","CalendarIcon","variant","onChange","timezone","slots","useMemo","actionBar","DateFieldActionBar","field","muiProps","leftArrowIcon","ArrowLeftIcon","rightArrowIcon","ArrowRightIcon","switchViewIcon","ChevronDownIcon","slotProps","wrapperVariant","onAccept","onCancel","actions","popper","anchorEl","tabs","dateIcon","timeIcon","ClockIcon","toolbar","toolbarPlaceholder","OdysseyThemeProvider","themeOverride","dateTimePickerTheme","children","jsxs","DateFieldLocalizationProvider","ref","dayOfWeekFormatter","disabled","fixedWeekNumber","onClose","open","readOnly","TimeZonePicker","MemoizedDateTimePicker","exports","memo","displayName"],"sources":["../../../../src/labs/DatePickers/DateTimePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n type DateTimePickerSlots,\n DateTimePicker as MuiDateTimePicker,\n DateTimePickerProps as MuiDateTimePickerProps,\n DateTimePickerSlotProps,\n} from \"@mui/x-date-pickers\";\nimport { DateTime } from \"luxon\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \"../../Buttons/index.js\";\nimport { DateFieldActionBar } from \"../../DatePickers/DateFieldActionBar.js\";\nimport { DateFieldLocalizationProvider } from \"../../DatePickers/DateFieldLocalizationProvider.js\";\nimport { TimeZonePicker } from \"../../DatePickers/TimeZonePicker.js\";\nimport {\n useOdysseyDateFields,\n OdysseyDateFieldProps,\n} from \"../../DatePickers/useOdysseyDateFields.js\";\nimport { DateTimeField, DateTimeFieldProps } from \"./DateTimeField.js\";\nimport { dateTimePickerTheme } from \"./dateTimePickerTheme.js\";\nimport { FieldComponentProps } from \"../../FieldComponentProps.js\";\nimport { CalendarIcon, ClockIcon } from \"../../icons.generated/index.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\n\nconst DatePickerContainer = styled.div({\n \".MuiFormControl-root\": {\n marginBlockEnd: 0,\n },\n});\n\nconst DatePickerWidthContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n \".MuiInput-root\": {\n width: \"100%\",\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n },\n}));\n\nconst TimeZonePickerContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n marginBlockStart: odysseyDesignTokens.Spacing3,\n}));\n\ntype RenderDateTimeFieldProps = {\n defaultValue: DateTimeFieldProps[\"defaultValue\"];\n value: DateTimeFieldProps[\"value\"];\n} & MuiDateTimePickerProps<DateTime>;\n\nexport type DateTimePickerProps = OdysseyDateFieldProps &\n Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"isDisabled\"\n | \"isReadOnly\"\n | \"isOptional\"\n >;\n\nconst DateTimePicker = ({\n defaultValue: defaultValueProp,\n errorMessage,\n hint,\n HintLinkComponent,\n isDateEnabled = () => true,\n isDisabled,\n isOptional,\n isReadOnly,\n isMonthEnabled = () => true,\n isYearEnabled = () => true,\n label,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onBlur,\n onCalendarDateChange,\n onInputChange: onInputChangeProp,\n timeZone,\n timeZonePickerLabel,\n timeZoneOptions,\n value: valueProp,\n}: DateTimePickerProps) => {\n const { i18n, t } = useTranslation();\n const inputRef = useRef<HTMLInputElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const {\n closeCalendar,\n commonIcons,\n defaultedLanguageCode,\n formatDateTimeToUtcIsoDateString,\n formatDayOfWeek,\n inputValues,\n internalTimeZone,\n isOpen,\n localeText,\n minDate,\n maxDate,\n onInputChange,\n onTimeZoneChange,\n popperElement,\n setPopperElement,\n shouldDisableDate,\n shouldDisableMonth,\n shouldDisableYear,\n toggleCalendarVisibility,\n } = useOdysseyDateFields({\n defaultValue: defaultValueProp,\n errorMessage,\n isDateEnabled,\n isMonthEnabled,\n isYearEnabled,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onInputChange: onInputChangeProp,\n timeZone,\n value: valueProp,\n });\n\n const { language } = i18n;\n const containerRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setPopperElement(containerRef.current);\n }, [setPopperElement]);\n\n const formatDateTimeToJsDateStringOnCalendarSelection = useCallback<\n NonNullable<MuiDateTimePickerProps<DateTime>[\"onChange\"]>\n >(\n (value) => {\n if (value) {\n const dateStringFromDateTime = formatDateTimeToUtcIsoDateString(value);\n\n if (dateStringFromDateTime) {\n onCalendarDateChange?.({\n value: dateStringFromDateTime,\n timeZone: internalTimeZone,\n });\n }\n }\n },\n [formatDateTimeToUtcIsoDateString, internalTimeZone, onCalendarDateChange],\n );\n\n const renderDateTimeField = useCallback(\n ({ defaultValue, inputRef, value }: RenderDateTimeFieldProps) => {\n return (\n <DateTimeField\n defaultValue={defaultValue}\n endAdornment={\n <Button\n ariaLabel={t(\"picker.labels.date.choose\")}\n label=\"\"\n onClick={toggleCalendarVisibility}\n size=\"small\"\n startIcon={<commonIcons.CalendarIcon />}\n variant=\"floating\"\n />\n }\n errorMessage={errorMessage}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n inputRef={inputRef}\n isDisabled={isDisabled}\n isOptional={isOptional}\n isReadOnly={isReadOnly}\n label={label}\n onBlur={onBlur}\n minDate={minDate}\n maxDate={maxDate}\n onChange={onInputChange}\n timezone={internalTimeZone}\n value={value}\n />\n );\n },\n [\n commonIcons,\n errorMessage,\n hint,\n HintLinkComponent,\n internalTimeZone,\n isDisabled,\n isOptional,\n isReadOnly,\n label,\n onBlur,\n onInputChange,\n minDate,\n maxDate,\n t,\n toggleCalendarVisibility,\n ],\n );\n\n const slots = useMemo<DateTimePickerSlots<DateTime>>(\n () => ({\n actionBar: DateFieldActionBar,\n field: (muiProps: RenderDateTimeFieldProps) =>\n renderDateTimeField(muiProps),\n leftArrowIcon: () => <commonIcons.ArrowLeftIcon />,\n rightArrowIcon: () => <commonIcons.ArrowRightIcon />,\n switchViewIcon: () => <commonIcons.ChevronDownIcon />,\n }),\n [commonIcons, renderDateTimeField],\n );\n\n const slotProps = useMemo<DateTimePickerSlotProps<DateTime, false>>(\n () => ({\n actionBar: ({ wrapperVariant, onAccept, onCancel }) => ({\n actions:\n // This is the default behavior but felt more clear to pass them in explicitly\n wrapperVariant === \"desktop\" ? [] : [\"accept\", \"cancel\"],\n onAccept,\n onCancel,\n }),\n popper: {\n anchorEl: popperElement,\n },\n tabs: {\n dateIcon: <CalendarIcon />,\n timeIcon: <ClockIcon />,\n },\n toolbar: {\n toolbarPlaceholder: \"\",\n },\n }),\n [popperElement],\n );\n\n return (\n <OdysseyThemeProvider themeOverride={dateTimePickerTheme}>\n <DateFieldLocalizationProvider\n defaultedLanguageCode={defaultedLanguageCode}\n localeText={localeText}\n >\n <DatePickerContainer>\n <DatePickerWidthContainer\n odysseyDesignTokens={odysseyDesignTokens}\n ref={containerRef}\n >\n <MuiDateTimePicker\n dayOfWeekFormatter={formatDayOfWeek}\n defaultValue={inputValues?.defaultValue}\n disabled={isDisabled}\n fixedWeekNumber={6}\n inputRef={inputRef}\n key={language}\n label={label}\n minDate={minDate}\n maxDate={maxDate}\n onChange={formatDateTimeToJsDateStringOnCalendarSelection}\n onClose={closeCalendar}\n open={isOpen}\n readOnly={isReadOnly}\n shouldDisableDate={shouldDisableDate}\n shouldDisableMonth={shouldDisableMonth}\n shouldDisableYear={shouldDisableYear}\n slots={slots}\n slotProps={slotProps}\n timezone={internalTimeZone}\n value={inputValues?.value}\n />\n </DatePickerWidthContainer>\n </DatePickerContainer>\n {timeZoneOptions && timeZonePickerLabel && (\n <TimeZonePickerContainer odysseyDesignTokens={odysseyDesignTokens}>\n <TimeZonePicker\n label={timeZonePickerLabel}\n onTimeZoneChange={onTimeZoneChange}\n isReadOnly={isReadOnly}\n timeZoneOptions={timeZoneOptions}\n value={internalTimeZone}\n />\n </TimeZonePickerContainer>\n )}\n </DateFieldLocalizationProvider>\n </OdysseyThemeProvider>\n );\n};\n\nconst MemoizedDateTimePicker = memo(DateTimePicker);\nMemoizedDateTimePicker.displayName = \"DateTimePicker\";\n\nexport { MemoizedDateTimePicker as DateTimePicker };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"DateTimePicker.cjs","names":["_react","require","_reactI18next","_xDatePickers","_styled","_interopRequireDefault","_index","_DateFieldActionBar","_DateFieldLocalizationProvider","_TimeZonePicker","_useOdysseyDateFields","_DateTimeField","_dateTimePickerTheme","_index2","_OdysseyDesignTokensContext","_OdysseyThemeProvider","_jsxRuntime","e","__esModule","default","DatePickerContainer","styled","div","marginBlockEnd","DatePickerWidthContainer","odysseyDesignTokens","width","maxWidth","TypographyLineLengthMax","TimeZonePickerContainer","shouldForwardProp","prop","marginBlockStart","Spacing3","DateTimePicker","defaultValue","defaultValueProp","errorMessage","hint","HintLinkComponent","isDateEnabled","isDisabled","isOptional","isReadOnly","isMonthEnabled","isYearEnabled","label","minDate","minDateProp","maxDate","maxDateProp","onBlur","onCalendarDateChange","onInputChange","onInputChangeProp","timeZone","timeZonePickerLabel","timeZoneOptions","value","valueProp","i18n","t","useTranslation","inputRef","useRef","useOdysseyDesignTokens","closeCalendar","commonIcons","defaultedLanguageCode","formatDateTimeToUtcIsoDateString","formatDayOfWeek","inputValues","internalTimeZone","isOpen","localeText","onTimeZoneChange","popperElement","setPopperElement","shouldDisableDate","shouldDisableMonth","shouldDisableYear","toggleCalendarVisibility","useOdysseyDateFields","language","containerRef","useEffect","current","formatDateTimeToJsDateStringOnCalendarSelection","useCallback","dateStringFromDateTime","renderDateTimeField","jsx","DateTimeField","endAdornment","Button","ariaLabel","onClick","size","startIcon","CalendarIcon","variant","onChange","timezone","slots","useMemo","actionBar","DateFieldActionBar","field","muiProps","leftArrowIcon","ArrowLeftIcon","rightArrowIcon","ArrowRightIcon","switchViewIcon","ChevronDownIcon","slotProps","wrapperVariant","onAccept","onCancel","actions","popper","anchorEl","tabs","dateIcon","timeIcon","ClockIcon","toolbar","toolbarPlaceholder","OdysseyThemeProvider","themeOverride","dateTimePickerTheme","children","jsxs","DateFieldLocalizationProvider","ref","dayOfWeekFormatter","disabled","fixedWeekNumber","onClose","open","readOnly","TimeZonePicker","MemoizedDateTimePicker","exports","memo","displayName"],"sources":["../../../../src/labs/DatePickers/DateTimePicker.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { memo, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n type DateTimePickerSlots,\n DateTimePicker as MuiDateTimePicker,\n DateTimePickerProps as MuiDateTimePickerProps,\n DateTimePickerSlotProps,\n} from \"@mui/x-date-pickers\";\nimport { DateTime } from \"luxon\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \"../../Buttons/index.js\";\nimport { DateFieldActionBar } from \"../../DatePickers/DateFieldActionBar.js\";\nimport { DateFieldLocalizationProvider } from \"../../DatePickers/DateFieldLocalizationProvider.js\";\nimport { TimeZonePicker } from \"../../DatePickers/TimeZonePicker.js\";\nimport {\n useOdysseyDateFields,\n OdysseyDateFieldProps,\n} from \"../../DatePickers/useOdysseyDateFields.js\";\nimport { DateTimeField, DateTimeFieldProps } from \"./DateTimeField.js\";\nimport { dateTimePickerTheme } from \"./dateTimePickerTheme.js\";\nimport { FieldComponentProps } from \"../../FieldComponentProps.js\";\nimport { CalendarIcon, ClockIcon } from \"../../icons.generated/index.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { OdysseyThemeProvider } from \"../../OdysseyThemeProvider.js\";\n\nconst DatePickerContainer = styled.div({\n \".MuiFormControl-root\": {\n marginBlockEnd: 0,\n },\n});\n\nconst DatePickerWidthContainer = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n \".MuiInput-root\": {\n width: \"100%\",\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n },\n}));\n\nconst TimeZonePickerContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n marginBlockStart: odysseyDesignTokens.Spacing3,\n}));\n\ntype RenderDateTimeFieldProps = {\n defaultValue: DateTimeFieldProps[\"defaultValue\"];\n value: DateTimeFieldProps[\"value\"];\n} & MuiDateTimePickerProps<DateTime>;\n\nexport type DateTimePickerProps = OdysseyDateFieldProps &\n Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"isDisabled\"\n | \"isReadOnly\"\n | \"isOptional\"\n >;\n\nconst DateTimePicker = ({\n defaultValue: defaultValueProp,\n errorMessage,\n hint,\n HintLinkComponent,\n isDateEnabled = () => true,\n isDisabled,\n isOptional,\n isReadOnly,\n isMonthEnabled = () => true,\n isYearEnabled = () => true,\n label,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onBlur,\n onCalendarDateChange,\n onInputChange: onInputChangeProp,\n timeZone,\n timeZonePickerLabel,\n timeZoneOptions,\n value: valueProp,\n}: DateTimePickerProps) => {\n const { i18n, t } = useTranslation();\n const inputRef = useRef<HTMLInputElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const {\n closeCalendar,\n commonIcons,\n defaultedLanguageCode,\n formatDateTimeToUtcIsoDateString,\n formatDayOfWeek,\n inputValues,\n internalTimeZone,\n isOpen,\n localeText,\n minDate,\n maxDate,\n onInputChange,\n onTimeZoneChange,\n popperElement,\n setPopperElement,\n shouldDisableDate,\n shouldDisableMonth,\n shouldDisableYear,\n toggleCalendarVisibility,\n } = useOdysseyDateFields({\n defaultValue: defaultValueProp,\n errorMessage,\n isDateEnabled,\n isMonthEnabled,\n isYearEnabled,\n minDate: minDateProp,\n maxDate: maxDateProp,\n onInputChange: onInputChangeProp,\n timeZone,\n value: valueProp,\n });\n\n const { language } = i18n;\n const containerRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setPopperElement(containerRef.current);\n }, [setPopperElement]);\n\n const formatDateTimeToJsDateStringOnCalendarSelection = useCallback<\n NonNullable<MuiDateTimePickerProps<DateTime>[\"onChange\"]>\n >(\n (value) => {\n if (value) {\n const dateStringFromDateTime = formatDateTimeToUtcIsoDateString(value);\n\n if (dateStringFromDateTime) {\n onCalendarDateChange?.({\n value: dateStringFromDateTime,\n timeZone: internalTimeZone,\n });\n }\n }\n },\n [formatDateTimeToUtcIsoDateString, internalTimeZone, onCalendarDateChange],\n );\n\n const renderDateTimeField = useCallback(\n ({ defaultValue, inputRef, value }: RenderDateTimeFieldProps) => {\n return (\n <DateTimeField\n defaultValue={defaultValue}\n endAdornment={\n <Button\n ariaLabel={t(\"picker.labels.date.choose\")}\n label=\"\"\n onClick={toggleCalendarVisibility}\n size=\"small\"\n startIcon={<commonIcons.CalendarIcon />}\n variant=\"floating\"\n />\n }\n errorMessage={errorMessage}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n inputRef={inputRef}\n isDisabled={isDisabled}\n isOptional={isOptional}\n isReadOnly={isReadOnly}\n label={label}\n onBlur={onBlur}\n minDate={minDate}\n maxDate={maxDate}\n onChange={onInputChange}\n timezone={internalTimeZone}\n value={value}\n />\n );\n },\n [\n commonIcons,\n errorMessage,\n hint,\n HintLinkComponent,\n internalTimeZone,\n isDisabled,\n isOptional,\n isReadOnly,\n label,\n onBlur,\n onInputChange,\n minDate,\n maxDate,\n t,\n toggleCalendarVisibility,\n ],\n );\n\n const slots = useMemo<DateTimePickerSlots<DateTime>>(\n () => ({\n actionBar: DateFieldActionBar,\n field: (muiProps: RenderDateTimeFieldProps) =>\n renderDateTimeField(muiProps),\n leftArrowIcon: () => <commonIcons.ArrowLeftIcon />,\n rightArrowIcon: () => <commonIcons.ArrowRightIcon />,\n switchViewIcon: () => <commonIcons.ChevronDownIcon />,\n }),\n [commonIcons, renderDateTimeField],\n );\n\n const slotProps = useMemo<DateTimePickerSlotProps<DateTime, false>>(\n () => ({\n actionBar: ({ wrapperVariant, onAccept, onCancel }) => ({\n actions:\n // This is the default behavior but felt more clear to pass them in explicitly\n wrapperVariant === \"desktop\" ? [] : [\"accept\", \"cancel\"],\n onAccept,\n onCancel,\n }),\n popper: {\n anchorEl: popperElement,\n },\n tabs: {\n dateIcon: <CalendarIcon />,\n timeIcon: <ClockIcon />,\n },\n toolbar: {\n toolbarPlaceholder: \"\",\n },\n }),\n [popperElement],\n );\n\n return (\n <OdysseyThemeProvider themeOverride={dateTimePickerTheme}>\n <DateFieldLocalizationProvider\n defaultedLanguageCode={defaultedLanguageCode}\n localeText={localeText}\n >\n <DatePickerContainer>\n <DatePickerWidthContainer\n odysseyDesignTokens={odysseyDesignTokens}\n ref={containerRef}\n >\n <MuiDateTimePicker\n dayOfWeekFormatter={formatDayOfWeek}\n defaultValue={inputValues?.defaultValue}\n disabled={isDisabled}\n fixedWeekNumber={6}\n inputRef={inputRef}\n key={language}\n label={label}\n minDate={minDate}\n maxDate={maxDate}\n onChange={formatDateTimeToJsDateStringOnCalendarSelection}\n onClose={closeCalendar}\n open={isOpen}\n readOnly={isReadOnly}\n shouldDisableDate={shouldDisableDate}\n shouldDisableMonth={shouldDisableMonth}\n shouldDisableYear={shouldDisableYear}\n slots={slots}\n slotProps={slotProps}\n timezone={internalTimeZone}\n value={inputValues?.value}\n />\n </DatePickerWidthContainer>\n </DatePickerContainer>\n\n {timeZoneOptions && timeZonePickerLabel && (\n <TimeZonePickerContainer odysseyDesignTokens={odysseyDesignTokens}>\n <TimeZonePicker\n label={timeZonePickerLabel}\n onTimeZoneChange={onTimeZoneChange}\n isReadOnly={isReadOnly}\n timeZoneOptions={timeZoneOptions}\n value={internalTimeZone}\n />\n </TimeZonePickerContainer>\n )}\n </DateFieldLocalizationProvider>\n </OdysseyThemeProvider>\n );\n};\n\nconst MemoizedDateTimePicker = memo(DateTimePicker);\nMemoizedDateTimePicker.displayName = \"DateTimePicker\";\n\nexport { MemoizedDateTimePicker as DateTimePicker };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PickerWithOptionAdornment.cjs","names":["_react","require","_styled","_interopRequireDefault","_Box","_ComposablePicker","_OdysseyDesignTokensContext","_Picker","_Typography","_Tag","_jsxRuntime","e","__esModule","default","OptionAdornmentContainer","styled","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","OptionAdornment","adornment","isImageAdornment","jsx","children","src","alt","role","OptionWithLabelDescriptionOnly","muiProps","option","description","label","value","jsxs","Option","hasAdornment","OptionLabelContainer","Heading6","component","OptionDescriptionComponent","OptionWithLabelDescriptionMetadata","metaData","OptionMetadataComponent","TagAdornment","useOdysseyDesignTokens","PickerWithOptionAdornment","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","groupOptionsBy","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","isVirtualizedProp","hint","HintLinkComponent","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","testId","translate","customTagRender","useCallback","values","getTagProps","map","index","key","onDelete","Box","sx","margin","Spacing1","Tag","icon","onRemove","customOptionRender","hasMetadata","ComposablePicker","renderOption","renderTags","MemoizedPickerWithOptionAdornment","exports","memo","displayName"],"sources":["../../../../src/labs/OdysseyPickers/PickerWithOptionAdornment.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n HTMLAttributes,\n memo,\n ReactElement,\n ReactNode,\n useCallback,\n} from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n ComposablePicker,\n ComposablePickerProps,\n type AdornmentSize,\n type BasePickerProps,\n type BasePickerType,\n} from \"./ComposablePicker.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport {\n type BaseOptionProps,\n type LabelDescription,\n type Metadata,\n Option,\n OptionDescriptionComponent,\n OptionLabelContainer,\n OptionMetadataComponent,\n OptionProps,\n} from \"./Picker.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport { Tag } from \"../../Tag.js\";\n\ntype Adornment = ReactNode | string;\n\ntype AdornmentLabelDescription = LabelDescription & {\n adornment: Adornment;\n};\n\ntype AdornmentLabelDescriptionMetadata = AdornmentLabelDescription & Metadata;\n\nexport type AdornmentOptionType =\n | AdornmentLabelDescription\n | AdornmentLabelDescriptionMetadata;\n\nconst OptionAdornmentContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"adornmentSize\" &&\n prop !== \"isTagContainer\",\n})<{\n adornmentSize?: AdornmentSize;\n isTagContainer?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(\n ({\n adornmentSize = \"small\",\n isTagContainer = false,\n odysseyDesignTokens,\n }) => ({\n position: \"relative\",\n // push icon up by one px for better visual alignment\n bottom: \"1px\",\n alignSelf: \"flex-start\",\n width: odysseyDesignTokens.Spacing5,\n height: odysseyDesignTokens.Spacing5,\n overflow: \"hidden\",\n marginInlineEnd: odysseyDesignTokens.Spacing3,\n\n svg: {\n width: \"100%\",\n height: \"auto\",\n },\n\n img: {\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n width: \"100%\",\n transform: \"translate(-50%, -50%)\",\n },\n\n ...(adornmentSize === \"large\" &&\n !isTagContainer && {\n bottom: 0,\n width: odysseyDesignTokens.Spacing8,\n height: odysseyDesignTokens.Spacing8,\n }),\n\n ...(isTagContainer && {\n bottom: 0,\n alignSelf: \"center\",\n width: odysseyDesignTokens.Spacing4,\n height: \"auto\",\n maxHeight: odysseyDesignTokens.Spacing4,\n marginInlineEnd: odysseyDesignTokens.Spacing2,\n\n svg: {\n display: \"flex\",\n width: \"100%\",\n height: \"auto\",\n },\n }),\n }),\n);\n\ntype OptionAdornmentProps = {\n adornment: Adornment;\n adornmentSize: AdornmentSize;\n odysseyDesignTokens: DesignTokens;\n};\n\nconst OptionAdornment = ({\n adornment,\n adornmentSize,\n odysseyDesignTokens,\n}: OptionAdornmentProps) => {\n const isImageAdornment = typeof adornment === \"string\";\n\n if (isImageAdornment) {\n return (\n <OptionAdornmentContainer\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {/* NOTE: Intentionally leaving alt as an empty string here so screen readers will ignore this image */}\n {/* Image should be suffciently described by the adjacent title and/or description of the option */}\n <img src={adornment} alt=\"\" role=\"presentation\" />\n </OptionAdornmentContainer>\n );\n } else {\n return (\n <OptionAdornmentContainer\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {adornment}\n </OptionAdornmentContainer>\n );\n }\n};\n\nconst OptionWithLabelDescriptionOnly = <\n OptionType extends AdornmentLabelDescription,\n>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & { adornmentSize: AdornmentSize }) => {\n const { adornment, description, label, value } = option;\n return (\n <Option hasAdornment key={value} muiProps={muiProps}>\n <OptionAdornment\n adornment={adornment}\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n <OptionLabelContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Heading6 component=\"p\">{label}</Heading6>\n <OptionDescriptionComponent\n description={description}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </OptionLabelContainer>\n </Option>\n );\n};\n\nconst OptionWithLabelDescriptionMetadata = <\n OptionType extends AdornmentLabelDescriptionMetadata,\n>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & {\n adornmentSize: AdornmentSize;\n }) => {\n const { adornment, description, label, metaData, value } = option;\n\n return (\n <Option hasAdornment key={value} muiProps={muiProps}>\n <OptionAdornment\n adornment={adornment}\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n <div>\n <OptionLabelContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Heading6 component=\"p\">{label}</Heading6>\n <OptionDescriptionComponent\n description={description}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </OptionLabelContainer>\n <OptionMetadataComponent\n metaData={metaData}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </div>\n </Option>\n );\n};\n\ntype TagAdornmentProps = {\n adornment: Adornment;\n};\n\nconst TagAdornment = ({ adornment }: TagAdornmentProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const isImageAdornment = typeof adornment === \"string\";\n\n if (isImageAdornment) {\n return (\n <OptionAdornmentContainer\n isTagContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <img src={adornment} alt=\"\" role=\"presentation\" />\n </OptionAdornmentContainer>\n );\n }\n\n return (\n <OptionAdornmentContainer\n isTagContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {adornment}\n </OptionAdornmentContainer>\n );\n};\n\nexport type PickerWithOptionAdornmentProps<\n OptionType extends AdornmentOptionType,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n> = BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n adornmentSize?: AdornmentSize;\n};\n\ntype PickerWithOptionAdornmentComponentType = {\n <\n OptionType extends AdornmentLabelDescription,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n >(\n props: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n <\n OptionType extends AdornmentLabelDescriptionMetadata,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n >(\n props: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n};\n\nconst PickerWithOptionAdornment: PickerWithOptionAdornmentComponentType = <\n OptionType extends AdornmentOptionType,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n>({\n adornmentSize = \"small\",\n ariaDescribedBy,\n defaultValue,\n errorMessage,\n errorMessageList,\n getIsOptionEqualToValue,\n groupOptionsBy,\n hasMultipleChoices,\n id: idOverride,\n inputValue,\n isCustomValueAllowed,\n isDisabled,\n isFullWidth = false,\n isLoading,\n isOptional = false,\n isReadOnly,\n isVirtualized: isVirtualizedProp = false,\n hint,\n HintLinkComponent,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onInputChange: onInputChangeProp,\n onFocus,\n options,\n value,\n testId,\n translate,\n}: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n>) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const customTagRender = useCallback<\n NonNullable<\n ComposablePickerProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >[\"renderTags\"]\n >\n >(\n (values, getTagProps) =>\n values.map((value, index) => {\n const { key, onDelete } = getTagProps({ index });\n const { adornment, label } = value;\n\n return (\n <Box\n key={key}\n sx={{\n margin: odysseyDesignTokens.Spacing1,\n marginInlineEnd: 0,\n }}\n >\n <Tag\n icon={<TagAdornment adornment={adornment} />}\n label={label}\n onRemove={onDelete}\n />\n </Box>\n );\n }),\n [odysseyDesignTokens],\n );\n\n const customOptionRender = useCallback<\n (props: HTMLAttributes<HTMLLIElement>, option: OptionType) => ReactNode\n >(\n (muiProps, option) => {\n const hasMetadata = \"metaData\" in option && option.metaData;\n\n if (hasMetadata) {\n return (\n <OptionWithLabelDescriptionMetadata\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n );\n }\n\n return (\n <OptionWithLabelDescriptionOnly\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n );\n },\n [adornmentSize, odysseyDesignTokens],\n );\n\n return (\n <ComposablePicker<OptionType, HasMultipleChoices, IsCustomValueAllowed>\n ariaDescribedBy={ariaDescribedBy}\n defaultValue={defaultValue}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n getIsOptionEqualToValue={getIsOptionEqualToValue}\n groupOptionsBy={groupOptionsBy}\n hasMultipleChoices={hasMultipleChoices}\n id={idOverride}\n inputValue={inputValue}\n isCustomValueAllowed={isCustomValueAllowed}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isLoading={isLoading}\n isOptional={isOptional}\n isReadOnly={isReadOnly}\n isVirtualized={isVirtualizedProp}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onInputChange={onInputChangeProp}\n onFocus={onFocus}\n options={options}\n renderOption={customOptionRender}\n renderTags={customTagRender}\n value={value}\n testId={testId}\n translate={translate}\n />\n );\n};\n\n// Need the `as BasePickerType` because generics don't get passed through\nconst MemoizedPickerWithOptionAdornment = memo(\n PickerWithOptionAdornment,\n) as BasePickerType;\n\nMemoizedPickerWithOptionAdornment.displayName = \"PickerWithOptionAdornment\";\n\nexport { MemoizedPickerWithOptionAdornment as PickerWithOptionAdornment };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"PickerWithOptionAdornment.cjs","names":["_react","require","_styled","_interopRequireDefault","_Box","_ComposablePicker","_OdysseyDesignTokensContext","_Picker","_Typography","_Tag","_jsxRuntime","e","__esModule","default","OptionAdornmentContainer","styled","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","OptionAdornment","adornment","isImageAdornment","jsx","children","src","alt","role","OptionWithLabelDescriptionOnly","muiProps","option","description","label","value","jsxs","Option","hasAdornment","OptionLabelContainer","Heading6","component","OptionDescriptionComponent","OptionWithLabelDescriptionMetadata","metaData","OptionMetadataComponent","TagAdornment","useOdysseyDesignTokens","PickerWithOptionAdornment","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","groupOptionsBy","hasMultipleChoices","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","isVirtualizedProp","hint","HintLinkComponent","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","testId","translate","customTagRender","useCallback","values","getTagProps","map","index","key","onDelete","Box","sx","margin","Spacing1","Tag","icon","onRemove","customOptionRender","hasMetadata","ComposablePicker","renderOption","renderTags","MemoizedPickerWithOptionAdornment","exports","memo","displayName"],"sources":["../../../../src/labs/OdysseyPickers/PickerWithOptionAdornment.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n HTMLAttributes,\n memo,\n ReactElement,\n ReactNode,\n useCallback,\n} from \"react\";\nimport styled from \"@emotion/styled\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n ComposablePicker,\n ComposablePickerProps,\n type AdornmentSize,\n type BasePickerProps,\n type BasePickerType,\n} from \"./ComposablePicker.js\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport {\n type BaseOptionProps,\n type LabelDescription,\n type Metadata,\n Option,\n OptionDescriptionComponent,\n OptionLabelContainer,\n OptionMetadataComponent,\n OptionProps,\n} from \"./Picker.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport { Tag } from \"../../Tag.js\";\n\ntype Adornment = ReactNode | string;\n\ntype AdornmentLabelDescription = LabelDescription & {\n adornment: Adornment;\n};\n\ntype AdornmentLabelDescriptionMetadata = AdornmentLabelDescription & Metadata;\n\nexport type AdornmentOptionType =\n | AdornmentLabelDescription\n | AdornmentLabelDescriptionMetadata;\n\nconst OptionAdornmentContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"adornmentSize\" &&\n prop !== \"isTagContainer\",\n})<{\n adornmentSize?: AdornmentSize;\n isTagContainer?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(\n ({\n adornmentSize = \"small\",\n isTagContainer = false,\n odysseyDesignTokens,\n }) => ({\n position: \"relative\",\n // push icon up by one px for better visual alignment\n bottom: \"1px\",\n alignSelf: \"flex-start\",\n width: odysseyDesignTokens.Spacing5,\n height: odysseyDesignTokens.Spacing5,\n overflow: \"hidden\",\n marginInlineEnd: odysseyDesignTokens.Spacing3,\n\n svg: {\n width: \"100%\",\n height: \"auto\",\n },\n\n img: {\n position: \"absolute\",\n top: \"50%\",\n left: \"50%\",\n width: \"100%\",\n transform: \"translate(-50%, -50%)\",\n },\n\n ...(adornmentSize === \"large\" &&\n !isTagContainer && {\n bottom: 0,\n width: odysseyDesignTokens.Spacing8,\n height: odysseyDesignTokens.Spacing8,\n }),\n\n ...(isTagContainer && {\n bottom: 0,\n alignSelf: \"center\",\n width: odysseyDesignTokens.Spacing4,\n height: \"auto\",\n maxHeight: odysseyDesignTokens.Spacing4,\n marginInlineEnd: odysseyDesignTokens.Spacing2,\n\n svg: {\n display: \"flex\",\n width: \"100%\",\n height: \"auto\",\n },\n }),\n }),\n);\n\ntype OptionAdornmentProps = {\n adornment: Adornment;\n adornmentSize: AdornmentSize;\n odysseyDesignTokens: DesignTokens;\n};\n\nconst OptionAdornment = ({\n adornment,\n adornmentSize,\n odysseyDesignTokens,\n}: OptionAdornmentProps) => {\n const isImageAdornment = typeof adornment === \"string\";\n\n if (isImageAdornment) {\n return (\n <OptionAdornmentContainer\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {/* NOTE: Intentionally leaving alt as an empty string here so screen readers will ignore this image */}\n {/* Image should be sufficiently described by the adjacent title and/or description of the option */}\n <img src={adornment} alt=\"\" role=\"presentation\" />\n </OptionAdornmentContainer>\n );\n } else {\n return (\n <OptionAdornmentContainer\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {adornment}\n </OptionAdornmentContainer>\n );\n }\n};\n\nconst OptionWithLabelDescriptionOnly = <\n OptionType extends AdornmentLabelDescription,\n>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & { adornmentSize: AdornmentSize }) => {\n const { adornment, description, label, value } = option;\n return (\n <Option hasAdornment key={value} muiProps={muiProps}>\n <OptionAdornment\n adornment={adornment}\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n <OptionLabelContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Heading6 component=\"p\">{label}</Heading6>\n <OptionDescriptionComponent\n description={description}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </OptionLabelContainer>\n </Option>\n );\n};\n\nconst OptionWithLabelDescriptionMetadata = <\n OptionType extends AdornmentLabelDescriptionMetadata,\n>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & {\n adornmentSize: AdornmentSize;\n }) => {\n const { adornment, description, label, metaData, value } = option;\n\n return (\n <Option hasAdornment key={value} muiProps={muiProps}>\n <OptionAdornment\n adornment={adornment}\n adornmentSize={adornmentSize}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n <div>\n <OptionLabelContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Heading6 component=\"p\">{label}</Heading6>\n <OptionDescriptionComponent\n description={description}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </OptionLabelContainer>\n <OptionMetadataComponent\n metaData={metaData}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n </div>\n </Option>\n );\n};\n\ntype TagAdornmentProps = {\n adornment: Adornment;\n};\n\nconst TagAdornment = ({ adornment }: TagAdornmentProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const isImageAdornment = typeof adornment === \"string\";\n\n if (isImageAdornment) {\n return (\n <OptionAdornmentContainer\n isTagContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <img src={adornment} alt=\"\" role=\"presentation\" />\n </OptionAdornmentContainer>\n );\n }\n\n return (\n <OptionAdornmentContainer\n isTagContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {adornment}\n </OptionAdornmentContainer>\n );\n};\n\nexport type PickerWithOptionAdornmentProps<\n OptionType extends AdornmentOptionType,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n> = BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed> & {\n adornmentSize?: AdornmentSize;\n};\n\ntype PickerWithOptionAdornmentComponentType = {\n <\n OptionType extends AdornmentLabelDescription,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n >(\n props: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n <\n OptionType extends AdornmentLabelDescriptionMetadata,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n >(\n props: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n};\n\nconst PickerWithOptionAdornment: PickerWithOptionAdornmentComponentType = <\n OptionType extends AdornmentOptionType,\n HasMultipleChoices extends boolean | undefined,\n IsCustomValueAllowed extends boolean | undefined,\n>({\n adornmentSize = \"small\",\n ariaDescribedBy,\n defaultValue,\n errorMessage,\n errorMessageList,\n getIsOptionEqualToValue,\n groupOptionsBy,\n hasMultipleChoices,\n id: idOverride,\n inputValue,\n isCustomValueAllowed,\n isDisabled,\n isFullWidth = false,\n isLoading,\n isOptional = false,\n isReadOnly,\n isVirtualized: isVirtualizedProp = false,\n hint,\n HintLinkComponent,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onInputChange: onInputChangeProp,\n onFocus,\n options,\n value,\n testId,\n translate,\n}: PickerWithOptionAdornmentProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n>) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const customTagRender = useCallback<\n NonNullable<\n ComposablePickerProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >[\"renderTags\"]\n >\n >(\n (values, getTagProps) =>\n values.map((value, index) => {\n const { key, onDelete } = getTagProps({ index });\n const { adornment, label } = value;\n\n return (\n <Box\n key={key}\n sx={{\n margin: odysseyDesignTokens.Spacing1,\n marginInlineEnd: 0,\n }}\n >\n <Tag\n icon={<TagAdornment adornment={adornment} />}\n label={label}\n onRemove={onDelete}\n />\n </Box>\n );\n }),\n [odysseyDesignTokens],\n );\n\n const customOptionRender = useCallback<\n (props: HTMLAttributes<HTMLLIElement>, option: OptionType) => ReactNode\n >(\n (muiProps, option) => {\n const hasMetadata = \"metaData\" in option && option.metaData;\n\n if (hasMetadata) {\n return (\n <OptionWithLabelDescriptionMetadata\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n );\n }\n\n return (\n <OptionWithLabelDescriptionOnly\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n );\n },\n [adornmentSize, odysseyDesignTokens],\n );\n\n return (\n <ComposablePicker<OptionType, HasMultipleChoices, IsCustomValueAllowed>\n ariaDescribedBy={ariaDescribedBy}\n defaultValue={defaultValue}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n getIsOptionEqualToValue={getIsOptionEqualToValue}\n groupOptionsBy={groupOptionsBy}\n hasMultipleChoices={hasMultipleChoices}\n id={idOverride}\n inputValue={inputValue}\n isCustomValueAllowed={isCustomValueAllowed}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isLoading={isLoading}\n isOptional={isOptional}\n isReadOnly={isReadOnly}\n isVirtualized={isVirtualizedProp}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onInputChange={onInputChangeProp}\n onFocus={onFocus}\n options={options}\n renderOption={customOptionRender}\n renderTags={customTagRender}\n value={value}\n testId={testId}\n translate={translate}\n />\n );\n};\n\n// Need the `as BasePickerType` because generics don't get passed through\nconst MemoizedPickerWithOptionAdornment = memo(\n PickerWithOptionAdornment,\n) as BasePickerType;\n\nMemoizedPickerWithOptionAdornment.displayName = \"PickerWithOptionAdornment\";\n\nexport { MemoizedPickerWithOptionAdornment as PickerWithOptionAdornment };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -224,11 +224,15 @@ const NarrowUiShellContent = ({
|
|
|
224
224
|
setIsRightSideMenuOpen(false);
|
|
225
225
|
}, []);
|
|
226
226
|
(0, _react.useEffect)(() => {
|
|
227
|
-
const
|
|
227
|
+
const unsubscribeFromCloseRightSideMenu = uiShellContext?.subscribeToCloseRightSideMenu(() => {
|
|
228
|
+
closeSideMenus();
|
|
229
|
+
});
|
|
230
|
+
const unsubscribeFromSideNavItemClicked = uiShellContext?.subscribeToCloseSideNavMenu(() => {
|
|
228
231
|
closeSideMenus();
|
|
229
232
|
});
|
|
230
233
|
return () => {
|
|
231
|
-
|
|
234
|
+
unsubscribeFromCloseRightSideMenu?.();
|
|
235
|
+
unsubscribeFromSideNavItemClicked?.();
|
|
232
236
|
};
|
|
233
237
|
}, [closeSideMenus, uiShellContext]);
|
|
234
238
|
const toggleLeftSideMenu = (0, _react.useCallback)(() => {
|
|
@@ -269,9 +273,10 @@ const NarrowUiShellContent = ({
|
|
|
269
273
|
topNavBackgroundColor: uiShellContext?.sideNavBackgroundColor,
|
|
270
274
|
children: [(0, _jsxRuntime.jsxs)(StyledMenuLogo, {
|
|
271
275
|
odysseyDesignTokens: odysseyDesignTokens,
|
|
272
|
-
children: [(0, _jsxRuntime.jsx)(_Button.Button, {
|
|
276
|
+
children: [(sideNavProps?.isCollapsible || !sideNavProps?.isCollapsed) && (0, _jsxRuntime.jsx)(_Button.Button, {
|
|
273
277
|
onClick: toggleLeftSideMenu,
|
|
274
278
|
startIcon: (0, _jsxRuntime.jsx)(_HamburgerMenuIcon.HamburgerMenuIcon, {}),
|
|
279
|
+
testId: "sidenav-menu--icon",
|
|
275
280
|
variant: "floating"
|
|
276
281
|
}), (0, _jsxRuntime.jsx)(StyledLogoContainer, {
|
|
277
282
|
odysseyDesignTokens: odysseyDesignTokens,
|
|
@@ -286,6 +291,7 @@ const NarrowUiShellContent = ({
|
|
|
286
291
|
}), optionalComponents?.rightSideMenu && (0, _jsxRuntime.jsx)(_Button.Button, {
|
|
287
292
|
onClick: toggleRightSideMenu,
|
|
288
293
|
startIcon: isRightSideMenuOpen ? (0, _jsxRuntime.jsx)(_Close.CloseIcon, {}) : (0, _jsxRuntime.jsx)(_More.MoreIcon, {}),
|
|
294
|
+
testId: "userprofile-menu--icon",
|
|
289
295
|
variant: "floating"
|
|
290
296
|
})]
|
|
291
297
|
}), optionalComponents?.topNavLeftSide && (0, _jsxRuntime.jsx)(StyledTopNavSearch, {
|
|
@@ -294,9 +300,16 @@ const NarrowUiShellContent = ({
|
|
|
294
300
|
})]
|
|
295
301
|
})
|
|
296
302
|
}), (0, _jsxRuntime.jsxs)(StyledAppContentArea, {
|
|
297
|
-
children: [(0, _jsxRuntime.
|
|
303
|
+
children: [(0, _jsxRuntime.jsxs)(StyledLeftSideContainer, {
|
|
298
304
|
isOpen: isLeftSideMenuOpen,
|
|
299
|
-
children: sideNavProps && (0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
|
|
305
|
+
children: [initialVisibleSections?.includes("SideNav") && sideNavProps === undefined && (0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
|
|
306
|
+
fallback: null,
|
|
307
|
+
onError: onError,
|
|
308
|
+
children: (0, _jsxRuntime.jsx)(_SideNav.SideNav, {
|
|
309
|
+
isLoading: true,
|
|
310
|
+
sideNavItems: _uiShellSharedConstants.emptySideNavItems
|
|
311
|
+
})
|
|
312
|
+
}), sideNavProps && (0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
|
|
300
313
|
fallback: null,
|
|
301
314
|
onError: onError,
|
|
302
315
|
children: (0, _jsxRuntime.jsx)(StyledSideNavContainer, {
|
|
@@ -319,7 +332,7 @@ const NarrowUiShellContent = ({
|
|
|
319
332
|
isObtrusive: true
|
|
320
333
|
})
|
|
321
334
|
})
|
|
322
|
-
})
|
|
335
|
+
})]
|
|
323
336
|
}), (0, _jsxRuntime.jsx)(StyledRightSideContainer, {
|
|
324
337
|
isOpen: isRightSideMenuOpen,
|
|
325
338
|
odysseyDesignTokens: odysseyDesignTokens,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NarrowUiShellContent.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactErrorBoundary","_Button","_Close","_More","_OdysseyDesignTokensContext","_SideNav","_SideNavLogo","_HamburgerMenuIcon","_UiShellProvider","_uiShellSharedConstants","_useScrollState","_useMatchAppElementToUiShellAppArea","_hexToRgb","_jsxRuntime","e","__esModule","default","StyledAppContentArea","styled","gridArea","position","display","gridGap","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","height","width","StyledAppContainer","shouldForwardProp","prop","appBackgroundColor","backgroundColor","overflow","StyledBannersContainer","zIndex","UI_SHELL_BASE_Z_INDEX","StyledLeftSideContainer","isOpen","overflowY","StyledRightSideContainer","odysseyDesignTokens","HueNeutralWhite","maxWidth","SIDE_NAV_WIDTH","right","StyledMenuLogo","alignItems","gap","Spacing3","StyledLogoContainer","TOP_NAV_HEIGHT","paddingBlock","Spacing4","maxHeight","StyledPageOverlay","hexToRgb","HueNeutral900","asFormattedString","replace","left","top","StyledSideNavContainer","StyledUiShellContainer","HueNeutral50","StyledTopNav","isContentScrolled","topNavBackgroundColor","boxShadow","DepthMedium","undefined","clipPath","flexDirection","justifyContent","transition","TransitionDurationMain","TransitionTimingMain","StyledTopNavMenu","minHeight","Spacing2","paddingInline","borderBottomColor","HueNeutral100","borderBottomStyle","BorderStyleMain","borderBottomWidth","BorderWidthMain","StyledTopNavSearch","NarrowUiShellContent","appElement","appElementScrollingMode","hasStandardAppContentPadding","initialVisibleSections","onError","console","error","optionalComponents","sideNavProps","topNavProps","useOdysseyDesignTokens","uiShellContext","useUiShellContext","useScrollState","sideNavContainerRef","useRef","topNavContainerRef","uiShellAppAreaRef","isLeftSideMenuOpen","setIsLeftSideMenuOpen","useState","isRightSideMenuOpen","setIsRightSideMenuOpen","closeSideMenus","useCallback","useEffect","unsubscribe","subscribeSideNavItemClicked","toggleLeftSideMenu","toggleRightSideMenu","parentContainerRef","useMatchAppElementToUiShellAppArea","paddingMode","uiShellResizableRefs","jsxs","Fragment","children","jsx","onClick","ref","banners","includes","ErrorBoundary","fallback","sideNavBackgroundColor","Button","startIcon","HamburgerMenuIcon","variant","isLoading","_Skeleton2","SideNavLogo","logoProps","rightSideMenu","CloseIcon","MoreIcon","topNavLeftSide","SideNav","appName","hasCustomFooter","sideNavFooter","footerComponent","footerItems","isCollapsed","isCollapsible","isObtrusive","tabIndex","MemoizedNarrowUiShellContent","exports","memo","displayName"],"sources":["../../../src/ui-shell/NarrowUiShellContent.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { Skeleton } from \"@mui/material\";\nimport {\n CSSProperties,\n memo,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { ErrorBoundary } from \"react-error-boundary\";\n\nimport { Button } from \"../Buttons/Button.js\";\nimport type { HtmlProps } from \"../HtmlProps.js\";\nimport { CloseIcon } from \"../icons.generated/Close.js\";\nimport { MoreIcon } from \"../icons.generated/More.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { SideNav } from \"./SideNav/SideNav.js\";\nimport { SideNavLogo } from \"./SideNav/SideNavLogo.js\";\nimport { HamburgerMenuIcon } from \"./TopNav/HamburgerMenuIcon.js\";\nimport { UiShellColors, useUiShellContext } from \"./UiShellProvider.js\";\nimport {\n UiShellNavComponentProps,\n UiShellContentProps,\n} from \"./uiShellContentTypes.js\";\nimport {\n SIDE_NAV_WIDTH,\n TOP_NAV_HEIGHT,\n UI_SHELL_BASE_Z_INDEX,\n} from \"./uiShellSharedConstants.js\";\nimport { useScrollState } from \"./useScrollState.js\";\nimport { useMatchAppElementToUiShellAppArea } from \"./useMatchAppElementToUiShellAppArea.js\";\nimport { hexToRgb } from \"../hexToRgb.js\";\n\nconst StyledAppContentArea = styled(\"div\")({\n gridArea: \"app-content\",\n position: \"relative\",\n display: \"grid\",\n gridGap: 0,\n gridTemplateAreas: `\n \"left-side app-container right-side\"\n `,\n gridTemplateColumns: \"auto 1fr auto\",\n gridTemplateRows: \"1fr\",\n height: \"100%\",\n width: \"100%\",\n});\n\nconst StyledAppContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"appBackgroundColor\" && prop !== \"odysseyDesignTokens\",\n})<{\n appBackgroundColor?: UiShellColors[\"appBackgroundColor\"];\n}>(({ appBackgroundColor }) => ({\n backgroundColor: appBackgroundColor,\n height: \"100%\",\n gridArea: \"app-container\",\n overflow: \"hidden\",\n width: \"100%\",\n}));\n\nconst StyledBannersContainer = styled(\"div\")({\n gridArea: \"banners\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n});\n\nconst StyledLeftSideContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"isOpen\",\n})<{\n isOpen: boolean;\n}>(({ isOpen }) => ({\n display: isOpen ? \"block\" : \"none\",\n height: \"100%\",\n gridArea: \"left-side\",\n overflowY: \"auto\",\n position: \"absolute\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledRightSideContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"isOpen\" && prop !== \"odysseyDesignTokens\",\n})<{\n isOpen: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ isOpen, odysseyDesignTokens }) => ({\n backgroundColor: odysseyDesignTokens.HueNeutralWhite,\n display: isOpen ? \"block\" : \"none\",\n gridArea: \"right-side\",\n height: \"100%\",\n maxWidth: SIDE_NAV_WIDTH,\n overflowY: \"auto\",\n position: \"absolute\",\n right: 0,\n width: SIDE_NAV_WIDTH,\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledMenuLogo = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n alignItems: \"center\",\n display: \"inline-flex\",\n gap: odysseyDesignTokens.Spacing3,\n}));\n\nconst StyledLogoContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n height: TOP_NAV_HEIGHT,\n paddingBlock: odysseyDesignTokens.Spacing4,\n\n \"svg, img\": {\n maxHeight: \"100%\",\n width: \"auto\",\n maxWidth: \"100%\",\n },\n}));\n\nconst StyledPageOverlay = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n backgroundColor: hexToRgb(\n odysseyDesignTokens.HueNeutral900,\n ).asFormattedString.replace(/rgb\\((.+)\\)$/, \"rgba($1, 0.26)\"),\n gridArea: \"app-content\",\n height: \"100vh\",\n left: 0,\n position: \"absolute\",\n top: 0,\n width: \"100vw\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledSideNavContainer = styled(\"div\")({\n height: \"100%\", // Without this value, side nav won't fill up the height if the content is too short.\n});\n\nconst StyledUiShellContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n display: \"grid\",\n gridGap: 0,\n gridTemplateAreas: `\n \"banners\"\n \"top-nav\"\n \"app-content\"\n `,\n gridTemplateColumns: \"1fr\",\n gridTemplateRows: \"auto auto 1fr\",\n height: \"100vh\",\n overflow: \"hidden\",\n width: \"100vw\",\n}));\n\nconst StyledTopNav = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"isContentScrolled\" &&\n prop !== \"topNavBackgroundColor\",\n})<{\n isContentScrolled?: boolean;\n odysseyDesignTokens: DesignTokens;\n topNavBackgroundColor?: UiShellColors[\"topNavBackgroundColor\"];\n}>(({ odysseyDesignTokens, isContentScrolled, topNavBackgroundColor }) => ({\n alignItems: \"stretch\",\n backgroundColor: odysseyDesignTokens.HueNeutralWhite || topNavBackgroundColor, // This logic doesn't make sense, but I wanted to leave it here for when we eventually make a decision on `topNavBackgroundColor`. --Kevin Ghadyani\n boxShadow: isContentScrolled ? odysseyDesignTokens.DepthMedium : undefined,\n clipPath: \"inset(0 0 -100vh 0)\",\n display: \"flex\",\n flexDirection: \"column\",\n gridArea: \"top-nav\",\n height: \"100%\",\n justifyContent: \"center\",\n position: \"relative\",\n transition: `box-shadow ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledTopNavMenu = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"topNavBackgroundColor\",\n})<{\n odysseyDesignTokens: DesignTokens;\n topNavBackgroundColor?: UiShellColors[\"topNavBackgroundColor\"];\n}>(({ odysseyDesignTokens, topNavBackgroundColor }) => ({\n alignItems: \"center\",\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing3,\n height: \"100%\",\n justifyContent: \"space-between\",\n maxHeight: TOP_NAV_HEIGHT,\n minHeight: TOP_NAV_HEIGHT,\n paddingBlock: odysseyDesignTokens.Spacing2,\n paddingInline: odysseyDesignTokens.Spacing3,\n transition: `box-shadow ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n\n ...(topNavBackgroundColor === odysseyDesignTokens.HueNeutralWhite &&\n ({\n borderBottomColor: odysseyDesignTokens.HueNeutral100,\n borderBottomStyle: odysseyDesignTokens.BorderStyleMain,\n borderBottomWidth: odysseyDesignTokens.BorderWidthMain,\n } as CSSProperties)),\n}));\n\nconst StyledTopNavSearch = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n paddingBlock: odysseyDesignTokens.Spacing2,\n paddingInline: odysseyDesignTokens.Spacing3,\n}));\n\nexport type NarrowUiShellContentProps = Pick<HtmlProps, \"testId\"> &\n Pick<UiShellNavComponentProps, \"sideNavProps\" | \"topNavProps\"> &\n UiShellContentProps;\n\nconst NarrowUiShellContent = ({\n appElement,\n appElementScrollingMode,\n hasStandardAppContentPadding = true,\n initialVisibleSections = [\"TopNav\", \"SideNav\", \"AppSwitcher\"],\n onError = console.error,\n optionalComponents,\n sideNavProps,\n topNavProps,\n}: NarrowUiShellContentProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const uiShellContext = useUiShellContext();\n\n const { isContentScrolled } = useScrollState(appElement);\n\n const sideNavContainerRef = useRef<HTMLDivElement>(null);\n const topNavContainerRef = useRef<HTMLDivElement>(null);\n const uiShellAppAreaRef = useRef<HTMLDivElement>(null);\n\n const [isLeftSideMenuOpen, setIsLeftSideMenuOpen] = useState(false);\n const [isRightSideMenuOpen, setIsRightSideMenuOpen] = useState(false);\n\n const closeSideMenus = useCallback(() => {\n setIsLeftSideMenuOpen(false);\n setIsRightSideMenuOpen(false);\n }, []);\n\n useEffect(() => {\n const unsubscribe = uiShellContext?.subscribeSideNavItemClicked(() => {\n closeSideMenus();\n });\n\n return () => {\n unsubscribe?.();\n };\n }, [closeSideMenus, uiShellContext]);\n\n const toggleLeftSideMenu = useCallback(() => {\n setIsRightSideMenuOpen(false);\n setIsLeftSideMenuOpen((isLeftSideMenuOpen) => !isLeftSideMenuOpen);\n }, []);\n\n const toggleRightSideMenu = useCallback(() => {\n setIsLeftSideMenuOpen(false);\n setIsRightSideMenuOpen((isRightSideMenuOpen) => !isRightSideMenuOpen);\n }, []);\n\n const { parentContainerRef } = useMatchAppElementToUiShellAppArea({\n appElement,\n appElementScrollingMode,\n paddingMode: hasStandardAppContentPadding ? \"compact\" : \"none\",\n uiShellAppAreaRef,\n uiShellResizableRefs: [\n sideNavContainerRef,\n topNavContainerRef,\n uiShellAppAreaRef,\n ],\n });\n\n return (\n <>\n {(isLeftSideMenuOpen || isRightSideMenuOpen) && (\n <StyledPageOverlay\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={closeSideMenus}\n />\n )}\n\n <StyledUiShellContainer\n odysseyDesignTokens={odysseyDesignTokens}\n ref={parentContainerRef}\n >\n <StyledBannersContainer>\n {optionalComponents?.banners}\n </StyledBannersContainer>\n\n {(initialVisibleSections?.includes(\"TopNav\") || topNavProps) && (\n <ErrorBoundary fallback={null} onError={onError}>\n <StyledTopNav\n isContentScrolled={isContentScrolled}\n odysseyDesignTokens={odysseyDesignTokens}\n topNavBackgroundColor={uiShellContext?.topNavBackgroundColor}\n >\n <StyledTopNavMenu\n odysseyDesignTokens={odysseyDesignTokens}\n topNavBackgroundColor={uiShellContext?.sideNavBackgroundColor}\n >\n <StyledMenuLogo odysseyDesignTokens={odysseyDesignTokens}>\n <Button\n onClick={toggleLeftSideMenu}\n startIcon={<HamburgerMenuIcon />}\n variant=\"floating\"\n />\n\n <StyledLogoContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {sideNavProps?.isLoading ? (\n // The skeleton takes the hardcoded dimensions of the Okta logo\n <Skeleton variant=\"rounded\" height={24} width={67} />\n ) : (\n <SideNavLogo {...sideNavProps?.logoProps} />\n )}\n </StyledLogoContainer>\n </StyledMenuLogo>\n\n {optionalComponents?.rightSideMenu && (\n <Button\n onClick={toggleRightSideMenu}\n startIcon={\n isRightSideMenuOpen ? <CloseIcon /> : <MoreIcon />\n }\n variant=\"floating\"\n />\n )}\n </StyledTopNavMenu>\n\n {optionalComponents?.topNavLeftSide && (\n <StyledTopNavSearch odysseyDesignTokens={odysseyDesignTokens}>\n {optionalComponents?.topNavLeftSide}\n </StyledTopNavSearch>\n )}\n </StyledTopNav>\n </ErrorBoundary>\n )}\n\n <StyledAppContentArea>\n <StyledLeftSideContainer isOpen={isLeftSideMenuOpen}>\n {sideNavProps && (\n <ErrorBoundary fallback={null} onError={onError}>\n <StyledSideNavContainer>\n <SideNav\n {...{\n ...{\n ...sideNavProps,\n // This hides the side nav logo or app name from showing up as we already have one in the narrow top nav.\n appName: undefined,\n logoProps: undefined,\n },\n ...(sideNavProps.hasCustomFooter &&\n optionalComponents?.sideNavFooter\n ? {\n footerComponent: optionalComponents.sideNavFooter,\n footerItems: undefined,\n hasCustomFooter: sideNavProps.hasCustomFooter,\n }\n : {\n footerItems: sideNavProps.footerItems,\n hasCustomFooter: false,\n }),\n }}\n isCollapsed={false}\n isCollapsible={false}\n isObtrusive\n />\n </StyledSideNavContainer>\n </ErrorBoundary>\n )}\n </StyledLeftSideContainer>\n\n <StyledRightSideContainer\n isOpen={isRightSideMenuOpen}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <StyledSideNavContainer>\n {optionalComponents?.rightSideMenu}\n </StyledSideNavContainer>\n </StyledRightSideContainer>\n\n <StyledAppContainer\n appBackgroundColor={uiShellContext?.appBackgroundColor}\n tabIndex={0}\n ref={uiShellAppAreaRef}\n />\n </StyledAppContentArea>\n </StyledUiShellContainer>\n </>\n );\n};\n\nconst MemoizedNarrowUiShellContent = memo(NarrowUiShellContent);\nMemoizedNarrowUiShellContent.displayName = \"NarrowUiShellContent\";\n\nexport { MemoizedNarrowUiShellContent as NarrowUiShellContent };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"NarrowUiShellContent.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactErrorBoundary","_Button","_Close","_More","_OdysseyDesignTokensContext","_SideNav","_SideNavLogo","_HamburgerMenuIcon","_UiShellProvider","_uiShellSharedConstants","_useScrollState","_useMatchAppElementToUiShellAppArea","_hexToRgb","_jsxRuntime","e","__esModule","default","StyledAppContentArea","styled","gridArea","position","display","gridGap","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","height","width","StyledAppContainer","shouldForwardProp","prop","appBackgroundColor","backgroundColor","overflow","StyledBannersContainer","zIndex","UI_SHELL_BASE_Z_INDEX","StyledLeftSideContainer","isOpen","overflowY","StyledRightSideContainer","odysseyDesignTokens","HueNeutralWhite","maxWidth","SIDE_NAV_WIDTH","right","StyledMenuLogo","alignItems","gap","Spacing3","StyledLogoContainer","TOP_NAV_HEIGHT","paddingBlock","Spacing4","maxHeight","StyledPageOverlay","hexToRgb","HueNeutral900","asFormattedString","replace","left","top","StyledSideNavContainer","StyledUiShellContainer","HueNeutral50","StyledTopNav","isContentScrolled","topNavBackgroundColor","boxShadow","DepthMedium","undefined","clipPath","flexDirection","justifyContent","transition","TransitionDurationMain","TransitionTimingMain","StyledTopNavMenu","minHeight","Spacing2","paddingInline","borderBottomColor","HueNeutral100","borderBottomStyle","BorderStyleMain","borderBottomWidth","BorderWidthMain","StyledTopNavSearch","NarrowUiShellContent","appElement","appElementScrollingMode","hasStandardAppContentPadding","initialVisibleSections","onError","console","error","optionalComponents","sideNavProps","topNavProps","useOdysseyDesignTokens","uiShellContext","useUiShellContext","useScrollState","sideNavContainerRef","useRef","topNavContainerRef","uiShellAppAreaRef","isLeftSideMenuOpen","setIsLeftSideMenuOpen","useState","isRightSideMenuOpen","setIsRightSideMenuOpen","closeSideMenus","useCallback","useEffect","unsubscribeFromCloseRightSideMenu","subscribeToCloseRightSideMenu","unsubscribeFromSideNavItemClicked","subscribeToCloseSideNavMenu","toggleLeftSideMenu","toggleRightSideMenu","parentContainerRef","useMatchAppElementToUiShellAppArea","paddingMode","uiShellResizableRefs","jsxs","Fragment","children","jsx","onClick","ref","banners","includes","ErrorBoundary","fallback","sideNavBackgroundColor","isCollapsible","isCollapsed","Button","startIcon","HamburgerMenuIcon","testId","variant","isLoading","_Skeleton2","SideNavLogo","logoProps","rightSideMenu","CloseIcon","MoreIcon","topNavLeftSide","SideNav","sideNavItems","emptySideNavItems","appName","hasCustomFooter","sideNavFooter","footerComponent","footerItems","isObtrusive","tabIndex","MemoizedNarrowUiShellContent","exports","memo","displayName"],"sources":["../../../src/ui-shell/NarrowUiShellContent.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { Skeleton } from \"@mui/material\";\nimport {\n CSSProperties,\n memo,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport { ErrorBoundary } from \"react-error-boundary\";\n\nimport { Button } from \"../Buttons/Button.js\";\nimport type { HtmlProps } from \"../HtmlProps.js\";\nimport { CloseIcon } from \"../icons.generated/Close.js\";\nimport { MoreIcon } from \"../icons.generated/More.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext.js\";\nimport { SideNav } from \"./SideNav/SideNav.js\";\nimport { SideNavLogo } from \"./SideNav/SideNavLogo.js\";\nimport { HamburgerMenuIcon } from \"./TopNav/HamburgerMenuIcon.js\";\nimport { UiShellColors, useUiShellContext } from \"./UiShellProvider.js\";\nimport {\n UiShellNavComponentProps,\n UiShellContentProps,\n} from \"./uiShellContentTypes.js\";\nimport {\n emptySideNavItems,\n SIDE_NAV_WIDTH,\n TOP_NAV_HEIGHT,\n UI_SHELL_BASE_Z_INDEX,\n} from \"./uiShellSharedConstants.js\";\nimport { useScrollState } from \"./useScrollState.js\";\nimport { useMatchAppElementToUiShellAppArea } from \"./useMatchAppElementToUiShellAppArea.js\";\nimport { hexToRgb } from \"../hexToRgb.js\";\n\nconst StyledAppContentArea = styled(\"div\")({\n gridArea: \"app-content\",\n position: \"relative\",\n display: \"grid\",\n gridGap: 0,\n gridTemplateAreas: `\n \"left-side app-container right-side\"\n `,\n gridTemplateColumns: \"auto 1fr auto\",\n gridTemplateRows: \"1fr\",\n height: \"100%\",\n width: \"100%\",\n});\n\nconst StyledAppContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"appBackgroundColor\" && prop !== \"odysseyDesignTokens\",\n})<{\n appBackgroundColor?: UiShellColors[\"appBackgroundColor\"];\n}>(({ appBackgroundColor }) => ({\n backgroundColor: appBackgroundColor,\n height: \"100%\",\n gridArea: \"app-container\",\n overflow: \"hidden\",\n width: \"100%\",\n}));\n\nconst StyledBannersContainer = styled(\"div\")({\n gridArea: \"banners\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n});\n\nconst StyledLeftSideContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"isOpen\",\n})<{\n isOpen: boolean;\n}>(({ isOpen }) => ({\n display: isOpen ? \"block\" : \"none\",\n height: \"100%\",\n gridArea: \"left-side\",\n overflowY: \"auto\",\n position: \"absolute\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledRightSideContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"isOpen\" && prop !== \"odysseyDesignTokens\",\n})<{\n isOpen: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ isOpen, odysseyDesignTokens }) => ({\n backgroundColor: odysseyDesignTokens.HueNeutralWhite,\n display: isOpen ? \"block\" : \"none\",\n gridArea: \"right-side\",\n height: \"100%\",\n maxWidth: SIDE_NAV_WIDTH,\n overflowY: \"auto\",\n position: \"absolute\",\n right: 0,\n width: SIDE_NAV_WIDTH,\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledMenuLogo = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n alignItems: \"center\",\n display: \"inline-flex\",\n gap: odysseyDesignTokens.Spacing3,\n}));\n\nconst StyledLogoContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n height: TOP_NAV_HEIGHT,\n paddingBlock: odysseyDesignTokens.Spacing4,\n\n \"svg, img\": {\n maxHeight: \"100%\",\n width: \"auto\",\n maxWidth: \"100%\",\n },\n}));\n\nconst StyledPageOverlay = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n backgroundColor: hexToRgb(\n odysseyDesignTokens.HueNeutral900,\n ).asFormattedString.replace(/rgb\\((.+)\\)$/, \"rgba($1, 0.26)\"),\n gridArea: \"app-content\",\n height: \"100vh\",\n left: 0,\n position: \"absolute\",\n top: 0,\n width: \"100vw\",\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledSideNavContainer = styled(\"div\")({\n height: \"100%\", // Without this value, side nav won't fill up the height if the content is too short.\n});\n\nconst StyledUiShellContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n backgroundColor: odysseyDesignTokens.HueNeutral50,\n display: \"grid\",\n gridGap: 0,\n gridTemplateAreas: `\n \"banners\"\n \"top-nav\"\n \"app-content\"\n `,\n gridTemplateColumns: \"1fr\",\n gridTemplateRows: \"auto auto 1fr\",\n height: \"100vh\",\n overflow: \"hidden\",\n width: \"100vw\",\n}));\n\nconst StyledTopNav = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"isContentScrolled\" &&\n prop !== \"topNavBackgroundColor\",\n})<{\n isContentScrolled?: boolean;\n odysseyDesignTokens: DesignTokens;\n topNavBackgroundColor?: UiShellColors[\"topNavBackgroundColor\"];\n}>(({ odysseyDesignTokens, isContentScrolled, topNavBackgroundColor }) => ({\n alignItems: \"stretch\",\n backgroundColor: odysseyDesignTokens.HueNeutralWhite || topNavBackgroundColor, // This logic doesn't make sense, but I wanted to leave it here for when we eventually make a decision on `topNavBackgroundColor`. --Kevin Ghadyani\n boxShadow: isContentScrolled ? odysseyDesignTokens.DepthMedium : undefined,\n clipPath: \"inset(0 0 -100vh 0)\",\n display: \"flex\",\n flexDirection: \"column\",\n gridArea: \"top-nav\",\n height: \"100%\",\n justifyContent: \"center\",\n position: \"relative\",\n transition: `box-shadow ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n zIndex: UI_SHELL_BASE_Z_INDEX,\n}));\n\nconst StyledTopNavMenu = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"topNavBackgroundColor\",\n})<{\n odysseyDesignTokens: DesignTokens;\n topNavBackgroundColor?: UiShellColors[\"topNavBackgroundColor\"];\n}>(({ odysseyDesignTokens, topNavBackgroundColor }) => ({\n alignItems: \"center\",\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing3,\n height: \"100%\",\n justifyContent: \"space-between\",\n maxHeight: TOP_NAV_HEIGHT,\n minHeight: TOP_NAV_HEIGHT,\n paddingBlock: odysseyDesignTokens.Spacing2,\n paddingInline: odysseyDesignTokens.Spacing3,\n transition: `box-shadow ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n\n ...(topNavBackgroundColor === odysseyDesignTokens.HueNeutralWhite &&\n ({\n borderBottomColor: odysseyDesignTokens.HueNeutral100,\n borderBottomStyle: odysseyDesignTokens.BorderStyleMain,\n borderBottomWidth: odysseyDesignTokens.BorderWidthMain,\n } as CSSProperties)),\n}));\n\nconst StyledTopNavSearch = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n paddingBlock: odysseyDesignTokens.Spacing2,\n paddingInline: odysseyDesignTokens.Spacing3,\n}));\n\nexport type NarrowUiShellContentProps = Pick<HtmlProps, \"testId\"> &\n Pick<UiShellNavComponentProps, \"sideNavProps\" | \"topNavProps\"> &\n UiShellContentProps;\n\nconst NarrowUiShellContent = ({\n appElement,\n appElementScrollingMode,\n hasStandardAppContentPadding = true,\n initialVisibleSections = [\"TopNav\", \"SideNav\", \"AppSwitcher\"],\n onError = console.error,\n optionalComponents,\n sideNavProps,\n topNavProps,\n}: NarrowUiShellContentProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const uiShellContext = useUiShellContext();\n\n const { isContentScrolled } = useScrollState(appElement);\n\n const sideNavContainerRef = useRef<HTMLDivElement>(null);\n const topNavContainerRef = useRef<HTMLDivElement>(null);\n const uiShellAppAreaRef = useRef<HTMLDivElement>(null);\n\n const [isLeftSideMenuOpen, setIsLeftSideMenuOpen] = useState(false);\n const [isRightSideMenuOpen, setIsRightSideMenuOpen] = useState(false);\n\n const closeSideMenus = useCallback(() => {\n setIsLeftSideMenuOpen(false);\n setIsRightSideMenuOpen(false);\n }, []);\n\n useEffect(() => {\n const unsubscribeFromCloseRightSideMenu =\n uiShellContext?.subscribeToCloseRightSideMenu(() => {\n closeSideMenus();\n });\n\n const unsubscribeFromSideNavItemClicked =\n uiShellContext?.subscribeToCloseSideNavMenu(() => {\n closeSideMenus();\n });\n\n return () => {\n unsubscribeFromCloseRightSideMenu?.();\n unsubscribeFromSideNavItemClicked?.();\n };\n }, [closeSideMenus, uiShellContext]);\n\n const toggleLeftSideMenu = useCallback(() => {\n setIsRightSideMenuOpen(false);\n setIsLeftSideMenuOpen((isLeftSideMenuOpen) => !isLeftSideMenuOpen);\n }, []);\n\n const toggleRightSideMenu = useCallback(() => {\n setIsLeftSideMenuOpen(false);\n setIsRightSideMenuOpen((isRightSideMenuOpen) => !isRightSideMenuOpen);\n }, []);\n\n const { parentContainerRef } = useMatchAppElementToUiShellAppArea({\n appElement,\n appElementScrollingMode,\n paddingMode: hasStandardAppContentPadding ? \"compact\" : \"none\",\n uiShellAppAreaRef,\n uiShellResizableRefs: [\n sideNavContainerRef,\n topNavContainerRef,\n uiShellAppAreaRef,\n ],\n });\n\n return (\n <>\n {(isLeftSideMenuOpen || isRightSideMenuOpen) && (\n <StyledPageOverlay\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={closeSideMenus}\n />\n )}\n\n <StyledUiShellContainer\n odysseyDesignTokens={odysseyDesignTokens}\n ref={parentContainerRef}\n >\n <StyledBannersContainer>\n {optionalComponents?.banners}\n </StyledBannersContainer>\n\n {(initialVisibleSections?.includes(\"TopNav\") || topNavProps) && (\n <ErrorBoundary fallback={null} onError={onError}>\n <StyledTopNav\n isContentScrolled={isContentScrolled}\n odysseyDesignTokens={odysseyDesignTokens}\n topNavBackgroundColor={uiShellContext?.topNavBackgroundColor}\n >\n <StyledTopNavMenu\n odysseyDesignTokens={odysseyDesignTokens}\n topNavBackgroundColor={uiShellContext?.sideNavBackgroundColor}\n >\n <StyledMenuLogo odysseyDesignTokens={odysseyDesignTokens}>\n {(sideNavProps?.isCollapsible ||\n !sideNavProps?.isCollapsed) && (\n <Button\n onClick={toggleLeftSideMenu}\n startIcon={<HamburgerMenuIcon />}\n testId=\"sidenav-menu--icon\"\n variant=\"floating\"\n />\n )}\n\n <StyledLogoContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {sideNavProps?.isLoading ? (\n // The skeleton takes the hardcoded dimensions of the Okta logo\n <Skeleton variant=\"rounded\" height={24} width={67} />\n ) : (\n <SideNavLogo {...sideNavProps?.logoProps} />\n )}\n </StyledLogoContainer>\n </StyledMenuLogo>\n\n {optionalComponents?.rightSideMenu && (\n <Button\n onClick={toggleRightSideMenu}\n startIcon={\n isRightSideMenuOpen ? <CloseIcon /> : <MoreIcon />\n }\n testId=\"userprofile-menu--icon\"\n variant=\"floating\"\n />\n )}\n </StyledTopNavMenu>\n\n {optionalComponents?.topNavLeftSide && (\n <StyledTopNavSearch odysseyDesignTokens={odysseyDesignTokens}>\n {optionalComponents?.topNavLeftSide}\n </StyledTopNavSearch>\n )}\n </StyledTopNav>\n </ErrorBoundary>\n )}\n\n <StyledAppContentArea>\n <StyledLeftSideContainer isOpen={isLeftSideMenuOpen}>\n {\n /* If SideNav should be initially visible and we have not yet received props, render SideNav with minimal inputs */\n initialVisibleSections?.includes(\"SideNav\") &&\n sideNavProps === undefined && (\n <ErrorBoundary fallback={null} onError={onError}>\n <SideNav isLoading sideNavItems={emptySideNavItems} />\n </ErrorBoundary>\n )\n }\n\n {sideNavProps && (\n <ErrorBoundary fallback={null} onError={onError}>\n <StyledSideNavContainer>\n <SideNav\n {...{\n ...{\n ...sideNavProps,\n // This hides the side nav logo or app name from showing up as we already have one in the narrow top nav.\n appName: undefined,\n logoProps: undefined,\n },\n ...(sideNavProps.hasCustomFooter &&\n optionalComponents?.sideNavFooter\n ? {\n footerComponent: optionalComponents.sideNavFooter,\n footerItems: undefined,\n hasCustomFooter: sideNavProps.hasCustomFooter,\n }\n : {\n footerItems: sideNavProps.footerItems,\n hasCustomFooter: false,\n }),\n }}\n isCollapsed={false}\n isCollapsible={false}\n isObtrusive\n />\n </StyledSideNavContainer>\n </ErrorBoundary>\n )}\n </StyledLeftSideContainer>\n\n <StyledRightSideContainer\n isOpen={isRightSideMenuOpen}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <StyledSideNavContainer>\n {optionalComponents?.rightSideMenu}\n </StyledSideNavContainer>\n </StyledRightSideContainer>\n\n <StyledAppContainer\n appBackgroundColor={uiShellContext?.appBackgroundColor}\n tabIndex={0}\n ref={uiShellAppAreaRef}\n />\n </StyledAppContentArea>\n </StyledUiShellContainer>\n </>\n );\n};\n\nconst MemoizedNarrowUiShellContent = memo(NarrowUiShellContent);\nMemoizedNarrowUiShellContent.displayName = \"NarrowUiShellContent\";\n\nexport { MemoizedNarrowUiShellContent as NarrowUiShellContent };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -367,7 +367,7 @@ const SideNav = ({
|
|
|
367
367
|
});
|
|
368
368
|
updateSideNavItemsList(updatedSideNavItems);
|
|
369
369
|
if (isCollapsed || isObtrusive) {
|
|
370
|
-
uiShellContext?.
|
|
370
|
+
uiShellContext?.closeSideNavMenu();
|
|
371
371
|
}
|
|
372
372
|
}, [isCollapsed, isObtrusive, sideNavItemsList, uiShellContext]);
|
|
373
373
|
const processedSideNavItems = (0, _react.useMemo)(() => {
|
|
@@ -414,7 +414,7 @@ const SideNav = ({
|
|
|
414
414
|
}, [sideNavExpandClickHandler]);
|
|
415
415
|
(0, _react.useEffect)(() => {
|
|
416
416
|
if (isCollapsed) {
|
|
417
|
-
const unsubscribe = uiShellContext?.
|
|
417
|
+
const unsubscribe = uiShellContext?.subscribeToCloseSideNavMenu(() => {
|
|
418
418
|
onCollapse?.();
|
|
419
419
|
setIsSideNavCollapsed(true);
|
|
420
420
|
});
|