npm - @okta/odyssey-react-mui - Versions diffs - 1.56.0 → 1.57.0 - Mend

@okta/odyssey-react-mui 1.56.0 → 1.57.0

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

Files changed (1151) hide show

package/dist/esm/labs/OdysseyPickers/PickerVirtualizationListBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PickerVirtualizationListBox.js","names":["styled","Children","createContext","forwardRef","memo","useCallback","useContext","useEffect","useMemo","useRef","useState","VariableSizeList","jsx","_jsx","ListboxContainer","div","width","height","Row","data","index","setItemSize","style","rowRef","current","firstChild","firstElementChild","clientHeight","baseOption","props","styles","ref","children","OuterListboxContext","OuterListboxElementType","outerProps","useResetCache","length","resetCacheRef","resetAfterIndex","PickerVirtualizationListBox","listHeight","setListHeight","other","itemData","toArray","flatMap","child","concat","sizeMapRef","getListBoxHeight","COMBINED_LISTBOX_PADDING","OVERSCAN_ROW_COUNT","itemsHeightCalculated","slice","map","_","reduce","prevItemHeight","nextItemHeight","gridRef","size","getItemSize","Provider","value","innerElementType","itemCount","itemSize","outerElementType","overscanCount","MemoizedPickerVirtualizationListBox","displayName"],"sources":["../../../../src/labs/OdysseyPickers/PickerVirtualizationListBox.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 styled from \"@emotion/styled\";\nimport { AutocompleteProps } from \"@mui/material\";\nimport {\n Children,\n createContext,\n forwardRef,\n memo,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { ListChildComponentProps, VariableSizeList } from \"react-window\";\n\ntype SetItemSize = (size: number) => void;\n\nconst ListboxContainer = styled.div({\n width: \"100%\",\n height: \"100%\",\n});\n\nconst Row = <Data extends { key: string; props: Record<string, unknown> }[]>({\n data,\n index,\n setItemSize,\n style,\n}: ListChildComponentProps<Data> & { setItemSize: SetItemSize }) => {\n const rowRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (rowRef.current) {\n /\n Checking for child height to workaround a bug where the clientHeight of the row isn't updated correctly\n * @see here if you need to know more: https://github.com/bvaughn/react-window/issues/582#issuecomment-1883074908\n /\n const firstChild = rowRef.current.firstElementChild;\n const height = firstChild\n ? firstChild.clientHeight\n : rowRef.current.clientHeight;\n\n setItemSize(height);\n }\n }, [index, rowRef, setItemSize]);\n\n const baseOption = data[index];\n const { props } = baseOption;\n\n /\n react-window calculates the absolute positions of the list items, via an inline style, so\n * we need to add it to each list item that is being rendered in the viewable list window.\n * @see here if you need to know more: https://github.com/bvaughn/react-window?tab=readme-ov-file#why-is-my-list-blank-when-i-scroll\n */\n const styles = useMemo(\n () => ({\n ...style,\n height: \"auto\",\n }),\n [style],\n );\n\n return (\n <div ref={rowRef}>\n <li {...props} style={styles} />\n </div>\n );\n};\n\nconst OuterListboxContext = createContext({});\n\nconst OuterListboxElementType = forwardRef<HTMLDivElement>((props, ref) => {\n const outerProps = useContext(OuterListboxContext);\n return <div ref={ref} {...props} {...outerProps} />;\n});\n\nconst useResetCache = (length: number) => {\n const resetCacheRef = useRef<VariableSizeList>(null);\n useEffect(() => {\n if (resetCacheRef.current) {\n resetCacheRef.current.resetAfterIndex(0, true);\n }\n }, [length]);\n return resetCacheRef;\n};\n\nconst PickerVirtualizationListBox = forwardRef<\n HTMLDivElement,\n AutocompleteProps<undefined, undefined, undefined, undefined>[\"ListboxProps\"]\n>((props = {}, ref) => {\n const [listHeight, setListHeight] = useState(0);\n\n const { children, ...other } = props;\n\n const itemData = Children.toArray(children).flatMap<typeof children>(\n (child) =>\n typeof child === \"number\" \|\| typeof child === \"string\"\n ? [child]\n : [child].concat(\"children\" in child ? Children.toArray(children) : []),\n );\n\n const sizeMapRef = useRef<number[]>([]);\n\n const getListBoxHeight = useCallback(() => {\n // 8px of padding top/bottom applied by MUI\n const COMBINED_LISTBOX_PADDING = 16;\n\n if (itemData.length > OVERSCAN_ROW_COUNT) {\n // has a max-height of 40vh set in CSS. This is only set because height needs to be a number\n return 9999;\n } else {\n const itemsHeightCalculated = sizeMapRef.current\n .slice(0, itemData.length)\n .map((_, index) => sizeMapRef.current[index] \|\| 0)\n .reduce(\n (prevItemHeight, nextItemHeight) => prevItemHeight + nextItemHeight,\n 0,\n );\n return COMBINED_LISTBOX_PADDING + itemsHeightCalculated;\n }\n }, [itemData, sizeMapRef]);\n\n useEffect(() => {\n if (sizeMapRef.current.length && itemData.length) {\n setListHeight(getListBoxHeight());\n }\n }, [getListBoxHeight, itemData, sizeMapRef]);\n\n // The number of items (rows or columns) to render outside of the visible area for performance and scrolling reasons\n const OVERSCAN_ROW_COUNT = 8;\n\n const gridRef = useResetCache(itemData.length);\n\n const setItemSize = useCallback<SetItemSize>(\n (size) => {\n gridRef?.current?.resetAfterIndex(0, true);\n sizeMapRef.current = sizeMapRef.current.concat(size);\n },\n [gridRef, sizeMapRef],\n );\n const getItemSize = useCallback(\n // using 45px as a sane default here to avoid a lot of content shift on repaint\n (index: number) => sizeMapRef.current[index] \|\| 45,\n [sizeMapRef],\n );\n\n return (\n <ListboxContainer ref={ref}>\n <OuterListboxContext.Provider value={other}>\n <VariableSizeList\n height={listHeight}\n innerElementType=\"ul\"\n itemCount={itemData.length}\n itemData={itemData}\n itemSize={getItemSize}\n outerElementType={OuterListboxElementType}\n overscanCount={OVERSCAN_ROW_COUNT}\n ref={gridRef}\n width=\"100%\"\n >\n {({ data, index, style }) => (\n <Row\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n data={data}\n index={index}\n setItemSize={setItemSize}\n style={style}\n />\n )}\n </VariableSizeList>\n </OuterListboxContext.Provider>\n </ListboxContainer>\n );\n});\n\nconst MemoizedPickerVirtualizationListBox = memo(PickerVirtualizationListBox);\n\nMemoizedPickerVirtualizationListBox.displayName = \"PickerVirtualizationListBox\";\n\nexport { MemoizedPickerVirtualizationListBox as PickerVirtualizationListBox };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"PickerVirtualizationListBox.js","names":["styled","Children","createContext","forwardRef","memo","useCallback","useContext","useEffect","useMemo","useRef","useState","VariableSizeList","jsx","_jsx","ListboxContainer","div","width","height","Row","data","index","setItemSize","style","rowRef","current","firstChild","firstElementChild","clientHeight","baseOption","props","styles","ref","children","OuterListboxContext","OuterListboxElementType","outerProps","useResetCache","length","resetCacheRef","resetAfterIndex","PickerVirtualizationListBox","listHeight","setListHeight","other","itemData","toArray","flatMap","child","concat","sizeMapRef","getListBoxHeight","COMBINED_LISTBOX_PADDING","OVERSCAN_ROW_COUNT","itemsHeightCalculated","slice","map","_","reduce","prevItemHeight","nextItemHeight","gridRef","size","getItemSize","Provider","value","innerElementType","itemCount","itemSize","outerElementType","overscanCount","MemoizedPickerVirtualizationListBox","displayName"],"sources":["../../../../src/labs/OdysseyPickers/PickerVirtualizationListBox.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 styled from \"@emotion/styled\";\nimport { AutocompleteProps } from \"@mui/material\";\nimport {\n Children,\n createContext,\n forwardRef,\n memo,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { ListChildComponentProps, VariableSizeList } from \"react-window\";\n\ntype SetItemSize = (size: number) => void;\n\nconst ListboxContainer = styled.div({\n width: \"100%\",\n height: \"100%\",\n});\n\nconst Row = <Data extends { key: string; props: Record<string, unknown> }[]>({\n data,\n index,\n setItemSize,\n style,\n}: ListChildComponentProps<Data> & { setItemSize: SetItemSize }) => {\n const rowRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (rowRef.current) {\n /\n Checking for child height to workaround a bug where the clientHeight of the row isn't updated correctly\n * @see here if you need to know more: https://github.com/bvaughn/react-window/issues/582#issuecomment-1883074908\n /\n const firstChild = rowRef.current.firstElementChild;\n const height = firstChild\n ? firstChild.clientHeight\n : rowRef.current.clientHeight;\n\n setItemSize(height);\n }\n }, [index, rowRef, setItemSize]);\n\n const baseOption = data[index];\n const { props } = baseOption;\n\n /\n react-window calculates the absolute positions of the list items, via an inline style, so\n * we need to add it to each list item that is being rendered in the viewable list window.\n * @see here if you need to know more: https://github.com/bvaughn/react-window?tab=readme-ov-file#why-is-my-list-blank-when-i-scroll\n */\n const styles = useMemo(\n () => ({\n ...style,\n height: \"auto\",\n }),\n [style],\n );\n\n return (\n <div ref={rowRef}>\n <li {...props} style={styles} />\n </div>\n );\n};\n\nconst OuterListboxContext = createContext({});\n\nconst OuterListboxElementType = forwardRef<HTMLDivElement>((props, ref) => {\n const outerProps = useContext(OuterListboxContext);\n return <div ref={ref} {...props} {...outerProps} />;\n});\n\nconst useResetCache = (length: number) => {\n const resetCacheRef = useRef<VariableSizeList>(null);\n useEffect(() => {\n if (resetCacheRef.current) {\n resetCacheRef.current.resetAfterIndex(0, true);\n }\n }, [length]);\n return resetCacheRef;\n};\n\nconst PickerVirtualizationListBox = forwardRef<\n HTMLDivElement,\n AutocompleteProps<undefined, undefined, undefined, undefined>[\"ListboxProps\"]\n>((props = {}, ref) => {\n const [listHeight, setListHeight] = useState(0);\n\n const { children, ...other } = props;\n\n const itemData = Children.toArray(children).flatMap<typeof children>(\n (child) =>\n typeof child === \"number\" \|\| typeof child === \"string\"\n ? [child]\n : [child].concat(\"children\" in child ? Children.toArray(children) : []),\n );\n\n const sizeMapRef = useRef<number[]>([]);\n\n const getListBoxHeight = useCallback(() => {\n // 8px of padding top/bottom applied by MUI\n const COMBINED_LISTBOX_PADDING = 16;\n\n if (itemData.length > OVERSCAN_ROW_COUNT) {\n // has a max-height of 40vh set in CSS. This is only set because height needs to be a number\n return 9999;\n } else {\n const itemsHeightCalculated = sizeMapRef.current\n .slice(0, itemData.length)\n .map((_, index) => sizeMapRef.current[index] \|\| 0)\n .reduce(\n (prevItemHeight, nextItemHeight) => prevItemHeight + nextItemHeight,\n 0,\n );\n return COMBINED_LISTBOX_PADDING + itemsHeightCalculated;\n }\n }, [itemData, sizeMapRef]);\n\n useEffect(() => {\n if (sizeMapRef.current.length && itemData.length) {\n setListHeight(getListBoxHeight());\n }\n }, [getListBoxHeight, itemData, sizeMapRef]);\n\n // The number of items (rows or columns) to render outside of the visible area for performance and scrolling reasons\n const OVERSCAN_ROW_COUNT = 8;\n\n const gridRef = useResetCache(itemData.length);\n\n const setItemSize = useCallback<SetItemSize>(\n (size) => {\n gridRef?.current?.resetAfterIndex(0, true);\n sizeMapRef.current = sizeMapRef.current.concat(size);\n },\n [gridRef, sizeMapRef],\n );\n const getItemSize = useCallback(\n // using 45px as a sane default here to avoid a lot of content shift on repaint\n (index: number) => sizeMapRef.current[index] \|\| 45,\n [sizeMapRef],\n );\n\n return (\n <ListboxContainer ref={ref}>\n <OuterListboxContext.Provider value={other}>\n <VariableSizeList\n height={listHeight}\n innerElementType=\"ul\"\n itemCount={itemData.length}\n itemData={itemData}\n itemSize={getItemSize}\n outerElementType={OuterListboxElementType}\n overscanCount={OVERSCAN_ROW_COUNT}\n ref={gridRef}\n width=\"100%\"\n >\n {({ data, index, style }) => (\n <Row\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n data={data}\n index={index}\n setItemSize={setItemSize}\n style={style}\n />\n )}\n </VariableSizeList>\n </OuterListboxContext.Provider>\n </ListboxContainer>\n );\n});\n\nconst MemoizedPickerVirtualizationListBox = memo(PickerVirtualizationListBox);\n\nMemoizedPickerVirtualizationListBox.displayName = \"PickerVirtualizationListBox\";\n\nexport { MemoizedPickerVirtualizationListBox as PickerVirtualizationListBox };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/OdysseyPickers/PickerWithOptionAdornment.js CHANGED Viewed

@@ -291,6 +291,6 @@ const PickerWithOptionAdornment = ({
   });
 };
 const MemoizedPickerWithOptionAdornment = memo(PickerWithOptionAdornment);
-MemoizedPickerWithOptionAdornment.displayName = "PickerWithOptionAdornment";
+MemoizedPickerWithOptionAdornment.displayName = "PickerWithOptionAdornment::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedPickerWithOptionAdornment as PickerWithOptionAdornment };
 //# sourceMappingURL=PickerWithOptionAdornment.js.map

package/dist/esm/labs/OdysseyPickers/PickerWithOptionAdornment.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PickerWithOptionAdornment.js","names":["styled","Fragment","memo","useCallback","Box","useOdysseyDesignTokens","Tag","pxToRem","Heading6","ComposablePicker","Option","OptionDescriptionComponent","OptionLabelContainer","OptionMetadataComponent","jsx","_jsx","jsxs","_jsxs","OptionAdornmentContainer","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","flexShrink","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","OptionAdornment","adornment","isImageAdornment","children","alt","role","src","OptionWithLabelDescriptionOnly","muiProps","option","description","label","value","hasAdornment","component","OptionWithLabelDescriptionMetadata","metaData","TagAdornment","PickerWithOptionAdornment","ariaDescribedBy","defaultValue","emptyOptionsText","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","values","getTagProps","map","index","key","onDelete","sx","margin","Spacing1","icon","onRemove","customOptionRender","hasMetadata","renderOption","renderTags","MemoizedPickerWithOptionAdornment","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 styled from \"@emotion/styled\";\nimport { AutocompleteProps as MuiAutocompleteProps } from \"@mui/material\";\nimport { FC, Fragment, memo, ReactNode, useCallback } from \"react\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Tag } from \"../../Tag.js\";\nimport { pxToRem } from \"../../theme/pxToRem.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport {\n type AdornmentSize,\n type BasePickerProps,\n ComposablePicker,\n ComposablePickerProps,\n} from \"./ComposablePicker.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\";\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 flexShrink: 0,\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 \"&:has(> img)\": {\n height: `${pxToRem(16)}rem`,\n },\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 alt=\"\" role=\"presentation\" src={adornment} />\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 alt=\"\" role=\"presentation\" src={adornment} />\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> = Omit<\n BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>,\n \"getOptionLabel\" \| \"noOptionsText\"\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 ): ReactNode;\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 ): ReactNode;\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 emptyOptionsText,\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 NonNullable<\n MuiAutocompleteProps<\n OptionType,\n HasMultipleChoices,\n undefined,\n IsCustomValueAllowed\n >[\"renderOption\"]\n >\n >(\n (muiProps, option) => {\n const hasMetadata = \"metaData\" in option && option.metaData;\n\n return (\n <Fragment key={option.value}>\n {hasMetadata ? (\n <OptionWithLabelDescriptionMetadata\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n ) : (\n <OptionWithLabelDescriptionOnly\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n )}\n </Fragment>\n );\n },\n [adornmentSize, odysseyDesignTokens],\n );\n\n return (\n <ComposablePicker<OptionType, HasMultipleChoices, IsCustomValueAllowed>\n ariaDescribedBy={ariaDescribedBy}\n defaultValue={defaultValue}\n emptyOptionsText={emptyOptionsText}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n getIsOptionEqualToValue={getIsOptionEqualToValue}\n groupOptionsBy={groupOptionsBy}\n hasMultipleChoices={hasMultipleChoices}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\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 label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onFocus={onFocus}\n onInputChange={onInputChangeProp}\n options={options}\n renderOption={customOptionRender}\n renderTags={customTagRender}\n testId={testId}\n translate={translate}\n value={value}\n />\n );\n};\n\nconst MemoizedPickerWithOptionAdornment = memo(\n PickerWithOptionAdornment,\n) as PickerWithOptionAdornmentComponentType & Pick<FC, \"displayName\">;\nMemoizedPickerWithOptionAdornment.displayName = \"PickerWithOptionAdornment\";\n\nexport { MemoizedPickerWithOptionAdornment as PickerWithOptionAdornment };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"PickerWithOptionAdornment.js","names":["styled","Fragment","memo","useCallback","Box","useOdysseyDesignTokens","Tag","pxToRem","Heading6","ComposablePicker","Option","OptionDescriptionComponent","OptionLabelContainer","OptionMetadataComponent","jsx","_jsx","jsxs","_jsxs","OptionAdornmentContainer","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","flexShrink","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","OptionAdornment","adornment","isImageAdornment","children","alt","role","src","OptionWithLabelDescriptionOnly","muiProps","option","description","label","value","hasAdornment","component","OptionWithLabelDescriptionMetadata","metaData","TagAdornment","PickerWithOptionAdornment","ariaDescribedBy","defaultValue","emptyOptionsText","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","values","getTagProps","map","index","key","onDelete","sx","margin","Spacing1","icon","onRemove","customOptionRender","hasMetadata","renderOption","renderTags","MemoizedPickerWithOptionAdornment","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 styled from \"@emotion/styled\";\nimport { AutocompleteProps as MuiAutocompleteProps } from \"@mui/material\";\nimport { FC, Fragment, memo, ReactNode, useCallback } from \"react\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Tag } from \"../../Tag.js\";\nimport { pxToRem } from \"../../theme/pxToRem.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport {\n type AdornmentSize,\n type BasePickerProps,\n ComposablePicker,\n ComposablePickerProps,\n} from \"./ComposablePicker.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\";\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 flexShrink: 0,\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 \"&:has(> img)\": {\n height: `${pxToRem(16)}rem`,\n },\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 alt=\"\" role=\"presentation\" src={adornment} />\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 alt=\"\" role=\"presentation\" src={adornment} />\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> = Omit<\n BasePickerProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>,\n \"getOptionLabel\" \| \"noOptionsText\"\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 ): ReactNode;\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 ): ReactNode;\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 emptyOptionsText,\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 NonNullable<\n MuiAutocompleteProps<\n OptionType,\n HasMultipleChoices,\n undefined,\n IsCustomValueAllowed\n >[\"renderOption\"]\n >\n >(\n (muiProps, option) => {\n const hasMetadata = \"metaData\" in option && option.metaData;\n\n return (\n <Fragment key={option.value}>\n {hasMetadata ? (\n <OptionWithLabelDescriptionMetadata\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n ) : (\n <OptionWithLabelDescriptionOnly\n adornmentSize={adornmentSize}\n muiProps={muiProps}\n odysseyDesignTokens={odysseyDesignTokens}\n option={option}\n />\n )}\n </Fragment>\n );\n },\n [adornmentSize, odysseyDesignTokens],\n );\n\n return (\n <ComposablePicker<OptionType, HasMultipleChoices, IsCustomValueAllowed>\n ariaDescribedBy={ariaDescribedBy}\n defaultValue={defaultValue}\n emptyOptionsText={emptyOptionsText}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n getIsOptionEqualToValue={getIsOptionEqualToValue}\n groupOptionsBy={groupOptionsBy}\n hasMultipleChoices={hasMultipleChoices}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\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 label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onFocus={onFocus}\n onInputChange={onInputChangeProp}\n options={options}\n renderOption={customOptionRender}\n renderTags={customTagRender}\n testId={testId}\n translate={translate}\n value={value}\n />\n );\n};\n\nconst MemoizedPickerWithOptionAdornment = memo(\n PickerWithOptionAdornment,\n) as PickerWithOptionAdornmentComponentType & Pick<FC, \"displayName\">;\nMemoizedPickerWithOptionAdornment.displayName = \"PickerWithOptionAdornment\";\n\nexport { MemoizedPickerWithOptionAdornment as PickerWithOptionAdornment };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/OdysseyPickers/SearchDropdown.js CHANGED Viewed

@@ -257,6 +257,6 @@ const SearchDropdown = ({
   });
 };
 const MemoizedSearchDropdown = memo(SearchDropdown);
-MemoizedSearchDropdown.displayName = "MemoizedSearchDropdown";
+MemoizedSearchDropdown.displayName = "MemoizedSearchDropdown::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedSearchDropdown as SearchDropdown };
 //# sourceMappingURL=SearchDropdown.js.map

package/dist/esm/labs/OdysseyPickers/SearchDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchDropdown.js","names":["styled","memo","useCallback","useMemo","useOdysseyDesignTokens","Heading6","ComposablePicker","Option","OptionDescriptionComponent","OptionLabelContainer","OptionMetadataComponent","jsx","_jsx","jsxs","_jsxs","OptionAdornmentContainer","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","marginInlineStart","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","CustomOptionContainer","justifyContent","CustomOptionLeftContainer","OptionAdornment","adornment","isImageAdornment","children","alt","role","src","Extra","content","size","onClick","handleClick","event","stopPropagation","CustomOption","muiProps","option","description","label","metaData","extra","isInteractive","handleOptionClick","preventDefault","extendedMuiProps","undefined","hasAdornment","component","SearchDropdown","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","groupOptionsBy","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","isVirtualizedProp","hint","HintLinkComponent","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","value","testId","translate","customOptionRender","renderOption","MemoizedSearchDropdown","displayName"],"sources":["../../../../src/labs/OdysseyPickers/SearchDropdown.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 styled from \"@emotion/styled\";\nimport { memo, ReactElement, ReactNode, useCallback, useMemo } from \"react\";\n\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport {\n type AdornmentSize,\n type BasePickerProps,\n type BasePickerType,\n type BaseRenderOptionProps,\n ComposablePicker,\n} from \"./ComposablePicker.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\";\n\ntype Adornment = ReactNode \| string;\ntype ExtraType = {\n content: ReactNode \| string;\n onClick: () => void;\n size?: AdornmentSize;\n};\n\ntype AdornmentLabelDescription = LabelDescription & {\n adornment: Adornment;\n extra?: ExtraType;\n isInteractive?: boolean;\n onClick?: () => void;\n};\n\nexport type CustomOptionType = AdornmentLabelDescription & Partial<Metadata>;\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 position?: \"left\" \| \"right\";\n}>(\n ({\n adornmentSize = \"small\",\n isTagContainer = false,\n\n odysseyDesignTokens,\n position = \"left\",\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\n ...(position === \"left\" && {\n marginInlineEnd: odysseyDesignTokens.Spacing3,\n }),\n ...(position === \"right\" && {\n marginInlineStart: odysseyDesignTokens.Spacing3,\n }),\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\ntype ExtraProps = {\n content: Adornment;\n odysseyDesignTokens: DesignTokens;\n onClick: () => void;\n size?: AdornmentSize;\n};\n\nconst CustomOptionContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n display: \"flex\",\n justifyContent: \"space-between\",\n width: \"100%\",\n}));\n\nconst CustomOptionLeftContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n display: \"flex\",\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 <img alt=\"\" role=\"presentation\" src={adornment} />\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 Extra = ({ content, size, odysseyDesignTokens, onClick }: ExtraProps) => {\n const handleClick = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n onClick();\n },\n [onClick],\n );\n\n return (\n <OptionAdornmentContainer\n adornmentSize={size}\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={handleClick}\n >\n {content}\n </OptionAdornmentContainer>\n );\n};\n\nconst CustomOption = <OptionType extends CustomOptionType>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & {\n adornmentSize: AdornmentSize;\n }) => {\n const {\n adornment,\n description,\n label,\n metaData,\n extra,\n onClick,\n isInteractive = true,\n } = option;\n\n const handleOptionClick = useCallback(\n (event: React.MouseEvent) => {\n if (!isInteractive) {\n event.preventDefault();\n return;\n }\n event.stopPropagation();\n onClick?.();\n },\n [onClick, isInteractive],\n );\n\n const extendedMuiProps = useMemo(() => {\n return {\n ...muiProps,\n onClick: isInteractive ? handleOptionClick : undefined,\n \"aria-disabled\": !isInteractive ? \"true\" : undefined,\n role: \"option\",\n } satisfies BaseRenderOptionProps;\n }, [muiProps, isInteractive, handleOptionClick]);\n\n return (\n <Option hasAdornment muiProps={extendedMuiProps}>\n <CustomOptionContainer odysseyDesignTokens={odysseyDesignTokens}>\n <CustomOptionLeftContainer odysseyDesignTokens={odysseyDesignTokens}>\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 {metaData && (\n <OptionMetadataComponent\n metaData={metaData}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n )}\n </div>\n </CustomOptionLeftContainer>\n {extra && (\n <Extra\n content={extra.content}\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={extra.onClick}\n size={extra.size \|\| adornmentSize}\n />\n )}\n </CustomOptionContainer>\n </Option>\n );\n};\n\nexport type SearchDropdownProps<\n OptionType extends CustomOptionType,\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 CustomOptionType,\n HasMultipleChoices extends boolean \| undefined,\n IsCustomValueAllowed extends boolean \| undefined,\n >(\n props: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n <\n OptionType extends CustomOptionType,\n HasMultipleChoices extends boolean \| undefined,\n IsCustomValueAllowed extends boolean \| undefined,\n >(\n props: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n};\n\nconst SearchDropdown: PickerWithOptionAdornmentComponentType = <\n OptionType extends CustomOptionType,\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 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}: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n>) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const customOptionRender = useCallback<\n (props: BaseRenderOptionProps, option: OptionType) => ReactNode\n >(\n (muiProps, option) => {\n return (\n <CustomOption\n adornmentSize={adornmentSize}\n key={option.value}\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 hint={hint}\n HintLinkComponent={HintLinkComponent}\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 label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onFocus={onFocus}\n onInputChange={onInputChangeProp}\n options={options}\n renderOption={customOptionRender}\n testId={testId}\n translate={translate}\n value={value}\n />\n );\n};\n\n// Need the `as BasePickerType` because generics don't get passed through\nconst MemoizedSearchDropdown = memo(SearchDropdown) as BasePickerType;\n\nMemoizedSearchDropdown.displayName = \"MemoizedSearchDropdown\";\n\nexport { MemoizedSearchDropdown as SearchDropdown };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"SearchDropdown.js","names":["styled","memo","useCallback","useMemo","useOdysseyDesignTokens","Heading6","ComposablePicker","Option","OptionDescriptionComponent","OptionLabelContainer","OptionMetadataComponent","jsx","_jsx","jsxs","_jsxs","OptionAdornmentContainer","shouldForwardProp","prop","adornmentSize","isTagContainer","odysseyDesignTokens","position","bottom","alignSelf","width","Spacing5","height","overflow","marginInlineEnd","Spacing3","marginInlineStart","svg","img","top","left","transform","Spacing8","Spacing4","maxHeight","Spacing2","display","CustomOptionContainer","justifyContent","CustomOptionLeftContainer","OptionAdornment","adornment","isImageAdornment","children","alt","role","src","Extra","content","size","onClick","handleClick","event","stopPropagation","CustomOption","muiProps","option","description","label","metaData","extra","isInteractive","handleOptionClick","preventDefault","extendedMuiProps","undefined","hasAdornment","component","SearchDropdown","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","getIsOptionEqualToValue","groupOptionsBy","id","idOverride","inputValue","isCustomValueAllowed","isDisabled","isFullWidth","isLoading","isOptional","isReadOnly","isVirtualized","isVirtualizedProp","hint","HintLinkComponent","name","nameOverride","onBlur","onChange","onChangeProp","onInputChange","onInputChangeProp","onFocus","options","value","testId","translate","customOptionRender","renderOption","MemoizedSearchDropdown","displayName"],"sources":["../../../../src/labs/OdysseyPickers/SearchDropdown.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 styled from \"@emotion/styled\";\nimport { memo, ReactElement, ReactNode, useCallback, useMemo } from \"react\";\n\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Heading6 } from \"../../Typography.js\";\nimport {\n type AdornmentSize,\n type BasePickerProps,\n type BasePickerType,\n type BaseRenderOptionProps,\n ComposablePicker,\n} from \"./ComposablePicker.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\";\n\ntype Adornment = ReactNode \| string;\ntype ExtraType = {\n content: ReactNode \| string;\n onClick: () => void;\n size?: AdornmentSize;\n};\n\ntype AdornmentLabelDescription = LabelDescription & {\n adornment: Adornment;\n extra?: ExtraType;\n isInteractive?: boolean;\n onClick?: () => void;\n};\n\nexport type CustomOptionType = AdornmentLabelDescription & Partial<Metadata>;\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 position?: \"left\" \| \"right\";\n}>(\n ({\n adornmentSize = \"small\",\n isTagContainer = false,\n\n odysseyDesignTokens,\n position = \"left\",\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\n ...(position === \"left\" && {\n marginInlineEnd: odysseyDesignTokens.Spacing3,\n }),\n ...(position === \"right\" && {\n marginInlineStart: odysseyDesignTokens.Spacing3,\n }),\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\ntype ExtraProps = {\n content: Adornment;\n odysseyDesignTokens: DesignTokens;\n onClick: () => void;\n size?: AdornmentSize;\n};\n\nconst CustomOptionContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n display: \"flex\",\n justifyContent: \"space-between\",\n width: \"100%\",\n}));\n\nconst CustomOptionLeftContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(() => ({\n display: \"flex\",\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 <img alt=\"\" role=\"presentation\" src={adornment} />\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 Extra = ({ content, size, odysseyDesignTokens, onClick }: ExtraProps) => {\n const handleClick = useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n onClick();\n },\n [onClick],\n );\n\n return (\n <OptionAdornmentContainer\n adornmentSize={size}\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={handleClick}\n >\n {content}\n </OptionAdornmentContainer>\n );\n};\n\nconst CustomOption = <OptionType extends CustomOptionType>({\n adornmentSize,\n muiProps,\n odysseyDesignTokens,\n option,\n}: BaseOptionProps &\n OptionProps<OptionType> & {\n adornmentSize: AdornmentSize;\n }) => {\n const {\n adornment,\n description,\n label,\n metaData,\n extra,\n onClick,\n isInteractive = true,\n } = option;\n\n const handleOptionClick = useCallback(\n (event: React.MouseEvent) => {\n if (!isInteractive) {\n event.preventDefault();\n return;\n }\n event.stopPropagation();\n onClick?.();\n },\n [onClick, isInteractive],\n );\n\n const extendedMuiProps = useMemo(() => {\n return {\n ...muiProps,\n onClick: isInteractive ? handleOptionClick : undefined,\n \"aria-disabled\": !isInteractive ? \"true\" : undefined,\n role: \"option\",\n } satisfies BaseRenderOptionProps;\n }, [muiProps, isInteractive, handleOptionClick]);\n\n return (\n <Option hasAdornment muiProps={extendedMuiProps}>\n <CustomOptionContainer odysseyDesignTokens={odysseyDesignTokens}>\n <CustomOptionLeftContainer odysseyDesignTokens={odysseyDesignTokens}>\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 {metaData && (\n <OptionMetadataComponent\n metaData={metaData}\n odysseyDesignTokens={odysseyDesignTokens}\n />\n )}\n </div>\n </CustomOptionLeftContainer>\n {extra && (\n <Extra\n content={extra.content}\n odysseyDesignTokens={odysseyDesignTokens}\n onClick={extra.onClick}\n size={extra.size \|\| adornmentSize}\n />\n )}\n </CustomOptionContainer>\n </Option>\n );\n};\n\nexport type SearchDropdownProps<\n OptionType extends CustomOptionType,\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 CustomOptionType,\n HasMultipleChoices extends boolean \| undefined,\n IsCustomValueAllowed extends boolean \| undefined,\n >(\n props: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n <\n OptionType extends CustomOptionType,\n HasMultipleChoices extends boolean \| undefined,\n IsCustomValueAllowed extends boolean \| undefined,\n >(\n props: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n >,\n ): ReactElement;\n};\n\nconst SearchDropdown: PickerWithOptionAdornmentComponentType = <\n OptionType extends CustomOptionType,\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 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}: SearchDropdownProps<\n OptionType,\n HasMultipleChoices,\n IsCustomValueAllowed\n>) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const customOptionRender = useCallback<\n (props: BaseRenderOptionProps, option: OptionType) => ReactNode\n >(\n (muiProps, option) => {\n return (\n <CustomOption\n adornmentSize={adornmentSize}\n key={option.value}\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 hint={hint}\n HintLinkComponent={HintLinkComponent}\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 label={label}\n name={nameOverride}\n onBlur={onBlur}\n onChange={onChangeProp}\n onFocus={onFocus}\n onInputChange={onInputChangeProp}\n options={options}\n renderOption={customOptionRender}\n testId={testId}\n translate={translate}\n value={value}\n />\n );\n};\n\n// Need the `as BasePickerType` because generics don't get passed through\nconst MemoizedSearchDropdown = memo(SearchDropdown) as BasePickerType;\n\nMemoizedSearchDropdown.displayName = \"MemoizedSearchDropdown\";\n\nexport { MemoizedSearchDropdown as SearchDropdown };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/PageTemplate/DocumentationLink.js CHANGED Viewed

@@ -29,6 +29,6 @@ const DocumentationLink = ({
   });
 };
 const MemoizedDocumentationLink = memo(DocumentationLink);
-MemoizedDocumentationLink.displayName = "DocumentationLink";
+MemoizedDocumentationLink.displayName = "DocumentationLink::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedDocumentationLink as DocumentationLink };
 //# sourceMappingURL=DocumentationLink.js.map

package/dist/esm/labs/PageTemplate/DocumentationLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DocumentationLink.js","names":["memo","jsx","_jsx","jsxs","_jsxs","linkVariantValues","DocumentationLink","children","href","icon","target","_Link","className","MemoizedDocumentationLink","displayName"],"sources":["../../../../src/labs/PageTemplate/DocumentationLink.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 { Link as MuiLink } from \"@mui/material\";\nimport { memo, ReactElement, ReactNode } from \"react\";\n\nexport const linkVariantValues = [\"default\", \"monochrome\"] as const;\n\nexport type DocumentationLinkProps = {\n /\n The content within the Link\n /\n children: ReactNode;\n /\n The Link destination\n /\n href: string;\n /\n An optional Icon component at the start of the Link\n /\n icon?: ReactElement;\n /\n The HTML `target` attribute for the Link\n */\n target?:\n \| \"_self\"\n \| \"_blank\"\n \| \"_parent\"\n \| \"_top\"\n \| (string & NonNullable<unknown>);\n};\n\nconst DocumentationLink = ({\n children,\n href,\n icon,\n target,\n}: DocumentationLinkProps) => {\n return (\n <MuiLink href={href} target={target}>\n {icon && <span className=\"Link-icon\">{icon}</span>}\n\n {children}\n </MuiLink>\n );\n};\n\nconst MemoizedDocumentationLink = memo(DocumentationLink);\n\nMemoizedDocumentationLink.displayName = \"DocumentationLink\";\n\nexport { MemoizedDocumentationLink as DocumentationLink };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,QAAiC,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEtD,OAAO,MAAMC,iBAAiB,GAAG,CAAC,SAAS,EAAE,YAAY,CAAU;AA0BnE,MAAMC,iBAAiB,GAAGA,CAAC;EACzBC,QAAQ;EACRC,IAAI;EACJC,IAAI;EACJC;AACsB,CAAC,KAAK;EAC5B,OACEN,KAAA,CAAAO,KAAA;IAASH,IAAI,EAAEA,IAAK;IAACE,MAAM,EAAEA,MAAO;IAAAH,QAAA,GACjCE,IAAI,IAAIP,IAAA;MAAMU,SAAS,EAAC,WAAW;MAAAL,QAAA,EAAEE;IAAI,CAAO,CAAC,EAEjDF,QAAQ;EAAA,CACF,CAAC;AAEd,CAAC;AAED,MAAMM,yBAAyB,GAAGb,IAAI,CAACM,iBAAiB,CAAC;AAEzDO,yBAAyB,CAACC,WAAW,~~GAAG,mBAAmB~~;AAE3D,SAASD,yBAAyB,IAAIP,iBAAiB","ignoreList":[]}
1	+ {"version":3,"file":"DocumentationLink.js","names":["memo","jsx","_jsx","jsxs","_jsxs","linkVariantValues","DocumentationLink","children","href","icon","target","_Link","className","MemoizedDocumentationLink","displayName"],"sources":["../../../../src/labs/PageTemplate/DocumentationLink.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 { Link as MuiLink } from \"@mui/material\";\nimport { memo, ReactElement, ReactNode } from \"react\";\n\nexport const linkVariantValues = [\"default\", \"monochrome\"] as const;\n\nexport type DocumentationLinkProps = {\n /\n The content within the Link\n /\n children: ReactNode;\n /\n The Link destination\n /\n href: string;\n /\n An optional Icon component at the start of the Link\n /\n icon?: ReactElement;\n /\n The HTML `target` attribute for the Link\n */\n target?:\n \| \"_self\"\n \| \"_blank\"\n \| \"_parent\"\n \| \"_top\"\n \| (string & NonNullable<unknown>);\n};\n\nconst DocumentationLink = ({\n children,\n href,\n icon,\n target,\n}: DocumentationLinkProps) => {\n return (\n <MuiLink href={href} target={target}>\n {icon && <span className=\"Link-icon\">{icon}</span>}\n\n {children}\n </MuiLink>\n );\n};\n\nconst MemoizedDocumentationLink = memo(DocumentationLink);\n\nMemoizedDocumentationLink.displayName = \"DocumentationLink\";\n\nexport { MemoizedDocumentationLink as DocumentationLink };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,QAAiC,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEtD,OAAO,MAAMC,iBAAiB,GAAG,CAAC,SAAS,EAAE,YAAY,CAAU;AA0BnE,MAAMC,iBAAiB,GAAGA,CAAC;EACzBC,QAAQ;EACRC,IAAI;EACJC,IAAI;EACJC;AACsB,CAAC,KAAK;EAC5B,OACEN,KAAA,CAAAO,KAAA;IAASH,IAAI,EAAEA,IAAK;IAACE,MAAM,EAAEA,MAAO;IAAAH,QAAA,GACjCE,IAAI,IAAIP,IAAA;MAAMU,SAAS,EAAC,WAAW;MAAAL,QAAA,EAAEE;IAAI,CAAO,CAAC,EAEjDF,QAAQ;EAAA,CACF,CAAC;AAEd,CAAC;AAED,MAAMM,yBAAyB,GAAGb,IAAI,CAACM,iBAAiB,CAAC;AAEzDO,yBAAyB,CAACC,WAAW,mDAAsB;AAE3D,SAASD,yBAAyB,IAAIP,iBAAiB","ignoreList":[]}

package/dist/esm/labs/PageTemplate/Layout.js CHANGED Viewed

@@ -44,6 +44,6 @@ const Layout = ({
   });
 };
 const MemoizedLayout = memo(Layout);
-MemoizedLayout.displayName = "Layout";
+MemoizedLayout.displayName = "Layout::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedLayout as Layout };
 //# sourceMappingURL=Layout.js.map

package/dist/esm/labs/PageTemplate/Layout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Layout.js","names":["styled","Children","memo","Box","useOdysseyDesignTokens","jsx","_jsx","LayoutContent","shouldForwardProp","prop","includes","odysseyDesignTokens","regions","display","gridTemplateColumns","gridGap","Spacing4","gap","marginBlockStart","Layout","children","mappedRegions","map","region","join","toArray","child","MemoizedLayout","displayName"],"sources":["../../../../src/labs/PageTemplate/Layout.tsx"],"sourcesContent":["/!\n Copyright (c) 2024-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 { Children, memo, ReactNode } from \"react\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\n\ntype SupportedRegionRatios =\n \| [1]\n \| [1, 1]\n \| [1, 2]\n \| [2, 1]\n \| [1, 3]\n \| [3, 1]\n \| [1, 1, 1]\n \| [1, 1, 1, 1];\n\nexport type LayoutProps = {\n /\n The content of the Grid. May be a `string` or any other `ReactNode` or array of `ReactNode`s.\n /\n children?: ReactNode;\n /\n The supported region ratios for the Grid. Each number is a fractional unit that is mapped to the 'fr' CSS unit.\n * e.g. [2, 1] defines a 2/3, 1/3 layout and [1, 1, 1] defines a 1/3, 1/3, 1/3 layout\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#the_fr_unit\n */\n regions: SupportedRegionRatios;\n};\n\ninterface LayoutContentProps {\n odysseyDesignTokens: DesignTokens;\n regions: string;\n}\n\nconst LayoutContent = styled(\"div\", {\n shouldForwardProp: (prop) =>\n ![\"odysseyDesignTokens\", \"regions\"].includes(prop),\n})<LayoutContentProps>(({ odysseyDesignTokens, regions }) => ({\n display: \"grid\",\n gridTemplateColumns: regions,\n gridGap: odysseyDesignTokens.Spacing4,\n gap: odysseyDesignTokens.Spacing4,\n\n \"& + &\": {\n marginBlockStart: odysseyDesignTokens.Spacing4,\n },\n}));\n\nconst Layout = ({ regions, children }: LayoutProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const mappedRegions = regions\n .map((region) => `minmax(0, ${region}fr)`)\n .join(\" \");\n\n return (\n <Box>\n <LayoutContent\n odysseyDesignTokens={odysseyDesignTokens}\n regions={mappedRegions}\n >\n {Children.toArray(children).map((child) => child)}\n </LayoutContent>\n </Box>\n );\n};\n\nconst MemoizedLayout = memo(Layout);\nMemoizedLayout.displayName = \"Layout\";\n\nexport { MemoizedLayout as Layout };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,QAAQ,EAAEC,IAAI,QAAmB,OAAO;AAEjD,SAASC,GAAG,QAAQ,cAAc;AAClC,SAEEC,sBAAsB,QACjB,qCAAqC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA8B7C,MAAMC,aAAa,GAAGP,MAAM,CAAC,KAAK,EAAE;EAClCQ,iBAAiB,EAAGC,IAAI,IACtB,CAAC,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAACC,QAAQ,CAACD,IAAI;AACrD,CAAC,CAAC,CAAqB,CAAC;EAAEE,mBAAmB;EAAEC;AAAQ,CAAC,MAAM;EAC5DC,OAAO,EAAE,MAAM;EACfC,mBAAmB,EAAEF,OAAO;EAC5BG,OAAO,EAAEJ,mBAAmB,CAACK,QAAQ;EACrCC,GAAG,EAAEN,mBAAmB,CAACK,QAAQ;EAEjC,OAAO,EAAE;IACPE,gBAAgB,EAAEP,mBAAmB,CAACK;EACxC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMG,MAAM,GAAGA,CAAC;EAAEP,OAAO;EAAEQ;AAAsB,CAAC,KAAK;EACrD,MAAMT,mBAAmB,GAAGP,sBAAsB,CAAC,CAAC;EACpD,MAAMiB,aAAa,GAAGT,OAAO,CAC1BU,GAAG,CAAEC,MAAM,IAAK,aAAaA,MAAM,KAAK,CAAC,CACzCC,IAAI,CAAC,GAAG,CAAC;EAEZ,OACElB,IAAA,CAACH,GAAG;IAAAiB,QAAA,EACFd,IAAA,CAACC,aAAa;MACZI,mBAAmB,EAAEA,mBAAoB;MACzCC,OAAO,EAAES,aAAc;MAAAD,QAAA,EAEtBnB,QAAQ,CAACwB,OAAO,CAACL,QAAQ,CAAC,CAACE,GAAG,CAAEI,KAAK,IAAKA,KAAK;IAAC,CACpC;EAAC,CACb,CAAC;AAEV,CAAC;AAED,MAAMC,cAAc,GAAGzB,IAAI,CAACiB,MAAM,CAAC;AACnCQ,cAAc,CAACC,WAAW,~~GAAG,QAAQ~~;AAErC,SAASD,cAAc,IAAIR,MAAM","ignoreList":[]}
1	+ {"version":3,"file":"Layout.js","names":["styled","Children","memo","Box","useOdysseyDesignTokens","jsx","_jsx","LayoutContent","shouldForwardProp","prop","includes","odysseyDesignTokens","regions","display","gridTemplateColumns","gridGap","Spacing4","gap","marginBlockStart","Layout","children","mappedRegions","map","region","join","toArray","child","MemoizedLayout","displayName"],"sources":["../../../../src/labs/PageTemplate/Layout.tsx"],"sourcesContent":["/!\n Copyright (c) 2024-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 { Children, memo, ReactNode } from \"react\";\n\nimport { Box } from \"../../Box.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\n\ntype SupportedRegionRatios =\n \| [1]\n \| [1, 1]\n \| [1, 2]\n \| [2, 1]\n \| [1, 3]\n \| [3, 1]\n \| [1, 1, 1]\n \| [1, 1, 1, 1];\n\nexport type LayoutProps = {\n /\n The content of the Grid. May be a `string` or any other `ReactNode` or array of `ReactNode`s.\n /\n children?: ReactNode;\n /\n The supported region ratios for the Grid. Each number is a fractional unit that is mapped to the 'fr' CSS unit.\n * e.g. [2, 1] defines a 2/3, 1/3 layout and [1, 1, 1] defines a 1/3, 1/3, 1/3 layout\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Basic_concepts_of_grid_layout#the_fr_unit\n */\n regions: SupportedRegionRatios;\n};\n\ninterface LayoutContentProps {\n odysseyDesignTokens: DesignTokens;\n regions: string;\n}\n\nconst LayoutContent = styled(\"div\", {\n shouldForwardProp: (prop) =>\n ![\"odysseyDesignTokens\", \"regions\"].includes(prop),\n})<LayoutContentProps>(({ odysseyDesignTokens, regions }) => ({\n display: \"grid\",\n gridTemplateColumns: regions,\n gridGap: odysseyDesignTokens.Spacing4,\n gap: odysseyDesignTokens.Spacing4,\n\n \"& + &\": {\n marginBlockStart: odysseyDesignTokens.Spacing4,\n },\n}));\n\nconst Layout = ({ regions, children }: LayoutProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const mappedRegions = regions\n .map((region) => `minmax(0, ${region}fr)`)\n .join(\" \");\n\n return (\n <Box>\n <LayoutContent\n odysseyDesignTokens={odysseyDesignTokens}\n regions={mappedRegions}\n >\n {Children.toArray(children).map((child) => child)}\n </LayoutContent>\n </Box>\n );\n};\n\nconst MemoizedLayout = memo(Layout);\nMemoizedLayout.displayName = \"Layout\";\n\nexport { MemoizedLayout as Layout };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,QAAQ,EAAEC,IAAI,QAAmB,OAAO;AAEjD,SAASC,GAAG,QAAQ,cAAc;AAClC,SAEEC,sBAAsB,QACjB,qCAAqC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA8B7C,MAAMC,aAAa,GAAGP,MAAM,CAAC,KAAK,EAAE;EAClCQ,iBAAiB,EAAGC,IAAI,IACtB,CAAC,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAACC,QAAQ,CAACD,IAAI;AACrD,CAAC,CAAC,CAAqB,CAAC;EAAEE,mBAAmB;EAAEC;AAAQ,CAAC,MAAM;EAC5DC,OAAO,EAAE,MAAM;EACfC,mBAAmB,EAAEF,OAAO;EAC5BG,OAAO,EAAEJ,mBAAmB,CAACK,QAAQ;EACrCC,GAAG,EAAEN,mBAAmB,CAACK,QAAQ;EAEjC,OAAO,EAAE;IACPE,gBAAgB,EAAEP,mBAAmB,CAACK;EACxC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMG,MAAM,GAAGA,CAAC;EAAEP,OAAO;EAAEQ;AAAsB,CAAC,KAAK;EACrD,MAAMT,mBAAmB,GAAGP,sBAAsB,CAAC,CAAC;EACpD,MAAMiB,aAAa,GAAGT,OAAO,CAC1BU,GAAG,CAAEC,MAAM,IAAK,aAAaA,MAAM,KAAK,CAAC,CACzCC,IAAI,CAAC,GAAG,CAAC;EAEZ,OACElB,IAAA,CAACH,GAAG;IAAAiB,QAAA,EACFd,IAAA,CAACC,aAAa;MACZI,mBAAmB,EAAEA,mBAAoB;MACzCC,OAAO,EAAES,aAAc;MAAAD,QAAA,EAEtBnB,QAAQ,CAACwB,OAAO,CAACL,QAAQ,CAAC,CAACE,GAAG,CAAEI,KAAK,IAAKA,KAAK;IAAC,CACpC;EAAC,CACb,CAAC;AAEV,CAAC;AAED,MAAMC,cAAc,GAAGzB,IAAI,CAACiB,MAAM,CAAC;AACnCQ,cAAc,CAACC,WAAW,wCAAW;AAErC,SAASD,cAAc,IAAIR,MAAM","ignoreList":[]}

package/dist/esm/labs/PageTemplate/PageTemplate.js CHANGED Viewed

@@ -163,6 +163,6 @@ const PageTemplate = ({
   });
 };
 const MemoizedPageTemplate = memo(PageTemplate);
-MemoizedPageTemplate.displayName = "PageTemplate";
+MemoizedPageTemplate.displayName = "PageTemplate::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedPageTemplate as PageTemplate };
 //# sourceMappingURL=PageTemplate.js.map

package/dist/esm/labs/PageTemplate/PageTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplate.js","names":["styled","memo","useCallback","useRef","DocumentationIcon","useOdysseyDesignTokens","Heading4","Paragraph","useHasUiShell","useMountLifecycleEffect","DocumentationLink","jsx","_jsx","jsxs","_jsxs","TemplateContainer","shouldForwardProp","prop","hasUiShell","isFullWidth","odysseyDesignTokens","maxWidth","Spacing6","marginInline","padding","TemplateHeader","display","alignItems","justifyContent","gap","Spacing4","TemplateHeaderPrimaryContent","TypographyLineLengthMax","marginBlockEnd","TemplateHeaderSecondaryContent","flexDirection","minHeight","Spacing7","whiteSpace","TemplateHeaderButtons","Spacing2","TemplateContent","includes","drawerVariant","isDrawerOpen","isFirstRender","gridTemplateColumns","gridGap","marginBlock","animation","undefined","PageTemplate","children","description","documentationLink","documentationText","drawer","primaryCallToActionComponent","secondaryCallToActionComponent","tertiaryCallToActionComponent","title","isOpen","variant","props","firstRenderRef","current","onMount","href","icon","target","MemoizedPageTemplate","displayName"],"sources":["../../../../src/labs/PageTemplate/PageTemplate.tsx"],"sourcesContent":["/!\n Copyright (c) 2024-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 { memo, ReactElement, ReactNode, useCallback, useRef } from \"react\";\n\nimport { DrawerProps } from \"../../Drawer.js\";\nimport { DocumentationIcon } from \"../../icons.generated/index.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Heading4, Paragraph } from \"../../Typography.js\";\nimport { useHasUiShell } from \"../../ui-shell/useHasUiShell.js\";\nimport { useMountLifecycleEffect } from \"../../useMountLifecycleEffect.js\";\nimport { DocumentationLink } from \"./DocumentationLink.js\";\n\nexport type PageTemplateProps = {\n /\n The content of the layout. May be a `string` or any other `ReactNode` or array of `ReactNode`s. Will often be `Grid` objects.\n /\n children?: ReactNode;\n /\n A supplementary description to be situated in the layout header\n /\n description?: string;\n /\n The destination for a documentation `Link` to be situated in the layout header\n /\n documentationLink?: string;\n /\n The text for a documentation `Link` to be situated in the layout header\n /\n documentationText?: string;\n /\n An optional `Drawer` object. Can be of variant 'temporary' or 'persistent'.\n /\n drawer?: ReactElement<DrawerProps>;\n /\n When set to `true`, the layout expands past its max width of 1440px and spans the entire available screen width.\n /\n isFullWidth?: boolean;\n /\n An optional `Button` object to be situated in the layout header. Should almost always be of variant `primary`.\n /\n primaryCallToActionComponent?: ReactElement;\n /\n An optional `Button` object to be situated in the layout header, alongside the `callToActionPrimaryComponent`.\n /\n secondaryCallToActionComponent?: ReactElement;\n /\n An optional `Button` object to be situated in the layout header, alongside the other two `callToAction` components.\n /\n tertiaryCallToActionComponent?: ReactElement;\n /\n The title of the layout to be situated in the layout header\n */\n title?: string;\n};\n\ntype TemplateContentProps = {\n drawerVariant?: string;\n isDrawerOpen?: boolean;\n isFirstRender: boolean;\n odysseyDesignTokens: DesignTokens;\n};\n\nconst TemplateContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"hasUiShell\" &&\n prop !== \"isFullWidth\",\n})<{\n hasUiShell: boolean;\n isFullWidth: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ hasUiShell, isFullWidth, odysseyDesignTokens }) => ({\n maxWidth: isFullWidth\n ? \"100%\"\n : `calc(1440px + ${odysseyDesignTokens.Spacing6} + ${odysseyDesignTokens.Spacing6})`,\n marginInline:\n isFullWidth && !hasUiShell ? odysseyDesignTokens.Spacing6 : \"auto\",\n padding: hasUiShell ? 0 : odysseyDesignTokens.Spacing6,\n}));\n\nconst TemplateHeader = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n alignItems: \"flex-start\",\n justifyContent: \"space-between\",\n gap: odysseyDesignTokens.Spacing4,\n}));\n\nconst TemplateHeaderPrimaryContent = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n [\".MuiTypography-root:last-child\"]: {\n marginBlockEnd: \"0\",\n },\n}));\n\nconst TemplateHeaderSecondaryContent = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n alignItems: \"flex-end\",\n display: \"flex\",\n flexDirection: \"column\",\n gap: odysseyDesignTokens.Spacing4,\n minHeight: odysseyDesignTokens.Spacing7,\n justifyContent: \"center\",\n whiteSpace: \"nowrap\",\n}));\n\nconst TemplateHeaderButtons = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing2,\n}));\n\nconst TemplateContent = styled(\"div\", {\n shouldForwardProp: (prop) =>\n ![\n \"drawerVariant\",\n \"isDrawerOpen\",\n \"isFirstRender\",\n \"odysseyDesignTokens\",\n ].includes(prop),\n})<TemplateContentProps>(\n ({ drawerVariant, isDrawerOpen, isFirstRender, odysseyDesignTokens }) => ({\n \"@keyframes animate-drawer-open\": {\n \"0%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 0\",\n },\n \"100%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 360px\",\n },\n },\n \"@keyframes animate-drawer-close\": {\n \"0%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 360px\",\n },\n \"100%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 0\",\n },\n },\n display: \"grid\",\n gridGap:\n drawerVariant === \"persistent\" && !isDrawerOpen\n ? 0\n : odysseyDesignTokens.Spacing4,\n gap:\n drawerVariant === \"persistent\" && !isDrawerOpen\n ? 0\n : odysseyDesignTokens.Spacing4,\n marginBlock: odysseyDesignTokens.Spacing4,\n gridTemplateColumns:\n drawerVariant === \"persistent\"\n ? isDrawerOpen\n ? \"minmax(0, 1fr) 360px\"\n : \"minmax(0, 1fr) 0\"\n : \"minmax(0, 1fr)\",\n animation:\n drawerVariant === \"persistent\" && (!isFirstRender \|\| isDrawerOpen)\n ? `animate-drawer-${isDrawerOpen ? \"open\" : \"close\"} 225ms cubic-bezier(0, 0, 0.2, 1)`\n : undefined,\n }),\n);\n\nconst PageTemplate = ({\n children,\n description,\n documentationLink,\n documentationText,\n drawer,\n isFullWidth = false,\n primaryCallToActionComponent,\n secondaryCallToActionComponent,\n tertiaryCallToActionComponent,\n title,\n}: PageTemplateProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { isOpen: isDrawerOpen, variant: drawerVariant } = drawer?.props ?? {};\n\n const hasUiShell = useHasUiShell();\n\n const firstRenderRef = useRef(true);\n\n const isFirstRender = firstRenderRef.current;\n\n const onMount = useCallback(() => {\n firstRenderRef.current = false;\n }, []);\n\n useMountLifecycleEffect({\n onMount,\n });\n\n return (\n <TemplateContainer\n hasUiShell={hasUiShell}\n isFullWidth={isFullWidth}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <TemplateHeader odysseyDesignTokens={odysseyDesignTokens}>\n <TemplateHeaderPrimaryContent odysseyDesignTokens={odysseyDesignTokens}>\n {title && <Heading4>{title}</Heading4>}\n {description && <Paragraph>{description}</Paragraph>}\n </TemplateHeaderPrimaryContent>\n <TemplateHeaderSecondaryContent\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {documentationLink && (\n <DocumentationLink\n href={documentationLink}\n icon={<DocumentationIcon />}\n target=\"_blank\"\n >\n {documentationText}\n </DocumentationLink>\n )}\n {(primaryCallToActionComponent \|\|\n secondaryCallToActionComponent \|\|\n tertiaryCallToActionComponent) && (\n <TemplateHeaderButtons odysseyDesignTokens={odysseyDesignTokens}>\n {tertiaryCallToActionComponent}\n {secondaryCallToActionComponent}\n {primaryCallToActionComponent}\n </TemplateHeaderButtons>\n )}\n </TemplateHeaderSecondaryContent>\n </TemplateHeader>\n <TemplateContent\n drawerVariant={drawerVariant}\n isDrawerOpen={isDrawerOpen}\n isFirstRender={isFirstRender}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {children}\n {drawer}\n </TemplateContent>\n </TemplateContainer>\n );\n};\n\nconst MemoizedPageTemplate = memo(PageTemplate);\nMemoizedPageTemplate.displayName = \"PageTemplate\";\n\nexport { MemoizedPageTemplate as PageTemplate };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"PageTemplate.js","names":["styled","memo","useCallback","useRef","DocumentationIcon","useOdysseyDesignTokens","Heading4","Paragraph","useHasUiShell","useMountLifecycleEffect","DocumentationLink","jsx","_jsx","jsxs","_jsxs","TemplateContainer","shouldForwardProp","prop","hasUiShell","isFullWidth","odysseyDesignTokens","maxWidth","Spacing6","marginInline","padding","TemplateHeader","display","alignItems","justifyContent","gap","Spacing4","TemplateHeaderPrimaryContent","TypographyLineLengthMax","marginBlockEnd","TemplateHeaderSecondaryContent","flexDirection","minHeight","Spacing7","whiteSpace","TemplateHeaderButtons","Spacing2","TemplateContent","includes","drawerVariant","isDrawerOpen","isFirstRender","gridTemplateColumns","gridGap","marginBlock","animation","undefined","PageTemplate","children","description","documentationLink","documentationText","drawer","primaryCallToActionComponent","secondaryCallToActionComponent","tertiaryCallToActionComponent","title","isOpen","variant","props","firstRenderRef","current","onMount","href","icon","target","MemoizedPageTemplate","displayName"],"sources":["../../../../src/labs/PageTemplate/PageTemplate.tsx"],"sourcesContent":["/!\n Copyright (c) 2024-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 { memo, ReactElement, ReactNode, useCallback, useRef } from \"react\";\n\nimport { DrawerProps } from \"../../Drawer.js\";\nimport { DocumentationIcon } from \"../../icons.generated/index.js\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext.js\";\nimport { Heading4, Paragraph } from \"../../Typography.js\";\nimport { useHasUiShell } from \"../../ui-shell/useHasUiShell.js\";\nimport { useMountLifecycleEffect } from \"../../useMountLifecycleEffect.js\";\nimport { DocumentationLink } from \"./DocumentationLink.js\";\n\nexport type PageTemplateProps = {\n /\n The content of the layout. May be a `string` or any other `ReactNode` or array of `ReactNode`s. Will often be `Grid` objects.\n /\n children?: ReactNode;\n /\n A supplementary description to be situated in the layout header\n /\n description?: string;\n /\n The destination for a documentation `Link` to be situated in the layout header\n /\n documentationLink?: string;\n /\n The text for a documentation `Link` to be situated in the layout header\n /\n documentationText?: string;\n /\n An optional `Drawer` object. Can be of variant 'temporary' or 'persistent'.\n /\n drawer?: ReactElement<DrawerProps>;\n /\n When set to `true`, the layout expands past its max width of 1440px and spans the entire available screen width.\n /\n isFullWidth?: boolean;\n /\n An optional `Button` object to be situated in the layout header. Should almost always be of variant `primary`.\n /\n primaryCallToActionComponent?: ReactElement;\n /\n An optional `Button` object to be situated in the layout header, alongside the `callToActionPrimaryComponent`.\n /\n secondaryCallToActionComponent?: ReactElement;\n /\n An optional `Button` object to be situated in the layout header, alongside the other two `callToAction` components.\n /\n tertiaryCallToActionComponent?: ReactElement;\n /\n The title of the layout to be situated in the layout header\n */\n title?: string;\n};\n\ntype TemplateContentProps = {\n drawerVariant?: string;\n isDrawerOpen?: boolean;\n isFirstRender: boolean;\n odysseyDesignTokens: DesignTokens;\n};\n\nconst TemplateContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"hasUiShell\" &&\n prop !== \"isFullWidth\",\n})<{\n hasUiShell: boolean;\n isFullWidth: boolean;\n odysseyDesignTokens: DesignTokens;\n}>(({ hasUiShell, isFullWidth, odysseyDesignTokens }) => ({\n maxWidth: isFullWidth\n ? \"100%\"\n : `calc(1440px + ${odysseyDesignTokens.Spacing6} + ${odysseyDesignTokens.Spacing6})`,\n marginInline:\n isFullWidth && !hasUiShell ? odysseyDesignTokens.Spacing6 : \"auto\",\n padding: hasUiShell ? 0 : odysseyDesignTokens.Spacing6,\n}));\n\nconst TemplateHeader = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n alignItems: \"flex-start\",\n justifyContent: \"space-between\",\n gap: odysseyDesignTokens.Spacing4,\n}));\n\nconst TemplateHeaderPrimaryContent = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n maxWidth: odysseyDesignTokens.TypographyLineLengthMax,\n [\".MuiTypography-root:last-child\"]: {\n marginBlockEnd: \"0\",\n },\n}));\n\nconst TemplateHeaderSecondaryContent = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n alignItems: \"flex-end\",\n display: \"flex\",\n flexDirection: \"column\",\n gap: odysseyDesignTokens.Spacing4,\n minHeight: odysseyDesignTokens.Spacing7,\n justifyContent: \"center\",\n whiteSpace: \"nowrap\",\n}));\n\nconst TemplateHeaderButtons = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing2,\n}));\n\nconst TemplateContent = styled(\"div\", {\n shouldForwardProp: (prop) =>\n ![\n \"drawerVariant\",\n \"isDrawerOpen\",\n \"isFirstRender\",\n \"odysseyDesignTokens\",\n ].includes(prop),\n})<TemplateContentProps>(\n ({ drawerVariant, isDrawerOpen, isFirstRender, odysseyDesignTokens }) => ({\n \"@keyframes animate-drawer-open\": {\n \"0%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 0\",\n },\n \"100%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 360px\",\n },\n },\n \"@keyframes animate-drawer-close\": {\n \"0%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 360px\",\n },\n \"100%\": {\n gridTemplateColumns: \"minmax(0, 1fr) 0\",\n },\n },\n display: \"grid\",\n gridGap:\n drawerVariant === \"persistent\" && !isDrawerOpen\n ? 0\n : odysseyDesignTokens.Spacing4,\n gap:\n drawerVariant === \"persistent\" && !isDrawerOpen\n ? 0\n : odysseyDesignTokens.Spacing4,\n marginBlock: odysseyDesignTokens.Spacing4,\n gridTemplateColumns:\n drawerVariant === \"persistent\"\n ? isDrawerOpen\n ? \"minmax(0, 1fr) 360px\"\n : \"minmax(0, 1fr) 0\"\n : \"minmax(0, 1fr)\",\n animation:\n drawerVariant === \"persistent\" && (!isFirstRender \|\| isDrawerOpen)\n ? `animate-drawer-${isDrawerOpen ? \"open\" : \"close\"} 225ms cubic-bezier(0, 0, 0.2, 1)`\n : undefined,\n }),\n);\n\nconst PageTemplate = ({\n children,\n description,\n documentationLink,\n documentationText,\n drawer,\n isFullWidth = false,\n primaryCallToActionComponent,\n secondaryCallToActionComponent,\n tertiaryCallToActionComponent,\n title,\n}: PageTemplateProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { isOpen: isDrawerOpen, variant: drawerVariant } = drawer?.props ?? {};\n\n const hasUiShell = useHasUiShell();\n\n const firstRenderRef = useRef(true);\n\n const isFirstRender = firstRenderRef.current;\n\n const onMount = useCallback(() => {\n firstRenderRef.current = false;\n }, []);\n\n useMountLifecycleEffect({\n onMount,\n });\n\n return (\n <TemplateContainer\n hasUiShell={hasUiShell}\n isFullWidth={isFullWidth}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <TemplateHeader odysseyDesignTokens={odysseyDesignTokens}>\n <TemplateHeaderPrimaryContent odysseyDesignTokens={odysseyDesignTokens}>\n {title && <Heading4>{title}</Heading4>}\n {description && <Paragraph>{description}</Paragraph>}\n </TemplateHeaderPrimaryContent>\n <TemplateHeaderSecondaryContent\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {documentationLink && (\n <DocumentationLink\n href={documentationLink}\n icon={<DocumentationIcon />}\n target=\"_blank\"\n >\n {documentationText}\n </DocumentationLink>\n )}\n {(primaryCallToActionComponent \|\|\n secondaryCallToActionComponent \|\|\n tertiaryCallToActionComponent) && (\n <TemplateHeaderButtons odysseyDesignTokens={odysseyDesignTokens}>\n {tertiaryCallToActionComponent}\n {secondaryCallToActionComponent}\n {primaryCallToActionComponent}\n </TemplateHeaderButtons>\n )}\n </TemplateHeaderSecondaryContent>\n </TemplateHeader>\n <TemplateContent\n drawerVariant={drawerVariant}\n isDrawerOpen={isDrawerOpen}\n isFirstRender={isFirstRender}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {children}\n {drawer}\n </TemplateContent>\n </TemplateContainer>\n );\n};\n\nconst MemoizedPageTemplate = memo(PageTemplate);\nMemoizedPageTemplate.displayName = \"PageTemplate\";\n\nexport { MemoizedPageTemplate as PageTemplate };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/PaginatedTable.js CHANGED Viewed

@@ -166,6 +166,6 @@ const PaginatedTable = ({
   });
 };
 const MemoizedPaginatedTable = memo(PaginatedTable);
-MemoizedPaginatedTable.displayName = "PaginatedTable";
+MemoizedPaginatedTable.displayName = "PaginatedTable::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedPaginatedTable as PaginatedTable };
 //# sourceMappingURL=PaginatedTable.js.map

package/dist/esm/labs/PaginatedTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaginatedTable.js","names":["MaterialReactTable","useMaterialReactTable","memo","useCallback","useEffect","useMemo","useRef","useState","Trans","useTranslation","Typography","jsx","_jsx","Fragment","_Fragment","PaginatedTable","columns","data","fetchMoreData","getRowId","hasError","hasRowSelection","initialState","isFetching","onGlobalFilterChange","onPaginationChange","onRowSelectionChange","onRowSelectionChangeProp","rowsPerPage","state","ToolbarButtons","t","rowVirtualizerInstanceRef","columnFilters","setColumnFilters","globalFilter","setGlobalFilter","undefined","current","scrollToIndex","error","console","totalFetchedRows","length","renderBottomToolbarCustomActions","children","count","i18nKey","values","totalRows","renderTopToolbarCustomActions","table","rowSelection","setRowSelection","pagination","setPagination","pageIndex","pageSize","dataLengthRef","updatePagination","paginationFunction","previousPagination","nextPagination","numberOfPages","Math","floor","modifiedInitialState","modifiedState","muiToolbarAlertBannerProps","severity","muiTablePaginationProps","rowsPerPageOptions","showFirstButton","showLastButton","muiCheckboxStyles","theme","components","MuiCheckbox","styleOverrides","root","ownerState","enableMultiRowSelection","enablePagination","enableRowSelection","enableSorting","muiSelectAllCheckboxProps","sx","muiSelectCheckboxProps","muiPaginationProps","onColumnFiltersChange","rowVirtualizerOptions","overscan","MemoizedPaginatedTable","displayName"],"sources":["../../../src/labs/PaginatedTable.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 { AlertProps, CheckboxProps } from \"@mui/material\";\nimport {\n MaterialReactTable,\n type MRT_ColumnFiltersState,\n MRT_PaginationState,\n type MRT_RowSelectionState,\n type MRT_TableInstance,\n type MRT_Virtualizer,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n FunctionComponent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport type {\n DefaultMaterialReactTableData,\n MaterialReactTableProps,\n} from \"./materialReactTableTypes.js\";\n\nimport { Trans, useTranslation } from \"../i18n.generated/i18n.js\";\nimport { Typography } from \"../Typography.js\";\n\nexport type PaginatedTableProps<TData extends DefaultMaterialReactTableData> = {\n columns: MaterialReactTableProps<TData>[\"columns\"];\n data: MaterialReactTableProps<TData>[\"data\"];\n fetchMoreData?: () => void;\n getRowId?: MaterialReactTableProps<TData>[\"getRowId\"];\n hasError?: boolean;\n hasRowSelection?: boolean;\n initialState?: MaterialReactTableProps<TData>[\"initialState\"];\n isFetching?: boolean;\n onGlobalFilterChange?: MaterialReactTableProps<TData>[\"onGlobalFilterChange\"];\n onPaginationChange?: MaterialReactTableProps<TData>[\"onPaginationChange\"];\n onRowSelectionChange?: MaterialReactTableProps<TData>[\"onRowSelectionChange\"];\n rowsPerPage?: number;\n state?: MaterialReactTableProps<TData>[\"state\"];\n ToolbarButtons?: FunctionComponent<{ table: MRT_TableInstance<TData> }>;\n};\n\nconst PaginatedTable = <TData extends DefaultMaterialReactTableData>({\n columns = [],\n data = [],\n fetchMoreData,\n getRowId,\n hasError,\n hasRowSelection,\n initialState,\n isFetching,\n onGlobalFilterChange,\n onPaginationChange,\n onRowSelectionChange: onRowSelectionChangeProp,\n rowsPerPage = 10,\n state,\n ToolbarButtons,\n}: PaginatedTableProps<TData>) => {\n const { t } = useTranslation();\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const [columnFilters, setColumnFilters] = useState<MRT_ColumnFiltersState>(\n [],\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>();\n\n useEffect(() => {\n if (globalFilter !== undefined) {\n onGlobalFilterChange?.(globalFilter);\n }\n }, [globalFilter, onGlobalFilterChange]);\n\n useEffect(() => {\n try {\n // Scroll to top of table when sorting or filters change.\n rowVirtualizerInstanceRef.current?.scrollToIndex?.(0);\n } catch (error) {\n console.error(error);\n }\n }, [columnFilters, globalFilter]);\n\n const totalFetchedRows = data.length ?? 0;\n\n const renderBottomToolbarCustomActions = useCallback(\n () =>\n fetchMoreData ? (\n <Typography>\n <Trans\n count={totalFetchedRows}\n i18nKey=\"table.fetchedrows.text\"\n values={{\n totalRows: totalFetchedRows,\n }}\n />\n </Typography>\n ) : (\n <Typography>\n <Trans\n count={totalFetchedRows}\n i18nKey=\"table.rows.text\"\n values={{\n totalRows: totalFetchedRows,\n }}\n />\n </Typography>\n ),\n [fetchMoreData, totalFetchedRows],\n );\n\n const renderTopToolbarCustomActions = useCallback<\n Exclude<\n MaterialReactTableProps<TData>[\"renderTopToolbarCustomActions\"],\n undefined\n >\n >(\n ({ table }: { table: MRT_TableInstance<TData> }) => (\n <>{ToolbarButtons && <ToolbarButtons table={table} />}</>\n ),\n [ToolbarButtons],\n );\n\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n\n useEffect(() => {\n onRowSelectionChangeProp?.(rowSelection);\n }, [onRowSelectionChangeProp, rowSelection]);\n\n const [pagination, setPagination] = useState<MRT_PaginationState>(\n initialState?.pagination \|\| {\n pageIndex: 0,\n pageSize: rowsPerPage,\n },\n );\n\n const dataLengthRef = useRef(data.length);\n\n const updatePagination = useCallback<\n Required<MaterialReactTableProps<TData>>[\"onPaginationChange\"]\n >(\n (paginationFunction) => {\n if (data.length === dataLengthRef.current) {\n setPagination((previousPagination) => {\n // @ts-expect-error This broke in the upgrade, but this component is legacy and replaced by `DataView`.\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const nextPagination = paginationFunction(previousPagination);\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-return\n return nextPagination;\n });\n } else {\n dataLengthRef.current = data.length;\n }\n },\n [data.length],\n );\n\n useEffect(() => {\n const numberOfPages = Math.floor(data.length / pagination.pageSize);\n\n if (!isFetching && pagination.pageIndex > numberOfPages - 1) {\n fetchMoreData?.();\n }\n }, [\n data.length,\n fetchMoreData,\n isFetching,\n pagination.pageIndex,\n pagination.pageSize,\n ]);\n\n useEffect(() => {\n onPaginationChange?.({\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n });\n }, [onPaginationChange, pagination.pageIndex, pagination.pageSize]);\n\n const modifiedInitialState = useMemo(\n () => ({\n pagination,\n ...initialState,\n }),\n [initialState, pagination],\n );\n\n const modifiedState = useMemo(\n () => ({\n pagination: {\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n },\n rowSelection,\n globalFilter,\n columnFilters,\n ...state,\n }),\n [\n pagination.pageIndex,\n pagination.pageSize,\n rowSelection,\n globalFilter,\n columnFilters,\n state,\n ],\n );\n\n const muiToolbarAlertBannerProps: AlertProps = useMemo(\n () =>\n hasError\n ? {\n children: t(\"table.error\"),\n severity: \"error\",\n }\n : {},\n [hasError, t],\n );\n\n const muiTablePaginationProps = useMemo(\n () => ({\n rowsPerPageOptions: [],\n showFirstButton: false,\n showLastButton: false,\n }),\n [],\n );\n\n const muiCheckboxStyles = useCallback<\n // @ts-expect-error This breaks after the upgrade, but it doesn't matter as this is a legacy function and internal type.\n NonNullable<Required<CheckboxProps>[\"sx\"]>\n >(\n (theme) =>\n typeof theme.components?.MuiCheckbox?.styleOverrides?.root === \"function\"\n ? theme.components?.MuiCheckbox?.styleOverrides?.root?.({\n ownerState: {},\n theme,\n })\n : \"\",\n [],\n );\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n enableMultiRowSelection: hasRowSelection,\n enablePagination: true,\n enableRowSelection: hasRowSelection,\n enableSorting: false,\n getRowId: getRowId,\n initialState: modifiedInitialState,\n muiSelectAllCheckboxProps: { sx: muiCheckboxStyles },\n muiSelectCheckboxProps: { sx: muiCheckboxStyles },\n muiPaginationProps: muiTablePaginationProps,\n muiToolbarAlertBannerProps: muiToolbarAlertBannerProps,\n onColumnFiltersChange: setColumnFilters,\n onGlobalFilterChange: setGlobalFilter,\n onPaginationChange: updatePagination,\n onRowSelectionChange: setRowSelection,\n renderBottomToolbarCustomActions: renderBottomToolbarCustomActions,\n renderTopToolbarCustomActions: renderTopToolbarCustomActions,\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n state: modifiedState,\n });\n\n return <MaterialReactTable table={table} />;\n};\n\nconst MemoizedPaginatedTable = memo(PaginatedTable) as typeof PaginatedTable;\n\n// @ts-expect-error \| This is going to error because the component isn't and can't be defined as a `FunctionComponent`, and therefore, doesn't have a `displayName` prop.\nMemoizedPaginatedTable.displayName = \"PaginatedTable\";\n\nexport { MemoizedPaginatedTable as PaginatedTable };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"PaginatedTable.js","names":["MaterialReactTable","useMaterialReactTable","memo","useCallback","useEffect","useMemo","useRef","useState","Trans","useTranslation","Typography","jsx","_jsx","Fragment","_Fragment","PaginatedTable","columns","data","fetchMoreData","getRowId","hasError","hasRowSelection","initialState","isFetching","onGlobalFilterChange","onPaginationChange","onRowSelectionChange","onRowSelectionChangeProp","rowsPerPage","state","ToolbarButtons","t","rowVirtualizerInstanceRef","columnFilters","setColumnFilters","globalFilter","setGlobalFilter","undefined","current","scrollToIndex","error","console","totalFetchedRows","length","renderBottomToolbarCustomActions","children","count","i18nKey","values","totalRows","renderTopToolbarCustomActions","table","rowSelection","setRowSelection","pagination","setPagination","pageIndex","pageSize","dataLengthRef","updatePagination","paginationFunction","previousPagination","nextPagination","numberOfPages","Math","floor","modifiedInitialState","modifiedState","muiToolbarAlertBannerProps","severity","muiTablePaginationProps","rowsPerPageOptions","showFirstButton","showLastButton","muiCheckboxStyles","theme","components","MuiCheckbox","styleOverrides","root","ownerState","enableMultiRowSelection","enablePagination","enableRowSelection","enableSorting","muiSelectAllCheckboxProps","sx","muiSelectCheckboxProps","muiPaginationProps","onColumnFiltersChange","rowVirtualizerOptions","overscan","MemoizedPaginatedTable","displayName"],"sources":["../../../src/labs/PaginatedTable.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 { AlertProps, CheckboxProps } from \"@mui/material\";\nimport {\n MaterialReactTable,\n type MRT_ColumnFiltersState,\n MRT_PaginationState,\n type MRT_RowSelectionState,\n type MRT_TableInstance,\n type MRT_Virtualizer,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n FunctionComponent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport type {\n DefaultMaterialReactTableData,\n MaterialReactTableProps,\n} from \"./materialReactTableTypes.js\";\n\nimport { Trans, useTranslation } from \"../i18n.generated/i18n.js\";\nimport { Typography } from \"../Typography.js\";\n\nexport type PaginatedTableProps<TData extends DefaultMaterialReactTableData> = {\n columns: MaterialReactTableProps<TData>[\"columns\"];\n data: MaterialReactTableProps<TData>[\"data\"];\n fetchMoreData?: () => void;\n getRowId?: MaterialReactTableProps<TData>[\"getRowId\"];\n hasError?: boolean;\n hasRowSelection?: boolean;\n initialState?: MaterialReactTableProps<TData>[\"initialState\"];\n isFetching?: boolean;\n onGlobalFilterChange?: MaterialReactTableProps<TData>[\"onGlobalFilterChange\"];\n onPaginationChange?: MaterialReactTableProps<TData>[\"onPaginationChange\"];\n onRowSelectionChange?: MaterialReactTableProps<TData>[\"onRowSelectionChange\"];\n rowsPerPage?: number;\n state?: MaterialReactTableProps<TData>[\"state\"];\n ToolbarButtons?: FunctionComponent<{ table: MRT_TableInstance<TData> }>;\n};\n\nconst PaginatedTable = <TData extends DefaultMaterialReactTableData>({\n columns = [],\n data = [],\n fetchMoreData,\n getRowId,\n hasError,\n hasRowSelection,\n initialState,\n isFetching,\n onGlobalFilterChange,\n onPaginationChange,\n onRowSelectionChange: onRowSelectionChangeProp,\n rowsPerPage = 10,\n state,\n ToolbarButtons,\n}: PaginatedTableProps<TData>) => {\n const { t } = useTranslation();\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const [columnFilters, setColumnFilters] = useState<MRT_ColumnFiltersState>(\n [],\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>();\n\n useEffect(() => {\n if (globalFilter !== undefined) {\n onGlobalFilterChange?.(globalFilter);\n }\n }, [globalFilter, onGlobalFilterChange]);\n\n useEffect(() => {\n try {\n // Scroll to top of table when sorting or filters change.\n rowVirtualizerInstanceRef.current?.scrollToIndex?.(0);\n } catch (error) {\n console.error(error);\n }\n }, [columnFilters, globalFilter]);\n\n const totalFetchedRows = data.length ?? 0;\n\n const renderBottomToolbarCustomActions = useCallback(\n () =>\n fetchMoreData ? (\n <Typography>\n <Trans\n count={totalFetchedRows}\n i18nKey=\"table.fetchedrows.text\"\n values={{\n totalRows: totalFetchedRows,\n }}\n />\n </Typography>\n ) : (\n <Typography>\n <Trans\n count={totalFetchedRows}\n i18nKey=\"table.rows.text\"\n values={{\n totalRows: totalFetchedRows,\n }}\n />\n </Typography>\n ),\n [fetchMoreData, totalFetchedRows],\n );\n\n const renderTopToolbarCustomActions = useCallback<\n Exclude<\n MaterialReactTableProps<TData>[\"renderTopToolbarCustomActions\"],\n undefined\n >\n >(\n ({ table }: { table: MRT_TableInstance<TData> }) => (\n <>{ToolbarButtons && <ToolbarButtons table={table} />}</>\n ),\n [ToolbarButtons],\n );\n\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n\n useEffect(() => {\n onRowSelectionChangeProp?.(rowSelection);\n }, [onRowSelectionChangeProp, rowSelection]);\n\n const [pagination, setPagination] = useState<MRT_PaginationState>(\n initialState?.pagination \|\| {\n pageIndex: 0,\n pageSize: rowsPerPage,\n },\n );\n\n const dataLengthRef = useRef(data.length);\n\n const updatePagination = useCallback<\n Required<MaterialReactTableProps<TData>>[\"onPaginationChange\"]\n >(\n (paginationFunction) => {\n if (data.length === dataLengthRef.current) {\n setPagination((previousPagination) => {\n // @ts-expect-error This broke in the upgrade, but this component is legacy and replaced by `DataView`.\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const nextPagination = paginationFunction(previousPagination);\n\n // eslint-disable-next-line @typescript-eslint/no-unsafe-return\n return nextPagination;\n });\n } else {\n dataLengthRef.current = data.length;\n }\n },\n [data.length],\n );\n\n useEffect(() => {\n const numberOfPages = Math.floor(data.length / pagination.pageSize);\n\n if (!isFetching && pagination.pageIndex > numberOfPages - 1) {\n fetchMoreData?.();\n }\n }, [\n data.length,\n fetchMoreData,\n isFetching,\n pagination.pageIndex,\n pagination.pageSize,\n ]);\n\n useEffect(() => {\n onPaginationChange?.({\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n });\n }, [onPaginationChange, pagination.pageIndex, pagination.pageSize]);\n\n const modifiedInitialState = useMemo(\n () => ({\n pagination,\n ...initialState,\n }),\n [initialState, pagination],\n );\n\n const modifiedState = useMemo(\n () => ({\n pagination: {\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n },\n rowSelection,\n globalFilter,\n columnFilters,\n ...state,\n }),\n [\n pagination.pageIndex,\n pagination.pageSize,\n rowSelection,\n globalFilter,\n columnFilters,\n state,\n ],\n );\n\n const muiToolbarAlertBannerProps: AlertProps = useMemo(\n () =>\n hasError\n ? {\n children: t(\"table.error\"),\n severity: \"error\",\n }\n : {},\n [hasError, t],\n );\n\n const muiTablePaginationProps = useMemo(\n () => ({\n rowsPerPageOptions: [],\n showFirstButton: false,\n showLastButton: false,\n }),\n [],\n );\n\n const muiCheckboxStyles = useCallback<\n // @ts-expect-error This breaks after the upgrade, but it doesn't matter as this is a legacy function and internal type.\n NonNullable<Required<CheckboxProps>[\"sx\"]>\n >(\n (theme) =>\n typeof theme.components?.MuiCheckbox?.styleOverrides?.root === \"function\"\n ? theme.components?.MuiCheckbox?.styleOverrides?.root?.({\n ownerState: {},\n theme,\n })\n : \"\",\n [],\n );\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n enableMultiRowSelection: hasRowSelection,\n enablePagination: true,\n enableRowSelection: hasRowSelection,\n enableSorting: false,\n getRowId: getRowId,\n initialState: modifiedInitialState,\n muiSelectAllCheckboxProps: { sx: muiCheckboxStyles },\n muiSelectCheckboxProps: { sx: muiCheckboxStyles },\n muiPaginationProps: muiTablePaginationProps,\n muiToolbarAlertBannerProps: muiToolbarAlertBannerProps,\n onColumnFiltersChange: setColumnFilters,\n onGlobalFilterChange: setGlobalFilter,\n onPaginationChange: updatePagination,\n onRowSelectionChange: setRowSelection,\n renderBottomToolbarCustomActions: renderBottomToolbarCustomActions,\n renderTopToolbarCustomActions: renderTopToolbarCustomActions,\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n state: modifiedState,\n });\n\n return <MaterialReactTable table={table} />;\n};\n\nconst MemoizedPaginatedTable = memo(PaginatedTable) as typeof PaginatedTable;\n\n// @ts-expect-error \| This is going to error because the component isn't and can't be defined as a `FunctionComponent`, and therefore, doesn't have a `displayName` prop.\nMemoizedPaginatedTable.displayName = \"PaginatedTable\";\n\nexport { MemoizedPaginatedTable as PaginatedTable };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/StaticTable.js CHANGED Viewed

@@ -81,6 +81,6 @@ const StaticTable = ({
   });
 };
 const MemoizedStaticTable = memo(StaticTable);
-MemoizedStaticTable.displayName = "StaticTable";
+MemoizedStaticTable.displayName = "StaticTable::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedStaticTable as StaticTable };
 //# sourceMappingURL=StaticTable.js.map

package/dist/esm/labs/StaticTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StaticTable.js","names":["MaterialReactTable","useMaterialReactTable","memo","useCallback","useEffect","useMemo","useRef","useState","useTranslation","jsx","_jsx","Fragment","_Fragment","StaticTable","columns","data","getRowId","hasError","initialState","onGlobalFilterChange","state","ToolbarButtons","t","rowVirtualizerInstanceRef","columnFilters","setColumnFilters","globalFilter","setGlobalFilter","undefined","modifiedState","renderTopToolbarCustomActions","table","children","current","scrollToIndex","error","console","enableBottomToolbar","enablePagination","enableRowVirtualization","enableSorting","muiToolbarAlertBannerProps","color","onColumnFiltersChange","rowVirtualizerOptions","overscan","MemoizedStaticTable","displayName"],"sources":["../../../src/labs/StaticTable.tsx"],"sourcesContent":["/!\n Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n MaterialReactTable,\n type MRT_ColumnFiltersState,\n type MRT_TableInstance,\n type MRT_Virtualizer,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n FunctionComponent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport type {\n DefaultMaterialReactTableData,\n MaterialReactTableProps,\n} from \"./materialReactTableTypes.js\";\n\nimport { useTranslation } from \"../i18n.generated/i18n.js\";\n\nexport type StaticTableProps<TData extends DefaultMaterialReactTableData> = {\n columns: MaterialReactTableProps<TData>[\"columns\"];\n data: MaterialReactTableProps<TData>[\"data\"];\n getRowId?: MaterialReactTableProps<TData>[\"getRowId\"];\n hasError?: boolean;\n initialState?: MaterialReactTableProps<TData>[\"initialState\"];\n onGlobalFilterChange?: MaterialReactTableProps<TData>[\"onGlobalFilterChange\"];\n state?: MaterialReactTableProps<TData>[\"state\"];\n ToolbarButtons?: FunctionComponent<{ table: MRT_TableInstance<TData> }>;\n};\n\nconst StaticTable = <TData extends DefaultMaterialReactTableData>({\n columns = [],\n data = [],\n getRowId,\n hasError,\n initialState,\n onGlobalFilterChange,\n state,\n ToolbarButtons,\n}: StaticTableProps<TData>) => {\n const { t } = useTranslation();\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const [columnFilters, setColumnFilters] = useState<MRT_ColumnFiltersState>(\n [],\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>();\n\n useEffect(() => {\n if (globalFilter !== undefined) {\n onGlobalFilterChange?.(globalFilter);\n }\n }, [globalFilter, onGlobalFilterChange]);\n\n const modifiedState = useMemo(\n () => ({\n globalFilter,\n columnFilters,\n ...state,\n }),\n [globalFilter, columnFilters, state],\n );\n\n const renderTopToolbarCustomActions = useCallback<\n Exclude<\n MaterialReactTableProps<TData>[\"renderTopToolbarCustomActions\"],\n undefined\n >\n >(\n ({ table }) => <>{ToolbarButtons && <ToolbarButtons table={table} />}</>,\n [ToolbarButtons],\n );\n\n useEffect(() => {\n try {\n // Scroll to top of table when sorting or filters change.\n rowVirtualizerInstanceRef.current?.scrollToIndex?.(0);\n } catch (error) {\n console.error(error);\n }\n }, [columnFilters, globalFilter]);\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n enableBottomToolbar: false,\n enablePagination: false,\n enableRowVirtualization: true,\n enableSorting: false,\n getRowId: getRowId,\n initialState: initialState,\n muiToolbarAlertBannerProps: hasError\n ? { children: t(\"table.error\"), color: \"error\" }\n : undefined,\n onColumnFiltersChange: setColumnFilters,\n onGlobalFilterChange: setGlobalFilter,\n renderTopToolbarCustomActions: renderTopToolbarCustomActions,\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n state: modifiedState,\n });\n\n return <MaterialReactTable table={table} />;\n};\n\n// Need the `typeof StaticTable` because generics don't get passed through `memo`.\nconst MemoizedStaticTable = memo(StaticTable) as typeof StaticTable;\n\n// @ts-expect-error displayName is expected to not be on `typeof StaticTable`\nMemoizedStaticTable.displayName = \"StaticTable\";\n\nexport { MemoizedStaticTable as StaticTable };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,kBAAkB,EAIlBC,qBAAqB,QAChB,sBAAsB;AAC7B,SAEEC,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACH,OAAO;AAOd,SAASC,cAAc,QAAQ,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA;AAa3D,MAAMC,WAAW,GAAGA,CAA8C;EAChEC,OAAO,GAAG,EAAE;EACZC,IAAI,GAAG,EAAE;EACTC,QAAQ;EACRC,QAAQ;EACRC,YAAY;EACZC,oBAAoB;EACpBC,KAAK;EACLC;AACuB,CAAC,KAAK;EAC7B,MAAM;IAAEC;EAAE,CAAC,GAAGd,cAAc,CAAC,CAAC;EAE9B,MAAMe,yBAAyB,GAC7BjB,MAAM,CAAuD,IAAI,CAAC;EAEpE,MAAM,CAACkB,aAAa,EAAEC,gBAAgB,CAAC,GAAGlB,QAAQ,CAChD,EACF,CAAC;EAED,MAAM,CAACmB,YAAY,EAAEC,eAAe,CAAC,GAAGpB,QAAQ,CAAS,CAAC;EAE1DH,SAAS,CAAC,MAAM;IACd,IAAIsB,YAAY,KAAKE,SAAS,EAAE;MAC9BT,oBAAoB,GAAGO,YAAY,CAAC;IACtC;EACF,CAAC,EAAE,CAACA,YAAY,EAAEP,oBAAoB,CAAC,CAAC;EAExC,MAAMU,aAAa,GAAGxB,OAAO,CAC3B,OAAO;IACLqB,YAAY;IACZF,aAAa;IACb,GAAGJ;EACL,CAAC,CAAC,EACF,CAACM,YAAY,EAAEF,aAAa,EAAEJ,KAAK,CACrC,CAAC;EAED,MAAMU,6BAA6B,GAAG3B,WAAW,CAM/C,CAAC;IAAE4B;EAAM,CAAC,KAAKrB,IAAA,CAAAE,SAAA;IAAAoB,QAAA,EAAGX,cAAc,IAAIX,IAAA,CAACW,cAAc;MAACU,KAAK,EAAEA;IAAM,CAAE;EAAC,CAAG,CAAC,EACxE,CAACV,cAAc,CACjB,CAAC;EAEDjB,SAAS,CAAC,MAAM;IACd,IAAI;MAEFmB,yBAAyB,CAACU,OAAO,EAAEC,aAAa,GAAG,CAAC,CAAC;IACvD,CAAC,CAAC,OAAOC,KAAK,EAAE;MACdC,OAAO,CAACD,KAAK,CAACA,KAAK,CAAC;IACtB;EACF,CAAC,EAAE,CAACX,aAAa,EAAEE,YAAY,CAAC,CAAC;EAEjC,MAAMK,KAAK,GAAG9B,qBAAqB,CAAC;IAClCa,OAAO,EAAEA,OAAO;IAChBC,IAAI,EAAEA,IAAI;IACVsB,mBAAmB,EAAE,KAAK;IAC1BC,gBAAgB,EAAE,KAAK;IACvBC,uBAAuB,EAAE,IAAI;IAC7BC,aAAa,EAAE,KAAK;IACpBxB,QAAQ,EAAEA,QAAQ;IAClBE,YAAY,EAAEA,YAAY;IAC1BuB,0BAA0B,EAAExB,QAAQ,GAChC;MAAEe,QAAQ,EAAEV,CAAC,CAAC,aAAa,CAAC;MAAEoB,KAAK,EAAE;IAAQ,CAAC,GAC9Cd,SAAS;IACbe,qBAAqB,EAAElB,gBAAgB;IACvCN,oBAAoB,EAAEQ,eAAe;IACrCG,6BAA6B,EAAEA,6BAA6B;IAC5DP,yBAAyB,EAAEA,yBAAyB;IACpDqB,qBAAqB,EAAE;MAAEC,QAAQ,EAAE;IAAE,CAAC;IACtCzB,KAAK,EAAES;EACT,CAAC,CAAC;EAEF,OAAOnB,IAAA,CAACV,kBAAkB;IAAC+B,KAAK,EAAEA;EAAM,CAAE,CAAC;AAC7C,CAAC;AAGD,MAAMe,mBAAmB,GAAG5C,IAAI,CAACW,WAAW,CAAuB;AAGnEiC,mBAAmB,CAACC,WAAW,~~GAAG,aAAa~~;AAE/C,SAASD,mBAAmB,IAAIjC,WAAW","ignoreList":[]}
1	+ {"version":3,"file":"StaticTable.js","names":["MaterialReactTable","useMaterialReactTable","memo","useCallback","useEffect","useMemo","useRef","useState","useTranslation","jsx","_jsx","Fragment","_Fragment","StaticTable","columns","data","getRowId","hasError","initialState","onGlobalFilterChange","state","ToolbarButtons","t","rowVirtualizerInstanceRef","columnFilters","setColumnFilters","globalFilter","setGlobalFilter","undefined","modifiedState","renderTopToolbarCustomActions","table","children","current","scrollToIndex","error","console","enableBottomToolbar","enablePagination","enableRowVirtualization","enableSorting","muiToolbarAlertBannerProps","color","onColumnFiltersChange","rowVirtualizerOptions","overscan","MemoizedStaticTable","displayName"],"sources":["../../../src/labs/StaticTable.tsx"],"sourcesContent":["/!\n Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n MaterialReactTable,\n type MRT_ColumnFiltersState,\n type MRT_TableInstance,\n type MRT_Virtualizer,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n FunctionComponent,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport type {\n DefaultMaterialReactTableData,\n MaterialReactTableProps,\n} from \"./materialReactTableTypes.js\";\n\nimport { useTranslation } from \"../i18n.generated/i18n.js\";\n\nexport type StaticTableProps<TData extends DefaultMaterialReactTableData> = {\n columns: MaterialReactTableProps<TData>[\"columns\"];\n data: MaterialReactTableProps<TData>[\"data\"];\n getRowId?: MaterialReactTableProps<TData>[\"getRowId\"];\n hasError?: boolean;\n initialState?: MaterialReactTableProps<TData>[\"initialState\"];\n onGlobalFilterChange?: MaterialReactTableProps<TData>[\"onGlobalFilterChange\"];\n state?: MaterialReactTableProps<TData>[\"state\"];\n ToolbarButtons?: FunctionComponent<{ table: MRT_TableInstance<TData> }>;\n};\n\nconst StaticTable = <TData extends DefaultMaterialReactTableData>({\n columns = [],\n data = [],\n getRowId,\n hasError,\n initialState,\n onGlobalFilterChange,\n state,\n ToolbarButtons,\n}: StaticTableProps<TData>) => {\n const { t } = useTranslation();\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const [columnFilters, setColumnFilters] = useState<MRT_ColumnFiltersState>(\n [],\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>();\n\n useEffect(() => {\n if (globalFilter !== undefined) {\n onGlobalFilterChange?.(globalFilter);\n }\n }, [globalFilter, onGlobalFilterChange]);\n\n const modifiedState = useMemo(\n () => ({\n globalFilter,\n columnFilters,\n ...state,\n }),\n [globalFilter, columnFilters, state],\n );\n\n const renderTopToolbarCustomActions = useCallback<\n Exclude<\n MaterialReactTableProps<TData>[\"renderTopToolbarCustomActions\"],\n undefined\n >\n >(\n ({ table }) => <>{ToolbarButtons && <ToolbarButtons table={table} />}</>,\n [ToolbarButtons],\n );\n\n useEffect(() => {\n try {\n // Scroll to top of table when sorting or filters change.\n rowVirtualizerInstanceRef.current?.scrollToIndex?.(0);\n } catch (error) {\n console.error(error);\n }\n }, [columnFilters, globalFilter]);\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n enableBottomToolbar: false,\n enablePagination: false,\n enableRowVirtualization: true,\n enableSorting: false,\n getRowId: getRowId,\n initialState: initialState,\n muiToolbarAlertBannerProps: hasError\n ? { children: t(\"table.error\"), color: \"error\" }\n : undefined,\n onColumnFiltersChange: setColumnFilters,\n onGlobalFilterChange: setGlobalFilter,\n renderTopToolbarCustomActions: renderTopToolbarCustomActions,\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n state: modifiedState,\n });\n\n return <MaterialReactTable table={table} />;\n};\n\n// Need the `typeof StaticTable` because generics don't get passed through `memo`.\nconst MemoizedStaticTable = memo(StaticTable) as typeof StaticTable;\n\n// @ts-expect-error displayName is expected to not be on `typeof StaticTable`\nMemoizedStaticTable.displayName = \"StaticTable\";\n\nexport { MemoizedStaticTable as StaticTable };\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/labs/UserProfile.js CHANGED Viewed

@@ -68,6 +68,6 @@ const UserProfile = ({
   });
 };
 const MemoizedUserProfile = memo(UserProfile);
-MemoizedUserProfile.displayName = "UserProfile";
+MemoizedUserProfile.displayName = "UserProfile::pkg=odyssey&odysseyV=1.57.0";
 export { MemoizedUserProfile as UserProfile };
 //# sourceMappingURL=UserProfile.js.map