@laerdal/life-react-components 1.2.2-dev.1.full → 1.2.2-dev.11.full

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 (168) hide show
  1. package/dist/esm/Breadcrumb/Breadcrumb.js.map +1 -1
  2. package/dist/esm/Button/Iconbutton.js +11 -4
  3. package/dist/esm/Button/Iconbutton.js.map +1 -1
  4. package/dist/esm/Dropdown/CommonStyling.js +2 -1
  5. package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
  6. package/dist/esm/Dropdown/DropdownContent.js +13 -1
  7. package/dist/esm/Dropdown/DropdownContent.js.map +1 -1
  8. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js +2 -1
  9. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  10. package/dist/esm/GlobalNavigationBar/GlobalNavigationBar.js +6 -2
  11. package/dist/esm/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  12. package/dist/esm/GlobalNavigationBar/UserMenu/MobileUserMenu.js +2 -1
  13. package/dist/esm/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  14. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js +2 -1
  15. package/dist/esm/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  16. package/dist/esm/GlobalNavigationBar/mobile/CommonStyles.js +8 -1
  17. package/dist/esm/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  18. package/dist/esm/InputFields/Checkbox.js +0 -1
  19. package/dist/esm/InputFields/Checkbox.js.map +1 -1
  20. package/dist/esm/InputFields/DatepickerField.js +6 -0
  21. package/dist/esm/InputFields/DatepickerField.js.map +1 -1
  22. package/dist/esm/InputFields/PasswordField.js +1 -1
  23. package/dist/esm/InputFields/PasswordField.js.map +1 -1
  24. package/dist/esm/InputFields/SearchBar.js +28 -31
  25. package/dist/esm/InputFields/SearchBar.js.map +1 -1
  26. package/dist/esm/List/ListRow.js +4 -1
  27. package/dist/esm/List/ListRow.js.map +1 -1
  28. package/dist/esm/Modals/ModalContainer.js +3 -1
  29. package/dist/esm/Modals/ModalContainer.js.map +1 -1
  30. package/dist/esm/NavItem/NavItem.js +4 -0
  31. package/dist/esm/NavItem/NavItem.js.map +1 -1
  32. package/dist/esm/NotificationDot/NotificationDot.js +1 -1
  33. package/dist/esm/NotificationDot/NotificationDot.js.map +1 -1
  34. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js +40 -0
  35. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js.map +1 -0
  36. package/dist/esm/Paginator/Paginator.js +60 -48
  37. package/dist/esm/Paginator/Paginator.js.map +1 -1
  38. package/dist/esm/Paginator/__tests__/Paginator.test.js +4 -4
  39. package/dist/esm/Paginator/__tests__/Paginator.test.js.map +1 -1
  40. package/dist/esm/Switcher/MobileSwitcherMenu.js +2 -1
  41. package/dist/esm/Switcher/MobileSwitcherMenu.js.map +1 -1
  42. package/dist/esm/Switcher/SwitcherMenuItem.js +5 -0
  43. package/dist/esm/Switcher/SwitcherMenuItem.js.map +1 -1
  44. package/dist/esm/Tabs/HorizontalTabs.js +10 -4
  45. package/dist/esm/Tabs/HorizontalTabs.js.map +1 -1
  46. package/dist/esm/Tabs/TabLink.js +15 -4
  47. package/dist/esm/Tabs/TabLink.js.map +1 -1
  48. package/dist/esm/Toasters/Toast.js +5 -1
  49. package/dist/esm/Toasters/Toast.js.map +1 -1
  50. package/dist/esm/Toasters/ToastContext.js +2 -1
  51. package/dist/esm/Toasters/ToastContext.js.map +1 -1
  52. package/dist/esm/Tooltips/TooltipStyles.js +3 -2
  53. package/dist/esm/Tooltips/TooltipStyles.js.map +1 -1
  54. package/dist/esm/styles/z-indexes.js +14 -0
  55. package/dist/esm/styles/z-indexes.js.map +1 -0
  56. package/dist/js/Breadcrumb/Breadcrumb.js.map +1 -1
  57. package/dist/js/Button/Iconbutton.d.ts +2 -1
  58. package/dist/js/Button/Iconbutton.js +22 -11
  59. package/dist/js/Button/Iconbutton.js.map +1 -1
  60. package/dist/js/Dropdown/CommonStyling.js +3 -1
  61. package/dist/js/Dropdown/CommonStyling.js.map +1 -1
  62. package/dist/js/Dropdown/DropdownContent.js +5 -3
  63. package/dist/js/Dropdown/DropdownContent.js.map +1 -1
  64. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js +3 -1
  65. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  66. package/dist/js/GlobalNavigationBar/GlobalNavigationBar.js +5 -3
  67. package/dist/js/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  68. package/dist/js/GlobalNavigationBar/UserMenu/MobileUserMenu.js +3 -1
  69. package/dist/js/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  70. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js +3 -1
  71. package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  72. package/dist/js/GlobalNavigationBar/mobile/CommonStyles.js +4 -2
  73. package/dist/js/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  74. package/dist/js/InputFields/Checkbox.js +0 -1
  75. package/dist/js/InputFields/Checkbox.js.map +1 -1
  76. package/dist/js/InputFields/DatepickerField.js +3 -1
  77. package/dist/js/InputFields/DatepickerField.js.map +1 -1
  78. package/dist/js/InputFields/PasswordField.js +1 -1
  79. package/dist/js/InputFields/PasswordField.js.map +1 -1
  80. package/dist/js/InputFields/SearchBar.js +28 -34
  81. package/dist/js/InputFields/SearchBar.js.map +1 -1
  82. package/dist/js/List/ListRow.js +3 -1
  83. package/dist/js/List/ListRow.js.map +1 -1
  84. package/dist/js/Modals/ModalContainer.js +3 -1
  85. package/dist/js/Modals/ModalContainer.js.map +1 -1
  86. package/dist/js/NavItem/NavItem.js +3 -1
  87. package/dist/js/NavItem/NavItem.js.map +1 -1
  88. package/dist/js/NotificationDot/NotificationDot.js +1 -1
  89. package/dist/js/NotificationDot/NotificationDot.js.map +1 -1
  90. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js +86 -0
  91. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js.map +1 -0
  92. package/dist/js/Paginator/Paginator.js +39 -38
  93. package/dist/js/Paginator/Paginator.js.map +1 -1
  94. package/dist/js/Paginator/__tests__/Paginator.test.js +6 -6
  95. package/dist/js/Paginator/__tests__/Paginator.test.js.map +1 -1
  96. package/dist/js/Switcher/MobileSwitcherMenu.js +3 -1
  97. package/dist/js/Switcher/MobileSwitcherMenu.js.map +1 -1
  98. package/dist/js/Switcher/SwitcherMenuItem.js +3 -1
  99. package/dist/js/Switcher/SwitcherMenuItem.js.map +1 -1
  100. package/dist/js/Tabs/HorizontalTabs.js +4 -2
  101. package/dist/js/Tabs/HorizontalTabs.js.map +1 -1
  102. package/dist/js/Tabs/TabLink.js +4 -2
  103. package/dist/js/Tabs/TabLink.js.map +1 -1
  104. package/dist/js/Toasters/Toast.js +8 -4
  105. package/dist/js/Toasters/Toast.js.map +1 -1
  106. package/dist/js/Toasters/ToastContext.js +3 -1
  107. package/dist/js/Toasters/ToastContext.js.map +1 -1
  108. package/dist/js/Tooltips/TooltipStyles.js +4 -2
  109. package/dist/js/Tooltips/TooltipStyles.js.map +1 -1
  110. package/dist/js/styles/z-indexes.d.ts +13 -0
  111. package/dist/js/styles/z-indexes.js +21 -0
  112. package/dist/js/styles/z-indexes.js.map +1 -0
  113. package/dist/umd/Breadcrumb/Breadcrumb.js.map +1 -1
  114. package/dist/umd/Button/Iconbutton.js +22 -61
  115. package/dist/umd/Button/Iconbutton.js.map +1 -1
  116. package/dist/umd/Dropdown/CommonStyling.js +5 -5
  117. package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
  118. package/dist/umd/Dropdown/DropdownContent.js +16 -5
  119. package/dist/umd/Dropdown/DropdownContent.js.map +1 -1
  120. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js +5 -5
  121. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  122. package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js +9 -6
  123. package/dist/umd/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  124. package/dist/umd/GlobalNavigationBar/UserMenu/MobileUserMenu.js +5 -5
  125. package/dist/umd/GlobalNavigationBar/UserMenu/MobileUserMenu.js.map +1 -1
  126. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js +5 -5
  127. package/dist/umd/GlobalNavigationBar/UserMenu/UserMenu.js.map +1 -1
  128. package/dist/umd/GlobalNavigationBar/mobile/CommonStyles.js +11 -5
  129. package/dist/umd/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  130. package/dist/umd/InputFields/Checkbox.js +0 -1
  131. package/dist/umd/InputFields/Checkbox.js.map +1 -1
  132. package/dist/umd/InputFields/DatepickerField.js +9 -4
  133. package/dist/umd/InputFields/DatepickerField.js.map +1 -1
  134. package/dist/umd/InputFields/PasswordField.js +1 -1
  135. package/dist/umd/InputFields/PasswordField.js.map +1 -1
  136. package/dist/umd/InputFields/SearchBar.js +33 -34
  137. package/dist/umd/InputFields/SearchBar.js.map +1 -1
  138. package/dist/umd/List/ListRow.js +7 -5
  139. package/dist/umd/List/ListRow.js.map +1 -1
  140. package/dist/umd/Modals/ModalContainer.js +6 -5
  141. package/dist/umd/Modals/ModalContainer.js.map +1 -1
  142. package/dist/umd/NavItem/NavItem.js +7 -4
  143. package/dist/umd/NavItem/NavItem.js.map +1 -1
  144. package/dist/umd/NotificationDot/NotificationDot.js +1 -1
  145. package/dist/umd/NotificationDot/NotificationDot.js.map +1 -1
  146. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js +61 -0
  147. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js.map +1 -0
  148. package/dist/umd/Paginator/Paginator.js +60 -51
  149. package/dist/umd/Paginator/Paginator.js.map +1 -1
  150. package/dist/umd/Paginator/__tests__/Paginator.test.js +4 -4
  151. package/dist/umd/Paginator/__tests__/Paginator.test.js.map +1 -1
  152. package/dist/umd/Switcher/MobileSwitcherMenu.js +5 -5
  153. package/dist/umd/Switcher/MobileSwitcherMenu.js.map +1 -1
  154. package/dist/umd/Switcher/SwitcherMenuItem.js +8 -4
  155. package/dist/umd/Switcher/SwitcherMenuItem.js.map +1 -1
  156. package/dist/umd/Tabs/HorizontalTabs.js +12 -7
  157. package/dist/umd/Tabs/HorizontalTabs.js.map +1 -1
  158. package/dist/umd/Tabs/TabLink.js +18 -8
  159. package/dist/umd/Tabs/TabLink.js.map +1 -1
  160. package/dist/umd/Toasters/Toast.js +5 -1
  161. package/dist/umd/Toasters/Toast.js.map +1 -1
  162. package/dist/umd/Toasters/ToastContext.js +5 -5
  163. package/dist/umd/Toasters/ToastContext.js.map +1 -1
  164. package/dist/umd/Tooltips/TooltipStyles.js +6 -6
  165. package/dist/umd/Tooltips/TooltipStyles.js.map +1 -1
  166. package/dist/umd/styles/z-indexes.js +33 -0
  167. package/dist/umd/styles/z-indexes.js.map +1 -0
  168. package/package.json +10 -19
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","Size","SystemIcons","useHistory","HyperLink","IconButton","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","DropdownButton","marginRight","size","Small","Medium","BreadcrumbContainer","div","props","FontStyles","Regular","neutral_600","primary_700","primary_800","textStyle","color","XSmall","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","chevronSize","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {Link} from 'react-router-dom';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst marginRight = (size: Size | undefined) => {\n return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;'\n}\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n display:flex;\n align-items: center;\n min-height: 48px;\n \n a {\n text-decoration: none;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${(props) => marginRight(props.size) }\n }\n\n .chevronicon {\n ${(props) => marginRight(props.size) }\n }\n\n a:hover {\n color: ${COLORS.primary_700};\n }\n a:active {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n switch (size) {\n case Size.XSmall:\n return ComponentXXSStyling(textStyle, color);\n case Size.Medium:\n return ComponentMStyling(textStyle, color);\n case Size.Small:\n default:\n return ComponentSStyling(textStyle, color);\n }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n ${(props) => marginRight(props.size) }\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n items, \n size = Size.Small, \n homeIcon = true, \n homeLabel = 'Home', \n homeUrl = '/' }) => {\n\n const history = useHistory();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => { \n history.push(links[0]);\n };\n\n const chevronSize = size == Size.Medium ? \"24px\" : size == Size.Small ? \"20px\" : \"16px\";\n\n return (\n <BreadcrumbContainer size={size}>\n\n {homeIcon ? \n <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n <SystemIcons.Home size={chevronSize} />\n </IconButton> : \n <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n {homeLabel}\n </HyperLink>}\n\n { !!items && items.length > 2 &&\n (items.length > 3 ?\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <DropdownButton \n alignLeft={true}\n items={dropdownItems} \n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate} />\n </> :\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n {items[items.length - 3].label}\n </HyperLink> \n </>)\n }\n\n { !!items && items.length > 1 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </HyperLink>\n </>\n }\n\n { !!items && items.length > 0 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <LastBreadcrumbItem size={size}>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}
1
+ {"version":3,"sources":["../../../src/Breadcrumb/Breadcrumb.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","Size","SystemIcons","useHistory","HyperLink","IconButton","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","DropdownButton","marginRight","size","Small","Medium","BreadcrumbContainer","div","props","FontStyles","Regular","neutral_600","primary_700","primary_800","textStyle","color","XSmall","LastBreadcrumbItem","label","Bold","neutral_800","Breadcrumb","items","homeIcon","homeLabel","homeUrl","history","dropdownItems","slice","length","map","x","value","url","displayLabel","navigate","links","push","chevronSize","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {COLORS} from '../styles';\nimport {ComponentTextStyle, Size, SystemIcons} from '..';\nimport {useHistory} from 'react-router';\nimport { HyperLink, IconButton } from '..';\nimport {BreadcrumbItem} from '@laerdal/life-react-components/src/Breadcrumb/BreadcrumbItem';\nimport {ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\nimport DropdownButton from '../Dropdown/DropdownButton';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\n\ntype BreadcrumbProps = {\n homeIcon?: boolean;\n homeLabel?: string;\n homeUrl?: string;\n items?: BreadcrumbItem[];\n size?: Size;\n};\n\nconst marginRight = (size: Size | undefined) => {\n return size == Size.Small || size == Size.Medium ? 'margin-right: 8px;' : 'margin-right: 4px;'\n}\n\nconst BreadcrumbContainer = styled.div<{size: Size | undefined}>`\n display:flex;\n align-items: center;\n min-height: 48px;\n \n a {\n text-decoration: none;\n ${(props) => FontStyles(props.size, ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${(props) => marginRight(props.size) }\n }\n\n .chevronicon {\n ${(props) => marginRight(props.size) }\n }\n\n a:hover {\n color: ${COLORS.primary_700};\n }\n a:active {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst FontStyles = (size: Size | undefined, textStyle: ComponentTextStyle, color: string) => {\n switch (size) {\n case Size.XSmall:\n return ComponentXXSStyling(textStyle, color);\n case Size.Medium:\n return ComponentMStyling(textStyle, color);\n case Size.Small:\n default:\n return ComponentSStyling(textStyle, color);\n }\n}\n\nconst LastBreadcrumbItem = styled.label<{size: Size}>`\n ${(props) => FontStyles(props.size, ComponentTextStyle.Bold, COLORS.neutral_800)}\n ${(props) => marginRight(props.size) }\n`;\n\nconst Breadcrumb: React.FunctionComponent<BreadcrumbProps> = ({ \n items, \n size = Size.Small, \n homeIcon = true, \n homeLabel = 'Home', \n homeUrl = '/' }) => {\n\n const history = useHistory();\n const dropdownItems: DropdownItem[] = items ? items.slice(0, items.length - 2).map(x => ({ value: x.url, displayLabel: x.label })) : [];\n const navigate = (links: string[]) => { \n history.push(links[0]);\n };\n\n const chevronSize = size == Size.Medium ? \"24px\" : size == Size.Small ? \"20px\" : \"16px\";\n\n return (\n <BreadcrumbContainer size={size}>\n\n {homeIcon ? \n <IconButton variant=\"secondary\" shape=\"circular\" action={() => history.push(homeUrl)}>\n <SystemIcons.Home size={chevronSize} />\n </IconButton> : \n <HyperLink id={\"homelink\"} variant=\"default\" href={homeUrl}>\n {homeLabel}\n </HyperLink>}\n\n { !!items && items.length > 2 &&\n (items.length > 3 ?\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <DropdownButton \n alignLeft={true}\n items={dropdownItems} \n size={size}\n icon={<SystemIcons.MoreHorizontal color={COLORS.neutral_600} size=\"20px\" />}\n onClick={navigate} />\n </> :\n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 3)} target=\"_self\" variant=\"default\" href={items[items.length - 3].url}>\n {items[items.length - 3].label}\n </HyperLink> \n </>)\n }\n\n { !!items && items.length > 1 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <HyperLink id={\"link-item-\" + (items.length - 2)} target=\"_self\" variant=\"default\" href={items[items.length - 2].url}>\n {items[items.length - 2].label}\n </HyperLink>\n </>\n }\n\n { !!items && items.length > 0 && \n <>\n <SystemIcons.ChevronRight className=\"chevronicon\" color={COLORS.neutral_500} size={chevronSize} />\n <LastBreadcrumbItem size={size}>\n {items[items.length - 1].label}\n </LastBreadcrumbItem>\n </>\n }\n\n </BreadcrumbContainer>);\n};\n\nexport default Breadcrumb;\n"],"file":"Breadcrumb.js"}
@@ -1,5 +1,5 @@
1
1
  import _pt from "prop-types";
2
- import * as React from 'react';
2
+ import React from 'react';
3
3
  import styled, { css } from 'styled-components';
4
4
  import { BREAKPOINTS, COLORS } from '../styles';
5
5
 
@@ -198,7 +198,8 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
198
198
  borderRadius,
199
199
  onKeyPress,
200
200
  tabbedHereBackgroundColor,
201
- type
201
+ type,
202
+ hidden
202
203
  }, ref) => {
203
204
  const supressFocusRef = React.useRef(null);
204
205
  const [tabbedHere, setTabbedHere] = React.useState(false);
@@ -211,8 +212,11 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
211
212
  }
212
213
 
213
214
  return false;
214
- }; // Let's render button
215
+ };
215
216
 
217
+ React.useEffect(() => {
218
+ !!disabled && setTabbedHere(false);
219
+ }, [disabled]); // Let's render button
216
220
 
217
221
  switch (variant) {
218
222
  case 'secondary':
@@ -244,6 +248,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
244
248
  },
245
249
  tabbedHere: tabbedHere,
246
250
  onKeyPress: onKeyPress,
251
+ hidden: hidden,
247
252
  tabbedHereBackgroundColor: tabbedHereBackgroundColor
248
253
  }, /*#__PURE__*/React.createElement("div", null, children));
249
254
 
@@ -278,6 +283,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
278
283
  },
279
284
  tabbedHere: tabbedHere,
280
285
  onKeyPress: onKeyPress,
286
+ hidden: hidden,
281
287
  tabbedHereBackgroundColor: tabbedHereBackgroundColor
282
288
  }, /*#__PURE__*/React.createElement("div", null, children));
283
289
  }
@@ -297,7 +303,8 @@ IconButton.propTypes = {
297
303
  borderRadius: _pt.number,
298
304
  onKeyPress: _pt.func,
299
305
  tabbedHereBackgroundColor: _pt.string,
300
- children: _pt.node
306
+ children: _pt.node,
307
+ hidden: _pt.bool
301
308
  };
302
309
  export default IconButton;
303
310
  //# sourceMappingURL=Iconbutton.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["React","styled","css","BREAKPOINTS","COLORS","tabbedHereStyle","variant","tabbedHereBackgroundColor","primary_500","neutral_600","primary_700","white","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","forwardRef","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","type","ref","supressFocusRef","useRef","setTabbedHere","useState","isPressingEnter","e","key","preventDefault","stopPropagation","event","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n flatEdge?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst getBorderRadius = (props:HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px'); \n\nconst getBorderRadiusStyle = (props:HeaderItemProps) => {\n const radius = getBorderRadius(props);\n switch(props.flatEdge)\n {\n case 'left':\n return `0px ${radius} ${radius} 0px`;\n \n case 'right':\n return `${radius} 0px 0px ${radius}`;\n\n case 'none':\n default:\n return `${radius}`;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${getBorderRadiusStyle};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.white};\n path {\n fill: ${(props) => props.iconColor || COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ninterface Props {\n id?: string;\n variant?: 'primary' | 'secondary';\n shape?: 'square' | 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n type?: 'submit' | 'reset' | 'button' | undefined;\n children?: React.ReactNode;\n};\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n flatEdge,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n type,\n}: Props, ref) => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n flatEdge={flatEdge}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n});\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
1
+ {"version":3,"sources":["../../../src/Button/Iconbutton.tsx"],"names":["React","styled","css","BREAKPOINTS","COLORS","tabbedHereStyle","variant","tabbedHereBackgroundColor","primary_500","neutral_600","primary_700","white","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","StyledPrimaryIconButton","useTransparentBackground","iconColor","primary_800","neutral_200","tabbedHere","StyledSecondaryIconButton","primary_20","primary_100","neutral_300","IconButton","forwardRef","id","shape","action","isInMobileMenu","children","disabled","tabIndex","onKeyPress","type","hidden","ref","supressFocusRef","useRef","setTabbedHere","useState","isPressingEnter","e","key","preventDefault","stopPropagation","useEffect","event","current"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS } from '../styles';\n\ninterface HeaderItemProps {\n hideOnLowWidth: boolean;\n inMobileMenu?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n borderRadius?: number;\n shape?: string;\n flatEdge?: string;\n tabbedHere?: boolean;\n tabbedHereBackgroundColor?: string;\n}\n\nconst tabbedHereStyle = (variant: string, tabbedHereBackgroundColor?: string) => {\n switch (variant) {\n case 'secondary':\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || 'transparent'} !important;\n box-shadow: 0px 0px 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\n }\n div svg path,\n div svg {\n fill: ${COLORS.neutral_600};\n }\n `;\n case 'primary':\n default:\n return css`\n div {\n background-color: ${tabbedHereBackgroundColor || COLORS.primary_700} !important;\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n `;\n }\n};\n\nconst getBorderRadius = (props:HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px'); \n\nconst getBorderRadiusStyle = (props:HeaderItemProps) => {\n const radius = getBorderRadius(props);\n switch(props.flatEdge)\n {\n case 'left':\n return `0px ${radius} ${radius} 0px`;\n \n case 'right':\n return `${radius} 0px 0px ${radius}`;\n\n case 'none':\n default:\n return `${radius}`;\n }\n};\n\nconst StyledIconButton = styled.button<HeaderItemProps>`\n border-width: 0;\n cursor: pointer;\n height: 48px;\n width: 48px;\n background: transparent;\n\n display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n ${BREAKPOINTS.MEDIUM} {\n display: block;\n }\n\n border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n div {\n height: 36px;\n width: 36px;\n border-radius: ${getBorderRadiusStyle};\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n padding: 0;\n }\n }\n &:only-child {\n margin: 0;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:focus:not(:disabled) {\n outline: none;\n div {\n outline: none;\n }\n }\n &:active:not(:disabled) {\n div {\n box-shadow: none;\n }\n }\n`;\n\nconst StyledPrimaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.white};\n path {\n fill: ${(props) => props.iconColor || COLORS.white};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_700};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_800};\n }\n div svg path,\n div svg {\n fill: ${COLORS.white};\n }\n }\n &:disabled {\n div {\n background-color: ${COLORS.neutral_200};\n }\n svg {\n path {\n fill: ${COLORS.white};\n }\n fill: ${COLORS.white};\n }\n }\n ${(props) => (props.tabbedHere ? tabbedHereStyle('primary', props.tabbedHereBackgroundColor) : '')};\n`;\n\nconst StyledSecondaryIconButton = styled(StyledIconButton)`\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n svg {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n path {\n fill: ${(props) => props.iconColor || COLORS.neutral_600};\n }\n }\n }\n &:hover:not(:disabled) {\n div {\n background-color: ${COLORS.primary_20};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_700};\n }\n }\n &:active:not(:disabled) {\n div {\n background: ${COLORS.primary_100};\n }\n div svg path,\n div svg {\n fill: ${COLORS.primary_800};\n }\n }\n\n &:disabled {\n div {\n background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n }\n svg {\n path {\n fill: ${COLORS.neutral_300};\n }\n fill: ${COLORS.neutral_300};\n }\n }\n\n ${(props) => (props.tabbedHere ? tabbedHereStyle('secondary', props.tabbedHereBackgroundColor) : '')};\n`;\n\ninterface Props {\n id?: string;\n variant?: 'primary' | 'secondary';\n shape?: 'square' | 'circular';\n action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n hideOnLowWidth?: boolean;\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n isInMobileMenu?: boolean;\n disabled?: boolean;\n useTransparentBackground?: boolean;\n iconColor?: string;\n unsetIconSize?: boolean;\n tabIndex?: number;\n borderRadius?: number;\n onKeyPress?: React.KeyboardEventHandler<HTMLButtonElement>;\n tabbedHereBackgroundColor?: string;\n type?: 'submit' | 'reset' | 'button' | undefined;\n children?: React.ReactNode;\n hidden?: boolean;\n};\n\nconst IconButton = React.forwardRef<HTMLButtonElement, Props>(({\n id,\n variant,\n shape,\n action,\n hideOnLowWidth,\n isInMobileMenu,\n children,\n useTransparentBackground,\n disabled,\n iconColor,\n unsetIconSize,\n tabIndex,\n flatEdge,\n borderRadius,\n onKeyPress,\n tabbedHereBackgroundColor,\n type,\n hidden\n}: Props, ref) => {\n const supressFocusRef = React.useRef<any>(null);\n const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n const isPressingEnter = (e: any) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n e.stopPropagation();\n return true;\n }\n return false;\n };\n\n React.useEffect(() => {\n !!disabled && setTabbedHere(false)\n }, [disabled]);\n\n // Let's render button\n switch (variant) {\n case 'secondary':\n return (\n <StyledSecondaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n hidden={hidden}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledSecondaryIconButton>\n );\n case 'primary':\n default:\n return (\n <StyledPrimaryIconButton\n id={id}\n type={type ?? 'button'}\n data-testid={id}\n flatEdge={flatEdge}\n ref={ref}\n onClick={(event: React.MouseEvent<HTMLButtonElement>) => action(event)}\n onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)}\n disabled={disabled}\n hideOnLowWidth={hideOnLowWidth || false}\n inMobileMenu={isInMobileMenu}\n useTransparentBackground={useTransparentBackground}\n iconColor={iconColor}\n unsetIconSize={unsetIconSize}\n tabIndex={tabIndex || 0}\n borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n onMouseDown={(e: any) => {\n if (!disabled && !tabbedHere) supressFocusRef.current = true;\n }}\n onFocus={(e: any) => {\n if (!disabled) {\n if (!supressFocusRef.current) setTabbedHere(true);\n else supressFocusRef.current = false;\n }\n }}\n onBlur={() => {\n setTabbedHere(false);\n }}\n tabbedHere={tabbedHere}\n onKeyPress={onKeyPress}\n hidden={hidden}\n tabbedHereBackgroundColor={tabbedHereBackgroundColor}>\n <div>{children}</div>\n </StyledPrimaryIconButton>\n );\n }\n});\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
@@ -3,6 +3,7 @@ import { CommonInteractionStyling } from '../common';
3
3
  import { BREAKPOINTS, COLORS, ComponentTextStyle } from '../styles';
4
4
  import { ComponentMStyling, ComponentLStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling } from '../styles/typography';
5
5
  import { Size } from '../types';
6
+ import { Z_INDEXES } from '../styles/z-indexes';
6
7
  export const Dropdown = styled.div`
7
8
  position: relative;
8
9
  display: inline-block;
@@ -202,7 +203,7 @@ export const DropdownContentStyling = styled.div`
202
203
  position: absolute;
203
204
  background-color: ${COLORS.white};
204
205
  width: 100%;
205
- z-index: 1;
206
+ z-index: ${Z_INDEXES.dropdown};
206
207
  margin-top: ${props => props.isButton ? '-4px' : '2px'};
207
208
 
208
209
  &.show {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Dropdown/CommonStyling.tsx"],"names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","ComponentMStyling","ComponentLStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Size","Dropdown","div","props","isButton","locked","disabled","margin","primary_600","primary_800","lockedState","neutral_100","neutral_300","neutral_600","disabledState","white","activeValidationMessage","warning_400","placeholderStyling","Italic","InputField","input","Regular","black","MEDIUM","StyledField","neutral_400","primary_200","primary_300","Bold","neutral_800","neutral_20","showValidationMessage","isPlaceholder","ButtonDropdownContentStyling","DropdownContentStyling","neutral_200","DropdownButton","button","DropdownButtonCSS","size","Small","Medium","Large","primary_500","primary_20","primary_100","ButtonDropdownWrapper","primary_700"],"mappings":"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IAAI,IAAIxC,IAAI,CAAC2C,KAAb,IAAsB/C,iBAAiB,CAACF,kBAAkB,CAAC4B,OAApB,EAA6B7B,MAAM,CAACoB,WAApC,CAAiD;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB2B,IAAI,IAAIxC,IAAI,CAAC2C,KAAb,GAAqB,MAArB,GAA8BH,IAAI,IAAIxC,IAAI,CAAC0C,MAAb,GAAsB,MAAtB,GAA+B,MAAO;AACpF,sBAAsBjD,MAAM,CAACsB,KAAM;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIxB,wBAAyB;AAC7B;AACA;AACA,kBAAkBE,MAAM,CAACsC,UAAW;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0BtC,MAAM,CAACmD,WAAY;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAanD,MAAM,CAAC2C,WAAY;AAChC;AACA;AACA;AACA,wBAAwB3C,MAAM,CAACoD,UAAW;AAC1C;AACA;AACA,eAAepD,MAAM,CAACe,WAAY;AAClC;AACA;AACA;AACA,0BAA0Bf,MAAM,CAACmD,WAAY;AAC7C;AACA;AACA;AACA;AACA,wBAAwBnD,MAAM,CAACqD,WAAY;AAC3C;AACA;AACA,eAAerD,MAAM,CAACgB,WAAY;AAClC;AACA;AACA;AACA,0BAA0BhB,MAAM,CAACmD,WAAY;AAC7C;AACA;AACA,CA1FE;AA2FD,CA5FM;AA8FP,OAAO,MAAMG,qBAAqB,GAAG1D,MAAM,CAACa,GAA8C;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAKC,KAAD,IAAYA,KAAK,CAACE,MAAN,IAAgBF,KAAK,CAACG,QAAtB,GAAiC,sBAAjC,GAA0D,kBAAoB;AAC9F,IAAKH,KAAD,IAAYA,KAAK,CAACG,QAAN,GAAiB,uBAAjB,GAA2C,EAAI;AAC/D;AACA;AACA;AACA,wBAAwBb,MAAM,CAACoD,UAAW;AAC1C,aAAapD,MAAM,CAACuD,WAAY;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBvD,MAAM,CAACqD,WAAY;AAC3C,aAAarD,MAAM,CAACgB,WAAY;AAChC;AACA;AACA,EA5CO","sourcesContent":["import styled, {css} from 'styled-components';\nimport {CommonInteractionStyling} from '../common';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {ComponentMStyling, ComponentLStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling} from '../styles/typography';\nimport { Size } from '../types';\n\nexport const Dropdown = styled.div<{ isButton: boolean; locked?: boolean; disabled?: boolean; margin?: string }>`\n position: relative;\n display: inline-block;\n ${(props) => !props.isButton && 'width: 100%; min-width: 344px;'}\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : '')}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n\n .show {\n display: block;\n }\n\n .value {\n flex-grow: 1;\n }\n\n input:hover + div {\n color: ${COLORS.primary_600};\n }\n\n input:active + div {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst lockedState = css`\n background-color: ${COLORS.neutral_100};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_300};\n color: ${COLORS.neutral_600};\n pointer-events: none;\n cursor: not-allowed;\n input {\n color: ${COLORS.neutral_600} !important;\n }\n`;\n\nconst disabledState = css`\n background-color: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n pointer-events: none;\n cursor: not-allowed;\n svg {\n color: ${COLORS.neutral_300} !important;\n }\n input {\n color: ${COLORS.neutral_300} !important;\n ::placeholder {\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n\nconst activeValidationMessage = css`\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n`;\n\nconst placeholderStyling = css`\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n`;\n\nexport const InputField = styled.input`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n color: ${COLORS.black} !important;\n padding: 0;\n ::-webkit-search-decoration,\n ::-webkit-search-cancel-button,\n ::-webkit-search-results-button,\n ::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n ::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n`;\n\nexport const StyledField = styled.div<{ disabled: boolean; locked: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; fontSize?: string }>`\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n\n padding: 12px 16px;\n height: 48px;\n min-width: 344px;\n width: 100%;\n\n background: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\n box-sizing: border-box;\n border-radius: 4px;\n cursor: pointer;\n\n display: flex;\n align-items: center;\n gap: 4px;\n \n input{\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n }\n\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 16px;\n height: 56px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 12px 16px;\n height: 48px;\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n height: 56px;\n padding: 16px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &:focus {\n outline: 3px solid #ddd;\n }\n &:focus-within {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_200};\n input {\n ::placeholder {\n color: ${COLORS.primary_600};\n }\n }\n cursor: pointer;\n }\n &:active {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_300};\n input {\n ::placeholder {\n color: ${COLORS.primary_800};\n }\n }\n }\n\n &.button {\n ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.neutral_300 : COLORS.neutral_600)}\n\n box-sizing: border-box;\n height: 32px;\n padding: 0 8px;\n width: initial;\n min-width: initial;\n border: none !important;\n box-shadow: none;\n border-radius: 4px;\n\n &.expanded {\n color: ${COLORS.neutral_800};\n background: ${COLORS.neutral_20};\n }\n }\n\n ${(props) => (props.disabled ? disabledState : '')}\n ${(props) => (props.locked ? lockedState : '')}\n ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\n ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\n\n ${CommonInteractionStyling};\n`;\n\nexport const ButtonDropdownContentStyling = css`\n min-width: 344px;\n right: 0;\n`;\n\nexport const DropdownContentStyling = styled.div<{ isButton: boolean }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n width: 100%;\n z-index: 1;\n margin-top: ${(props) => (props.isButton ? '-4px' : '2px')};\n\n &.show {\n display: block;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\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 border-radius: 4px;\n padding: 4px 0;\n\n max-height: 240px;\n overflow-y: auto;\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_200};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_400};\n }\n`;\n\nexport const DropdownButton = styled.button<{size? : Size}>`\n ${props => DropdownButtonCSS(props.size)}\n`;\n\nexport const DropdownButtonCSS = (size? : Size) => {\n return css`\n\n ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n position: relative;\n text-decoration: none;\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n background-color: ${COLORS.white};\n border: none;\n cursor: pointer;\n background: transparent;\n width: 100%;\n text-align: left;\n\n span {\n margin: auto 0 auto 16px;\n line-height: 48px;\n }\n\n div.item-content {\n margin: auto 0 auto 16px;\n display: flex;\n align-items: center;\n\n div.item-label {\n flex: 1 0 calc(100% - 40px);\n }\n\n div.item-icon {\n margin-right: 6px;\n }\n div.item-icon-old {\n flex: 1 0 40px;\n display: flex;\n justify-content: flex-end;\n }\n }\n\n ${CommonInteractionStyling};\n\n &.active {\n background: ${COLORS.neutral_20};\n\n &::after {\n position: absolute;\n content: ' ';\n width: 4px;\n top: 0;\n bottom: 0;\n left: 2px;\n background-color: ${COLORS.primary_500};\n\n border-radius: 2px;\n }\n }\n\n &:disabled {\n background-color: transparent;\n cursor: not-allowed;\n color: ${COLORS.neutral_200}\n }\n\n &.active:hover {\n background-color: ${COLORS.primary_20};\n\n svg {\n color: ${COLORS.primary_600};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.active:active {\n background-color: ${COLORS.primary_100};\n\n svg {\n color: ${COLORS.primary_800};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n`;\n};\n\nexport const ButtonDropdownWrapper = styled.div<{ locked?: boolean; disabled?: boolean }>`\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n align-items: center;\n width: fit-content;\n\n .button {\n min-width: 64px;\n }\n\n .value {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n }\n\n .dropdown-arrow {\n width: 24px;\n height: 24px;\n }\n\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : 'cursor: pointer;')}\n ${(props) => (props.disabled ? 'pointer-events: none;' : '')}\n \n &:hover .button,\n & > .button:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:focus .button,\n & > .button:focus {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n outline: none;\n }\n\n &:active .button,\n & > .button:active {\n box-shadow: none;\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n}`;\n"],"file":"CommonStyling.js"}
1
+ {"version":3,"sources":["../../../src/Dropdown/CommonStyling.tsx"],"names":["styled","css","CommonInteractionStyling","BREAKPOINTS","COLORS","ComponentTextStyle","ComponentMStyling","ComponentLStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","Size","Z_INDEXES","Dropdown","div","props","isButton","locked","disabled","margin","primary_600","primary_800","lockedState","neutral_100","neutral_300","neutral_600","disabledState","white","activeValidationMessage","warning_400","placeholderStyling","Italic","InputField","input","Regular","black","MEDIUM","StyledField","neutral_400","primary_200","primary_300","Bold","neutral_800","neutral_20","showValidationMessage","isPlaceholder","ButtonDropdownContentStyling","DropdownContentStyling","dropdown","neutral_200","DropdownButton","button","DropdownButtonCSS","size","Small","Medium","Large","primary_500","primary_20","primary_100","ButtonDropdownWrapper","primary_700"],"mappings":"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CAAC6B,OAApB,EAA6B9B,MAAM,CAACqB,WAApC,CAAiD;AAC7F,IAAI4B,IAAI,IAAI1C,IAAI,CAAC6C,KAAb,IAAsBjD,iBAAiB,CAACF,kBAAkB,CAAC6B,OAApB,EAA6B9B,MAAM,CAACqB,WAApC,CAAiD;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgB4B,IAAI,IAAI1C,IAAI,CAAC6C,KAAb,GAAqB,MAArB,GAA8BH,IAAI,IAAI1C,IAAI,CAAC4C,MAAb,GAAsB,MAAtB,GAA+B,MAAO;AACpF,sBAAsBnD,MAAM,CAACuB,KAAM;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIzB,wBAAyB;AAC7B;AACA;AACA,kBAAkBE,MAAM,CAACuC,UAAW;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0BvC,MAAM,CAACqD,WAAY;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAarD,MAAM,CAAC6C,WAAY;AAChC;AACA;AACA;AACA,wBAAwB7C,MAAM,CAACsD,UAAW;AAC1C;AACA;AACA,eAAetD,MAAM,CAACgB,WAAY;AAClC;AACA;AACA;AACA,0BAA0BhB,MAAM,CAACqD,WAAY;AAC7C;AACA;AACA;AACA;AACA,wBAAwBrD,MAAM,CAACuD,WAAY;AAC3C;AACA;AACA,eAAevD,MAAM,CAACiB,WAAY;AAClC;AACA;AACA;AACA,0BAA0BjB,MAAM,CAACqD,WAAY;AAC7C;AACA;AACA,CA1FE;AA2FD,CA5FM;AA8FP,OAAO,MAAMG,qBAAqB,GAAG5D,MAAM,CAACc,GAA8C;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAKC,KAAD,IAAYA,KAAK,CAACE,MAAN,IAAgBF,KAAK,CAACG,QAAtB,GAAiC,sBAAjC,GAA0D,kBAAoB;AAC9F,IAAKH,KAAD,IAAYA,KAAK,CAACG,QAAN,GAAiB,uBAAjB,GAA2C,EAAI;AAC/D;AACA;AACA;AACA,wBAAwBd,MAAM,CAACsD,UAAW;AAC1C,aAAatD,MAAM,CAACyD,WAAY;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBzD,MAAM,CAACuD,WAAY;AAC3C,aAAavD,MAAM,CAACiB,WAAY;AAChC;AACA;AACA,EA5CO","sourcesContent":["import styled, {css} from 'styled-components';\nimport {CommonInteractionStyling} from '../common';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {ComponentMStyling, ComponentLStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling} from '../styles/typography';\nimport { Size } from '../types';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nexport const Dropdown = styled.div<{ isButton: boolean; locked?: boolean; disabled?: boolean; margin?: string }>`\n position: relative;\n display: inline-block;\n ${(props) => !props.isButton && 'width: 100%; min-width: 344px;'}\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : '')}\n ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n\n .show {\n display: block;\n }\n\n .value {\n flex-grow: 1;\n }\n\n input:hover + div {\n color: ${COLORS.primary_600};\n }\n\n input:active + div {\n color: ${COLORS.primary_800};\n }\n`;\n\nconst lockedState = css`\n background-color: ${COLORS.neutral_100};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_300};\n color: ${COLORS.neutral_600};\n pointer-events: none;\n cursor: not-allowed;\n input {\n color: ${COLORS.neutral_600} !important;\n }\n`;\n\nconst disabledState = css`\n background-color: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n pointer-events: none;\n cursor: not-allowed;\n svg {\n color: ${COLORS.neutral_300} !important;\n }\n input {\n color: ${COLORS.neutral_300} !important;\n ::placeholder {\n color: ${COLORS.neutral_300} !important;\n }\n }\n`;\n\nconst activeValidationMessage = css`\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n`;\n\nconst placeholderStyling = css`\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n`;\n\nexport const InputField = styled.input`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n border: none;\n outline: none;\n background-color: inherit;\n cursor: pointer;\n color: ${COLORS.black} !important;\n padding: 0;\n ::-webkit-search-decoration,\n ::-webkit-search-cancel-button,\n ::-webkit-search-results-button,\n ::-webkit-search-results-decoration {\n -webkit-appearance: none;\n }\n ::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n`;\n\nexport const StyledField = styled.div<{ disabled: boolean; locked: boolean; showValidationMessage?: boolean; isPlaceholder?: boolean; fontSize?: string }>`\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n\n padding: 12px 16px;\n height: 48px;\n min-width: 344px;\n width: 100%;\n\n background: ${COLORS.white};\n box-shadow: inset 0px 0px 0px 1px ${COLORS.neutral_400};\n box-sizing: border-box;\n border-radius: 4px;\n cursor: pointer;\n\n display: flex;\n align-items: center;\n gap: 4px;\n \n input{\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n }\n\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n\n ${BREAKPOINTS.MEDIUM} {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 16px;\n height: 56px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.small {\n ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n padding: 12px 16px;\n height: 48px;\n &::placeholder {\n ${ComponentXXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, 'inherit')}\n height: 56px;\n padding: 16px;\n &::placeholder {\n ${ComponentXSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &:focus {\n outline: 3px solid #ddd;\n }\n &:focus-within {\n -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n box-shadow: inset 0px 0px 0px 2px ${COLORS.primary_800};\n }\n &:hover {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_200};\n input {\n ::placeholder {\n color: ${COLORS.primary_600};\n }\n }\n cursor: pointer;\n }\n &:active {\n box-shadow: inset 0px 0px 0px 1px ${COLORS.primary_300};\n input {\n ::placeholder {\n color: ${COLORS.primary_800};\n }\n }\n }\n\n &.button {\n ${(props) => ComponentSStyling(ComponentTextStyle.Bold, props.disabled ? COLORS.neutral_300 : COLORS.neutral_600)}\n\n box-sizing: border-box;\n height: 32px;\n padding: 0 8px;\n width: initial;\n min-width: initial;\n border: none !important;\n box-shadow: none;\n border-radius: 4px;\n\n &.expanded {\n color: ${COLORS.neutral_800};\n background: ${COLORS.neutral_20};\n }\n }\n\n ${(props) => (props.disabled ? disabledState : '')}\n ${(props) => (props.locked ? lockedState : '')}\n ${(props) => (props.showValidationMessage ? activeValidationMessage : '')}\n ${(props) => (props.isPlaceholder ? placeholderStyling : '')}\n\n ${CommonInteractionStyling};\n`;\n\nexport const ButtonDropdownContentStyling = css`\n min-width: 344px;\n right: 0;\n`;\n\nexport const DropdownContentStyling = styled.div<{ isButton: boolean }>`\n display: none;\n position: absolute;\n background-color: ${COLORS.white};\n width: 100%;\n z-index: ${Z_INDEXES.dropdown};\n margin-top: ${(props) => (props.isButton ? '-4px' : '2px')};\n\n &.show {\n display: block;\n }\n\n &.up {\n top: auto;\n bottom: 100%;\n }\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 border-radius: 4px;\n padding: 4px 0;\n\n max-height: 240px;\n overflow-y: auto;\n\n /* width */\n ::-webkit-scrollbar {\n width: 4px;\n cursor: pointer;\n }\n\n /* Track */\n ::-webkit-scrollbar-track {\n background: ${COLORS.white};\n }\n\n /* Handle */\n ::-webkit-scrollbar-thumb {\n background: ${COLORS.neutral_200};\n border-radius: 8px;\n }\n\n /* Handle on hover */\n ::-webkit-scrollbar-thumb:hover {\n background: ${COLORS.neutral_400};\n }\n`;\n\nexport const DropdownButton = styled.button<{size? : Size}>`\n ${props => DropdownButtonCSS(props.size)}\n`;\n\nexport const DropdownButtonCSS = (size? : Size) => {\n return css`\n\n ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n position: relative;\n text-decoration: none;\n display: flex;\n flex-direction: row;\n align-items: center;\n min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n background-color: ${COLORS.white};\n border: none;\n cursor: pointer;\n background: transparent;\n width: 100%;\n text-align: left;\n\n span {\n margin: auto 0 auto 16px;\n line-height: 48px;\n }\n\n div.item-content {\n margin: auto 0 auto 16px;\n display: flex;\n align-items: center;\n\n div.item-label {\n flex: 1 0 calc(100% - 40px);\n }\n\n div.item-icon {\n margin-right: 6px;\n }\n div.item-icon-old {\n flex: 1 0 40px;\n display: flex;\n justify-content: flex-end;\n }\n }\n\n ${CommonInteractionStyling};\n\n &.active {\n background: ${COLORS.neutral_20};\n\n &::after {\n position: absolute;\n content: ' ';\n width: 4px;\n top: 0;\n bottom: 0;\n left: 2px;\n background-color: ${COLORS.primary_500};\n\n border-radius: 2px;\n }\n }\n\n &:disabled {\n background-color: transparent;\n cursor: not-allowed;\n color: ${COLORS.neutral_200}\n }\n\n &.active:hover {\n background-color: ${COLORS.primary_20};\n\n svg {\n color: ${COLORS.primary_600};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n\n &.active:active {\n background-color: ${COLORS.primary_100};\n\n svg {\n color: ${COLORS.primary_800};\n }\n\n &::after {\n background-color: ${COLORS.primary_500};\n }\n }\n`;\n};\n\nexport const ButtonDropdownWrapper = styled.div<{ locked?: boolean; disabled?: boolean }>`\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n align-items: center;\n width: fit-content;\n\n .button {\n min-width: 64px;\n }\n\n .value {\n flex-grow: 1;\n display: flex;\n justify-content: center;\n }\n\n .dropdown-arrow {\n width: 24px;\n height: 24px;\n }\n\n ${(props) => (props.locked || props.disabled ? 'cursor: not-allowed;' : 'cursor: pointer;')}\n ${(props) => (props.disabled ? 'pointer-events: none;' : '')}\n \n &:hover .button,\n & > .button:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:focus .button,\n & > .button:focus {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n outline: none;\n }\n\n &:active .button,\n & > .button:active {\n box-shadow: none;\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n}`;\n"],"file":"CommonStyling.js"}
@@ -7,13 +7,14 @@ import { ButtonDropdownContentStyling, DropdownButtonCSS } from './CommonStyling
7
7
  import { ComponentLStyling, ComponentXLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';
8
8
  import { COLORS } from '../styles';
9
9
  import { Checkbox, RadioButton } from '../InputFields';
10
+ import { Z_INDEXES } from '../styles/z-indexes';
10
11
  export const DDContainer = styled.div`
11
12
  display: none;
12
13
  position: absolute;
13
14
  background-color: ${COLORS.white};
14
15
 
15
16
  width: ${props => props.width ? props.width : '100%'};
16
- z-index: 1;
17
+ z-index: ${Z_INDEXES.dropdown};
17
18
  margin: ${props => props.isButton ? '-4px' : '4px 0px'};
18
19
 
19
20
  &.show {
@@ -45,6 +46,17 @@ export const DDContainer = styled.div`
45
46
  max-height: ${props => !props.scrollable ? 'auto' : props.maxHeight ? props.maxHeight : props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px'};
46
47
  `;
47
48
  const ItemsContainer = styled.div`
49
+ > *:hover {
50
+ z-index: ${Z_INDEXES.hover};
51
+ }
52
+ > *:active,
53
+ > *.active{
54
+ z-index: ${Z_INDEXES.active};
55
+ }
56
+ > *:focus {
57
+ z-index: ${Z_INDEXES.focus};
58
+ }
59
+
48
60
  button.dropdownButton {
49
61
  ${props => DropdownButtonCSS(props.size)}
50
62
  }`;
@@ -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","DDContainer","div","white","props","width","isButton","alignLeft","neutral_100","size","Large","Medium","scrollable","maxHeight","ItemsContainer","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","focus","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';\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: 1;\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 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","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":";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,eAAK,IAAIc,CAAC,GAAGH,UAAU,GAAG,CAA1B,EAA6BG,CAAC,GAAG,CAAjC,EAAoCA,CAAC,EAArC,EAAyC;AACvC,gBAAI,CAACD,QAAQ,CAACC,CAAC,GAAG,CAAL,CAAR,EAAiBC,QAAtB,EAAgC;AAC9BJ,cAAAA,UAAU,GAAGG,CAAb;AACA;AACD;AACF;;AACDlB,UAAAA,oBAAoB,CAACe,UAAD,CAApB;AACD;AACF,OAbD,MAaO,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,IAAIc,CAAC,GAAGH,UAAU,GAAG,CAA1B,EAA6BG,CAAC,IAAID,QAAQ,CAACrB,MAA3C,EAAmDsB,CAAC,EAApD,EAAwD;AACtD,gBAAI,CAACD,QAAQ,CAACC,CAAC,GAAG,CAAL,CAAR,EAAiBC,QAAtB,EAAgC;AAC9BJ,cAAAA,UAAU,GAAGG,CAAb;AACA;AACD;AACF;AACF,SARD,MAQO;AACLH,UAAAA,UAAU,GAAGK,WAAW,KAAK,CAAL,GAAS,CAAjC;AACD;;AACDpB,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,GAzDD;;AA2DA,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,EAAItB,CAAJ,KAAUe,aAAa,CAAC9B,MAAM,CAACe,CAAD,CAAP,CAF9B,CADO,CAAT;AAKD,GAND,EAMG,CAAChD,MAAD,EAASiE,SAAT,EAAoB3D,cAApB,CANH;AAQA1D,EAAAA,KAAK,CAAC6G,SAAN,CAAgB,MAAM;AACpB1C,IAAAA,eAAe;AAChB,GAFD,EAEG,CAACf,MAAD,CAFH;;AAIA,QAAMkD,WAAW,GAAG,MAAM;AACxB,QAAInD,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,CAAC8C,WAAW,EAA5B,GAAiC,CAAjC,GAAqC9C,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,EAAE5B,QALlB;AAME,QAAA,GAAG,EAAG,OAAMnD,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,EAAE5B,QAHlB;AAIE,QAAA,GAAG,EAAEhB,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,EAAE5B,QAFlB;AAGE,QAAA,GAAG,EAAEhB,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,CAvYD;;;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;AACAhD,MAAAA,Q;AACA0C,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;;AA4YF,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 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"}
@@ -3,6 +3,7 @@ import * as React from 'react';
3
3
  import styled, { keyframes } from 'styled-components';
4
4
  import { BREAKPOINTS, COLORS } from '../styles';
5
5
  import { VerticalTabs } from '../Tabs';
6
+ import { Z_INDEXES } from '../styles/z-indexes';
6
7
  const flowDown = keyframes`
7
8
  0% {
8
9
  opacity: 0;
@@ -27,7 +28,7 @@ const Menu = styled.ul`
27
28
  position: absolute;
28
29
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
29
30
  border-radius: 4px;
30
- z-index: 100;
31
+ z-index: ${Z_INDEXES.dropdown};
31
32
 
32
33
  top: 12px;
33
34
  ${BREAKPOINTS.SMALL} {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/GlobalNavigationBar/ExtendedMainMenu.tsx"],"names":["React","styled","keyframes","BREAKPOINTS","COLORS","VerticalTabs","flowDown","Menu","ul","white","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","ExtendedMainMenu","clickMenuAction","navigationOptions","entries","setEntries","useState","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","list","map","n","requiredLine","label","to","disabled","onClick","exact"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,IAAiBC,SAAjB,QAAkC,mBAAlC;AAGA,SAASC,WAAT,EAAsBC,MAAtB,QAAoC,WAApC;AACA,SAASC,YAAT,QAA6B,SAA7B;AAGA,MAAMC,QAAQ,GAAGJ,SAAU;AAC3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CATA;AAWA,MAAMK,IAAI,GAAGN,MAAM,CAACO,EAAG;AACvB;AACA;AACA;AACA,sBAAsBJ,MAAM,CAACK,KAAM;AACnC;AACA;AACA;AACA;AACA,uBAAuBH,QAAS;AAChC,eAAeA,QAAS;AACxB;AACA;AACA;AACA;AACA;AACA;AACA,IAAIH,WAAW,CAACO,KAAM;AACtB;AACA;AACA,IAAIP,WAAW,CAACQ,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,CA3BA;AA6BA,MAAMC,WAAW,GAAGX,MAAM,CAACY,EAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBT,MAAM,CAACU,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAnBA;AAqBA,MAAMC,eAAe,GAAGd,MAAM,CAACO,EAAG;AAClC;AACA;AACA;AACA,CAJA;;AAWA,MAAMQ,gBAAgB,GAAG,CAAC;AAAEC,EAAAA,eAAF;AAAmBC,EAAAA;AAAnB,CAAD,KAAmD;AAC1E,QAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBpB,KAAK,CAACqB,QAAN,CAAmC,EAAnC,CAA9B;AACArB,EAAAA,KAAK,CAACsB,SAAN,CAAgB,MAAM;AACpB,aAASC,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpBR,QAAAA,eAAe;AAChB;AACF;;AAEDS,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,MAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAXD,EAWG,CAACN,eAAD,CAXH;AAaAjB,EAAAA,KAAK,CAACsB,SAAN,CAAgB,MAAM;AACpB,UAAMO,IAAI,GAAGX,iBAAiB,EAAEY,GAAnB,CAAuBC,CAAC,IAAI;AACvC,aAAO;AAAEC,QAAAA,YAAY,EAAED,CAAC,CAACE,KAAlB;AAAyBC,QAAAA,EAAE,EAAEH,CAAC,CAACG,EAA/B;AAAmCC,QAAAA,QAAQ,EAAEJ,CAAC,CAACI,QAA/C;AAAyDC,QAAAA,OAAO,EAAEL,CAAC,CAACK,OAApE;AAA6EC,QAAAA,KAAK,EAAEN,CAAC,CAACM;AAAtF,OAAP;AACD,KAFY,CAAb;AAGAjB,IAAAA,UAAU,CAACS,IAAD,CAAV;AACD,GALD,EAKG,CAACX,iBAAD,CALH;AAOA,sBACE,oBAAC,IAAD;AAAM,IAAA,OAAO,EAAED,eAAf;AAAgC,IAAA,IAAI,EAAC,MAArC;AAA4C,uBAAgB;AAA5D,kBACE,oBAAC,WAAD,qBACE,oBAAC,eAAD,qBACE,oBAAC,YAAD;AAAc,IAAA,GAAG,EAAC,cAAlB;AAAiC,IAAA,OAAO,EAAEE,OAA1C;AAAmD,IAAA,IAAI,EAAC;AAAxD,IADF,CADF,CADF,CADF;AASD,CA/BD;;;AAJEF,EAAAA,e;AACAC,EAAAA,iB;;AAoCF,eAAeF,gBAAf","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { NavOption } from '../types';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { VerticalTabs } from '../Tabs';\nimport { VerticalTabEntry } from '../Tabs/VerticalTabs';\n\nconst flowDown = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n right: -8px;\n min-width: 300px;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n z-index: 100;\n\n top: 12px;\n ${BREAKPOINTS.SMALL} {\n top: 18px;\n }\n ${BREAKPOINTS.MEDIUM} {\n top: 24px;\n }\n\n .open & {\n display: block;\n }\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ${COLORS.neutral_100};\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0 2px;\n`;\n\ntype Props = {\n clickMenuAction: () => void;\n navigationOptions: NavOption[];\n};\n\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\n const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n React.useEffect(() => {\n const list = navigationOptions?.map(n => {\n return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.onClick, exact: n.exact };\n }) as VerticalTabEntry[];\n setEntries(list);\n }, [navigationOptions]);\n\n return (\n <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <MenuSection>\n <MenuSectionList>\n <VerticalTabs key=\"ExtendedMenu\" entries={entries} size=\"medium\" />\n </MenuSectionList>\n </MenuSection>\n </Menu>\n );\n};\n\nexport default ExtendedMainMenu;\n"],"file":"ExtendedMainMenu.js"}
1
+ {"version":3,"sources":["../../../src/GlobalNavigationBar/ExtendedMainMenu.tsx"],"names":["React","styled","keyframes","BREAKPOINTS","COLORS","VerticalTabs","Z_INDEXES","flowDown","Menu","ul","white","dropdown","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","ExtendedMainMenu","clickMenuAction","navigationOptions","entries","setEntries","useState","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","list","map","n","requiredLine","label","to","disabled","onClick","exact"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,IAAiBC,SAAjB,QAAkC,mBAAlC;AAGA,SAASC,WAAT,EAAsBC,MAAtB,QAAoC,WAApC;AACA,SAASC,YAAT,QAA6B,SAA7B;AAEA,SAAQC,SAAR,QAAwB,qBAAxB;AAEA,MAAMC,QAAQ,GAAGL,SAAU;AAC3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CATA;AAWA,MAAMM,IAAI,GAAGP,MAAM,CAACQ,EAAG;AACvB;AACA;AACA;AACA,sBAAsBL,MAAM,CAACM,KAAM;AACnC;AACA;AACA;AACA;AACA,uBAAuBH,QAAS;AAChC,eAAeA,QAAS;AACxB;AACA;AACA;AACA,aAAaD,SAAS,CAACK,QAAS;AAChC;AACA;AACA,IAAIR,WAAW,CAACS,KAAM;AACtB;AACA;AACA,IAAIT,WAAW,CAACU,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,CA3BA;AA6BA,MAAMC,WAAW,GAAGb,MAAM,CAACc,EAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBX,MAAM,CAACY,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAnBA;AAqBA,MAAMC,eAAe,GAAGhB,MAAM,CAACQ,EAAG;AAClC;AACA;AACA;AACA,CAJA;;AAWA,MAAMS,gBAAgB,GAAG,CAAC;AAAEC,EAAAA,eAAF;AAAmBC,EAAAA;AAAnB,CAAD,KAAmD;AAC1E,QAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBtB,KAAK,CAACuB,QAAN,CAAmC,EAAnC,CAA9B;AACAvB,EAAAA,KAAK,CAACwB,SAAN,CAAgB,MAAM;AACpB,aAASC,cAAT,CAAwBC,CAAxB,EAAgC;AAC9B,UAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpBR,QAAAA,eAAe;AAChB;AACF;;AAEDS,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,SAA1B,EAAqCJ,cAArC,EAAqD,KAArD;AACA,WAAO,MAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,SAA7B,EAAwCL,cAAxC,EAAwD,KAAxD;AACD,KAFD;AAGD,GAXD,EAWG,CAACN,eAAD,CAXH;AAaAnB,EAAAA,KAAK,CAACwB,SAAN,CAAgB,MAAM;AACpB,UAAMO,IAAI,GAAGX,iBAAiB,EAAEY,GAAnB,CAAuBC,CAAC,IAAI;AACvC,aAAO;AAAEC,QAAAA,YAAY,EAAED,CAAC,CAACE,KAAlB;AAAyBC,QAAAA,EAAE,EAAEH,CAAC,CAACG,EAA/B;AAAmCC,QAAAA,QAAQ,EAAEJ,CAAC,CAACI,QAA/C;AAAyDC,QAAAA,OAAO,EAAEL,CAAC,CAACK,OAApE;AAA6EC,QAAAA,KAAK,EAAEN,CAAC,CAACM;AAAtF,OAAP;AACD,KAFY,CAAb;AAGAjB,IAAAA,UAAU,CAACS,IAAD,CAAV;AACD,GALD,EAKG,CAACX,iBAAD,CALH;AAOA,sBACE,oBAAC,IAAD;AAAM,IAAA,OAAO,EAAED,eAAf;AAAgC,IAAA,IAAI,EAAC,MAArC;AAA4C,uBAAgB;AAA5D,kBACE,oBAAC,WAAD,qBACE,oBAAC,eAAD,qBACE,oBAAC,YAAD;AAAc,IAAA,GAAG,EAAC,cAAlB;AAAiC,IAAA,OAAO,EAAEE,OAA1C;AAAmD,IAAA,IAAI,EAAC;AAAxD,IADF,CADF,CADF,CADF;AASD,CA/BD;;;AAJEF,EAAAA,e;AACAC,EAAAA,iB;;AAoCF,eAAeF,gBAAf","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { NavOption } from '../types';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { VerticalTabs } from '../Tabs';\nimport { VerticalTabEntry } from '../Tabs/VerticalTabs';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst flowDown = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nconst Menu = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0;\n background-color: ${COLORS.white};\n box-sizing: border-box;\n display: none;\n right: -8px;\n min-width: 300px;\n -webkit-animation: ${flowDown} 0.2s ease-in-out;\n animation: ${flowDown} 0.2s ease-in-out;\n position: absolute;\n box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n border-radius: 4px;\n z-index: ${Z_INDEXES.dropdown};\n\n top: 12px;\n ${BREAKPOINTS.SMALL} {\n top: 18px;\n }\n ${BREAKPOINTS.MEDIUM} {\n top: 24px;\n }\n\n .open & {\n display: block;\n }\n`;\n\nconst MenuSection = styled.li`\n padding: 8px 0;\n position: relative;\n\n &:not(:first-of-type)::before {\n content: '';\n position: absolute;\n background: ${COLORS.neutral_100};\n height: 1px;\n top: 0;\n left: 16px;\n right: 16px;\n }\n\n .disabled-link {\n color: #21212150;\n pointer-events: none;\n key-events: none;\n }\n`;\n\nconst MenuSectionList = styled.ul`\n list-style: none;\n margin: 0;\n padding: 0 2px;\n`;\n\ntype Props = {\n clickMenuAction: () => void;\n navigationOptions: NavOption[];\n};\n\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\n const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\n React.useEffect(() => {\n function handleKeyPress(e: any) {\n if (e.keyCode === 27) {\n clickMenuAction();\n }\n }\n\n document.addEventListener('keydown', handleKeyPress, false);\n return () => {\n document.removeEventListener('keydown', handleKeyPress, false);\n };\n }, [clickMenuAction]);\n\n React.useEffect(() => {\n const list = navigationOptions?.map(n => {\n return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.onClick, exact: n.exact };\n }) as VerticalTabEntry[];\n setEntries(list);\n }, [navigationOptions]);\n\n return (\n <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n <MenuSection>\n <MenuSectionList>\n <VerticalTabs key=\"ExtendedMenu\" entries={entries} size=\"medium\" />\n </MenuSectionList>\n </MenuSection>\n </Menu>\n );\n};\n\nexport default ExtendedMainMenu;\n"],"file":"ExtendedMainMenu.js"}