@laerdal/life-react-components 1.3.2-dev.7 → 1.4.1-dev.1

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 (72) hide show
  1. package/dist/esm/Button/DualFunctionButton.js +4 -0
  2. package/dist/esm/Button/DualFunctionButton.js.map +1 -1
  3. package/dist/esm/Dropdown/DropdownContent.js +6 -6
  4. package/dist/esm/Dropdown/DropdownContent.js.map +1 -1
  5. package/dist/esm/Modals/ModalContainer.js +0 -5
  6. package/dist/esm/Modals/ModalContainer.js.map +1 -1
  7. package/dist/esm/Modals/ModalDialog.js +23 -4
  8. package/dist/esm/Modals/ModalDialog.js.map +1 -1
  9. package/dist/esm/Modals/ModalNote.js +1 -1
  10. package/dist/esm/Modals/ModalNote.js.map +1 -1
  11. package/dist/esm/Table/Table.js +22 -6
  12. package/dist/esm/Table/Table.js.map +1 -1
  13. package/dist/esm/Table/TableBody.js +14 -24
  14. package/dist/esm/Table/TableBody.js.map +1 -1
  15. package/dist/esm/Table/TableFooter.js +13 -12
  16. package/dist/esm/Table/TableFooter.js.map +1 -1
  17. package/dist/esm/Table/TableHeaders.js +8 -19
  18. package/dist/esm/Table/TableHeaders.js.map +1 -1
  19. package/dist/esm/Table/TableStyles.js +226 -180
  20. package/dist/esm/Table/TableStyles.js.map +1 -1
  21. package/dist/esm/Table/__tests__/Table.test.js +162 -0
  22. package/dist/esm/Table/__tests__/Table.test.js.map +1 -1
  23. package/dist/js/Button/DualFunctionButton.js +4 -0
  24. package/dist/js/Button/DualFunctionButton.js.map +1 -1
  25. package/dist/js/Dropdown/DropdownContent.js +8 -8
  26. package/dist/js/Dropdown/DropdownContent.js.map +1 -1
  27. package/dist/js/Modals/ModalContainer.js +1 -1
  28. package/dist/js/Modals/ModalContainer.js.map +1 -1
  29. package/dist/js/Modals/ModalDialog.d.ts +3 -1
  30. package/dist/js/Modals/ModalDialog.js +21 -4
  31. package/dist/js/Modals/ModalDialog.js.map +1 -1
  32. package/dist/js/Modals/ModalNote.d.ts +1 -1
  33. package/dist/js/Modals/ModalNote.js +1 -1
  34. package/dist/js/Modals/ModalNote.js.map +1 -1
  35. package/dist/js/Table/Table.js +32 -11
  36. package/dist/js/Table/Table.js.map +1 -1
  37. package/dist/js/Table/TableBody.js +16 -25
  38. package/dist/js/Table/TableBody.js.map +1 -1
  39. package/dist/js/Table/TableFooter.d.ts +2 -0
  40. package/dist/js/Table/TableFooter.js +19 -12
  41. package/dist/js/Table/TableFooter.js.map +1 -1
  42. package/dist/js/Table/TableHeaders.js +9 -19
  43. package/dist/js/Table/TableHeaders.js.map +1 -1
  44. package/dist/js/Table/TableStyles.d.ts +19 -0
  45. package/dist/js/Table/TableStyles.js +79 -3
  46. package/dist/js/Table/TableStyles.js.map +1 -1
  47. package/dist/js/Table/TableTypes.d.ts +4 -1
  48. package/dist/js/Table/__tests__/Table.test.js +164 -0
  49. package/dist/js/Table/__tests__/Table.test.js.map +1 -1
  50. package/dist/umd/Button/DualFunctionButton.js +4 -0
  51. package/dist/umd/Button/DualFunctionButton.js.map +1 -1
  52. package/dist/umd/Dropdown/DropdownContent.js +6 -6
  53. package/dist/umd/Dropdown/DropdownContent.js.map +1 -1
  54. package/dist/umd/Modals/ModalContainer.js +0 -5
  55. package/dist/umd/Modals/ModalContainer.js.map +1 -1
  56. package/dist/umd/Modals/ModalDialog.js +23 -4
  57. package/dist/umd/Modals/ModalDialog.js.map +1 -1
  58. package/dist/umd/Modals/ModalNote.js +1 -1
  59. package/dist/umd/Modals/ModalNote.js.map +1 -1
  60. package/dist/umd/Table/Table.js +21 -5
  61. package/dist/umd/Table/Table.js.map +1 -1
  62. package/dist/umd/Table/TableBody.js +17 -28
  63. package/dist/umd/Table/TableBody.js.map +1 -1
  64. package/dist/umd/Table/TableFooter.js +15 -16
  65. package/dist/umd/Table/TableFooter.js.map +1 -1
  66. package/dist/umd/Table/TableHeaders.js +11 -23
  67. package/dist/umd/Table/TableHeaders.js.map +1 -1
  68. package/dist/umd/Table/TableStyles.js +226 -180
  69. package/dist/umd/Table/TableStyles.js.map +1 -1
  70. package/dist/umd/Table/__tests__/Table.test.js +164 -4
  71. package/dist/umd/Table/__tests__/Table.test.js.map +1 -1
  72. package/package.json +1 -1
@@ -93,6 +93,10 @@ const DualFunctionButton = _ref => {
93
93
  })), /*#__PURE__*/React.createElement(Button, _extends({
94
94
  variant: variant
95
95
  }, renderProps, {
96
+ onKeyPress: e => {
97
+ if (isOpen) return;
98
+ if (e.key == 'Enter' || e.key == ' ') setFocused(0);
99
+ },
96
100
  disabled: disabled,
97
101
  type: type,
98
102
  size: size,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","isOpen","setIsOpen","useState","focused","setFocused","dropdownContainerRef","useRef","selectedValues","setSelectedValues","itemsType"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport Button, { ButtonProps } from './Button'\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n display: flex;\n align-items: center;\n\n button:first-child {\n margin-right: 2px;\n }\n\n div.button-content {\n gap: 0px;\n padding: ${ props => props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px' };\n }\n`;\n\nexport interface ButtonOption {\n label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n dropdownCustomizationProps: DropdownCustomizationProps;\n dropdownMenuValues?: string[];\n setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n children = 'Primary Button',\n variant = 'primary',\n type = 'button',\n size = Size.Medium,\n width = 'auto',\n testId,\n disabled,\n id,\n dropdownMenuValues,\n setDropdownMenuValues,\n dropdownCustomizationProps,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, icon, onClick, ...renderProps } = props;\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [focused, setFocused] = React.useState<number | null>(null);\n const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n return <ButtonsContainer ref={dropdownContainerRef} size={size}>\n <Dropdown isButton={true} locked={false} disabled={false} margin=''>\n <Button\n {...renderProps}\n onClick={onClick}\n disabled={disabled}\n type={type}\n loading={loading}\n icon={icon}\n size={size}\n width={width}\n variant={variant}\n flatEdge=\"right\">\n {children}\n </Button>\n <DropdownContent\n customizationProps={dropdownCustomizationProps}\n filter=''\n selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : (dropdownMenuValues ?? selectedValues)}\n setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n isButton={true}\n setIsOpen={setIsOpen}\n focused={focused}\n setFocused={setFocused}\n hideOnClickOutside={true}\n size={size}\n isOpen={isOpen}\n id={id ?? 'dropdownId'}\n messageOnNoResults=''\n alignLeft={true} />\n </Dropdown>\n <Button variant={variant}\n {...renderProps}\n disabled={disabled}\n type={type}\n size={size}\n minWidth={'unset'}\n onClick={() => setIsOpen(!isOpen)}\n icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\"/>}\n flatEdge=\"left\" />\n </ButtonsContainer>;\n };\n\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}
1
+ {"version":3,"sources":["../../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","isOpen","setIsOpen","useState","focused","setFocused","dropdownContainerRef","useRef","selectedValues","setSelectedValues","itemsType","e","key"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport Button, { ButtonProps } from './Button'\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n display: flex;\n align-items: center;\n\n button:first-child {\n margin-right: 2px;\n }\n\n div.button-content {\n gap: 0px;\n padding: ${ props => props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px' };\n }\n`;\n\nexport interface ButtonOption {\n label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n dropdownCustomizationProps: DropdownCustomizationProps;\n dropdownMenuValues?: string[];\n setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n children = 'Primary Button',\n variant = 'primary',\n type = 'button',\n size = Size.Medium,\n width = 'auto',\n testId,\n disabled,\n id,\n dropdownMenuValues,\n setDropdownMenuValues,\n dropdownCustomizationProps,\n ...props\n}) => {\n // Let's filter out properties that we don't need to render.\n const { loading, icon, onClick, ...renderProps } = props;\n const [isOpen, setIsOpen] = React.useState<boolean>(false);\n const [focused, setFocused] = React.useState<number | null>(null);\n const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n return <ButtonsContainer ref={dropdownContainerRef} size={size}>\n <Dropdown isButton={true} locked={false} disabled={false} margin=''>\n <Button\n {...renderProps}\n onClick={onClick}\n disabled={disabled}\n type={type}\n loading={loading}\n icon={icon}\n size={size}\n width={width}\n variant={variant}\n flatEdge=\"right\">\n {children}\n </Button>\n <DropdownContent\n customizationProps={dropdownCustomizationProps}\n filter=''\n selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : (dropdownMenuValues ?? selectedValues)}\n setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n isButton={true}\n setIsOpen={setIsOpen}\n focused={focused}\n setFocused={setFocused}\n hideOnClickOutside={true}\n size={size}\n isOpen={isOpen}\n id={id ?? 'dropdownId'}\n messageOnNoResults=''\n alignLeft={true} />\n </Dropdown>\n <Button variant={variant}\n {...renderProps}\n onKeyPress={(e:any) => {\n if(isOpen)\n return;\n\n if (e.key == 'Enter' || e.key == ' ')\n setFocused(0); \n }}\n\n disabled={disabled}\n type={type}\n size={size}\n minWidth={'unset'}\n onClick={() => setIsOpen(!isOpen)}\n icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\"/>}\n flatEdge=\"left\" />\n </ButtonsContainer>;\n };\n\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}
@@ -211,14 +211,14 @@ const DropdownContent = ({
211
211
 
212
212
  if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {
213
213
  const filtered = getFilteredItems();
214
-
215
- for (let i = focusedNow - 1; i > 0; i--) {
216
- if (!filtered[i - 1]?.disabled) {
217
- focusedNow = i;
218
- break;
214
+ if (focusedNow == 1 && haveTopItem()) focusedNow = 0;else {
215
+ for (let i = focusedNow - 1; i > 0; i--) {
216
+ if (!filtered[i - 1]?.disabled) {
217
+ focusedNow = i;
218
+ break;
219
+ }
219
220
  }
220
221
  }
221
-
222
222
  setNewFocusedElement(focusedNow);
223
223
  }
224
224
  } else if (e.keyCode === 40) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Dropdown/DropdownContent.tsx"],"names":["React","useLayoutEffect","createRef","styled","Button","Size","ButtonDropdownContentStyling","DropdownButtonCSS","ComponentLStyling","ComponentXLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Checkbox","RadioButton","Z_INDEXES","DDContainer","div","white","props","width","dropdown","isButton","alignLeft","neutral_100","size","Large","Medium","scrollable","maxHeight","ItemsContainer","hover","active","focus","ListContainer","itemsType","neutral_600","neutral_500","MenuContentContainer","Bold","Small","Regular","DividerContainer","TopItemContainer","neutral_200","ActionButtonContainer","MAX_MENU_HEIGHT","AVG_OPTION_HEIGHT","DropdownContent","id","customizationProps","isOpen","hideOnClickOutside","setIsOpen","filter","focused","setFocused","selectedValues","setSelectedValues","messageOnNoResults","isUp","setIsUp","useState","dropdownContentRef","useRef","itemsListRef","determineDropUp","options","items","node","current","windowHeight","window","innerHeight","menuHeight","Math","min","length","instOffsetWithMenu","getBoundingClientRect","top","setNewFocusedElement","index","newFocusedElement","elRefs","getFilteredItems","filtrationString","toUpperCase","x","value","includes","displayLabel","handleKeyDown","e","keyCode","preventDefault","focusedNow","undefined","filtered","i","disabled","haveTopItem","document","getElementById","handleClickOutside","contains","target","some","useEffect","addEventListener","removeEventListener","scrollPosition","handleScroll","scrollTop","getCorrectRef","ref","arrLength","setElRefs","Array","fill","map","_","multiSelect","getSuggestions","suggestion","focusThis","handleItemClick","selected","item","newValue","onValueUpdate","getTopItem","pinTopItem","visibleItems","allSelected","y","showTopItem","suggestions","find","c","selectedFirst","newValues","icon","noteLabel","fontSize","getElements","number","customContent","showDividerAbove","join","menuContent","action","actionLabel","actionIcon","actionLoading","actionDisabled","actionVariant"],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useMemo, createRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport { CommonInteractionStyling } from '../common';\nimport Button from '../Button/Button';\nimport { Size } from '../types';\nimport { ButtonDropdownContentStyling, DropdownButtonCSS } from './CommonStyling';\nimport { ComponentLStyling, ComponentXLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS } from '../styles';\nimport { Checkbox, RadioButton } from '../InputFields';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport const DDContainer = styled.div<{ isButton: boolean; width?: string; alignLeft?: boolean; size?: Size; scrollable?: boolean; maxHeight?: string }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n\n width: ${(props) => (props.width ? props.width : '100%')};\n z-index: ${Z_INDEXES.dropdown};\n margin: ${(props) => (props.isButton ? '-4px' : '4px 0px')};\n\n &.show {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\n\n ${(props) => (props.alignLeft ? 'left: 0px;' : '')}\n\n ${(props) => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n border: 1px solid ${COLORS.neutral_100};\n box-sizing: border-box;\n box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n padding-top: 4px;\n padding-right: 0px;\n padding-bottom: 4px;\n padding-left: 0px;\n\n min-width: ${(props) => (props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n border-radius: ${(props) => (props.size == Size.Large ? '10px' : props.size == Size.Medium ? '8px' : '6px')};\n\n max-height: ${(props) => (!props.scrollable ? 'auto' : props.maxHeight ? props.maxHeight : props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n`;\n\nconst ItemsContainer = styled.div<{size? : Size}>`\n > *:hover {\n z-index: ${Z_INDEXES.hover};\n }\n > *:active,\n > *.active{\n z-index: ${Z_INDEXES.active};\n }\n > *:focus {\n z-index: ${Z_INDEXES.focus};\n }\n \n button.dropdownButton {\n ${props => DropdownButtonCSS(props.size)}\n }`;\n \nconst ListContainer = styled.div<{ scrollable?: boolean; size?: Size; itemsType?: string }>`\n ${(props) => (props.scrollable ? 'overflow-y: scroll;' : '')}\n ${(props) => (props.itemsType != 'normal' ? 'margin-left: 4px;' : '')}\n\n\n div.divider {\n display: block;\n width: calc(100% - 40px);\n margin-left: 16px;\n border-top: 1px solid #e5e5e5;\n position: absolute;\n top: 0px;\n }\n\n ${ItemsContainer} {\n padding-top: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n padding-bottom: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n }\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n margin: 0 6px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.neutral_100};\n border-radius: 8px;\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_600};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_500};\n }\n`;\n\n\nconst MenuContentContainer = styled.div<{size? : Size}>`\n h1, h2, h3 {\n margin-block-start: 0px;\n margin-block-end: 0px;\n ${props => props.size == Size.Large && ComponentXLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n ${props => props.size == Size.Medium && ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n ${props => (props.size == Size.Small || !props.size) && ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n padding: ${props => props.size == Size.Small || !props.size ? '10px 16px 6px' :\n props.size == Size.Medium ? '16px 24px 8px' : '16px 32px 8px'};\n }\n\n p {\n margin-block-start: 0px;\n margin-block-end: 0px;\n ${props => props.size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n ${props => props.size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n ${props => (props.size == Size.Small || !props.size) && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n padding: ${props => props.size == Size.Small || !props.size ? '8px 16px' :\n props.size == Size.Medium ? '12px 24px' : '16px 32px'};\n }\n`;\n\nconst DividerContainer = styled.div<{size? : Size}>`\n position: relative;\n\n margin-top: ${props => props.size == Size.Large ? '16px' : \n props.size == Size.Medium ? '12px' : \n (props.size == Size.Small || !props.size) ? '8px' : '6px'};\n\n div.divider {\n width: 100%;\n margin: 0px;\n }\n`;\n\nconst TopItemContainer = styled.div<{size?:Size}>`\n border-bottom-style: solid;\n border-bottom-color: ${COLORS.neutral_200};\n border-bottom-width: 1px;\n margin-right: 22px;\n\n button {\n ${props => DropdownButtonCSS(props.size)}\n }\n`;\n\nconst ActionButtonContainer = styled.div<{size?:Size}>`\n border-top-style: solid;\n border-top-color: ${COLORS.neutral_200};\n border-top-width: 1px;\n \n padding: ${props => props.size == Size.Small || !props.size ? '0px 16px' : '8px 16px'};\n\n button {\n width: 100%;\n }\n`;\n\nconst MAX_MENU_HEIGHT = 240;\nconst AVG_OPTION_HEIGHT = 48;\n\nexport interface DropdownItem {\n value: string;\n displayLabel?: string;\n noteLabel?: string;\n suggestion?: boolean;\n showDividerAbove?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n customContent?: React.ReactNode;\n}\n\nexport interface DropdownCustomizationProps {\n itemsType?: 'radio' | 'checkbox' | 'normal';\n menuContent?: React.ReactNode;\n scrollable?: boolean;\n multiSelect?: boolean;\n maxHeight?: string;\n actionLabel?: string;\n actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n actionIcon?: React.ReactNode;\n actionLoading?: boolean;\n actionDisabled?: boolean;\n action: () => boolean | void | undefined;\n pinTopItem?: boolean;\n onValueUpdate: (values: string[]) => boolean | void | undefined;\n items: DropdownItem[];\n}\n\nexport interface DropdownProps {\n isButton: boolean;\n customizationProps: DropdownCustomizationProps;\n alignLeft?: boolean;\n isOpen: boolean;\n setIsOpen: (open: boolean) => void;\n size?: Size;\n id: string;\n filter: string;\n width?: string;\n hideOnClickOutside: boolean;\n selectedValues: string[];\n setSelectedValues: (val: string[]) => void;\n messageOnNoResults: string;\n focused: number | null;\n setFocused: (focused: number | null) => void;\n}\n\nconst DropdownContent: React.FunctionComponent<DropdownProps> = ({\n id,\n customizationProps,\n alignLeft,\n isButton,\n size,\n isOpen,\n hideOnClickOutside,\n width,\n setIsOpen,\n filter,\n focused,\n setFocused,\n selectedValues,\n setSelectedValues,\n messageOnNoResults,\n}) => {\n const [isUp, setIsUp] = React.useState<boolean>(false);\n const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n\n if (!customizationProps.itemsType) customizationProps.itemsType = 'normal';\n if (!size) size = Size.Small;\n\n const itemsListRef = React.useRef<HTMLDivElement>(null);\n\n const determineDropUp = () => {\n const options = customizationProps.items;\n const node = dropdownContentRef.current;\n\n if (!node) return;\n\n const windowHeight = window.innerHeight;\n const menuHeight = Math.min(MAX_MENU_HEIGHT, options.length * AVG_OPTION_HEIGHT);\n const instOffsetWithMenu = node.getBoundingClientRect().top + menuHeight;\n setIsUp(instOffsetWithMenu >= windowHeight);\n };\n\n const setNewFocusedElement = (index: number) => {\n const newFocusedElement = elRefs[index];\n if (newFocusedElement) {\n setFocused(index);\n newFocusedElement?.current?.focus();\n }\n };\n\n const getFilteredItems = () => {\n const filtrationString = (filter ?? '').toUpperCase();\n return customizationProps.items.filter((x) => x?.value?.toUpperCase().includes(filtrationString) || x?.displayLabel?.toUpperCase().includes(filtrationString));\n };\n\n const handleKeyDown = (e: any) => {\n if (isOpen) {\n if (e.keyCode === 38) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {\n const filtered = getFilteredItems();\n for (let i = focusedNow - 1; i > 0; i--) {\n if (!filtered[i - 1]?.disabled) {\n focusedNow = i;\n break;\n }\n }\n setNewFocusedElement(focusedNow);\n }\n } else if (e.keyCode === 40) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null) {\n const filtered = getFilteredItems();\n for (let i = focusedNow + 1; i <= filtered.length; i++) {\n if (!filtered[i - 1]?.disabled) {\n focusedNow = i;\n break;\n }\n }\n } else {\n focusedNow = haveTopItem() ? 0 : 1;\n }\n setNewFocusedElement(focusedNow);\n } else if (e.keyCode === 9) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null) {\n focusedNow++;\n const newFocusedElement = document.getElementById(`${id}_${focusedNow}`);\n if (!newFocusedElement) {\n setNewFocusedElement(0);\n } else {\n setNewFocusedElement(focusedNow);\n }\n } else {\n setFocused(null);\n }\n } else if (e.keyCode === 27) {\n setIsOpen(false);\n setFocused(null);\n\n //TODO: add onEscapehandler\n /*\n if (!list.includes(input)) {\n setInput('');\n setPlaceholderSearch(placeholder || '');\n }\n styledFieldRef.current?.focus(); */\n }\n }\n };\n\n const handleClickOutside = (e: any) => {\n if (hideOnClickOutside && dropdownContentRef?.current && !dropdownContentRef.current.contains(e.target) && !elRefs.some((x) => x?.current?.contains(e.target))) {\n if (isOpen) {\n setIsOpen(false);\n setFocused(null);\n }\n }\n };\n\n React.useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n const scrollPosition = React.useRef<number | undefined>(0);\n const handleScroll = () => {\n scrollPosition.current = itemsListRef.current?.scrollTop;\n };\n useLayoutEffect(() => {\n if (itemsListRef.current) itemsListRef.current.scrollTop = scrollPosition.current ?? 0;\n }, [selectedValues]);\n\n const getCorrectRef = (ref: React.RefObject<HTMLElement>): React.RefObject<HTMLElement> => {\n switch (customizationProps.itemsType) {\n case 'normal':\n return (ref as React.RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n default:\n return (ref as React.RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n }\n };\n\n const arrLength = getFilteredItems().length;\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLElement>[]>([]);\n\n React.useEffect(() => {\n setElRefs((elRefs) =>\n Array(arrLength + 1)\n .fill(null)\n .map((_, i) => getCorrectRef(elRefs[i])),\n );\n }, [isOpen, arrLength, selectedValues]);\n\n React.useEffect(() => {\n determineDropUp();\n }, [isOpen]);\n\n const haveTopItem = () => {\n if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) return true;\n else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) return true;\n else if (customizationProps.itemsType == 'normal' && getSuggestions()?.length > 0) return true;\n return false;\n };\n\n const getSuggestions = () => {\n return getFilteredItems().filter((x) => x.suggestion);\n };\n\n React.useLayoutEffect(() => {\n if (isOpen && (focused || focused == 0)) {\n const focusThis = focused == 0 && !haveTopItem() ? 1 : focused;\n if (focusThis != focused) setFocused(focusThis);\n const newFocusedElement = elRefs[focusThis];\n newFocusedElement?.current?.focus();\n } else setFocused(null); //if the dropdown is closed, we don't to keep saved the focused item\n }, [isOpen]);\n\n const handleItemClick = (selected: boolean, item: DropdownItem) => {\n let newValue: string[] = [];\n if (customizationProps.multiSelect) {\n if (selected) newValue = [...selectedValues, item.value];\n else newValue = selectedValues.filter((x) => x != item.value);\n } else newValue = selected ? [item.value] : [];\n\n setSelectedValues(newValue);\n if(customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValue))\n setIsOpen(false);\n };\n\n const getTopItem = () => {\n if (!customizationProps.pinTopItem) return;\n const visibleItems = getFilteredItems();\n const allSelected = selectedValues?.filter((x) => visibleItems.some((y) => y.value == x)).length == visibleItems.length;\n let showTopItem = false;\n const suggestions = getSuggestions();\n const displayLabel = selectedValues[0] ? customizationProps.items?.find((c) => c.value === selectedValues[0])?.displayLabel : undefined;\n if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) showTopItem = true;\n else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) showTopItem = true;\n else if (customizationProps.itemsType == 'normal' && suggestions.length > 0) showTopItem = true;\n\n if (!showTopItem) return;\n\n const selectedFirst = selectedValues.length > 0 ? visibleItems.find(x => x.value == selectedValues[0]) : null;\n \n return (\n <TopItemContainer size={size}>\n {customizationProps.itemsType == 'radio' && (\n <RadioButton\n ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n iconPointerEventsTransparent={true}\n select={() => {}} label={selectedFirst?.displayLabel ?? selectedFirst?.value} \n size={size}\n id={`${id}_topitem`}\n selected={true}\n />\n )}\n {customizationProps.itemsType == 'checkbox' && (\n <Checkbox\n ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n select={(selected: boolean) => {\n if (!customizationProps.multiSelect) return;\n\n const newValues = selected ? visibleItems.map((x) => x.value) : [];\n setSelectedValues(newValues);\n if(customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValues))\n setIsOpen(false);\n }}\n iconPointerEventsTransparent={true}\n semiSelected={customizationProps.multiSelect && !allSelected && selectedValues?.length > 0}\n size={size}\n id={`${id}_checkbox_selectall`}\n label={customizationProps.multiSelect ? 'Select all' : (selectedFirst?.displayLabel ?? selectedFirst?.value)}\n selected={!customizationProps.multiSelect || allSelected}\n />\n )}\n {customizationProps.itemsType == 'normal' && (\n <>\n {suggestions.map((x) => (\n <button\n ref={elRefs[0] as React.RefObject<HTMLButtonElement>}\n type=\"button\"\n id={`${id}_topitem`}\n key={`${id}_topitem_${x.value}`}\n onClick={(e: any) => {\n customizationProps.onValueUpdate([x.value]);\n setSelectedValues([x.value]);\n setIsOpen(false);\n setFocused(null);\n }}>\n <div className=\"item-content\">\n {x?.icon && <div className=\"item-icon\">{x?.icon}</div>}\n <div className=\"item-label\">\n {x?.displayLabel ?? x?.value}\n {x?.noteLabel && <div style={{ fontSize: '12px' }}>{x.noteLabel}</div>}\n </div>\n </div>\n </button>))}\n </>\n )}\n </TopItemContainer>\n );\n };\n\n const getElements = () => {\n if (getFilteredItems().length === 0) {\n return (\n <ItemsContainer size={size}>\n <button className=\"dropdownButton\" disabled>\n <span>{messageOnNoResults}</span>\n </button>\n </ItemsContainer>\n );\n }\n let number = 0;\n return (\n <ItemsContainer size={size}>\n {getFilteredItems()\n .filter((x) => x && (customizationProps.itemsType != 'normal' || !x.suggestion))\n .map((item) => {\n return (\n <React.Fragment key={`key_${id}_${item.value}`}>\n {item.customContent}\n {!item.customContent && customizationProps.itemsType == 'radio' && (\n <RadioButton\n select={(selected:boolean) => handleItemClick(selected, item)}\n ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n size={size}\n iconPointerEventsTransparent={true}\n disabled={item?.disabled}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}\n label={item.displayLabel ?? item.value}\n selected={selectedValues?.includes(item.value)}\n />\n )}\n {!item.customContent && customizationProps.itemsType == 'checkbox' && (\n <Checkbox\n select={(selected:boolean) => handleItemClick(selected, item)}\n iconPointerEventsTransparent={true}\n disabled={item?.disabled}\n ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n size={size}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}\n label={item.displayLabel ?? item.value}\n selected={selectedValues?.includes(item.value)}\n />\n )}\n {!item.customContent && (customizationProps.itemsType == 'normal' || !customizationProps.itemsType) && (\n <button\n type=\"button\"\n disabled={item?.disabled}\n ref={elRefs[number + 1] as React.RefObject<HTMLButtonElement>}\n onClick={(e: any) => {\n customizationProps.onValueUpdate([item.value]);\n setSelectedValues([item.value]);\n setIsOpen(false);\n setFocused(null);\n }}\n className={ 'dropdownButton ' + (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (selectedValues?.includes(item.value) ? 'active' : '')}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}>\n {item.showDividerAbove && <div className=\"divider\" />}\n <div className=\"item-content\">\n {item.icon && <div className=\"item-icon\">{item.icon}</div>}\n <div className=\"item-label\">\n {item.displayLabel ?? item.value}\n {item.noteLabel && <div style={{ fontSize: '12px' }}>{item.noteLabel}</div>}\n </div>\n </div>\n </button>\n )}\n </React.Fragment>\n );\n })}\n </ItemsContainer>\n );\n };\n\n return (\n <DDContainer\n ref={dropdownContentRef}\n size={size}\n width={width}\n isButton={isButton}\n alignLeft={alignLeft}\n scrollable={customizationProps.scrollable}\n maxHeight={customizationProps.maxHeight}\n className={[isOpen && 'show', isUp && 'up'].filter((e) => !!e).join(' ')}>\n <ListContainer size={size} itemsType={customizationProps.itemsType} onScroll={handleScroll} ref={itemsListRef} scrollable={customizationProps.scrollable}>\n {customizationProps.menuContent &&\n <MenuContentContainer size={size}>\n {customizationProps.menuContent}\n <DividerContainer size={size}>\n <div className=\"divider\" />\n </DividerContainer>\n </MenuContentContainer>}\n {customizationProps.pinTopItem && getTopItem()}\n {getElements()}\n </ListContainer>\n {customizationProps.action && customizationProps.actionLabel && (\n <ActionButtonContainer size={size}>\n <Button width=\"100%\" icon={customizationProps.actionIcon}\n loading={customizationProps.actionLoading}\n disabled={customizationProps.actionDisabled}\n variant={customizationProps.actionVariant ?? 'primary'}\n size={size} onClick={() => \n {\n if(customizationProps.action()) //closing the dropdown if action returns 'true'\n setIsOpen(false);\n }}>\n {customizationProps.actionLabel}\n </Button>\n </ActionButtonContainer>\n )}\n </DDContainer>\n );\n /* ),\n {\n handleClickOutside: () => () => {\n if (isOpen) {\n setIsOpen(false);\n setFocused(null);\n }\n },\n },\n );\n\n return <Wrapped />; */\n};\n\nexport default DropdownContent;\n"],"file":"DropdownContent.js"}
1
+ {"version":3,"sources":["../../../src/Dropdown/DropdownContent.tsx"],"names":["React","useLayoutEffect","createRef","styled","Button","Size","ButtonDropdownContentStyling","DropdownButtonCSS","ComponentLStyling","ComponentXLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Checkbox","RadioButton","Z_INDEXES","DDContainer","div","white","props","width","dropdown","isButton","alignLeft","neutral_100","size","Large","Medium","scrollable","maxHeight","ItemsContainer","hover","active","focus","ListContainer","itemsType","neutral_600","neutral_500","MenuContentContainer","Bold","Small","Regular","DividerContainer","TopItemContainer","neutral_200","ActionButtonContainer","MAX_MENU_HEIGHT","AVG_OPTION_HEIGHT","DropdownContent","id","customizationProps","isOpen","hideOnClickOutside","setIsOpen","filter","focused","setFocused","selectedValues","setSelectedValues","messageOnNoResults","isUp","setIsUp","useState","dropdownContentRef","useRef","itemsListRef","determineDropUp","options","items","node","current","windowHeight","window","innerHeight","menuHeight","Math","min","length","instOffsetWithMenu","getBoundingClientRect","top","setNewFocusedElement","index","newFocusedElement","elRefs","getFilteredItems","filtrationString","toUpperCase","x","value","includes","displayLabel","handleKeyDown","e","keyCode","preventDefault","focusedNow","undefined","filtered","haveTopItem","i","disabled","document","getElementById","handleClickOutside","contains","target","some","useEffect","addEventListener","removeEventListener","scrollPosition","handleScroll","scrollTop","getCorrectRef","ref","arrLength","setElRefs","Array","fill","map","_","multiSelect","getSuggestions","suggestion","focusThis","handleItemClick","selected","item","newValue","onValueUpdate","getTopItem","pinTopItem","visibleItems","allSelected","y","showTopItem","suggestions","find","c","selectedFirst","newValues","icon","noteLabel","fontSize","getElements","number","customContent","showDividerAbove","join","menuContent","action","actionLabel","actionIcon","actionLoading","actionDisabled","actionVariant"],"mappings":";AAAA,OAAOA,KAAP,IAAgBC,eAAhB,EAA0CC,SAA1C,QAA2D,OAA3D;AACA,OAAOC,MAAP,MAA4B,mBAA5B;AAEA,OAAOC,MAAP,MAAmB,kBAAnB;AACA,SAASC,IAAT,QAAqB,UAArB;AACA,SAASC,4BAAT,EAAuCC,iBAAvC,QAAgE,iBAAhE;AACA,SAASC,iBAAT,EAA4BC,kBAA5B,EAAgDC,iBAAhD,EAAmEC,iBAAnE,EAAsFC,kBAAtF,QAAgH,sBAAhH;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,QAAT,EAAmBC,WAAnB,QAAsC,gBAAtC;AACA,SAAQC,SAAR,QAAwB,qBAAxB;AAEA,OAAO,MAAMC,WAAW,GAAGd,MAAM,CAACe,GAAuH;AACzJ;AACA;AACA,sBAAsBL,MAAM,CAACM,KAAM;AACnC;AACA,WAAYC,KAAD,IAAYA,KAAK,CAACC,KAAN,GAAcD,KAAK,CAACC,KAApB,GAA4B,MAAQ;AAC3D,aAAaL,SAAS,CAACM,QAAS;AAChC,YAAaF,KAAD,IAAYA,KAAK,CAACG,QAAN,GAAiB,MAAjB,GAA0B,SAAW;AAC7D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAKH,KAAD,IAAYA,KAAK,CAACI,SAAN,GAAkB,YAAlB,GAAiC,EAAI;AACrD;AACA,IAAKJ,KAAD,IAAYA,KAAK,CAACG,QAAN,GAAiBjB,4BAAjB,GAAgD,EAAI;AACpE;AACA,sBAAsBO,MAAM,CAACY,WAAY;AACzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAgBL,KAAD,IAAYA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,OAA3B,GAAqCP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,OAA5B,GAAsC,OAAS;AAC/G,mBAAoBR,KAAD,IAAYA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,MAA3B,GAAoCP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,KAA5B,GAAoC,KAAO;AAC9G;AACA,gBAAiBR,KAAD,IAAY,CAACA,KAAK,CAACS,UAAP,GAAoB,MAApB,GAA6BT,KAAK,CAACU,SAAN,GAAkBV,KAAK,CAACU,SAAxB,GAAoCV,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,OAA3B,GAAqCP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,OAA5B,GAAsC,OAAS;AACjL,CApCO;AAsCP,MAAMG,cAAc,GAAG5B,MAAM,CAACe,GAAoB;AAClD;AACA,eAAeF,SAAS,CAACgB,KAAM;AAC/B;AACA;AACA;AACA,eAAehB,SAAS,CAACiB,MAAO;AAChC;AACA;AACA,eAAejB,SAAS,CAACkB,KAAM;AAC/B;AACA;AACA;AACA,MAAMd,KAAK,IAAIb,iBAAiB,CAACa,KAAK,CAACM,IAAP,CAAa;AAC7C,IAdA;AAgBA,MAAMS,aAAa,GAAGhC,MAAM,CAACe,GAA+D;AAC5F,IAAKE,KAAD,IAAYA,KAAK,CAACS,UAAN,GAAmB,qBAAnB,GAA2C,EAAI;AAC/D,IAAKT,KAAD,IAAYA,KAAK,CAACgB,SAAN,IAAmB,QAAnB,GAA8B,mBAA9B,GAAoD,EAAI;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIL,cAAe;AACnB,mBAAmBX,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,KAA3B,GAAmCP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,KAA5B,GAAoC,KAAO;AAC1G,sBAAsBR,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,KAA3B,GAAmCP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,KAA5B,GAAoC,KAAO;AAC7G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBf,MAAM,CAACY,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA,kBAAkBZ,MAAM,CAACwB,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA,kBAAkBxB,MAAM,CAACyB,WAAY;AACrC;AACA,CA1CA;AA6CA,MAAMC,oBAAoB,GAAGpC,MAAM,CAACe,GAAoB;AACxD;AACA;AACA;AACA,MAAME,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,IAA4BlB,kBAAkB,CAACG,kBAAkB,CAAC4B,IAApB,EAA0B3B,MAAM,CAACyB,WAAjC,CAA8C;AAC3G,MAAMlB,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,IAA6BpB,iBAAiB,CAACI,kBAAkB,CAAC4B,IAApB,EAA0B3B,MAAM,CAACyB,WAAjC,CAA8C;AAC3G,MAAMlB,KAAK,IAAI,CAACA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAApC,KAA6ChB,iBAAiB,CAACE,kBAAkB,CAAC4B,IAApB,EAA0B3B,MAAM,CAACyB,WAAjC,CAA8C;AAC3H,eAAelB,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAAnC,GAA0C,eAA1C,GAClBN,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,eAA5B,GAA8C,eAAgB;AACpE;AACA;AACA;AACA;AACA;AACA,MAAMR,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,IAA4BnB,iBAAiB,CAACI,kBAAkB,CAAC8B,OAApB,EAA6B7B,MAAM,CAACyB,WAApC,CAAiD;AAC7G,MAAMlB,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,IAA6BlB,iBAAiB,CAACE,kBAAkB,CAAC8B,OAApB,EAA6B7B,MAAM,CAACyB,WAApC,CAAiD;AAC9G,MAAMlB,KAAK,IAAI,CAACA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAApC,KAA6Cf,iBAAiB,CAACC,kBAAkB,CAAC8B,OAApB,EAA6B7B,MAAM,CAACyB,WAApC,CAAiD;AAC9H,eAAelB,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAAnC,GAA0C,UAA1C,GAClBN,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,WAA5B,GAA0C,WAAY;AAC5D;AACA,CApBA;AAsBA,MAAMe,gBAAgB,GAAGxC,MAAM,CAACe,GAAoB;AACpD;AACA;AACA,gBAAgBE,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACsB,KAAnB,GAA2B,MAA3B,GACnBP,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACuB,MAAnB,GAA4B,MAA5B,GACCR,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAApC,GAA4C,KAA5C,GAAoD,KAAM;AAChE;AACA;AACA;AACA;AACA;AACA,CAXA;AAaA,MAAMkB,gBAAgB,GAAGzC,MAAM,CAACe,GAAkB;AAClD;AACA,yBAAyBL,MAAM,CAACgC,WAAY;AAC5C;AACA;AACA;AACA;AACA,MAAMzB,KAAK,IAAIb,iBAAiB,CAACa,KAAK,CAACM,IAAP,CAAa;AAC7C;AACA,CATA;AAWA,MAAMoB,qBAAqB,GAAG3C,MAAM,CAACe,GAAkB;AACvD;AACA,sBAAsBL,MAAM,CAACgC,WAAY;AACzC;AACA;AACA,aAAazB,KAAK,IAAIA,KAAK,CAACM,IAAN,IAAcrB,IAAI,CAACoC,KAAnB,IAA4B,CAACrB,KAAK,CAACM,IAAnC,GAA0C,UAA1C,GAAuD,UAAW;AACxF;AACA;AACA;AACA;AACA,CAVA;AAYA,MAAMqB,eAAe,GAAG,GAAxB;AACA,MAAMC,iBAAiB,GAAG,EAA1B;;AAgDA,MAAMC,eAAuD,GAAG,CAAC;AAC/DC,EAAAA,EAD+D;AAE/DC,EAAAA,kBAF+D;AAG/D3B,EAAAA,SAH+D;AAI/DD,EAAAA,QAJ+D;AAK/DG,EAAAA,IAL+D;AAM/D0B,EAAAA,MAN+D;AAO/DC,EAAAA,kBAP+D;AAQ/DhC,EAAAA,KAR+D;AAS/DiC,EAAAA,SAT+D;AAU/DC,EAAAA,MAV+D;AAW/DC,EAAAA,OAX+D;AAY/DC,EAAAA,UAZ+D;AAa/DC,EAAAA,cAb+D;AAc/DC,EAAAA,iBAd+D;AAe/DC,EAAAA;AAf+D,CAAD,KAgB1D;AACJ,QAAM,CAACC,IAAD,EAAOC,OAAP,IAAkB9D,KAAK,CAAC+D,QAAN,CAAwB,KAAxB,CAAxB;AACA,QAAMC,kBAAkB,GAAGhE,KAAK,CAACiE,MAAN,CAA6B,IAA7B,CAA3B;AAEA,MAAI,CAACd,kBAAkB,CAACf,SAAxB,EAAmCe,kBAAkB,CAACf,SAAnB,GAA+B,QAA/B;AACnC,MAAI,CAACV,IAAL,EAAWA,IAAI,GAAGrB,IAAI,CAACoC,KAAZ;AAEX,QAAMyB,YAAY,GAAGlE,KAAK,CAACiE,MAAN,CAA6B,IAA7B,CAArB;;AAEA,QAAME,eAAe,GAAG,MAAM;AAC5B,UAAMC,OAAO,GAAGjB,kBAAkB,CAACkB,KAAnC;AACA,UAAMC,IAAI,GAAGN,kBAAkB,CAACO,OAAhC;AAEA,QAAI,CAACD,IAAL,EAAW;AAEX,UAAME,YAAY,GAAGC,MAAM,CAACC,WAA5B;AACA,UAAMC,UAAU,GAAGC,IAAI,CAACC,GAAL,CAAS9B,eAAT,EAA0BqB,OAAO,CAACU,MAAR,GAAiB9B,iBAA3C,CAAnB;AACA,UAAM+B,kBAAkB,GAAGT,IAAI,CAACU,qBAAL,GAA6BC,GAA7B,GAAmCN,UAA9D;AACAb,IAAAA,OAAO,CAACiB,kBAAkB,IAAIP,YAAvB,CAAP;AACD,GAVD;;AAYA,QAAMU,oBAAoB,GAAIC,KAAD,IAAmB;AAC9C,UAAMC,iBAAiB,GAAGC,MAAM,CAACF,KAAD,CAAhC;;AACA,QAAIC,iBAAJ,EAAuB;AACrB3B,MAAAA,UAAU,CAAC0B,KAAD,CAAV;AACAC,MAAAA,iBAAiB,EAAEb,OAAnB,EAA4BrC,KAA5B;AACD;AACF,GAND;;AAQA,QAAMoD,gBAAgB,GAAG,MAAM;AAC7B,UAAMC,gBAAgB,GAAG,CAAChC,MAAM,IAAI,EAAX,EAAeiC,WAAf,EAAzB;AACA,WAAOrC,kBAAkB,CAACkB,KAAnB,CAAyBd,MAAzB,CAAiCkC,CAAD,IAAOA,CAAC,EAAEC,KAAH,EAAUF,WAAV,GAAwBG,QAAxB,CAAiCJ,gBAAjC,KAAsDE,CAAC,EAAEG,YAAH,EAAiBJ,WAAjB,GAA+BG,QAA/B,CAAwCJ,gBAAxC,CAA7F,CAAP;AACD,GAHD;;AAKA,QAAMM,aAAa,GAAIC,CAAD,IAAY;AAChC,QAAI1C,MAAJ,EAAY;AACV,UAAI0C,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpBD,QAAAA,CAAC,CAACE,cAAF;AACA,YAAIC,UAAU,GAAGzC,OAAjB;;AACA,YAAIyC,UAAU,KAAKC,SAAf,IAA4BD,UAAU,KAAK,IAA3C,IAAmDA,UAAU,GAAG,CAApE,EAAuE;AACrE,gBAAME,QAAQ,GAAGb,gBAAgB,EAAjC;AACA,cAAGW,UAAU,IAAI,CAAd,IAAmBG,WAAW,EAAjC,EACEH,UAAU,GAAG,CAAb,CADF,KAEK;AACH,iBAAK,IAAII,CAAC,GAAGJ,UAAU,GAAG,CAA1B,EAA6BI,CAAC,GAAG,CAAjC,EAAoCA,CAAC,EAArC,EAAyC;AACvC,kBAAI,CAACF,QAAQ,CAACE,CAAC,GAAG,CAAL,CAAR,EAAiBC,QAAtB,EAAgC;AAC9BL,gBAAAA,UAAU,GAAGI,CAAb;AACA;AACD;AACF;AACF;AACDnB,UAAAA,oBAAoB,CAACe,UAAD,CAApB;AACD;AACF,OAjBD,MAiBO,IAAIH,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AAC3BD,QAAAA,CAAC,CAACE,cAAF;AACA,YAAIC,UAAU,GAAGzC,OAAjB;;AACA,YAAIyC,UAAU,KAAKC,SAAf,IAA4BD,UAAU,KAAK,IAA/C,EAAqD;AACnD,gBAAME,QAAQ,GAAGb,gBAAgB,EAAjC;;AACA,eAAK,IAAIe,CAAC,GAAGJ,UAAU,GAAG,CAA1B,EAA6BI,CAAC,IAAIF,QAAQ,CAACrB,MAA3C,EAAmDuB,CAAC,EAApD,EAAwD;AACtD,gBAAI,CAACF,QAAQ,CAACE,CAAC,GAAG,CAAL,CAAR,EAAiBC,QAAtB,EAAgC;AAC9BL,cAAAA,UAAU,GAAGI,CAAb;AACA;AACD;AACF;AACF,SARD,MAQO;AACLJ,UAAAA,UAAU,GAAGG,WAAW,KAAK,CAAL,GAAS,CAAjC;AACD;;AACDlB,QAAAA,oBAAoB,CAACe,UAAD,CAApB;AACD,OAfM,MAeA,IAAIH,CAAC,CAACC,OAAF,KAAc,CAAlB,EAAqB;AAC1BD,QAAAA,CAAC,CAACE,cAAF;AACA,YAAIC,UAAU,GAAGzC,OAAjB;;AACA,YAAIyC,UAAU,KAAKC,SAAf,IAA4BD,UAAU,KAAK,IAA/C,EAAqD;AACnDA,UAAAA,UAAU;AACV,gBAAMb,iBAAiB,GAAGmB,QAAQ,CAACC,cAAT,CAAyB,GAAEtD,EAAG,IAAG+C,UAAW,EAA5C,CAA1B;;AACA,cAAI,CAACb,iBAAL,EAAwB;AACtBF,YAAAA,oBAAoB,CAAC,CAAD,CAApB;AACD,WAFD,MAEO;AACLA,YAAAA,oBAAoB,CAACe,UAAD,CAApB;AACD;AACF,SARD,MAQO;AACLxC,UAAAA,UAAU,CAAC,IAAD,CAAV;AACD;AACF,OAdM,MAcA,IAAIqC,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AAC3BzC,QAAAA,SAAS,CAAC,KAAD,CAAT;AACAG,QAAAA,UAAU,CAAC,IAAD,CAAV,CAF2B,CAI3B;;AACA;AACR;AACA;AACA;AACA;AACA;AACO;AACF;AACF,GA7DD;;AA+DA,QAAMgD,kBAAkB,GAAIX,CAAD,IAAY;AACrC,QAAIzC,kBAAkB,IAAIW,kBAAkB,EAAEO,OAA1C,IAAqD,CAACP,kBAAkB,CAACO,OAAnB,CAA2BmC,QAA3B,CAAoCZ,CAAC,CAACa,MAAtC,CAAtD,IAAuG,CAACtB,MAAM,CAACuB,IAAP,CAAanB,CAAD,IAAOA,CAAC,EAAElB,OAAH,EAAYmC,QAAZ,CAAqBZ,CAAC,CAACa,MAAvB,CAAnB,CAA5G,EAAgK;AAC9J,UAAIvD,MAAJ,EAAY;AACVE,QAAAA,SAAS,CAAC,KAAD,CAAT;AACAG,QAAAA,UAAU,CAAC,IAAD,CAAV;AACD;AACF;AACF,GAPD;;AASAzD,EAAAA,KAAK,CAAC6G,SAAN,CAAgB,MAAM;AACpBN,IAAAA,QAAQ,CAACO,gBAAT,CAA0B,SAA1B,EAAqCjB,aAArC;AACAU,IAAAA,QAAQ,CAACO,gBAAT,CAA0B,OAA1B,EAAmCL,kBAAnC;AACA,WAAO,MAAM;AACXF,MAAAA,QAAQ,CAACQ,mBAAT,CAA6B,SAA7B,EAAwClB,aAAxC;AACAU,MAAAA,QAAQ,CAACQ,mBAAT,CAA6B,OAA7B,EAAsCN,kBAAtC;AACD,KAHD;AAID,GAPD;AASA,QAAMO,cAAc,GAAGhH,KAAK,CAACiE,MAAN,CAAiC,CAAjC,CAAvB;;AACA,QAAMgD,YAAY,GAAG,MAAM;AACzBD,IAAAA,cAAc,CAACzC,OAAf,GAAyBL,YAAY,CAACK,OAAb,EAAsB2C,SAA/C;AACD,GAFD;;AAGAjH,EAAAA,eAAe,CAAC,MAAM;AACpB,QAAIiE,YAAY,CAACK,OAAjB,EAA0BL,YAAY,CAACK,OAAb,CAAqB2C,SAArB,GAAiCF,cAAc,CAACzC,OAAf,IAA0B,CAA3D;AAC3B,GAFc,EAEZ,CAACb,cAAD,CAFY,CAAf;;AAIA,QAAMyD,aAAa,GAAIC,GAAD,IAAqE;AACzF,YAAQjE,kBAAkB,CAACf,SAA3B;AACE,WAAK,QAAL;AACE,eAAQgF,GAAD,iBAA+ClH,SAAS,EAA/D;;AACF;AACE,eAAQkH,GAAD,iBAA4ClH,SAAS,EAA5D;AAJJ;AAMD,GAPD;;AASA,QAAMmH,SAAS,GAAG/B,gBAAgB,GAAGR,MAArC;AACA,QAAM,CAACO,MAAD,EAASiC,SAAT,IAAsBtH,KAAK,CAAC+D,QAAN,CAA+C,EAA/C,CAA5B;AAEA/D,EAAAA,KAAK,CAAC6G,SAAN,CAAgB,MAAM;AACpBS,IAAAA,SAAS,CAAEjC,MAAD,IACRkC,KAAK,CAACF,SAAS,GAAG,CAAb,CAAL,CACGG,IADH,CACQ,IADR,EAEGC,GAFH,CAEO,CAACC,CAAD,EAAIrB,CAAJ,KAAUc,aAAa,CAAC9B,MAAM,CAACgB,CAAD,CAAP,CAF9B,CADO,CAAT;AAKD,GAND,EAMG,CAACjD,MAAD,EAASiE,SAAT,EAAoB3D,cAApB,CANH;AAQA1D,EAAAA,KAAK,CAAC6G,SAAN,CAAgB,MAAM;AACpB1C,IAAAA,eAAe;AAChB,GAFD,EAEG,CAACf,MAAD,CAFH;;AAIA,QAAMgD,WAAW,GAAG,MAAM;AACxB,QAAIjD,kBAAkB,CAACf,SAAnB,IAAgC,OAAhC,IAA2CsB,cAA3C,IAA6DA,cAAc,EAAEoB,MAAhB,GAAyB,CAA1F,EAA6F,OAAO,IAAP,CAA7F,KACK,IAAI3B,kBAAkB,CAACf,SAAnB,IAAgC,UAAhC,KAA+Ce,kBAAkB,CAACwE,WAAnB,IAAkCjE,cAAc,EAAEoB,MAAhB,GAAyB,CAA1G,CAAJ,EAAkH,OAAO,IAAP,CAAlH,KACA,IAAI3B,kBAAkB,CAACf,SAAnB,IAAgC,QAAhC,IAA4CwF,cAAc,IAAI9C,MAAlB,GAA2B,CAA3E,EAA8E,OAAO,IAAP;AACnF,WAAO,KAAP;AACD,GALD;;AAOA,QAAM8C,cAAc,GAAG,MAAM;AAC3B,WAAOtC,gBAAgB,GAAG/B,MAAnB,CAA2BkC,CAAD,IAAOA,CAAC,CAACoC,UAAnC,CAAP;AACD,GAFD;;AAIA7H,EAAAA,KAAK,CAACC,eAAN,CAAsB,MAAM;AAC1B,QAAImD,MAAM,KAAKI,OAAO,IAAIA,OAAO,IAAI,CAA3B,CAAV,EAAyC;AACvC,YAAMsE,SAAS,GAAGtE,OAAO,IAAI,CAAX,IAAgB,CAAC4C,WAAW,EAA5B,GAAiC,CAAjC,GAAqC5C,OAAvD;AACA,UAAIsE,SAAS,IAAItE,OAAjB,EAA0BC,UAAU,CAACqE,SAAD,CAAV;AAC1B,YAAM1C,iBAAiB,GAAGC,MAAM,CAACyC,SAAD,CAAhC;AACA1C,MAAAA,iBAAiB,EAAEb,OAAnB,EAA4BrC,KAA5B;AACD,KALD,MAKOuB,UAAU,CAAC,IAAD,CAAV,CANmB,CAMD;;AAC1B,GAPD,EAOG,CAACL,MAAD,CAPH;;AASA,QAAM2E,eAAe,GAAG,CAACC,QAAD,EAAoBC,IAApB,KAA2C;AAC/D,QAAIC,QAAkB,GAAG,EAAzB;;AACA,QAAI/E,kBAAkB,CAACwE,WAAvB,EAAoC;AAClC,UAAIK,QAAJ,EAAcE,QAAQ,GAAG,CAAC,GAAGxE,cAAJ,EAAoBuE,IAAI,CAACvC,KAAzB,CAAX,CAAd,KACKwC,QAAQ,GAAGxE,cAAc,CAACH,MAAf,CAAuBkC,CAAD,IAAOA,CAAC,IAAIwC,IAAI,CAACvC,KAAvC,CAAX;AACN,KAHD,MAGOwC,QAAQ,GAAGF,QAAQ,GAAG,CAACC,IAAI,CAACvC,KAAN,CAAH,GAAkB,EAArC;;AAEP/B,IAAAA,iBAAiB,CAACuE,QAAD,CAAjB;AACA,QAAG/E,kBAAkB,CAACgF,aAAnB,IAAoChF,kBAAkB,CAACgF,aAAnB,CAAiCD,QAAjC,CAAvC,EACE5E,SAAS,CAAC,KAAD,CAAT;AACL,GAVD;;AAYA,QAAM8E,UAAU,GAAG,MAAM;AACvB,QAAI,CAACjF,kBAAkB,CAACkF,UAAxB,EAAoC;AACpC,UAAMC,YAAY,GAAGhD,gBAAgB,EAArC;AACA,UAAMiD,WAAW,GAAG7E,cAAc,EAAEH,MAAhB,CAAwBkC,CAAD,IAAO6C,YAAY,CAAC1B,IAAb,CAAmB4B,CAAD,IAAOA,CAAC,CAAC9C,KAAF,IAAWD,CAApC,CAA9B,EAAsEX,MAAtE,IAAgFwD,YAAY,CAACxD,MAAjH;AACA,QAAI2D,WAAW,GAAG,KAAlB;AACA,UAAMC,WAAW,GAAGd,cAAc,EAAlC;AACA,UAAMhC,YAAY,GAAGlC,cAAc,CAAC,CAAD,CAAd,GAAoBP,kBAAkB,CAACkB,KAAnB,EAA0BsE,IAA1B,CAAgCC,CAAD,IAAOA,CAAC,CAAClD,KAAF,KAAYhC,cAAc,CAAC,CAAD,CAAhE,GAAsEkC,YAA1F,GAAyGM,SAA9H;AACA,QAAI/C,kBAAkB,CAACf,SAAnB,IAAgC,OAAhC,IAA2CsB,cAA3C,IAA6DA,cAAc,EAAEoB,MAAhB,GAAyB,CAA1F,EAA6F2D,WAAW,GAAG,IAAd,CAA7F,KACK,IAAItF,kBAAkB,CAACf,SAAnB,IAAgC,UAAhC,KAA+Ce,kBAAkB,CAACwE,WAAnB,IAAkCjE,cAAc,EAAEoB,MAAhB,GAAyB,CAA1G,CAAJ,EAAkH2D,WAAW,GAAG,IAAd,CAAlH,KACA,IAAItF,kBAAkB,CAACf,SAAnB,IAAgC,QAAhC,IAA4CsG,WAAW,CAAC5D,MAAZ,GAAqB,CAArE,EAAwE2D,WAAW,GAAG,IAAd;AAE7E,QAAI,CAACA,WAAL,EAAkB;AAElB,UAAMI,aAAa,GAAGnF,cAAc,CAACoB,MAAf,GAAwB,CAAxB,GAA4BwD,YAAY,CAACK,IAAb,CAAkBlD,CAAC,IAAIA,CAAC,CAACC,KAAF,IAAWhC,cAAc,CAAC,CAAD,CAAhD,CAA5B,GAAmF,IAAzG;AAEA,wBACE,oBAAC,gBAAD;AAAkB,MAAA,IAAI,EAAEhC;AAAxB,OACGyB,kBAAkB,CAACf,SAAnB,IAAgC,OAAhC,iBACC,oBAAC,WAAD;AACE,MAAA,GAAG,EAAEiD,MAAM,CAAC,CAAD,CADb;AAEE,MAAA,4BAA4B,EAAE,IAFhC;AAGE,MAAA,MAAM,EAAE,MAAM,CAAE,CAHlB;AAGoB,MAAA,KAAK,EAAEwD,aAAa,EAAEjD,YAAf,IAA+BiD,aAAa,EAAEnD,KAHzE;AAIE,MAAA,IAAI,EAAEhE,IAJR;AAKE,MAAA,EAAE,EAAG,GAAEwB,EAAG,UALZ;AAME,MAAA,QAAQ,EAAE;AANZ,MAFJ,EAWGC,kBAAkB,CAACf,SAAnB,IAAgC,UAAhC,iBACC,oBAAC,QAAD;AACE,MAAA,GAAG,EAAEiD,MAAM,CAAC,CAAD,CADb;AAEE,MAAA,MAAM,EAAG2C,QAAD,IAAuB;AAC7B,YAAI,CAAC7E,kBAAkB,CAACwE,WAAxB,EAAqC;AAErC,cAAMmB,SAAS,GAAGd,QAAQ,GAAGM,YAAY,CAACb,GAAb,CAAkBhC,CAAD,IAAOA,CAAC,CAACC,KAA1B,CAAH,GAAsC,EAAhE;AACA/B,QAAAA,iBAAiB,CAACmF,SAAD,CAAjB;AACA,YAAG3F,kBAAkB,CAACgF,aAAnB,IAAoChF,kBAAkB,CAACgF,aAAnB,CAAiCW,SAAjC,CAAvC,EACExF,SAAS,CAAC,KAAD,CAAT;AACH,OATH;AAUE,MAAA,4BAA4B,EAAE,IAVhC;AAWE,MAAA,YAAY,EAAEH,kBAAkB,CAACwE,WAAnB,IAAkC,CAACY,WAAnC,IAAkD7E,cAAc,EAAEoB,MAAhB,GAAyB,CAX3F;AAYE,MAAA,IAAI,EAAEpD,IAZR;AAaE,MAAA,EAAE,EAAG,GAAEwB,EAAG,qBAbZ;AAcE,MAAA,KAAK,EAAEC,kBAAkB,CAACwE,WAAnB,GAAiC,YAAjC,GAAiDkB,aAAa,EAAEjD,YAAf,IAA+BiD,aAAa,EAAEnD,KAdxG;AAeE,MAAA,QAAQ,EAAE,CAACvC,kBAAkB,CAACwE,WAApB,IAAmCY;AAf/C,MAZJ,EA8BGpF,kBAAkB,CAACf,SAAnB,IAAgC,QAAhC,iBACC,0CACGsG,WAAW,CAACjB,GAAZ,CAAiBhC,CAAD,iBACjB;AACI,MAAA,GAAG,EAAEJ,MAAM,CAAC,CAAD,CADf;AAEI,MAAA,IAAI,EAAC,QAFT;AAGI,MAAA,EAAE,EAAG,GAAEnC,EAAG,UAHd;AAII,MAAA,GAAG,EAAG,GAAEA,EAAG,YAAWuC,CAAC,CAACC,KAAM,EAJlC;AAKI,MAAA,OAAO,EAAGI,CAAD,IAAY;AACnB3C,QAAAA,kBAAkB,CAACgF,aAAnB,CAAiC,CAAC1C,CAAC,CAACC,KAAH,CAAjC;AACA/B,QAAAA,iBAAiB,CAAC,CAAC8B,CAAC,CAACC,KAAH,CAAD,CAAjB;AACApC,QAAAA,SAAS,CAAC,KAAD,CAAT;AACAG,QAAAA,UAAU,CAAC,IAAD,CAAV;AACD;AAVL,oBAWI;AAAK,MAAA,SAAS,EAAC;AAAf,OACGgC,CAAC,EAAEsD,IAAH,iBAAW;AAAK,MAAA,SAAS,EAAC;AAAf,OAA4BtD,CAAC,EAAEsD,IAA/B,CADd,eAEE;AAAK,MAAA,SAAS,EAAC;AAAf,OACGtD,CAAC,EAAEG,YAAH,IAAmBH,CAAC,EAAEC,KADzB,EAEGD,CAAC,EAAEuD,SAAH,iBAAgB;AAAK,MAAA,KAAK,EAAE;AAAEC,QAAAA,QAAQ,EAAE;AAAZ;AAAZ,OAAmCxD,CAAC,CAACuD,SAArC,CAFnB,CAFF,CAXJ,CADC,CADH,CA/BJ,CADF;AAyDD,GAxED;;AA0EA,QAAME,WAAW,GAAG,MAAM;AACxB,QAAI5D,gBAAgB,GAAGR,MAAnB,KAA8B,CAAlC,EAAqC;AACnC,0BACE,oBAAC,cAAD;AAAgB,QAAA,IAAI,EAAEpD;AAAtB,sBACE;AAAQ,QAAA,SAAS,EAAC,gBAAlB;AAAmC,QAAA,QAAQ;AAA3C,sBACE,kCAAOkC,kBAAP,CADF,CADF,CADF;AAOD;;AACD,QAAIuF,MAAM,GAAG,CAAb;AACA,wBACE,oBAAC,cAAD;AAAgB,MAAA,IAAI,EAAEzH;AAAtB,OACG4D,gBAAgB,GACd/B,MADF,CACUkC,CAAD,IAAOA,CAAC,KAAKtC,kBAAkB,CAACf,SAAnB,IAAgC,QAAhC,IAA4C,CAACqD,CAAC,CAACoC,UAApD,CADjB,EAEEJ,GAFF,CAEOQ,IAAD,IAAU;AACb,0BACE,oBAAC,KAAD,CAAO,QAAP;AAAgB,QAAA,GAAG,EAAG,OAAM/E,EAAG,IAAG+E,IAAI,CAACvC,KAAM;AAA7C,SACCuC,IAAI,CAACmB,aADN,EAEC,CAACnB,IAAI,CAACmB,aAAN,IAAuBjG,kBAAkB,CAACf,SAAnB,IAAgC,OAAvD,iBACG,oBAAC,WAAD;AACE,QAAA,MAAM,EAAG4F,QAAD,IAAsBD,eAAe,CAACC,QAAD,EAAWC,IAAX,CAD/C;AAEE,QAAA,GAAG,EAAE5C,MAAM,CAAC8D,MAAM,GAAG,CAAV,CAFb;AAGE,QAAA,IAAI,EAAEzH,IAHR;AAIE,QAAA,4BAA4B,EAAE,IAJhC;AAKE,QAAA,QAAQ,EAAEuG,IAAI,EAAE3B,QALlB;AAME,QAAA,GAAG,EAAG,OAAMpD,EAAG,IAAGiG,MAAM,EAAG,EAN7B;AAOE,QAAA,EAAE,EAAG,GAAEjG,EAAG,IAAGiG,MAAM,GAAG,CAAE,EAP1B;AAQE,QAAA,KAAK,EAAElB,IAAI,CAACrC,YAAL,IAAqBqC,IAAI,CAACvC,KARnC;AASE,QAAA,QAAQ,EAAEhC,cAAc,EAAEiC,QAAhB,CAAyBsC,IAAI,CAACvC,KAA9B;AATZ,QAHJ,EAeC,CAACuC,IAAI,CAACmB,aAAN,IAAuBjG,kBAAkB,CAACf,SAAnB,IAAgC,UAAvD,iBACG,oBAAC,QAAD;AACE,QAAA,MAAM,EAAG4F,QAAD,IAAsBD,eAAe,CAACC,QAAD,EAAWC,IAAX,CAD/C;AAEE,QAAA,4BAA4B,EAAE,IAFhC;AAGE,QAAA,QAAQ,EAAEA,IAAI,EAAE3B,QAHlB;AAIE,QAAA,GAAG,EAAEjB,MAAM,CAAC8D,MAAM,GAAG,CAAV,CAJb;AAKE,QAAA,IAAI,EAAEzH,IALR;AAME,QAAA,GAAG,EAAG,OAAMwB,EAAG,IAAGiG,MAAM,EAAG,EAN7B;AAOE,QAAA,EAAE,EAAG,GAAEjG,EAAG,IAAGiG,MAAM,GAAG,CAAE,EAP1B;AAQE,QAAA,KAAK,EAAElB,IAAI,CAACrC,YAAL,IAAqBqC,IAAI,CAACvC,KARnC;AASE,QAAA,QAAQ,EAAEhC,cAAc,EAAEiC,QAAhB,CAAyBsC,IAAI,CAACvC,KAA9B;AATZ,QAhBJ,EA4BC,CAACuC,IAAI,CAACmB,aAAN,KAAwBjG,kBAAkB,CAACf,SAAnB,IAAgC,QAAhC,IAA4C,CAACe,kBAAkB,CAACf,SAAxF,kBACG;AACE,QAAA,IAAI,EAAC,QADP;AAEE,QAAA,QAAQ,EAAE6F,IAAI,EAAE3B,QAFlB;AAGE,QAAA,GAAG,EAAEjB,MAAM,CAAC8D,MAAM,GAAG,CAAV,CAHb;AAIE,QAAA,OAAO,EAAGrD,CAAD,IAAY;AACnB3C,UAAAA,kBAAkB,CAACgF,aAAnB,CAAiC,CAACF,IAAI,CAACvC,KAAN,CAAjC;AACA/B,UAAAA,iBAAiB,CAAC,CAACsE,IAAI,CAACvC,KAAN,CAAD,CAAjB;AACApC,UAAAA,SAAS,CAAC,KAAD,CAAT;AACAG,UAAAA,UAAU,CAAC,IAAD,CAAV;AACD,SATH;AAUE,QAAA,SAAS,EAAG,qBAAqBwE,IAAI,CAACoB,gBAAL,GAAwB,oBAAxB,GAA+C,EAApE,IAA0E,GAA1E,IAAiF3F,cAAc,EAAEiC,QAAhB,CAAyBsC,IAAI,CAACvC,KAA9B,IAAuC,QAAvC,GAAkD,EAAnI,CAVd;AAWE,QAAA,GAAG,EAAG,OAAMxC,EAAG,IAAGiG,MAAM,EAAG,EAX7B;AAYE,QAAA,EAAE,EAAG,GAAEjG,EAAG,IAAGiG,MAAM,GAAG,CAAE;AAZ1B,SAaGlB,IAAI,CAACoB,gBAAL,iBAAyB;AAAK,QAAA,SAAS,EAAC;AAAf,QAb5B,eAcE;AAAK,QAAA,SAAS,EAAC;AAAf,SACGpB,IAAI,CAACc,IAAL,iBAAa;AAAK,QAAA,SAAS,EAAC;AAAf,SAA4Bd,IAAI,CAACc,IAAjC,CADhB,eAEE;AAAK,QAAA,SAAS,EAAC;AAAf,SACGd,IAAI,CAACrC,YAAL,IAAqBqC,IAAI,CAACvC,KAD7B,EAEGuC,IAAI,CAACe,SAAL,iBAAkB;AAAK,QAAA,KAAK,EAAE;AAAEC,UAAAA,QAAQ,EAAE;AAAZ;AAAZ,SAAmChB,IAAI,CAACe,SAAxC,CAFrB,CAFF,CAdF,CA7BJ,CADF;AAuDD,KA1DF,CADH,CADF;AA+DD,GA1ED;;AA4EA,sBACE,oBAAC,WAAD;AACE,IAAA,GAAG,EAAEhF,kBADP;AAEE,IAAA,IAAI,EAAEtC,IAFR;AAGE,IAAA,KAAK,EAAEL,KAHT;AAIE,IAAA,QAAQ,EAAEE,QAJZ;AAKE,IAAA,SAAS,EAAEC,SALb;AAME,IAAA,UAAU,EAAE2B,kBAAkB,CAACtB,UANjC;AAOE,IAAA,SAAS,EAAEsB,kBAAkB,CAACrB,SAPhC;AAQE,IAAA,SAAS,EAAE,CAACsB,MAAM,IAAI,MAAX,EAAmBS,IAAI,IAAI,IAA3B,EAAiCN,MAAjC,CAAyCuC,CAAD,IAAO,CAAC,CAACA,CAAjD,EAAoDwD,IAApD,CAAyD,GAAzD;AARb,kBASE,oBAAC,aAAD;AAAe,IAAA,IAAI,EAAE5H,IAArB;AAA2B,IAAA,SAAS,EAAEyB,kBAAkB,CAACf,SAAzD;AAAoE,IAAA,QAAQ,EAAE6E,YAA9E;AAA4F,IAAA,GAAG,EAAE/C,YAAjG;AAA+G,IAAA,UAAU,EAAEf,kBAAkB,CAACtB;AAA9I,KACOsB,kBAAkB,CAACoG,WAAnB,iBACC,oBAAC,oBAAD;AAAsB,IAAA,IAAI,EAAE7H;AAA5B,KACGyB,kBAAkB,CAACoG,WADtB,eAEE,oBAAC,gBAAD;AAAkB,IAAA,IAAI,EAAE7H;AAAxB,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,IADF,CAFF,CAFR,EAQGyB,kBAAkB,CAACkF,UAAnB,IAAiCD,UAAU,EAR9C,EASGc,WAAW,EATd,CATF,EAoBG/F,kBAAkB,CAACqG,MAAnB,IAA6BrG,kBAAkB,CAACsG,WAAhD,iBACC,oBAAC,qBAAD;AAAuB,IAAA,IAAI,EAAE/H;AAA7B,kBACM,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAC,MAAd;AAAqB,IAAA,IAAI,EAAEyB,kBAAkB,CAACuG,UAA9C;AACE,IAAA,OAAO,EAAEvG,kBAAkB,CAACwG,aAD9B;AAEE,IAAA,QAAQ,EAAExG,kBAAkB,CAACyG,cAF/B;AAGE,IAAA,OAAO,EAAEzG,kBAAkB,CAAC0G,aAAnB,IAAoC,SAH/C;AAIE,IAAA,IAAI,EAAEnI,IAJR;AAIc,IAAA,OAAO,EAAE,MACrB;AACE,UAAGyB,kBAAkB,CAACqG,MAAnB,EAAH,EAAgC;AAC9BlG,QAAAA,SAAS,CAAC,KAAD,CAAT;AACH;AARH,KASDH,kBAAkB,CAACsG,WATlB,CADN,CArBJ,CADF;AAsCA;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEC,CA3YD;;;AAjBElI,EAAAA,Q;AACA4B,EAAAA,kB;AAlBAf,IAAAA,S,aAAY,O,EAAU,U,EAAa,Q;AACnCmH,IAAAA,W;AACA1H,IAAAA,U;AACA8F,IAAAA,W;AACA7F,IAAAA,S;AACA2H,IAAAA,W;AAEAC,IAAAA,U;AACAC,IAAAA,a;AACAC,IAAAA,c;AACAJ,IAAAA,M;AACAnB,IAAAA,U;AACAF,IAAAA,a;AACA9D,IAAAA,K;AAxBAqB,MAAAA,K;AACAE,MAAAA,Y;AACAoD,MAAAA,S;AACAnB,MAAAA,U;AACAwB,MAAAA,gB;AACA/C,MAAAA,Q;AACAyC,MAAAA,I;AACAK,MAAAA,a;;;AAuBA5H,EAAAA,S;AACA4B,EAAAA,M;AACAE,EAAAA,S;AAEAJ,EAAAA,E;AACAK,EAAAA,M;AACAlC,EAAAA,K;AACAgC,EAAAA,kB;AACAK,EAAAA,c;AACAC,EAAAA,iB;AACAC,EAAAA,kB;AACAJ,EAAAA,O;AACAC,EAAAA,U;;AAgZF,eAAeR,eAAf","sourcesContent":["import React, { useLayoutEffect, useMemo, createRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport { CommonInteractionStyling } from '../common';\nimport Button from '../Button/Button';\nimport { Size } from '../types';\nimport { ButtonDropdownContentStyling, DropdownButtonCSS } from './CommonStyling';\nimport { ComponentLStyling, ComponentXLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS } from '../styles';\nimport { Checkbox, RadioButton } from '../InputFields';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport const DDContainer = styled.div<{ isButton: boolean; width?: string; alignLeft?: boolean; size?: Size; scrollable?: boolean; maxHeight?: string }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n\n width: ${(props) => (props.width ? props.width : '100%')};\n z-index: ${Z_INDEXES.dropdown};\n margin: ${(props) => (props.isButton ? '-4px' : '4px 0px')};\n\n &.show {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\n\n ${(props) => (props.alignLeft ? 'left: 0px;' : '')}\n\n ${(props) => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n border: 1px solid ${COLORS.neutral_100};\n box-sizing: border-box;\n box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n padding-top: 4px;\n padding-right: 0px;\n padding-bottom: 4px;\n padding-left: 0px;\n\n min-width: ${(props) => (props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n border-radius: ${(props) => (props.size == Size.Large ? '10px' : props.size == Size.Medium ? '8px' : '6px')};\n\n max-height: ${(props) => (!props.scrollable ? 'auto' : props.maxHeight ? props.maxHeight : props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n`;\n\nconst ItemsContainer = styled.div<{size? : Size}>`\n > *:hover {\n z-index: ${Z_INDEXES.hover};\n }\n > *:active,\n > *.active{\n z-index: ${Z_INDEXES.active};\n }\n > *:focus {\n z-index: ${Z_INDEXES.focus};\n }\n \n button.dropdownButton {\n ${props => DropdownButtonCSS(props.size)}\n }`;\n \nconst ListContainer = styled.div<{ scrollable?: boolean; size?: Size; itemsType?: string }>`\n ${(props) => (props.scrollable ? 'overflow-y: scroll;' : '')}\n ${(props) => (props.itemsType != 'normal' ? 'margin-left: 4px;' : '')}\n\n\n div.divider {\n display: block;\n width: calc(100% - 40px);\n margin-left: 16px;\n border-top: 1px solid #e5e5e5;\n position: absolute;\n top: 0px;\n }\n\n ${ItemsContainer} {\n padding-top: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n padding-bottom: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n }\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n margin: 0 6px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.neutral_100};\n border-radius: 8px;\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_600};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_500};\n }\n`;\n\n\nconst MenuContentContainer = styled.div<{size? : Size}>`\n h1, h2, h3 {\n margin-block-start: 0px;\n margin-block-end: 0px;\n ${props => props.size == Size.Large && ComponentXLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n ${props => props.size == Size.Medium && ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n ${props => (props.size == Size.Small || !props.size) && ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n padding: ${props => props.size == Size.Small || !props.size ? '10px 16px 6px' :\n props.size == Size.Medium ? '16px 24px 8px' : '16px 32px 8px'};\n }\n\n p {\n margin-block-start: 0px;\n margin-block-end: 0px;\n ${props => props.size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n ${props => props.size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n ${props => (props.size == Size.Small || !props.size) && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n padding: ${props => props.size == Size.Small || !props.size ? '8px 16px' :\n props.size == Size.Medium ? '12px 24px' : '16px 32px'};\n }\n`;\n\nconst DividerContainer = styled.div<{size? : Size}>`\n position: relative;\n\n margin-top: ${props => props.size == Size.Large ? '16px' : \n props.size == Size.Medium ? '12px' : \n (props.size == Size.Small || !props.size) ? '8px' : '6px'};\n\n div.divider {\n width: 100%;\n margin: 0px;\n }\n`;\n\nconst TopItemContainer = styled.div<{size?:Size}>`\n border-bottom-style: solid;\n border-bottom-color: ${COLORS.neutral_200};\n border-bottom-width: 1px;\n margin-right: 22px;\n\n button {\n ${props => DropdownButtonCSS(props.size)}\n }\n`;\n\nconst ActionButtonContainer = styled.div<{size?:Size}>`\n border-top-style: solid;\n border-top-color: ${COLORS.neutral_200};\n border-top-width: 1px;\n \n padding: ${props => props.size == Size.Small || !props.size ? '0px 16px' : '8px 16px'};\n\n button {\n width: 100%;\n }\n`;\n\nconst MAX_MENU_HEIGHT = 240;\nconst AVG_OPTION_HEIGHT = 48;\n\nexport interface DropdownItem {\n value: string;\n displayLabel?: string;\n noteLabel?: string;\n suggestion?: boolean;\n showDividerAbove?: boolean;\n disabled?: boolean;\n icon?: React.ReactNode;\n customContent?: React.ReactNode;\n}\n\nexport interface DropdownCustomizationProps {\n itemsType?: 'radio' | 'checkbox' | 'normal';\n menuContent?: React.ReactNode;\n scrollable?: boolean;\n multiSelect?: boolean;\n maxHeight?: string;\n actionLabel?: string;\n actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n actionIcon?: React.ReactNode;\n actionLoading?: boolean;\n actionDisabled?: boolean;\n action: () => boolean | void | undefined;\n pinTopItem?: boolean;\n onValueUpdate: (values: string[]) => boolean | void | undefined;\n items: DropdownItem[];\n}\n\nexport interface DropdownProps {\n isButton: boolean;\n customizationProps: DropdownCustomizationProps;\n alignLeft?: boolean;\n isOpen: boolean;\n setIsOpen: (open: boolean) => void;\n size?: Size;\n id: string;\n filter: string;\n width?: string;\n hideOnClickOutside: boolean;\n selectedValues: string[];\n setSelectedValues: (val: string[]) => void;\n messageOnNoResults: string;\n focused: number | null;\n setFocused: (focused: number | null) => void;\n}\n\nconst DropdownContent: React.FunctionComponent<DropdownProps> = ({\n id,\n customizationProps,\n alignLeft,\n isButton,\n size,\n isOpen,\n hideOnClickOutside,\n width,\n setIsOpen,\n filter,\n focused,\n setFocused,\n selectedValues,\n setSelectedValues,\n messageOnNoResults,\n}) => {\n const [isUp, setIsUp] = React.useState<boolean>(false);\n const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n\n if (!customizationProps.itemsType) customizationProps.itemsType = 'normal';\n if (!size) size = Size.Small;\n\n const itemsListRef = React.useRef<HTMLDivElement>(null);\n\n const determineDropUp = () => {\n const options = customizationProps.items;\n const node = dropdownContentRef.current;\n\n if (!node) return;\n\n const windowHeight = window.innerHeight;\n const menuHeight = Math.min(MAX_MENU_HEIGHT, options.length * AVG_OPTION_HEIGHT);\n const instOffsetWithMenu = node.getBoundingClientRect().top + menuHeight;\n setIsUp(instOffsetWithMenu >= windowHeight);\n };\n\n const setNewFocusedElement = (index: number) => {\n const newFocusedElement = elRefs[index];\n if (newFocusedElement) {\n setFocused(index);\n newFocusedElement?.current?.focus();\n }\n };\n\n const getFilteredItems = () => {\n const filtrationString = (filter ?? '').toUpperCase();\n return customizationProps.items.filter((x) => x?.value?.toUpperCase().includes(filtrationString) || x?.displayLabel?.toUpperCase().includes(filtrationString));\n };\n\n const handleKeyDown = (e: any) => {\n if (isOpen) {\n if (e.keyCode === 38) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {\n const filtered = getFilteredItems();\n if(focusedNow == 1 && haveTopItem())\n focusedNow = 0;\n else {\n for (let i = focusedNow - 1; i > 0; i--) {\n if (!filtered[i - 1]?.disabled) {\n focusedNow = i;\n break;\n }\n }\n }\n setNewFocusedElement(focusedNow);\n }\n } else if (e.keyCode === 40) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null) {\n const filtered = getFilteredItems();\n for (let i = focusedNow + 1; i <= filtered.length; i++) {\n if (!filtered[i - 1]?.disabled) {\n focusedNow = i;\n break;\n }\n }\n } else {\n focusedNow = haveTopItem() ? 0 : 1;\n }\n setNewFocusedElement(focusedNow);\n } else if (e.keyCode === 9) {\n e.preventDefault();\n var focusedNow = focused;\n if (focusedNow !== undefined && focusedNow !== null) {\n focusedNow++;\n const newFocusedElement = document.getElementById(`${id}_${focusedNow}`);\n if (!newFocusedElement) {\n setNewFocusedElement(0);\n } else {\n setNewFocusedElement(focusedNow);\n }\n } else {\n setFocused(null);\n }\n } else if (e.keyCode === 27) {\n setIsOpen(false);\n setFocused(null);\n\n //TODO: add onEscapehandler\n /*\n if (!list.includes(input)) {\n setInput('');\n setPlaceholderSearch(placeholder || '');\n }\n styledFieldRef.current?.focus(); */\n }\n }\n };\n\n const handleClickOutside = (e: any) => {\n if (hideOnClickOutside && dropdownContentRef?.current && !dropdownContentRef.current.contains(e.target) && !elRefs.some((x) => x?.current?.contains(e.target))) {\n if (isOpen) {\n setIsOpen(false);\n setFocused(null);\n }\n }\n };\n\n React.useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n const scrollPosition = React.useRef<number | undefined>(0);\n const handleScroll = () => {\n scrollPosition.current = itemsListRef.current?.scrollTop;\n };\n useLayoutEffect(() => {\n if (itemsListRef.current) itemsListRef.current.scrollTop = scrollPosition.current ?? 0;\n }, [selectedValues]);\n\n const getCorrectRef = (ref: React.RefObject<HTMLElement>): React.RefObject<HTMLElement> => {\n switch (customizationProps.itemsType) {\n case 'normal':\n return (ref as React.RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n default:\n return (ref as React.RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n }\n };\n\n const arrLength = getFilteredItems().length;\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLElement>[]>([]);\n\n React.useEffect(() => {\n setElRefs((elRefs) =>\n Array(arrLength + 1)\n .fill(null)\n .map((_, i) => getCorrectRef(elRefs[i])),\n );\n }, [isOpen, arrLength, selectedValues]);\n\n React.useEffect(() => {\n determineDropUp();\n }, [isOpen]);\n\n const haveTopItem = () => {\n if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) return true;\n else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) return true;\n else if (customizationProps.itemsType == 'normal' && getSuggestions()?.length > 0) return true;\n return false;\n };\n\n const getSuggestions = () => {\n return getFilteredItems().filter((x) => x.suggestion);\n };\n\n React.useLayoutEffect(() => {\n if (isOpen && (focused || focused == 0)) {\n const focusThis = focused == 0 && !haveTopItem() ? 1 : focused;\n if (focusThis != focused) setFocused(focusThis);\n const newFocusedElement = elRefs[focusThis];\n newFocusedElement?.current?.focus();\n } else setFocused(null); //if the dropdown is closed, we don't to keep saved the focused item\n }, [isOpen]);\n\n const handleItemClick = (selected: boolean, item: DropdownItem) => {\n let newValue: string[] = [];\n if (customizationProps.multiSelect) {\n if (selected) newValue = [...selectedValues, item.value];\n else newValue = selectedValues.filter((x) => x != item.value);\n } else newValue = selected ? [item.value] : [];\n\n setSelectedValues(newValue);\n if(customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValue))\n setIsOpen(false);\n };\n\n const getTopItem = () => {\n if (!customizationProps.pinTopItem) return;\n const visibleItems = getFilteredItems();\n const allSelected = selectedValues?.filter((x) => visibleItems.some((y) => y.value == x)).length == visibleItems.length;\n let showTopItem = false;\n const suggestions = getSuggestions();\n const displayLabel = selectedValues[0] ? customizationProps.items?.find((c) => c.value === selectedValues[0])?.displayLabel : undefined;\n if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) showTopItem = true;\n else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) showTopItem = true;\n else if (customizationProps.itemsType == 'normal' && suggestions.length > 0) showTopItem = true;\n\n if (!showTopItem) return;\n\n const selectedFirst = selectedValues.length > 0 ? visibleItems.find(x => x.value == selectedValues[0]) : null;\n \n return (\n <TopItemContainer size={size}>\n {customizationProps.itemsType == 'radio' && (\n <RadioButton\n ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n iconPointerEventsTransparent={true}\n select={() => {}} label={selectedFirst?.displayLabel ?? selectedFirst?.value} \n size={size}\n id={`${id}_topitem`}\n selected={true}\n />\n )}\n {customizationProps.itemsType == 'checkbox' && (\n <Checkbox\n ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n select={(selected: boolean) => {\n if (!customizationProps.multiSelect) return;\n\n const newValues = selected ? visibleItems.map((x) => x.value) : [];\n setSelectedValues(newValues);\n if(customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValues))\n setIsOpen(false);\n }}\n iconPointerEventsTransparent={true}\n semiSelected={customizationProps.multiSelect && !allSelected && selectedValues?.length > 0}\n size={size}\n id={`${id}_checkbox_selectall`}\n label={customizationProps.multiSelect ? 'Select all' : (selectedFirst?.displayLabel ?? selectedFirst?.value)}\n selected={!customizationProps.multiSelect || allSelected}\n />\n )}\n {customizationProps.itemsType == 'normal' && (\n <>\n {suggestions.map((x) => (\n <button\n ref={elRefs[0] as React.RefObject<HTMLButtonElement>}\n type=\"button\"\n id={`${id}_topitem`}\n key={`${id}_topitem_${x.value}`}\n onClick={(e: any) => {\n customizationProps.onValueUpdate([x.value]);\n setSelectedValues([x.value]);\n setIsOpen(false);\n setFocused(null);\n }}>\n <div className=\"item-content\">\n {x?.icon && <div className=\"item-icon\">{x?.icon}</div>}\n <div className=\"item-label\">\n {x?.displayLabel ?? x?.value}\n {x?.noteLabel && <div style={{ fontSize: '12px' }}>{x.noteLabel}</div>}\n </div>\n </div>\n </button>))}\n </>\n )}\n </TopItemContainer>\n );\n };\n\n const getElements = () => {\n if (getFilteredItems().length === 0) {\n return (\n <ItemsContainer size={size}>\n <button className=\"dropdownButton\" disabled>\n <span>{messageOnNoResults}</span>\n </button>\n </ItemsContainer>\n );\n }\n let number = 0;\n return (\n <ItemsContainer size={size}>\n {getFilteredItems()\n .filter((x) => x && (customizationProps.itemsType != 'normal' || !x.suggestion))\n .map((item) => {\n return (\n <React.Fragment key={`key_${id}_${item.value}`}>\n {item.customContent}\n {!item.customContent && customizationProps.itemsType == 'radio' && (\n <RadioButton\n select={(selected:boolean) => handleItemClick(selected, item)}\n ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n size={size}\n iconPointerEventsTransparent={true}\n disabled={item?.disabled}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}\n label={item.displayLabel ?? item.value}\n selected={selectedValues?.includes(item.value)}\n />\n )}\n {!item.customContent && customizationProps.itemsType == 'checkbox' && (\n <Checkbox\n select={(selected:boolean) => handleItemClick(selected, item)}\n iconPointerEventsTransparent={true}\n disabled={item?.disabled}\n ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n size={size}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}\n label={item.displayLabel ?? item.value}\n selected={selectedValues?.includes(item.value)}\n />\n )}\n {!item.customContent && (customizationProps.itemsType == 'normal' || !customizationProps.itemsType) && (\n <button\n type=\"button\"\n disabled={item?.disabled}\n ref={elRefs[number + 1] as React.RefObject<HTMLButtonElement>}\n onClick={(e: any) => {\n customizationProps.onValueUpdate([item.value]);\n setSelectedValues([item.value]);\n setIsOpen(false);\n setFocused(null);\n }}\n className={ 'dropdownButton ' + (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (selectedValues?.includes(item.value) ? 'active' : '')}\n key={`key_${id}_${number++}`}\n id={`${id}_${number + 1}`}>\n {item.showDividerAbove && <div className=\"divider\" />}\n <div className=\"item-content\">\n {item.icon && <div className=\"item-icon\">{item.icon}</div>}\n <div className=\"item-label\">\n {item.displayLabel ?? item.value}\n {item.noteLabel && <div style={{ fontSize: '12px' }}>{item.noteLabel}</div>}\n </div>\n </div>\n </button>\n )}\n </React.Fragment>\n );\n })}\n </ItemsContainer>\n );\n };\n\n return (\n <DDContainer\n ref={dropdownContentRef}\n size={size}\n width={width}\n isButton={isButton}\n alignLeft={alignLeft}\n scrollable={customizationProps.scrollable}\n maxHeight={customizationProps.maxHeight}\n className={[isOpen && 'show', isUp && 'up'].filter((e) => !!e).join(' ')}>\n <ListContainer size={size} itemsType={customizationProps.itemsType} onScroll={handleScroll} ref={itemsListRef} scrollable={customizationProps.scrollable}>\n {customizationProps.menuContent &&\n <MenuContentContainer size={size}>\n {customizationProps.menuContent}\n <DividerContainer size={size}>\n <div className=\"divider\" />\n </DividerContainer>\n </MenuContentContainer>}\n {customizationProps.pinTopItem && getTopItem()}\n {getElements()}\n </ListContainer>\n {customizationProps.action && customizationProps.actionLabel && (\n <ActionButtonContainer size={size}>\n <Button width=\"100%\" icon={customizationProps.actionIcon}\n loading={customizationProps.actionLoading}\n disabled={customizationProps.actionDisabled}\n variant={customizationProps.actionVariant ?? 'primary'}\n size={size} onClick={() => \n {\n if(customizationProps.action()) //closing the dropdown if action returns 'true'\n setIsOpen(false);\n }}>\n {customizationProps.actionLabel}\n </Button>\n </ActionButtonContainer>\n )}\n </DDContainer>\n );\n /* ),\n {\n handleClickOutside: () => () => {\n if (isOpen) {\n setIsOpen(false);\n setFocused(null);\n }\n },\n },\n );\n\n return <Wrapped />; */\n};\n\nexport default DropdownContent;\n"],"file":"DropdownContent.js"}
@@ -60,11 +60,6 @@ const modalTransitions = `
60
60
  transform: translate(-50%, -50%) scale(1.1, 1.1);
61
61
  transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);
62
62
  }
63
-
64
- .ReactModal__Body--open,
65
- .ReactModal__Html--open {
66
- overflow: hidden;
67
- }
68
63
  `;
69
64
 
70
65
  class ModalContainer extends React.Component {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","Component","modalHeight","modalWidth","modalOverflow","componentDidMount","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","render","id","showModal","closeModal","children","padding","minWidth","maxWidth","props","sizes","GetSize","GetOverflow","stylesConfiguration","Object","assign","styles","getElementById"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport { BOXSHADOWS } from '../styles';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n\n.ReactModal__Body--open,\n.ReactModal__Html--open {\n overflow: hidden;\n}\n`;\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n};\n\ntype ModalContainerState = {};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({ height: modalHeight, width: modalWidth });\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n render() {\n const { id, showModal, closeModal, children, modalHeight, modalWidth, modalOverflow, padding, minWidth = '', maxWidth = '' } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const { height, width } = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n const stylesConfiguration = Object.assign({ ...ModalContainerStyles.content }, { height, width, padding, overflow, minWidth, maxWidth });\n const styles = { content: stylesConfiguration };\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles} appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}
1
+ {"version":3,"sources":["../../../src/Modals/ModalContainer.tsx"],"names":["React","ReactModal","BOXSHADOWS","Z_INDEXES","ModalContainerStyles","content","top","left","right","bottom","marginRight","width","height","borderRadius","boxSizing","margin","overflow","boxShadow","BOXSHADOW_L3","modalTransitions","backdrop","modal","ModalContainer","Component","modalHeight","modalWidth","modalOverflow","componentDidMount","defaultStyles","overlay","backgroundColor","document","querySelector","head","getElementsByTagName","style","createElement","setAttribute","appendChild","createTextNode","render","id","showModal","closeModal","children","padding","minWidth","maxWidth","props","sizes","GetSize","GetOverflow","stylesConfiguration","Object","assign","styles","getElementById"],"mappings":";;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,UAAP,MAAuB,aAAvB;AACA,SAASC,UAAT,QAA2B,WAA3B;AACA,SAAQC,SAAR,QAAwB,qBAAxB;AAEA,MAAMC,oBAAoB,GAAG;AAC3BC,EAAAA,OAAO,EAAE;AACPC,IAAAA,GAAG,EAAE,KADE;AAEPC,IAAAA,IAAI,EAAE,KAFC;AAGPC,IAAAA,KAAK,EAAE,MAHA;AAIPC,IAAAA,MAAM,EAAE,MAJD;AAKPC,IAAAA,WAAW,EAAE,MALN;AAMPC,IAAAA,KAAK,EAAE,OANA;AAOPC,IAAAA,MAAM,EAAE,OAPD;AAQPC,IAAAA,YAAY,EAAE,KARP;AASPC,IAAAA,SAAS,EAAE,YATJ;AAUPC,IAAAA,MAAM,EAAE,CAVD;AAWPC,IAAAA,QAAQ,EAAE,MAXH;AAYPC,IAAAA,SAAS,EAAEf,UAAU,CAACgB;AAZf;AADkB,CAA7B,C,CAiBA;;AACA,MAAMC,gBAAgB,GAAI;AAC1B;AACA;AACA,aAAahB,SAAS,CAACiB,QAAS;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAajB,SAAS,CAACkB,KAAM;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAjCA;;AAkDA,MAAMC,cAAN,SAA6BtB,KAAK,CAACuB,SAAnC,CAAuF;AAAA;AAAA;;AAAA,qCAgB3E,CAACC,WAAmB,GAAG,MAAvB,EAA+BC,UAAkB,GAAG,MAApD,MAAgE;AAAEb,MAAAA,MAAM,EAAEY,WAAV;AAAuBb,MAAAA,KAAK,EAAEc;AAA9B,KAAhE,CAhB2E;;AAAA,yCAiBvE,CAACC,aAAqB,GAAG,SAAzB,KAAuCA,aAjBgC;AAAA;;AACrFC,EAAAA,iBAAiB,GAAG;AAClB,QAAI1B,UAAU,CAAC2B,aAAX,CAAyBC,OAA7B,EAAsC;AACpC5B,MAAAA,UAAU,CAAC2B,aAAX,CAAyBC,OAAzB,CAAiCC,eAAjC,GAAmD,iBAAnD;AACD,KAHiB,CAKlB;;;AACA,QAAI,CAACC,QAAQ,CAACC,aAAT,CAAuB,iCAAvB,CAAL,EAAgE;AAC9D,YAAMC,IAAI,GAAGF,QAAQ,CAACE,IAAT,IAAiBF,QAAQ,CAACG,oBAAT,CAA8B,MAA9B,EAAsC,CAAtC,CAA9B;AACA,YAAMC,KAAK,GAAGJ,QAAQ,CAACK,aAAT,CAAuB,OAAvB,CAAd;AACAD,MAAAA,KAAK,CAACE,YAAN,CAAmB,sBAAnB,EAA2C,QAA3C;AACAJ,MAAAA,IAAI,CAACK,WAAL,CAAiBH,KAAjB;AACAA,MAAAA,KAAK,CAACG,WAAN,CAAkBP,QAAQ,CAACQ,cAAT,CAAwBpB,gBAAxB,CAAlB;AACD;AACF;;AAIDqB,EAAAA,MAAM,GAAG;AACP,UAAM;AAAEC,MAAAA,EAAF;AAAMC,MAAAA,SAAN;AAAiBC,MAAAA,UAAjB;AAA6BC,MAAAA,QAA7B;AAAuCpB,MAAAA,WAAvC;AAAoDC,MAAAA,UAApD;AAAgEC,MAAAA,aAAhE;AAA+EmB,MAAAA,OAA/E;AAAwFC,MAAAA,QAAQ,GAAG,EAAnG;AAAuGC,MAAAA,QAAQ,GAAG;AAAlH,QAAyH,KAAKC,KAApI;AACA,UAAMC,KAAK,GAAG,KAAKC,OAAL,CAAa1B,WAAb,EAA0BC,UAA1B,CAAd;AACA,UAAM;AAAEb,MAAAA,MAAF;AAAUD,MAAAA;AAAV,QAAoBsC,KAA1B;AACA,UAAMjC,QAAQ,GAAG,KAAKmC,WAAL,CAAiBzB,aAAjB,CAAjB;AACA,UAAM0B,mBAAmB,GAAGC,MAAM,CAACC,MAAP,mBAAmBlD,oBAAoB,CAACC,OAAxC,GAAmD;AAAEO,MAAAA,MAAF;AAAUD,MAAAA,KAAV;AAAiBkC,MAAAA,OAAjB;AAA0B7B,MAAAA,QAA1B;AAAoC8B,MAAAA,QAApC;AAA8CC,MAAAA;AAA9C,KAAnD,CAA5B;AACA,UAAMQ,MAAM,GAAG;AAAElD,MAAAA,OAAO,EAAE+C;AAAX,KAAf;AAEA,wBACE,oBAAC,UAAD;AAAY,MAAA,EAAE,EAAEX,EAAhB;AAAoB,MAAA,MAAM,EAAEC,SAA5B;AAAuC,MAAA,cAAc,EAAE,GAAvD;AAA4D,MAAA,cAAc,EAAE,MAAMC,UAAU,EAA5F;AAAgG,MAAA,KAAK,EAAEY,MAAvG;AAA+G,MAAA,UAAU,EAAExB,QAAQ,CAACyB,cAAT,CAAwB,MAAxB,KAAmC;AAA9J,OACGZ,QADH,CADF;AAKD;;AA/BoF;;gBAAjFtB,c;AAdJmB,EAAAA,E;AACAC,EAAAA,S;AACAC,EAAAA,U;AACAC,EAAAA,Q;AACApB,EAAAA,W;AACAC,EAAAA,U;AACAC,EAAAA,a;AACAmB,EAAAA,O;AACAC,EAAAA,Q;AACAC,EAAAA,Q;;;AAuCF,eAAezB,cAAf","sourcesContent":["import * as React from 'react';\nimport ReactModal from 'react-modal';\nimport { BOXSHADOWS } from '../styles';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst ModalContainerStyles = {\n content: {\n top: '50%',\n left: '50%',\n right: 'auto',\n bottom: 'auto',\n marginRight: '-50%',\n width: '640px',\n height: '320px',\n borderRadius: '8px',\n boxSizing: 'border-box' as any,\n margin: 0,\n overflow: 'auto',\n boxShadow: BOXSHADOWS.BOXSHADOW_L3,\n },\n};\n\n//override modal classes to define the animations\nconst modalTransitions = `\n.ReactModal__Overlay {\n opacity: 0;\n z-index: ${Z_INDEXES.backdrop};\n}\n\n.ReactModal__Overlay--after-open {\n opacity: 1;\n transition: opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Content{\n z-index: ${Z_INDEXES.modal};\n opacity:0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n}\n\n.ReactModal__Content--after-open{\n opacity: 1;\n transform: translate(-50%, -50%) scale(1.0, 1.0);\n transition: transform 150ms ease-in-out, opacity 150ms cubic-bezier(0.22, 0.61, 0.35, 1);\n}\n\n.ReactModal__Overlay--before-close {\n opacity: 0;\n transition: opacity 120ms linear;\n}\n\n.ReactModal__Content--before-close{\n opacity: 0;\n transform: translate(-50%, -50%) scale(1.1, 1.1);\n transition: transform 120ms ease-in-out, opacity 120ms cubic-bezier(0.55, 0.05, 0.67, 0.19);\n}\n`;\n\ntype ModalContainerProps = {\n id?: string;\n showModal: boolean;\n closeModal: () => void;\n children: any;\n modalHeight?: any;\n modalWidth?: any;\n modalOverflow?: string;\n padding?: string;\n minWidth?: string;\n maxWidth?: string;\n};\n\ntype ModalContainerState = {};\n\nclass ModalContainer extends React.Component<ModalContainerProps, ModalContainerState> {\n componentDidMount() {\n if (ReactModal.defaultStyles.overlay) {\n ReactModal.defaultStyles.overlay.backgroundColor = 'rgba(0,0,0,0.5)';\n }\n\n //append style node to override modal transition classes\n if (!document.querySelector('[modal-custom-styling=\"active\"]')) {\n const head = document.head || document.getElementsByTagName('head')[0];\n const style = document.createElement('style');\n style.setAttribute('modal-custom-styling', 'active');\n head.appendChild(style);\n style.appendChild(document.createTextNode(modalTransitions));\n }\n }\n\n GetSize = (modalHeight: string = 'auto', modalWidth: string = 'auto') => ({ height: modalHeight, width: modalWidth });\n GetOverflow = (modalOverflow: string = 'visible') => modalOverflow;\n render() {\n const { id, showModal, closeModal, children, modalHeight, modalWidth, modalOverflow, padding, minWidth = '', maxWidth = '' } = this.props;\n const sizes = this.GetSize(modalHeight, modalWidth);\n const { height, width } = sizes;\n const overflow = this.GetOverflow(modalOverflow);\n const stylesConfiguration = Object.assign({ ...ModalContainerStyles.content }, { height, width, padding, overflow, minWidth, maxWidth });\n const styles = { content: stylesConfiguration };\n\n return (\n <ReactModal id={id} isOpen={showModal} closeTimeoutMS={120} onRequestClose={() => closeModal()} style={styles} appElement={document.getElementById('root') || ''}>\n {children}\n </ReactModal>\n );\n }\n}\n\nexport default ModalContainer;\n"],"file":"ModalContainer.js"}
@@ -23,7 +23,9 @@ export const ModalDialog = ({
23
23
  tooltip,
24
24
  children,
25
25
  note,
26
- state
26
+ state,
27
+ icon,
28
+ yOffset
27
29
  }) => {
28
30
  const getMinWidth = () => {
29
31
  switch (size) {
@@ -223,6 +225,20 @@ export const ModalDialog = ({
223
225
  }
224
226
  };
225
227
 
228
+ React.useEffect(() => {
229
+ let yPos = yOffset ? yOffset : 0;
230
+
231
+ if (isModalOpen) {
232
+ document.body.setAttribute('style', `position: fixed;
233
+ left: 0; right: 0;
234
+ top: -${yPos}px`);
235
+ }
236
+
237
+ return () => {
238
+ document.body.setAttribute('style', '');
239
+ window.scrollTo(0, yPos);
240
+ };
241
+ }, [isModalOpen]);
226
242
  return /*#__PURE__*/React.createElement(ModalContainer, {
227
243
  showModal: isModalOpen,
228
244
  closeModal: closeModalAndClearInput,
@@ -246,7 +262,8 @@ export const ModalDialog = ({
246
262
  }, children), note && /*#__PURE__*/React.createElement(ModalNote, {
247
263
  note: note,
248
264
  state: state,
249
- size: size
265
+ size: size,
266
+ icon: icon
250
267
  }), /*#__PURE__*/React.createElement(ModalFooter, {
251
268
  size: size
252
269
  }, leftFooterAction && LeftFooterAction(leftFooterAction), buttons?.map((b, i) => /*#__PURE__*/React.createElement(Button, {
@@ -270,8 +287,10 @@ ModalDialog.propTypes = {
270
287
  backButton: _pt.func,
271
288
  closeAction: _pt.func.isRequired,
272
289
  submitAction: _pt.func.isRequired,
273
- note: _pt.string,
274
- state: _pt.string
290
+ note: _pt.oneOfType([_pt.string, _pt.node]),
291
+ state: _pt.string,
292
+ icon: _pt.node,
293
+ yOffset: _pt.number
275
294
  };
276
295
  export default ModalDialog;
277
296
  //# sourceMappingURL=ModalDialog.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Modals/ModalDialog.tsx"],"names":["React","Button","IconButton","ArrowLineLeft","Close","Help","COLORS","ComponentL","ComponentM","ComponentTextStyle","ComponentXL","Size","ModalContainer","BackButtonWrapper","CloseButtonWrapper","Column","FlexContainer","ModalBody","ModalFooter","ModalHeaderActions","ModalHeaderActionsWithImage","ModalTitleSection","StyledModalHeader","ModalHoverModifier","ModalNote","TooltipWrapper","HyperLink","ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","getMinWidth","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","Bold","ModalTootip","XSmall","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","icon","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","map","b","i","id"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n BackButtonWrapper,\n CloseButtonWrapper,\n Column,\n FlexContainer,\n ModalBody,\n ModalFooter,\n ModalHeaderActions,\n ModalHeaderActionsWithImage,\n ModalTitleSection,\n StyledModalHeader,\n ModalHoverModifier\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { ReactNode } from 'react';\nimport { HyperLink } from '..';\n\ninterface NewModalProps {\n size?: Size;\n isModalOpen: boolean;\n closeModalAndClearInput: any;\n title?: string;\n topImage?: any;\n buttons?: ButtonAction[];\n leftFooterAction?: LeftFooterAction;\n tooltip?: string;\n backButton?: () => void;\n closeAction: () => void;\n submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n note?: string;\n state?: string;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n size,\n isModalOpen,\n closeModalAndClearInput,\n title,\n topImage,\n buttons,\n leftFooterAction,\n backButton,\n closeAction,\n submitAction,\n tooltip,\n children,\n note,\n state,\n}) => {\n const getMinWidth = () => {\n switch (size) {\n case Size.Small:\n return '320px';\n case Size.Large:\n return '640px';\n case Size.Medium:\n default:\n return '480px';\n }\n };\n\n const getMaxWidth = () => {\n switch (size) {\n case Size.Small:\n return '480px';\n case Size.Large:\n return '720px';\n case Size.Medium:\n default:\n return '640px';\n }\n };\n\n const getImageHeight = () => {\n switch (size) {\n case Size.Small:\n return 160;\n case Size.Medium:\n return 200;\n case Size.Large:\n return 240;\n default:\n return 200;\n }\n };\n\n const getMarginBottom = () => {\n switch (size) {\n case Size.Small:\n return '16px';\n case Size.Medium:\n return '24px';\n case Size.Large:\n return '32px';\n default:\n return '24px';\n }\n };\n\n const getPadding = () => {\n switch (size) {\n case Size.Small:\n return '16px 16px 8px';\n case Size.Medium:\n return '24px 24px 20px';\n case Size.Large:\n return '32px';\n default:\n return '24px 24px 16px';\n }\n };\n\n const ModalTitle = (title: string, size?: Size) => {\n switch (size) {\n case Size.Small:\n return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n case Size.Medium:\n return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n case Size.Large:\n return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n default:\n return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n }\n };\n\n const ModalTootip = (tooltip: string) => {\n return (\n <ModalHoverModifier>\n <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n <Help size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n </TooltipWrapper>\n </ModalHoverModifier>\n );\n };\n\n const ModalCloseButton = (onClick: any) => {\n return (\n <CloseButtonWrapper hasImage={!!topImage} size={size}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n <Close size=\"24px\" color={COLORS.black} />\n </IconButton>\n </CloseButtonWrapper>\n );\n };\n\n const ModalBackButton = () => {\n if (backButton) {\n return (\n <BackButtonWrapper hasImage={!!topImage} size={size}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n </IconButton>\n </BackButtonWrapper>\n );\n }\n };\n\n const getLeftActionIconElement = (icon: ReactNode) => {\n return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n };\n\n const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n const { text, actionType, disabled, icon, action } = leftFooterAction;\n switch (actionType) {\n case 'button':\n return (\n <Button\n id={'left-action-button'}\n type={(leftFooterAction as LeftFooterButton)?.type}\n disabled={disabled}\n loading={(leftFooterAction as LeftFooterButton)?.loading}\n icon={icon}\n size={size}\n onClick={action}\n variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n style={{ order: -1, marginRight: 'auto' }}>\n {text}\n </Button>\n );\n case 'hyperlink':\n return (\n <HyperLink id=\"left-action-hyperlink\" className=\"footer-action\" href={(leftFooterAction as LeftFooterHyperlink).href} disabled={disabled} variant=\"default\">\n {icon && getLeftActionIconElement(icon)}\n {text}\n </HyperLink>\n );\n case 'note':\n return (\n <div className=\"footer-action note\">\n {icon && getLeftActionIconElement(icon)}\n <span>{text}</span>\n </div>\n );\n }\n };\n\n return (\n <ModalContainer showModal={isModalOpen} closeModal={closeModalAndClearInput} minWidth={getMinWidth()} maxWidth={getMaxWidth()} modalHeight=\"auto\" padding={getPadding()}>\n <Column>\n <form onSubmit={submitAction}>\n {topImage && (\n <StyledModalHeader size={size} height={getImageHeight()} marginBottom={getMarginBottom()}>\n <img src={topImage} alt=\"Modal top\" />\n <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n {ModalBackButton()}\n {ModalCloseButton(closeAction)}\n </ModalHeaderActionsWithImage>\n </StyledModalHeader>\n )}\n <ModalTitleSection>\n <FlexContainer>\n {!topImage && ModalBackButton()}\n {title && ModalTitle(title, size)}\n </FlexContainer>\n <ModalHeaderActions>\n {tooltip && ModalTootip(tooltip)}\n {!topImage && ModalCloseButton(closeAction)}\n </ModalHeaderActions>\n </ModalTitleSection>\n\n <ModalBody size={size}>{children}</ModalBody>\n\n {note && <ModalNote note={note} state={state} size={size} />}\n\n <ModalFooter size={size}>\n {leftFooterAction && LeftFooterAction(leftFooterAction)}\n {buttons?.map((b, i) => (\n <Button key={b.id || i} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n {b.text}\n </Button>\n ))}\n </ModalFooter>\n </form>\n </Column>\n </ModalContainer>\n );\n};\n\nexport default ModalDialog;\n"],"file":"ModalDialog.js"}
1
+ {"version":3,"sources":["../../../src/Modals/ModalDialog.tsx"],"names":["React","Button","IconButton","ArrowLineLeft","Close","Help","COLORS","ComponentL","ComponentM","ComponentTextStyle","ComponentXL","Size","ModalContainer","BackButtonWrapper","CloseButtonWrapper","Column","FlexContainer","ModalBody","ModalFooter","ModalHeaderActions","ModalHeaderActionsWithImage","ModalTitleSection","StyledModalHeader","ModalHoverModifier","ModalNote","TooltipWrapper","HyperLink","ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","buttons","leftFooterAction","backButton","closeAction","submitAction","tooltip","children","note","state","icon","yOffset","getMinWidth","Small","Large","Medium","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","Bold","ModalTootip","XSmall","neutral_600","ModalCloseButton","onClick","black","ModalBackButton","getLeftActionIconElement","cloneElement","LeftFooterAction","text","actionType","disabled","action","type","loading","variant","order","marginRight","href","useEffect","yPos","document","body","setAttribute","window","scrollTo","map","b","i","id"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types';\nimport ModalContainer from './ModalContainer';\nimport {\n BackButtonWrapper,\n CloseButtonWrapper,\n Column,\n FlexContainer,\n ModalBody,\n ModalFooter,\n ModalHeaderActions,\n ModalHeaderActionsWithImage,\n ModalTitleSection,\n StyledModalHeader,\n ModalHoverModifier,\n} from './ModalStyles';\n\nimport { ModalNote } from './ModalNote';\nimport { TooltipWrapper } from '../Tooltips';\nimport { ButtonAction, LeftFooterAction, LeftFooterButton, LeftFooterHyperlink } from './ModalTypes';\nimport { ReactNode } from 'react';\nimport { HyperLink } from '..';\n\ninterface NewModalProps {\n size?: Size;\n isModalOpen: boolean;\n closeModalAndClearInput: any;\n title?: string;\n topImage?: any;\n buttons?: ButtonAction[];\n leftFooterAction?: LeftFooterAction;\n tooltip?: string;\n backButton?: () => void;\n closeAction: () => void;\n submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n note?: string | React.ReactNode;\n state?: string;\n icon?: React.ReactNode;\n yOffset?: number;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n size,\n isModalOpen,\n closeModalAndClearInput,\n title,\n topImage,\n buttons,\n leftFooterAction,\n backButton,\n closeAction,\n submitAction,\n tooltip,\n children,\n note,\n state,\n icon,\n yOffset\n}) => {\n const getMinWidth = () => {\n switch (size) {\n case Size.Small:\n return '320px';\n case Size.Large:\n return '640px';\n case Size.Medium:\n default:\n return '480px';\n }\n };\n\n const getMaxWidth = () => {\n switch (size) {\n case Size.Small:\n return '480px';\n case Size.Large:\n return '720px';\n case Size.Medium:\n default:\n return '640px';\n }\n };\n\n const getImageHeight = () => {\n switch (size) {\n case Size.Small:\n return 160;\n case Size.Medium:\n return 200;\n case Size.Large:\n return 240;\n default:\n return 200;\n }\n };\n\n const getMarginBottom = () => {\n switch (size) {\n case Size.Small:\n return '16px';\n case Size.Medium:\n return '24px';\n case Size.Large:\n return '32px';\n default:\n return '24px';\n }\n };\n\n const getPadding = () => {\n switch (size) {\n case Size.Small:\n return '16px 16px 8px';\n case Size.Medium:\n return '24px 24px 20px';\n case Size.Large:\n return '32px';\n default:\n return '24px 24px 16px';\n }\n };\n\n const ModalTitle = (title: string, size?: Size) => {\n switch (size) {\n case Size.Small:\n return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n case Size.Medium:\n return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n case Size.Large:\n return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n default:\n return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n }\n };\n\n const ModalTootip = (tooltip: string) => {\n return (\n <ModalHoverModifier>\n <TooltipWrapper delay=\"0s\" size={Size.XSmall} align=\"center\" position=\"top\" withArrow={false} label={tooltip}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => {}}>\n <Help size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n </TooltipWrapper>\n </ModalHoverModifier>\n );\n };\n\n const ModalCloseButton = (onClick: any) => {\n return (\n <CloseButtonWrapper hasImage={!!topImage} size={size}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n <Close size=\"24px\" color={COLORS.black} />\n </IconButton>\n </CloseButtonWrapper>\n );\n };\n\n const ModalBackButton = () => {\n if (backButton) {\n return (\n <BackButtonWrapper hasImage={!!topImage} size={size}>\n <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n </IconButton>\n </BackButtonWrapper>\n );\n }\n };\n\n const getLeftActionIconElement = (icon: ReactNode) => {\n return React.cloneElement(icon as React.ReactElement, { size: size === Size.Small ? '20px' : size === Size.Large ? '28px' : '24px' });\n };\n\n const LeftFooterAction = (leftFooterAction: LeftFooterAction) => {\n const { text, actionType, disabled, icon, action } = leftFooterAction;\n switch (actionType) {\n case 'button':\n return (\n <Button\n id={'left-action-button'}\n type={(leftFooterAction as LeftFooterButton)?.type}\n disabled={disabled}\n loading={(leftFooterAction as LeftFooterButton)?.loading}\n icon={icon}\n size={size}\n onClick={action}\n variant={(leftFooterAction as LeftFooterButton)?.variant ?? 'secondary'}\n style={{ order: -1, marginRight: 'auto' }}>\n {text}\n </Button>\n );\n case 'hyperlink':\n return (\n <HyperLink id=\"left-action-hyperlink\" className=\"footer-action\" href={(leftFooterAction as LeftFooterHyperlink).href} disabled={disabled} variant=\"default\">\n {icon && getLeftActionIconElement(icon)}\n {text}\n </HyperLink>\n );\n case 'note':\n return (\n <div className=\"footer-action note\">\n {icon && getLeftActionIconElement(icon)}\n <span>{text}</span>\n </div>\n );\n }\n };\n\n React.useEffect(()=>{\n let yPos = yOffset ? yOffset : 0;\n if(isModalOpen){ \n document.body.setAttribute('style', `position: fixed;\n left: 0; right: 0;\n top: -${yPos}px`);\n }\n return ()=>{\n document.body.setAttribute('style','');\n window.scrollTo(0,yPos);\n }\n },[isModalOpen]);\n\n return (\n <ModalContainer showModal={isModalOpen} closeModal={closeModalAndClearInput} minWidth={getMinWidth()} maxWidth={getMaxWidth()} modalHeight=\"auto\" padding={getPadding()}>\n <Column>\n <form onSubmit={submitAction}>\n {topImage && (\n <StyledModalHeader size={size} height={getImageHeight()} marginBottom={getMarginBottom()}>\n <img src={topImage} alt=\"Modal top\" />\n <ModalHeaderActionsWithImage hasBackButton={!!backButton}>\n {ModalBackButton()}\n {ModalCloseButton(closeAction)}\n </ModalHeaderActionsWithImage>\n </StyledModalHeader>\n )}\n <ModalTitleSection>\n <FlexContainer>\n {!topImage && ModalBackButton()}\n {title && ModalTitle(title, size)}\n </FlexContainer>\n <ModalHeaderActions>\n {tooltip && ModalTootip(tooltip)}\n {!topImage && ModalCloseButton(closeAction)}\n </ModalHeaderActions>\n </ModalTitleSection>\n\n <ModalBody size={size}>{children}</ModalBody>\n\n {note && <ModalNote note={note} state={state} size={size} icon={icon} />}\n\n <ModalFooter size={size}>\n {leftFooterAction && LeftFooterAction(leftFooterAction)}\n {buttons?.map((b, i) => (\n <Button key={b.id || i} id={b.id} disabled={b.disabled} loading={b.loading} size={size} onClick={b.action} type={b.type} variant={b.variant}>\n {b.text}\n </Button>\n ))}\n </ModalFooter>\n </form>\n </Column>\n </ModalContainer>\n );\n};\n\nexport default ModalDialog;\n"],"file":"ModalDialog.js"}
@@ -47,7 +47,7 @@ export const ModalNote = ({
47
47
  }
48
48
  };
49
49
  ModalNote.propTypes = {
50
- note: _pt.string.isRequired,
50
+ note: _pt.oneOfType([_pt.string, _pt.node]).isRequired,
51
51
  icon: _pt.node,
52
52
  state: _pt.string,
53
53
  size: _pt.string
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Modals/ModalNote.tsx"],"names":["React","COLORS","CheckComplete","Information","TechnicalWarning","ModalNoteSection","ModalNote","note","icon","size","state","stateVal","toLowerCase","correct_500","warning_500","primary_500"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT,QAAuB,IAAvB;AACA,SAASC,aAAT,EAAwBC,WAAxB,EAAqCC,gBAArC,QAA6D,kCAA7D;AACA,SAAQC,gBAAR,QAA+B,eAA/B;AASA,OAAO,MAAMC,SAA8C,GAAG,CAAC;AAACC,EAAAA,IAAD;AAAOC,EAAAA,IAAP;AAAaC,EAAAA,IAAb;AAAmBC,EAAAA,KAAK,GAAC;AAAzB,CAAD,KAAyC;AACnG,QAAMC,QAAQ,GAAGD,KAAK,CAACE,WAAN,EAAjB;;AAEA,UAAOD,QAAP;AACI,SAAK,UAAL;AAAiB,0BACb,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEA,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACKD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,aAAD;AAAe,QAAA,KAAK,EAAEP,MAAM,CAACY;AAA7B,QADnB,eAEI,kCAAON,IAAP,CAFJ,CADa;;AAOjB,SAAK,SAAL;AAAgB,0BACZ,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACKD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEP,MAAM,CAACa;AAAhC,QADnB,eAEI,kCAAOP,IAAP,CAFJ,CADY;;AAOhB,SAAK,UAAL;AAAiB,0BACb,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACKD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEP,MAAM,CAACa;AAAhC,QADnB,eAEI,kCAAOP,IAAP,CAFJ,CADa;;AAOjB;AAAS,0BACL,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACKD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,WAAD;AAAa,QAAA,KAAK,EAAEP,MAAM,CAACc,WAA3B;AAAwC,QAAA,SAAS,EAAEN;AAAnD,QADnB,eAEI,kCAAOF,IAAP,CAFJ,CADK;AAtBb;AA+BH,CAlCM;;AANHA,EAAAA,I;AACAC,EAAAA,I;AACAE,EAAAA,K;AACAD,EAAAA,I;;AAuCJ,eAAeH,SAAf","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '..';\nimport { CheckComplete, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport {ModalNoteSection} from './ModalStyles'\n\ninterface NoteProps {\n note: string;\n icon?: React.ReactNode;\n state?: string;\n size?: string;\n}\n\nexport const ModalNote : React.FunctionComponent<NoteProps> = ({note, icon, size, state='neutral'}) => { \n const stateVal = state.toLowerCase();\n\n switch(stateVal) {\n case 'positive': return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <CheckComplete color={COLORS.correct_500}/>}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n case 'warning': return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <TechnicalWarning color={COLORS.warning_500}/>}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n case 'critical': return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <TechnicalWarning color={COLORS.warning_500}/>}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n default: return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <Information color={COLORS.primary_500} className={size}/>}\n <span>{note}</span>\n </ModalNoteSection>\n );\n }\n \n \n};\n\nexport default ModalNote;"],"file":"ModalNote.js"}
1
+ {"version":3,"sources":["../../../src/Modals/ModalNote.tsx"],"names":["React","COLORS","CheckComplete","Information","TechnicalWarning","ModalNoteSection","ModalNote","note","icon","size","state","stateVal","toLowerCase","correct_500","warning_500","primary_500"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT,QAAuB,IAAvB;AACA,SAASC,aAAT,EAAwBC,WAAxB,EAAqCC,gBAArC,QAA6D,kCAA7D;AACA,SAASC,gBAAT,QAAiC,eAAjC;AASA,OAAO,MAAMC,SAA6C,GAAG,CAAC;AAAEC,EAAAA,IAAF;AAAQC,EAAAA,IAAR;AAAcC,EAAAA,IAAd;AAAoBC,EAAAA,KAAK,GAAG;AAA5B,CAAD,KAA6C;AACxG,QAAMC,QAAQ,GAAGD,KAAK,CAACE,WAAN,EAAjB;;AAEA,UAAQD,QAAR;AACE,SAAK,UAAL;AACE,0BACE,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEA,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACGD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,aAAD;AAAe,QAAA,KAAK,EAAEP,MAAM,CAACY;AAA7B,QADjB,eAEE,kCAAON,IAAP,CAFF,CADF;;AAOF,SAAK,SAAL;AACE,0BACE,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACGD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEP,MAAM,CAACa;AAAhC,QADjB,eAEE,kCAAOP,IAAP,CAFF,CADF;;AAOF,SAAK,UAAL;AACE,0BACE,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACGD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEP,MAAM,CAACa;AAAhC,QADjB,eAEE,kCAAOP,IAAP,CAFF,CADF;;AAOF;AACE,0BACE,oBAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEI,QAAzB;AAAmC,QAAA,IAAI,EAAEF;AAAzC,SACGD,IAAI,GAAGA,IAAH,gBAAU,oBAAC,WAAD;AAAa,QAAA,KAAK,EAAEP,MAAM,CAACc,WAA3B;AAAwC,QAAA,SAAS,EAAEN;AAAnD,QADjB,eAEE,kCAAOF,IAAP,CAFF,CADF;AA1BJ;AAiCD,CApCM;;AANLA,EAAAA,I;AACAC,EAAAA,I;AACAE,EAAAA,K;AACAD,EAAAA,I;;AAyCF,eAAeH,SAAf","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '..';\nimport { CheckComplete, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { ModalNoteSection } from './ModalStyles';\n\ninterface NoteProps {\n note: string | React.ReactNode;\n icon?: React.ReactNode;\n state?: string;\n size?: string;\n}\n\nexport const ModalNote: React.FunctionComponent<NoteProps> = ({ note, icon, size, state = 'neutral' }) => {\n const stateVal = state.toLowerCase();\n\n switch (stateVal) {\n case 'positive':\n return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <CheckComplete color={COLORS.correct_500} />}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n case 'warning':\n return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <TechnicalWarning color={COLORS.warning_500} />}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n case 'critical':\n return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <TechnicalWarning color={COLORS.warning_500} />}\n <span>{note}</span>\n </ModalNoteSection>\n );\n\n default:\n return (\n <ModalNoteSection state={stateVal} size={size}>\n {icon ? icon : <Information color={COLORS.primary_500} className={size} />}\n <span>{note}</span>\n </ModalNoteSection>\n );\n }\n};\n\nexport default ModalNote;\n"],"file":"ModalNote.js"}
@@ -13,7 +13,7 @@ import { Size } from '../types';
13
13
  * Import custom styles.
14
14
  */
15
15
 
16
- import { TableWrapper } from './TableStyles';
16
+ import { StyledTable, StyledTableSpinner, TableWrapper } from './TableStyles';
17
17
  /**
18
18
  * Import custom types.
19
19
  */
@@ -36,7 +36,10 @@ const Table = props => {
36
36
  showLoadingIndicator,
37
37
  selectable,
38
38
  multiSelect,
39
- keyExpr
39
+ keyExpr,
40
+ accordion,
41
+ collapsed = true,
42
+ collapsedRows
40
43
  } = props; // States used within the component
41
44
 
42
45
  const [rowsPerPage, setRowsPerPage] = React.useState(10);
@@ -48,6 +51,7 @@ const Table = props => {
48
51
  const [from, setFrom] = React.useState();
49
52
  const [to, setTo] = React.useState();
50
53
  const [total, setTotal] = React.useState();
54
+ const [isCollapsed, setIsCollapsed] = React.useState(true);
51
55
  const [selectAllState, setSelectAllState] = React.useState('none');
52
56
  const [selected, setSelected] = React.useState(multiSelect ? [] : undefined);
53
57
  React.useEffect(() => {
@@ -101,6 +105,18 @@ const Table = props => {
101
105
  setRowsPerPage(pagination?.rowsPerPage);
102
106
  }
103
107
  }, [remoteOperations, pagination, rows]);
108
+ /**
109
+ * Sets number of rows to display when accordion.
110
+ */
111
+
112
+ React.useEffect(() => {
113
+ if (!accordion) return;
114
+ setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);
115
+ }, [rows, accordion, collapsedRows, isCollapsed]);
116
+ React.useEffect(() => {
117
+ if (!accordion) return;
118
+ setIsCollapsed(!!collapsed);
119
+ }, [accordion, collapsed]);
104
120
  /**
105
121
  * Filters out a rows by specific column filters and sorts them if any sorting is set.
106
122
  * @returns Filtered and sorted rows.
@@ -312,7 +328,7 @@ const Table = props => {
312
328
  */
313
329
 
314
330
 
315
- return /*#__PURE__*/React.createElement(TableWrapper, null, /*#__PURE__*/React.createElement("table", {
331
+ return /*#__PURE__*/React.createElement(TableWrapper, null, /*#__PURE__*/React.createElement(StyledTable, {
316
332
  cellPadding: "0",
317
333
  cellSpacing: "0",
318
334
  "data-testid": "TestTable",
@@ -328,14 +344,14 @@ const Table = props => {
328
344
  })), /*#__PURE__*/React.createElement(TableFooter, _extends({}, props, {
329
345
  onRowsPerPageChange: changeRowsPerPage,
330
346
  rowsPerPage: rowsPerPage,
347
+ setIsCollapsed: setIsCollapsed,
348
+ isCollapsed: isCollapsed,
331
349
  from: from,
332
350
  to: to,
333
351
  total: total,
334
352
  nextPage: nextPage,
335
353
  prevPage: previousPage
336
- }))), showLoadingIndicator && /*#__PURE__*/React.createElement("div", {
337
- className: 'table-spinner'
338
- }, /*#__PURE__*/React.createElement(LoadingIndicator, {
354
+ }))), showLoadingIndicator && /*#__PURE__*/React.createElement(StyledTableSpinner, null, /*#__PURE__*/React.createElement(LoadingIndicator, {
339
355
  size: Size.Medium,
340
356
  color: "#ffffff"
341
357
  })));