@laerdal/life-react-components 2.2.1-dev.14 → 2.2.1-dev.15

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 (251) hide show
  1. package/dist/Accordion/AccordionItem.cjs +17 -8
  2. package/dist/Accordion/AccordionItem.cjs.map +1 -1
  3. package/dist/Accordion/AccordionItem.d.ts +0 -2
  4. package/dist/Accordion/AccordionItem.js +18 -9
  5. package/dist/Accordion/AccordionItem.js.map +1 -1
  6. package/dist/Accordion/AccordionMenu.cjs +2 -6
  7. package/dist/Accordion/AccordionMenu.cjs.map +1 -1
  8. package/dist/Accordion/AccordionMenu.d.ts +0 -3
  9. package/dist/Accordion/AccordionMenu.js +2 -6
  10. package/dist/Accordion/AccordionMenu.js.map +1 -1
  11. package/dist/Accordion/styles.cjs +11 -7
  12. package/dist/Accordion/styles.cjs.map +1 -1
  13. package/dist/Accordion/styles.d.ts +4 -1
  14. package/dist/Accordion/styles.js +9 -6
  15. package/dist/Accordion/styles.js.map +1 -1
  16. package/dist/AuthPage/AuthPage.js +1 -1
  17. package/dist/Banners/Banner.cjs.map +1 -1
  18. package/dist/Banners/Banner.js.map +1 -1
  19. package/dist/Button/Button.cjs +1 -1
  20. package/dist/Button/Button.cjs.map +1 -1
  21. package/dist/Button/Button.js +2 -2
  22. package/dist/Button/Button.js.map +1 -1
  23. package/dist/Button/Iconbutton.cjs +61 -68
  24. package/dist/Button/Iconbutton.cjs.map +1 -1
  25. package/dist/Button/Iconbutton.d.ts +1 -3
  26. package/dist/Button/Iconbutton.js +61 -68
  27. package/dist/Button/Iconbutton.js.map +1 -1
  28. package/dist/Card/HorizontalCard/HorizontalCard.cjs +9 -12
  29. package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
  30. package/dist/Card/HorizontalCard/HorizontalCard.d.ts +0 -2
  31. package/dist/Card/HorizontalCard/HorizontalCard.js +8 -9
  32. package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
  33. package/dist/Card/HorizontalCard/HorizontalCardActions.cjs +0 -1
  34. package/dist/Card/HorizontalCard/HorizontalCardActions.cjs.map +1 -1
  35. package/dist/Card/HorizontalCard/HorizontalCardActions.js +0 -1
  36. package/dist/Card/HorizontalCard/HorizontalCardActions.js.map +1 -1
  37. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +9 -13
  38. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
  39. package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts +0 -4
  40. package/dist/Card/HorizontalCard/HorizontalCardBody.js +8 -8
  41. package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
  42. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +5 -7
  43. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
  44. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts +0 -2
  45. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +5 -5
  46. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
  47. package/dist/Card/HorizontalCard/index.cjs +12 -33
  48. package/dist/Card/HorizontalCard/index.cjs.map +1 -1
  49. package/dist/Card/HorizontalCard/index.d.ts +1 -3
  50. package/dist/Card/HorizontalCard/index.js +1 -3
  51. package/dist/Card/HorizontalCard/index.js.map +1 -1
  52. package/dist/Card/HorizontalCard/types.cjs.map +1 -1
  53. package/dist/Card/HorizontalCard/types.d.ts +2 -2
  54. package/dist/Card/HorizontalCard/types.js.map +1 -1
  55. package/dist/ChipsInput/ChipInputField.cjs +1 -1
  56. package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
  57. package/dist/ChipsInput/ChipInputField.js +1 -1
  58. package/dist/ChipsInput/ChipInputField.js.map +1 -1
  59. package/dist/Dropdown/BasicDropdown.cjs +19 -6
  60. package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
  61. package/dist/Dropdown/BasicDropdown.d.ts +1 -0
  62. package/dist/Dropdown/BasicDropdown.js +20 -7
  63. package/dist/Dropdown/BasicDropdown.js.map +1 -1
  64. package/dist/Dropdown/CommonStyling.cjs +7 -4
  65. package/dist/Dropdown/CommonStyling.cjs.map +1 -1
  66. package/dist/Dropdown/CommonStyling.d.ts +3 -1
  67. package/dist/Dropdown/CommonStyling.js +7 -4
  68. package/dist/Dropdown/CommonStyling.js.map +1 -1
  69. package/dist/Dropdown/DropdownButton.cjs +0 -1
  70. package/dist/Dropdown/DropdownButton.cjs.map +1 -1
  71. package/dist/Dropdown/DropdownButton.js +0 -1
  72. package/dist/Dropdown/DropdownButton.js.map +1 -1
  73. package/dist/Dropdown/DropdownButtonTypes.cjs.map +1 -1
  74. package/dist/Dropdown/DropdownButtonTypes.d.ts +0 -2
  75. package/dist/Dropdown/DropdownButtonTypes.js.map +1 -1
  76. package/dist/Dropdown/DropdownContent.cjs +1 -1
  77. package/dist/Dropdown/DropdownContent.js +1 -1
  78. package/dist/Dropdown/DropdownFilter.cjs +13 -2
  79. package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
  80. package/dist/Dropdown/DropdownFilter.js +13 -2
  81. package/dist/Dropdown/DropdownFilter.js.map +1 -1
  82. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
  83. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
  84. package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +3 -1
  85. package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
  86. package/dist/GlobalNavigationBar/GlobalNavigationBar.js +4 -2
  87. package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
  88. package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
  89. package/dist/GlobalNavigationBar/Logo.js.map +1 -1
  90. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs +6 -1
  91. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -1
  92. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.d.ts +4 -0
  93. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js +5 -4
  94. package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -1
  95. package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +147 -56
  96. package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
  97. package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +2 -2
  98. package/dist/GlobalNavigationBar/desktop/MainMenu.js +147 -56
  99. package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
  100. package/dist/GlobalNavigationBar/desktop/SubMenu.cjs +176 -0
  101. package/dist/GlobalNavigationBar/desktop/SubMenu.cjs.map +1 -0
  102. package/dist/GlobalNavigationBar/desktop/SubMenu.d.ts +18 -0
  103. package/dist/GlobalNavigationBar/desktop/SubMenu.js +166 -0
  104. package/dist/GlobalNavigationBar/desktop/SubMenu.js.map +1 -0
  105. package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
  106. package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
  107. package/dist/GlobalNavigationBar/types.cjs.map +1 -1
  108. package/dist/GlobalNavigationBar/types.d.ts +12 -2
  109. package/dist/GlobalNavigationBar/types.js.map +1 -1
  110. package/dist/GlobalNavigationBar/utils.cjs +17 -0
  111. package/dist/GlobalNavigationBar/utils.cjs.map +1 -0
  112. package/dist/GlobalNavigationBar/utils.d.ts +2 -0
  113. package/dist/GlobalNavigationBar/utils.js +10 -0
  114. package/dist/GlobalNavigationBar/utils.js.map +1 -0
  115. package/dist/Image/ImageWithFallbacks.js +1 -1
  116. package/dist/InputFields/DatepickerField.cjs +50 -31
  117. package/dist/InputFields/DatepickerField.cjs.map +1 -1
  118. package/dist/InputFields/DatepickerField.js +51 -32
  119. package/dist/InputFields/DatepickerField.js.map +1 -1
  120. package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
  121. package/dist/InputFields/DatepickerFieldHeader.js +1 -1
  122. package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
  123. package/dist/InputFields/Label.cjs +12 -8
  124. package/dist/InputFields/Label.cjs.map +1 -1
  125. package/dist/InputFields/Label.js +12 -8
  126. package/dist/InputFields/Label.js.map +1 -1
  127. package/dist/InputFields/NumberField.cjs +29 -12
  128. package/dist/InputFields/NumberField.cjs.map +1 -1
  129. package/dist/InputFields/NumberField.js +32 -15
  130. package/dist/InputFields/NumberField.js.map +1 -1
  131. package/dist/InputFields/PasswordField.cjs +50 -44
  132. package/dist/InputFields/PasswordField.cjs.map +1 -1
  133. package/dist/InputFields/PasswordField.js +51 -45
  134. package/dist/InputFields/PasswordField.js.map +1 -1
  135. package/dist/InputFields/SearchBar.cjs +2 -1
  136. package/dist/InputFields/SearchBar.cjs.map +1 -1
  137. package/dist/InputFields/SearchBar.js +3 -2
  138. package/dist/InputFields/SearchBar.js.map +1 -1
  139. package/dist/InputFields/TextField.cjs +11 -1
  140. package/dist/InputFields/TextField.cjs.map +1 -1
  141. package/dist/InputFields/TextField.js +12 -2
  142. package/dist/InputFields/TextField.js.map +1 -1
  143. package/dist/InputFields/Textarea.cjs +3 -8
  144. package/dist/InputFields/Textarea.cjs.map +1 -1
  145. package/dist/InputFields/Textarea.d.ts +7 -3
  146. package/dist/InputFields/Textarea.js +6 -12
  147. package/dist/InputFields/Textarea.js.map +1 -1
  148. package/dist/InputFields/components/SearchField.cjs +1 -1
  149. package/dist/InputFields/components/SearchField.cjs.map +1 -1
  150. package/dist/InputFields/components/SearchField.js +1 -1
  151. package/dist/InputFields/components/SearchField.js.map +1 -1
  152. package/dist/InputFields/styling.cjs +11 -11
  153. package/dist/InputFields/styling.cjs.map +1 -1
  154. package/dist/InputFields/styling.d.ts +2 -3
  155. package/dist/InputFields/styling.js +11 -10
  156. package/dist/InputFields/styling.js.map +1 -1
  157. package/dist/InputFields/types.cjs.map +1 -1
  158. package/dist/InputFields/types.d.ts +8 -4
  159. package/dist/InputFields/types.js.map +1 -1
  160. package/dist/LinearProgress/LinearProgress.js +1 -1
  161. package/dist/Modals/ModalContent.cjs +2 -9
  162. package/dist/Modals/ModalContent.cjs.map +1 -1
  163. package/dist/Modals/ModalContent.d.ts +0 -1
  164. package/dist/Modals/ModalContent.js +2 -9
  165. package/dist/Modals/ModalContent.js.map +1 -1
  166. package/dist/Modals/ModalTypes.cjs.map +1 -1
  167. package/dist/Modals/ModalTypes.d.ts +1 -1
  168. package/dist/Modals/ModalTypes.js.map +1 -1
  169. package/dist/NavItem/NavItem.cjs +2 -1
  170. package/dist/NavItem/NavItem.cjs.map +1 -1
  171. package/dist/NavItem/NavItem.d.ts +1 -0
  172. package/dist/NavItem/NavItem.js +1 -1
  173. package/dist/NavItem/NavItem.js.map +1 -1
  174. package/dist/NavItem/NestedNavItem.cjs +38 -0
  175. package/dist/NavItem/NestedNavItem.cjs.map +1 -0
  176. package/dist/NavItem/NestedNavItem.d.ts +13 -0
  177. package/dist/NavItem/NestedNavItem.js +28 -0
  178. package/dist/NavItem/NestedNavItem.js.map +1 -0
  179. package/dist/Paginator/Paginator.cjs.map +1 -1
  180. package/dist/Paginator/Paginator.js.map +1 -1
  181. package/dist/Table/Table.cjs +1 -2
  182. package/dist/Table/Table.cjs.map +1 -1
  183. package/dist/Table/Table.js +1 -2
  184. package/dist/Table/Table.js.map +1 -1
  185. package/dist/Table/TableFooter.cjs.map +1 -1
  186. package/dist/Table/TableFooter.js +1 -1
  187. package/dist/Table/TableFooter.js.map +1 -1
  188. package/dist/Table/TableStyles.cjs +4 -4
  189. package/dist/Table/TableStyles.cjs.map +1 -1
  190. package/dist/Table/TableStyles.js +4 -4
  191. package/dist/Table/TableStyles.js.map +1 -1
  192. package/dist/Table/TableTypes.cjs.map +1 -1
  193. package/dist/Table/TableTypes.d.ts +1 -2
  194. package/dist/Table/TableTypes.js.map +1 -1
  195. package/dist/Tabs/HorizontalTabs.cjs +12 -10
  196. package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
  197. package/dist/Tabs/HorizontalTabs.d.ts +1 -2
  198. package/dist/Tabs/HorizontalTabs.js +14 -13
  199. package/dist/Tabs/HorizontalTabs.js.map +1 -1
  200. package/dist/Tabs/TabLink.cjs +39 -14
  201. package/dist/Tabs/TabLink.cjs.map +1 -1
  202. package/dist/Tabs/TabLink.d.ts +6 -1
  203. package/dist/Tabs/TabLink.js +39 -14
  204. package/dist/Tabs/TabLink.js.map +1 -1
  205. package/dist/Tabs/VerticalTabs.cjs +2 -0
  206. package/dist/Tabs/VerticalTabs.cjs.map +1 -1
  207. package/dist/Tabs/VerticalTabs.d.ts +1 -0
  208. package/dist/Tabs/VerticalTabs.js +2 -0
  209. package/dist/Tabs/VerticalTabs.js.map +1 -1
  210. package/dist/Tile/TileCommonItems.cjs +2 -4
  211. package/dist/Tile/TileCommonItems.cjs.map +1 -1
  212. package/dist/Tile/TileCommonItems.js +2 -4
  213. package/dist/Tile/TileCommonItems.js.map +1 -1
  214. package/dist/Tile/TileHeader.cjs +10 -18
  215. package/dist/Tile/TileHeader.cjs.map +1 -1
  216. package/dist/Tile/TileHeader.js +10 -18
  217. package/dist/Tile/TileHeader.js.map +1 -1
  218. package/dist/Tile/TileTypes.cjs.map +1 -1
  219. package/dist/Tile/TileTypes.d.ts +2 -5
  220. package/dist/Tile/TileTypes.js.map +1 -1
  221. package/dist/Toggles/ToggleSwitch.cjs +1 -11
  222. package/dist/Toggles/ToggleSwitch.cjs.map +1 -1
  223. package/dist/Toggles/ToggleSwitch.js +2 -12
  224. package/dist/Toggles/ToggleSwitch.js.map +1 -1
  225. package/dist/Toggles/TogglerStyles.cjs +1 -1
  226. package/dist/Toggles/TogglerStyles.cjs.map +1 -1
  227. package/dist/Toggles/TogglerStyles.js +1 -1
  228. package/dist/Toggles/TogglerStyles.js.map +1 -1
  229. package/dist/Tooltips/TooltipOverflow.cjs +117 -0
  230. package/dist/Tooltips/TooltipOverflow.cjs.map +1 -0
  231. package/dist/Tooltips/TooltipOverflow.d.ts +10 -0
  232. package/dist/Tooltips/TooltipOverflow.js +107 -0
  233. package/dist/Tooltips/TooltipOverflow.js.map +1 -0
  234. package/dist/Tooltips/TooltipStyles.cjs +5 -2
  235. package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
  236. package/dist/Tooltips/TooltipStyles.d.ts +1 -0
  237. package/dist/Tooltips/TooltipStyles.js +5 -2
  238. package/dist/Tooltips/TooltipStyles.js.map +1 -1
  239. package/dist/Tooltips/TooltipWrapper.cjs +3 -4
  240. package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
  241. package/dist/Tooltips/TooltipWrapper.js +1 -2
  242. package/dist/Tooltips/TooltipWrapper.js.map +1 -1
  243. package/dist/assets/index.cjs.map +1 -1
  244. package/dist/assets/index.js.map +1 -1
  245. package/dist/common/ActionWithin.cjs +1 -1
  246. package/dist/common/ActionWithin.js +1 -1
  247. package/dist/common/FocusVisible.cjs +1 -1
  248. package/dist/common/FocusVisible.js +1 -1
  249. package/dist/icons/systemicons/SystemIcons.cjs.map +1 -1
  250. package/dist/icons/systemicons/SystemIcons.js.map +1 -1
  251. package/package.json +2 -1
@@ -18,7 +18,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
18
18
  var distanceToEdge = function distanceToEdge(size) {
19
19
  return size == _types.Size.XSmall ? '8px' : !size || size == _types.Size.Small ? '12px' : '16px';
20
20
  };
21
- var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n \n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: 34em;\n background: ", ";\n position: absolute; \n opacity: 0; \n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n \n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " \n ", " \n ", " \n ", ";\n }\n"])), function (props) {
21
+ var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n box-sizing: border-box;\n \n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: ", ";\n background: ", ";\n position: absolute; \n opacity: 0; \n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n \n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " \n ", " \n ", " \n ", ";\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n\n"])), function (props) {
22
22
  return props.size == _types.Size.Small || props.size != _types.Size.Medium ? (0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
23
23
  }, function (props) {
24
24
  return props.size == _types.Size.XSmall ? (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white) : '';
@@ -32,6 +32,9 @@ var Tooltip = _styledComponents.default.div(_templateObject || (_templateObject
32
32
  return props.width ? "width: ".concat(props.width, ";") : 'width: max-content;';
33
33
  }, function (props) {
34
34
  return props.height;
35
+ }, function (props) {
36
+ var _props$maxWidth;
37
+ return (_props$maxWidth = props.maxWidth) !== null && _props$maxWidth !== void 0 ? _props$maxWidth : '34em';
35
38
  }, _styles.COLORS.primary_800, _zIndexes.Z_INDEXES.tooltip, function (props) {
36
39
  return props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '';
37
40
  }, function (props) {
@@ -70,7 +73,7 @@ Tooltip.defaultProps = {
70
73
  position: 'bottom'
71
74
  };
72
75
  var TooltipTrigger = function TooltipTrigger(delay) {
73
- return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n }\n\n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '1s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
76
+ return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n \n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '0.7s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
74
77
  };
75
78
  exports.TooltipTrigger = TooltipTrigger;
76
79
  var TooltipContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-block;\n position: relative;\n\n ", "\n \n &:focus{\n ", "\n }\n"])), function (props) {
@@ -1 +1 @@
1
- {"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '1s'};\n }\n }\n\n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TooltipStyles.cjs","names":["distanceToEdge","size","Size","XSmall","Small","Tooltip","styled","div","props","Medium","ComponentSStyling","ComponentTextStyle","Regular","COLORS","white","ComponentXSStyling","ComponentMStyling","align","BOXSHADOWS","BOXSHADOW_L2","width","height","maxWidth","primary_800","Z_INDEXES","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","css","TooltipContainer","focusStyles"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n maxWidth?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n box-sizing: border-box;\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: ${props => props.maxWidth ?? '34em'};\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '0.7s'};\n }\n\n \n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
@@ -3,6 +3,7 @@ export declare const Tooltip: import("styled-components").StyledComponent<"div",
3
3
  withArrow?: boolean | undefined;
4
4
  size?: Size | undefined;
5
5
  height?: string | undefined;
6
+ maxWidth?: string | undefined;
6
7
  align?: 'start' | 'end' | 'center' | undefined;
7
8
  position?: 'top' | 'right' | 'bottom' | 'left' | undefined;
8
9
  width?: string | undefined;
@@ -8,7 +8,7 @@ import { Z_INDEXES } from '../styles/z-indexes';
8
8
  var distanceToEdge = function distanceToEdge(size) {
9
9
  return size == Size.XSmall ? '8px' : !size || size == Size.Small ? '12px' : '16px';
10
10
  };
11
- export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n \n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: 34em;\n background: ", ";\n position: absolute; \n opacity: 0; \n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n \n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " \n ", " \n ", " \n ", ";\n }\n"])), function (props) {
11
+ export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n pointer-events: none;\n ", "\n ", "\n ", "\n ", "\n box-shadow: ", ";\n box-sizing: border-box;\n \n padding: ", ";\n border-radius: 2px;\n ", "\n height: ", ";\n max-width: ", ";\n background: ", ";\n position: absolute; \n opacity: 0; \n z-index: ", ";\n ", "\n\n ", "\n ", "\n \n ", "\n\n\n&::after {\n ", "\n content: \"\";\n position: absolute;\n ", "\n \n ", "\n ", "\n\n ", "\n\n ", "\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ", " \n ", " \n ", " \n ", ";\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n\n"])), function (props) {
12
12
  return props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
13
13
  }, function (props) {
14
14
  return props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '';
@@ -22,6 +22,9 @@ export var Tooltip = styled.div(_templateObject || (_templateObject = _taggedTem
22
22
  return props.width ? "width: ".concat(props.width, ";") : 'width: max-content;';
23
23
  }, function (props) {
24
24
  return props.height;
25
+ }, function (props) {
26
+ var _props$maxWidth;
27
+ return (_props$maxWidth = props.maxWidth) !== null && _props$maxWidth !== void 0 ? _props$maxWidth : '34em';
25
28
  }, COLORS.primary_800, Z_INDEXES.tooltip, function (props) {
26
29
  return props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '';
27
30
  }, function (props) {
@@ -59,7 +62,7 @@ Tooltip.defaultProps = {
59
62
  position: 'bottom'
60
63
  };
61
64
  export var TooltipTrigger = function TooltipTrigger(delay) {
62
- return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n }\n\n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '1s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
65
+ return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &.hover {\n &:hover ", ", &:focus-within ", ", &:focus ", " {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n \n &.click ", " {\n transition: 0.5s;\n transition-delay: ", ";\n }\n\n &.click.show ", " {\n opacity: 1;\n }\n\n &.click.hide ", " {\n opacity: 0;\n }\n\n"])), Tooltip, Tooltip, Tooltip, delay !== null && delay !== void 0 ? delay : '0.7s', Tooltip, delay !== null && delay !== void 0 ? delay : '0s', Tooltip, Tooltip);
63
66
  };
64
67
  export var TooltipContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n\n ", "\n \n &:focus{\n ", "\n }\n"])), function (props) {
65
68
  return TooltipTrigger(props.delay);
@@ -1 +1 @@
1
- {"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: 34em;\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '1s'};\n }\n }\n\n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TooltipStyles.js","names":["styled","css","Size","BOXSHADOWS","COLORS","ComponentTextStyle","focusStyles","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","distanceToEdge","size","XSmall","Small","Tooltip","div","props","Medium","Regular","white","align","BOXSHADOW_L2","width","height","maxWidth","primary_800","tooltip","position","withArrow","defaultProps","TooltipTrigger","delay","TooltipContainer"],"sources":["../../src/Tooltips/TooltipStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types';\nimport {BOXSHADOWS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\nconst distanceToEdge = (size: Size | undefined) => {\n return size == Size.XSmall ? '8px' : (!size || size == Size.Small) ? '12px' : '16px';\n}\n\nexport const Tooltip = styled.div<{\n withArrow?: boolean;\n size?: Size;\n height?: string;\n maxWidth?: string;\n align?: 'start' | 'end' | 'center' | undefined;\n position?: 'top' | 'right' | 'bottom' | 'left' | undefined;\n width?: string;\n}>`\n\n pointer-events: none;\n ${props => (props.size == Size.Small || props.size != Size.Medium ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.size == Size.Medium ? ComponentMStyling(ComponentTextStyle.Regular, COLORS.white) : '')}\n ${props => (props.align == 'center' ? 'text-align: center;' : '')}\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n box-sizing: border-box;\n \n padding: ${props => props.size == Size.XSmall ? '4px 8px' : props.size == Size.Medium ? '8px 12px' : '6px 10px'};\n border-radius: 2px;\n ${props => props.width ? `width: ${props.width};` : 'width: max-content;'}\n height: ${props => props.height};\n max-width: ${props => props.maxWidth ?? '34em'};\n background: ${COLORS.primary_800};\n position: absolute; \n opacity: 0; \n z-index: ${Z_INDEXES.tooltip};\n ${props => (props.position == 'top' ? 'bottom: 110%;' : props.position == 'bottom' ? 'top: 110%;' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; transform: translateX(-110%) translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%;left: 110%; transform: translateY(50%);' : '')}\n \n ${props =>\n props.position == 'left' || props.position == 'right'\n ? ''\n : props.align == 'start'\n ? 'left: 0%;'\n : props.align == 'end'\n ? 'right: 0%;'\n : 'left: 50%; transform: translateX(-50%);'}\n\n\n&::after {\n ${props => (!props.withArrow ? 'display: none;' : '')}\n content: \"\";\n position: absolute;\n ${props => (props.position == 'top' ? 'top: 100%;' : props.position == 'bottom' ? 'bottom: 100%;' : '')}\n \n ${props => (props.position == 'right' ? 'right: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n ${props => (props.position == 'left' ? 'left: 100%; bottom: 50%; transform: translateY(50%);' : '')}\n\n ${props =>\n props.position == 'left' || props.position == 'right' ? '' : \n props.align == 'start' ? `left: ${distanceToEdge(props.size)};` : props.align == 'end' ? `right: ${distanceToEdge(props.size)};` : 'left: 50%;'}\n\n ${props => (props.position == 'left' ? '' : 'margin-left: -5px;')}\n margin: -0.5px;\n border-width: 4px;\n border-style: solid;\n border-color: ${props => (props.position == 'top' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'right' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'bottom' ? COLORS.primary_800 : 'transparent')} \n ${props => (props.position == 'left' ? COLORS.primary_800 : 'transparent')};\n }\n\n & > span {\n word-wrap: break-word;\n color: white;\n }\n\n`;\n\nTooltip.defaultProps = {\n withArrow: false,\n size: Size.Small,\n height: 'auto',\n align: 'center',\n position: 'bottom'\n}\n\nexport const TooltipTrigger = (delay?: string) => css`\n &.hover {\n &:hover ${Tooltip}, &:focus-within ${Tooltip}, &:focus ${Tooltip} {\n opacity: 1;\n transition: 0.5s;\n transition-delay: ${delay ?? '0.7s'};\n }\n\n \n &.click ${Tooltip} {\n transition: 0.5s;\n transition-delay: ${delay ?? '0s'};\n }\n\n &.click.show ${Tooltip} {\n opacity: 1;\n }\n\n &.click.hide ${Tooltip} {\n opacity: 0;\n }\n\n`;\n\nexport const TooltipContainer = styled.div<{delay?: string}>`\n display: inline-block;\n position: relative;\n\n ${props => TooltipTrigger(props.delay)}\n \n &:focus{\n ${focusStyles}\n }\n`;\n"],"mappings":"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"}
@@ -11,8 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
11
11
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
12
12
  var React = _interopRequireWildcard(require("react"));
13
13
  var _TooltipStyles = require("./TooltipStyles");
14
- var _common = require("../common");
15
- var _types = require("../types");
14
+ var _ = require("..");
16
15
  var _jsxRuntime = require("react/jsx-runtime");
17
16
  var _excluded = ["label", "children", "withArrow", "tabIndex", "size", "height", "delay", "align", "position", "trigger", "hideAfter"];
18
17
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -25,7 +24,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
25
24
  withArrow = _ref.withArrow,
26
25
  tabIndex = _ref.tabIndex,
27
26
  _ref$size = _ref.size,
28
- size = _ref$size === void 0 ? _types.Size.Small : _ref$size,
27
+ size = _ref$size === void 0 ? _.Size.Small : _ref$size,
29
28
  _ref$height = _ref.height,
30
29
  height = _ref$height === void 0 ? 'auto' : _ref$height,
31
30
  _ref$delay = _ref.delay,
@@ -44,7 +43,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
44
43
  showTooltip = _React$useState2[0],
45
44
  setShowTooltip = _React$useState2[1];
46
45
  var timeoutRef = (0, React.useRef)();
47
- var ref = (0, _common.useClickOutsideRef)(function () {
46
+ var ref = (0, _.useClickOutsideRef)(function () {
48
47
  return setShowTooltip(false);
49
48
  });
50
49
  var handleClick = function handleClick(e) {
@@ -1 +1 @@
1
- {"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","React","useState","showTooltip","setShowTooltip","timeoutRef","useRef","ref","useClickOutsideRef","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","useEffect","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TooltipWrapper.cjs","names":["TooltipWrapper","label","children","withArrow","tabIndex","size","Size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","React","useState","showTooltip","setShowTooltip","timeoutRef","useRef","ref","useClickOutsideRef","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","useEffect","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {Size, useClickOutsideRef} from '..';\nimport {useEffect, useRef} from \"react\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
@@ -6,9 +6,8 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
6
6
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
7
7
  import * as React from 'react';
8
8
  import { TooltipContainer, Tooltip } from './TooltipStyles';
9
- import { useClickOutsideRef } from '../common';
9
+ import { Size, useClickOutsideRef } from '..';
10
10
  import { useEffect, useRef } from "react";
11
- import { Size } from "../types";
12
11
  import { jsx as _jsx } from "react/jsx-runtime";
13
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
13
  var TooltipWrapper = function TooltipWrapper(_ref) {
@@ -1 +1 @@
1
- {"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","useClickOutsideRef","useEffect","useRef","Size","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","useState","showTooltip","setShowTooltip","timeoutRef","ref","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {useClickOutsideRef} from '../common';\nimport {useEffect, useRef} from \"react\";\nimport {Size} from \"../types\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TooltipWrapper.js","names":["React","TooltipContainer","Tooltip","Size","useClickOutsideRef","useEffect","useRef","TooltipWrapper","label","children","withArrow","tabIndex","size","Small","height","delay","undefined","align","position","trigger","hideAfter","props","useState","showTooltip","setShowTooltip","timeoutRef","ref","handleClick","e","current","contains","target","clearTimeout","setTimeout","handleButtonDown","key","document","addEventListener","removeEventListener","cls"],"sources":["../../src/Tooltips/TooltipWrapper.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {TooltipProps} from './TooltipTypes';\n\nimport {TooltipContainer, Tooltip} from './TooltipStyles';\nimport {Size, useClickOutsideRef} from '..';\nimport {useEffect, useRef} from \"react\";\n\nconst TooltipWrapper = ({\n label, children,\n withArrow,\n tabIndex,\n size = Size.Small,\n height = 'auto',\n delay = undefined,\n align = 'center',\n position = 'bottom',\n trigger = 'hover',\n hideAfter = 5000,\n ...props\n }: TooltipProps) => {\n\n const [showTooltip, setShowTooltip] = React.useState(false);\n const timeoutRef = useRef<any>();\n\n const ref = useClickOutsideRef(() => setShowTooltip(false));\n\n const handleClick = (e?: MouseEvent) => {\n if (ref?.current?.contains(e?.target as Node)) {\n setShowTooltip(true)\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n const handleButtonDown = (e?: KeyboardEvent) => {\n if (e?.key === 'Enter' || e?.key === ' ') {\n setShowTooltip(true);\n timeoutRef.current && clearTimeout(timeoutRef.current);\n timeoutRef.current = setTimeout(() => setShowTooltip(false), hideAfter);\n }\n }\n\n useEffect(() => {\n if (trigger == 'click') {\n document.addEventListener('mousedown', handleClick);\n ref?.current?.addEventListener('keydown', handleButtonDown);\n\n return () => {\n document.removeEventListener('mousedown', handleClick);\n ref?.current?.removeEventListener('keydown', handleButtonDown);\n };\n }\n }, [trigger])\n\n const cls = `${trigger} ${trigger === 'click' ? showTooltip ? 'show' : 'hide' : ''}`;\n return <TooltipContainer ref={ref}\n delay={delay}\n tabIndex={tabIndex}\n className={cls}>\n <Tooltip align={align}\n height={height}\n role=\"tooltip\"\n size={size}\n withArrow={withArrow}\n position={position}\n {...props}>\n {label}\n </Tooltip>\n {children}\n </TooltipContainer>;\n};\n\nexport default TooltipWrapper;\n"],"mappings":"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"}