@laerdal/life-react-components 1.2.2-dev.6 → 1.2.2-dev.9

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 (216) hide show
  1. package/dist/esm/Banners/Banner.js +1 -0
  2. package/dist/esm/Banners/Banner.js.map +1 -1
  3. package/dist/esm/Button/BackButton.js +4 -4
  4. package/dist/esm/Button/BackButton.js.map +1 -1
  5. package/dist/esm/Button/Iconbutton.js +6 -2
  6. package/dist/esm/Button/Iconbutton.js.map +1 -1
  7. package/dist/esm/Button/__tests__/BackButton.test.js +3 -4
  8. package/dist/esm/Button/__tests__/BackButton.test.js.map +1 -1
  9. package/dist/esm/Chips/ActionChip.js +2 -3
  10. package/dist/esm/Chips/ActionChip.js.map +1 -1
  11. package/dist/esm/Chips/ChipInput.js +1 -2
  12. package/dist/esm/Chips/ChipInput.js.map +1 -1
  13. package/dist/esm/Chips/FilterChip.js +2 -3
  14. package/dist/esm/Chips/FilterChip.js.map +1 -1
  15. package/dist/esm/Chips/InputChip.js +2 -3
  16. package/dist/esm/Chips/InputChip.js.map +1 -1
  17. package/dist/esm/Dropdown/BasicDropdown.js +3 -2
  18. package/dist/esm/Dropdown/BasicDropdown.js.map +1 -1
  19. package/dist/esm/Dropdown/ChipDropdownInput.js +2 -3
  20. package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
  21. package/dist/esm/Dropdown/DropdownFilter.js +4 -3
  22. package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
  23. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js +1 -2
  24. package/dist/esm/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  25. package/dist/esm/InputFields/Label.js +2 -1
  26. package/dist/esm/InputFields/Label.js.map +1 -1
  27. package/dist/esm/InputFields/PasswordField.js +1 -0
  28. package/dist/esm/InputFields/PasswordField.js.map +1 -1
  29. package/dist/esm/InputFields/QuickSearch.js +2 -2
  30. package/dist/esm/InputFields/QuickSearch.js.map +1 -1
  31. package/dist/esm/InputFields/ResponsiveComponentWrapper.js +2 -2
  32. package/dist/esm/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  33. package/dist/esm/InputFields/SearchBar.js +29 -31
  34. package/dist/esm/InputFields/SearchBar.js.map +1 -1
  35. package/dist/esm/InputFields/TextField.js +1 -0
  36. package/dist/esm/InputFields/TextField.js.map +1 -1
  37. package/dist/esm/InputFields/Textarea.js +2 -1
  38. package/dist/esm/InputFields/Textarea.js.map +1 -1
  39. package/dist/esm/InputFields/__tests__/QuickSearch.test.js +1 -2
  40. package/dist/esm/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  41. package/dist/esm/InputFields/components/SearchBarInput.js +1 -0
  42. package/dist/esm/InputFields/components/SearchBarInput.js.map +1 -1
  43. package/dist/esm/LoadingIndicator/LoadingIndicator.js +4 -4
  44. package/dist/esm/LoadingIndicator/LoadingIndicator.js.map +1 -1
  45. package/dist/esm/NotificationDot/NotificationDot.js +9 -9
  46. package/dist/esm/NotificationDot/NotificationDot.js.map +1 -1
  47. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js +2 -3
  48. package/dist/esm/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  49. package/dist/esm/Table/Table.js +1 -1
  50. package/dist/esm/Table/Table.js.map +1 -1
  51. package/dist/esm/Tabs/HorizontalTabs.js +5 -5
  52. package/dist/esm/Tabs/HorizontalTabs.js.map +1 -1
  53. package/dist/esm/Tabs/TabLink.js +2 -2
  54. package/dist/esm/Tabs/TabLink.js.map +1 -1
  55. package/dist/esm/Tabs/Tabs.js +14 -14
  56. package/dist/esm/Tabs/Tabs.js.map +1 -1
  57. package/dist/esm/Tabs/VerticalTabs.js +2 -2
  58. package/dist/esm/Tabs/VerticalTabs.js.map +1 -1
  59. package/dist/esm/Toasters/Toast.js +5 -1
  60. package/dist/esm/Toasters/Toast.js.map +1 -1
  61. package/dist/esm/styles/typography.js +8 -9
  62. package/dist/esm/styles/typography.js.map +1 -1
  63. package/dist/esm/types.js +0 -1
  64. package/dist/esm/types.js.map +1 -1
  65. package/dist/js/Banners/Banner.d.ts +1 -2
  66. package/dist/js/Banners/Banner.js +1 -0
  67. package/dist/js/Banners/Banner.js.map +1 -1
  68. package/dist/js/Button/BackButton.d.ts +1 -2
  69. package/dist/js/Button/BackButton.js +4 -5
  70. package/dist/js/Button/BackButton.js.map +1 -1
  71. package/dist/js/Button/Iconbutton.d.ts +1 -0
  72. package/dist/js/Button/Iconbutton.js +6 -2
  73. package/dist/js/Button/Iconbutton.js.map +1 -1
  74. package/dist/js/Button/__tests__/BackButton.test.js +3 -5
  75. package/dist/js/Button/__tests__/BackButton.test.js.map +1 -1
  76. package/dist/js/Chips/ActionChip.js +2 -4
  77. package/dist/js/Chips/ActionChip.js.map +1 -1
  78. package/dist/js/Chips/ChipInput.js +1 -3
  79. package/dist/js/Chips/ChipInput.js.map +1 -1
  80. package/dist/js/Chips/ChipTypes.d.ts +3 -3
  81. package/dist/js/Chips/FilterChip.js +2 -4
  82. package/dist/js/Chips/FilterChip.js.map +1 -1
  83. package/dist/js/Chips/InputChip.js +2 -4
  84. package/dist/js/Chips/InputChip.js.map +1 -1
  85. package/dist/js/Dropdown/BasicDropdown.d.ts +1 -2
  86. package/dist/js/Dropdown/BasicDropdown.js +3 -2
  87. package/dist/js/Dropdown/BasicDropdown.js.map +1 -1
  88. package/dist/js/Dropdown/ChipDropdownInput.d.ts +3 -0
  89. package/dist/js/Dropdown/ChipDropdownInput.js +2 -4
  90. package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
  91. package/dist/js/Dropdown/DropdownFilter.d.ts +1 -2
  92. package/dist/js/Dropdown/DropdownFilter.js +4 -3
  93. package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
  94. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js +1 -3
  95. package/dist/js/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  96. package/dist/js/InputFields/Label.d.ts +1 -2
  97. package/dist/js/InputFields/Label.js +1 -0
  98. package/dist/js/InputFields/Label.js.map +1 -1
  99. package/dist/js/InputFields/PasswordField.d.ts +1 -2
  100. package/dist/js/InputFields/PasswordField.js +1 -0
  101. package/dist/js/InputFields/PasswordField.js.map +1 -1
  102. package/dist/js/InputFields/QuickSearch.d.ts +1 -2
  103. package/dist/js/InputFields/QuickSearch.js +2 -3
  104. package/dist/js/InputFields/QuickSearch.js.map +1 -1
  105. package/dist/js/InputFields/ResponsiveComponentWrapper.d.ts +1 -2
  106. package/dist/js/InputFields/ResponsiveComponentWrapper.js +2 -3
  107. package/dist/js/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  108. package/dist/js/InputFields/SearchBar.d.ts +1 -2
  109. package/dist/js/InputFields/SearchBar.js +29 -34
  110. package/dist/js/InputFields/SearchBar.js.map +1 -1
  111. package/dist/js/InputFields/TextField.d.ts +1 -2
  112. package/dist/js/InputFields/TextField.js +1 -0
  113. package/dist/js/InputFields/TextField.js.map +1 -1
  114. package/dist/js/InputFields/Textarea.d.ts +1 -2
  115. package/dist/js/InputFields/Textarea.js +1 -0
  116. package/dist/js/InputFields/Textarea.js.map +1 -1
  117. package/dist/js/InputFields/__tests__/QuickSearch.test.js +1 -3
  118. package/dist/js/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  119. package/dist/js/InputFields/components/SearchBarInput.d.ts +1 -2
  120. package/dist/js/InputFields/components/SearchBarInput.js +1 -0
  121. package/dist/js/InputFields/components/SearchBarInput.js.map +1 -1
  122. package/dist/js/LoadingIndicator/LoadingIndicator.d.ts +1 -2
  123. package/dist/js/LoadingIndicator/LoadingIndicator.js +4 -5
  124. package/dist/js/LoadingIndicator/LoadingIndicator.js.map +1 -1
  125. package/dist/js/NotificationDot/NotificationDot.d.ts +1 -2
  126. package/dist/js/NotificationDot/NotificationDot.js +9 -10
  127. package/dist/js/NotificationDot/NotificationDot.js.map +1 -1
  128. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js +2 -4
  129. package/dist/js/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  130. package/dist/js/Table/Table.js +1 -1
  131. package/dist/js/Table/Table.js.map +1 -1
  132. package/dist/js/Tabs/HorizontalTabs.d.ts +2 -2
  133. package/dist/js/Tabs/HorizontalTabs.js +2 -3
  134. package/dist/js/Tabs/HorizontalTabs.js.map +1 -1
  135. package/dist/js/Tabs/TabLink.d.ts +1 -2
  136. package/dist/js/Tabs/TabLink.js +2 -3
  137. package/dist/js/Tabs/TabLink.js.map +1 -1
  138. package/dist/js/Tabs/Tabs.d.ts +1 -2
  139. package/dist/js/Tabs/Tabs.js +14 -15
  140. package/dist/js/Tabs/Tabs.js.map +1 -1
  141. package/dist/js/Tabs/VerticalTabs.d.ts +1 -2
  142. package/dist/js/Tabs/VerticalTabs.js +2 -3
  143. package/dist/js/Tabs/VerticalTabs.js.map +1 -1
  144. package/dist/js/Toasters/Toast.js +8 -4
  145. package/dist/js/Toasters/Toast.js.map +1 -1
  146. package/dist/js/styles/typography.d.ts +1 -2
  147. package/dist/js/styles/typography.js +8 -10
  148. package/dist/js/styles/typography.js.map +1 -1
  149. package/dist/js/types.d.ts +0 -1
  150. package/dist/js/types.js +0 -1
  151. package/dist/js/types.js.map +1 -1
  152. package/dist/umd/Banners/Banner.js +1 -0
  153. package/dist/umd/Banners/Banner.js.map +1 -1
  154. package/dist/umd/Button/BackButton.js +8 -7
  155. package/dist/umd/Button/BackButton.js.map +1 -1
  156. package/dist/umd/Button/Iconbutton.js +6 -2
  157. package/dist/umd/Button/Iconbutton.js.map +1 -1
  158. package/dist/umd/Button/__tests__/BackButton.test.js +7 -7
  159. package/dist/umd/Button/__tests__/BackButton.test.js.map +1 -1
  160. package/dist/umd/Chips/ActionChip.js +6 -6
  161. package/dist/umd/Chips/ActionChip.js.map +1 -1
  162. package/dist/umd/Chips/ChipInput.js +5 -5
  163. package/dist/umd/Chips/ChipInput.js.map +1 -1
  164. package/dist/umd/Chips/FilterChip.js +6 -6
  165. package/dist/umd/Chips/FilterChip.js.map +1 -1
  166. package/dist/umd/Chips/InputChip.js +6 -6
  167. package/dist/umd/Chips/InputChip.js.map +1 -1
  168. package/dist/umd/Dropdown/BasicDropdown.js +3 -2
  169. package/dist/umd/Dropdown/BasicDropdown.js.map +1 -1
  170. package/dist/umd/Dropdown/ChipDropdownInput.js +6 -6
  171. package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
  172. package/dist/umd/Dropdown/DropdownFilter.js +4 -3
  173. package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
  174. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js +5 -5
  175. package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map +1 -1
  176. package/dist/umd/InputFields/Label.js +1 -0
  177. package/dist/umd/InputFields/Label.js.map +1 -1
  178. package/dist/umd/InputFields/PasswordField.js +1 -0
  179. package/dist/umd/InputFields/PasswordField.js.map +1 -1
  180. package/dist/umd/InputFields/QuickSearch.js +6 -5
  181. package/dist/umd/InputFields/QuickSearch.js.map +1 -1
  182. package/dist/umd/InputFields/ResponsiveComponentWrapper.js +6 -5
  183. package/dist/umd/InputFields/ResponsiveComponentWrapper.js.map +1 -1
  184. package/dist/umd/InputFields/SearchBar.js +34 -34
  185. package/dist/umd/InputFields/SearchBar.js.map +1 -1
  186. package/dist/umd/InputFields/TextField.js +1 -0
  187. package/dist/umd/InputFields/TextField.js.map +1 -1
  188. package/dist/umd/InputFields/Textarea.js +1 -0
  189. package/dist/umd/InputFields/Textarea.js.map +1 -1
  190. package/dist/umd/InputFields/__tests__/QuickSearch.test.js +5 -5
  191. package/dist/umd/InputFields/__tests__/QuickSearch.test.js.map +1 -1
  192. package/dist/umd/InputFields/components/SearchBarInput.js +1 -0
  193. package/dist/umd/InputFields/components/SearchBarInput.js.map +1 -1
  194. package/dist/umd/LoadingIndicator/LoadingIndicator.js +8 -7
  195. package/dist/umd/LoadingIndicator/LoadingIndicator.js.map +1 -1
  196. package/dist/umd/NotificationDot/NotificationDot.js +13 -12
  197. package/dist/umd/NotificationDot/NotificationDot.js.map +1 -1
  198. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js +6 -6
  199. package/dist/umd/NotificationDot/__tests__/NotificationDot.test.js.map +1 -1
  200. package/dist/umd/Table/Table.js +1 -1
  201. package/dist/umd/Table/Table.js.map +1 -1
  202. package/dist/umd/Tabs/HorizontalTabs.js +9 -8
  203. package/dist/umd/Tabs/HorizontalTabs.js.map +1 -1
  204. package/dist/umd/Tabs/TabLink.js +6 -5
  205. package/dist/umd/Tabs/TabLink.js.map +1 -1
  206. package/dist/umd/Tabs/Tabs.js +18 -17
  207. package/dist/umd/Tabs/Tabs.js.map +1 -1
  208. package/dist/umd/Tabs/VerticalTabs.js +6 -5
  209. package/dist/umd/Tabs/VerticalTabs.js.map +1 -1
  210. package/dist/umd/Toasters/Toast.js +5 -1
  211. package/dist/umd/Toasters/Toast.js.map +1 -1
  212. package/dist/umd/styles/typography.js +12 -12
  213. package/dist/umd/styles/typography.js.map +1 -1
  214. package/dist/umd/types.js +0 -1
  215. package/dist/umd/types.js.map +1 -1
  216. package/package.json +10 -19
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Toasters/Toast.tsx"],"names":["React","styled","keyframes","ToastActionType","ToastColor","ToastEntryDirection","ToastPosition","BOXSHADOWS","COLORS","Close","Size","Button","IconButton","ComponentSStyling","ComponentTextStyle","HyperLinkDefaultStyling","HyperLinkInvertedStyling","LoaderAnimationKeyframes","Loader","div","props","duration","BLACK","neutral_200","neutral_800","WHITE","neutral_400","white","BLUE","accent1_200","accent1_600","GREEN","correct_200","correct_500","ORANGE","warning_200","warning_500","RED","critical_200","critical_500","Container","BOXSHADOW_L2","animation","bezier","transform","withClose","withLoader","Regular","black","ActionButtons","CloseButton","neutral_600","TextContainer","span","IconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","TOPLEFT","enterFrom","TOP","Toast","content","remove","options","testId","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","theme","focus","icon","action","map","i","Small","type","SECONDARY","handler","label","event","enter","BOTTOM","LEFT","RIGHT","leave"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\nimport { BOXSHADOWS, COLORS, TYPOGRAPHY } from '../styles';\nimport { Close } from '../icons/systemicons/SystemIcons';\nimport { Size } from '../types' \nimport { Button, IconButton } from '../Button';\nimport { ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\n\nconst LoaderAnimationKeyframes = keyframes`\n 0% {\n background-position: right;\n }\n 100% {\n background-position: left;\n }\n`;\n\nconst Loader = styled.div<{ duration: number }>`\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 4px;\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n\n animation: ${LoaderAnimationKeyframes} ${(props) => props.duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\n\n &.${ToastColor[ToastColor.BLACK]} {\n background: linear-gradient(to right, ${COLORS.neutral_200} 50%, ${COLORS.neutral_800} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n background: linear-gradient(to right, ${COLORS.neutral_400} 50%, ${COLORS.white} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.BLUE]} {\n background: linear-gradient(to right, ${COLORS.accent1_200} 50%, ${COLORS.accent1_600} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.GREEN]} {\n background: linear-gradient(to right, ${COLORS.correct_200} 50%, ${COLORS.correct_500} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.ORANGE]} {\n background: linear-gradient(to right, ${COLORS.warning_200} 50%, ${COLORS.warning_500} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.RED]} {\n background: linear-gradient(to right, ${COLORS.critical_200} 50%, ${COLORS.critical_500} 50%) left;\n background-size: 200% 100%;\n }\n`;\n\nconst Container = styled.div<{ animation: { duration: string; bezier: string; transform: string; keyframes: any }; withLoader: boolean; withClose: boolean }>`\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n border-radius: 4px;\n\n animation: ${(props) => props.animation.keyframes} ${(props) => props.animation.duration} ${(props) => props.animation.bezier};\n transform: ${(props) => props.animation.transform};\n\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\n\n padding: 0 ${(props) => (props.withClose ? '0' : '16px')} ${(props) => (props.withLoader ? '4px' : '0')} 16px;\n\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 16px;\n justify-content: left;\n\n position: relative;\n\n width: max-content;\n min-height: 48px;\n box-sizing: border-box;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.white)}\n\n & a {\n display: inline;\n ${HyperLinkInvertedStyling}\n }\n\n &.${ToastColor[ToastColor.BLACK]} {\n background-color: ${COLORS.neutral_800};\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n background-color: ${COLORS.white};\n color: ${COLORS.black};\n\n & a {\n ${HyperLinkDefaultStyling}\n }\n }\n\n &.${ToastColor[ToastColor.BLUE]} {\n background-color: ${COLORS.accent1_600};\n }\n\n &.${ToastColor[ToastColor.GREEN]} {\n background-color: ${COLORS.correct_500};\n }\n\n &.${ToastColor[ToastColor.ORANGE]} {\n background-color: ${COLORS.warning_500};\n }\n\n &.${ToastColor[ToastColor.RED]} {\n background-color: ${COLORS.critical_500};\n }\n`;\n\nconst ActionButtons = styled.div`\n display: flex;\n flex-direction: row;\n gap: 8px;\n align-items: center;\n\n & .action {\n height: unset;\n }\n`;\n\nconst CloseButton = styled.div`\n & > button {\n background-color: transparent;\n border: none;\n margin-left: 16px;\n\n & svg {\n padding: 0;\n }\n }\n\n & > button:focus:not(:disabled):not(:active):not(:hover) div svg path {\n fill: ${COLORS.white};\n }\n\n & div svg path {\n fill: ${COLORS.white};\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n & div svg path {\n fill: ${COLORS.neutral_600};\n }\n }\n`;\n\nconst TextContainer = styled.span`\n font-feature-settings: 'liga' off;\n width: 240px;\n display: flex;\n padding: 16px 0;\n`;\n\nconst IconContainer = styled.span`\n margin-right: -8px;\n`;\n\nexport type ToastOptions = {\n color?: ToastColor;\n autoClose?: boolean;\n delay?: number;\n showCloseButton?: boolean;\n action?: {\n label: string;\n handler: () => void;\n type?: ToastActionType;\n }[];\n position: ToastPosition;\n enterFrom?: ToastEntryDirection;\n icon?: React.ReactNode;\n};\n\ntype Props = {\n remove?: any;\n content: any;\n options?: ToastOptions;\n testId?: string;\n};\n\nconst DEFAULT_OPTIONS: ToastOptions = {\n color: ToastColor.BLACK,\n autoClose: true,\n delay: 5000,\n showCloseButton: false,\n position: ToastPosition.TOPLEFT,\n enterFrom: ToastEntryDirection.TOP,\n};\n\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\n const removeRef = React.useRef();\n removeRef.current = remove;\n\n const elementRef = React.useRef<any>(null);\n\n const [shouldRemove, setShouldRemove] = React.useState(false);\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\n\n const opts = { ...DEFAULT_OPTIONS, ...options };\n\n React.useEffect(() => {\n if (opts?.autoClose) {\n // @ts-ignore\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\n return () => clearTimeout(id);\n }\n return undefined;\n }, []);\n\n React.useEffect(() => {\n if (shouldRemove) {\n // @ts-ignore\n const id = setTimeout(() => removeRef.current(), 200);\n return () => clearTimeout(id);\n }\n }, [shouldRemove]);\n\n React.useEffect(() => {\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\n }, []);\n\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\n\n const fromY = dimensions.height * direction.fromHeight;\n const toY = dimensions.height * direction.toHeight;\n const fromX = dimensions.width * direction.fromWidth;\n const toX = dimensions.width * direction.toWidth;\n\n let prop = {\n duration: animation.duration,\n bezier: animation.bezier,\n transform: `translateY(${toY}) translateX(${toX})`,\n keyframes: keyframes`\n 0% {\n transform: translateY(${fromY}px) translateX(${fromX}px);\n }\n 100% {\n transform: translateY(${toY}px) translateX(${toX}px);\n }`,\n };\n\n if (!dimensions.height) {\n prop = {\n ...prop,\n ...{\n transform: 'translateY(-1000vh) translateX(-1000vw)',\n keyframes: keyframes``,\n },\n };\n }\n\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\n\n setTimeout(() => elementRef?.current?.focus());\n\n return (\n <Container data-testid={testId} animation={prop} ref={elementRef} withLoader={!!opts.autoClose} className={theme} withClose={!!opts.showCloseButton} tabIndex={-1}>\n {opts.icon && <IconContainer>{opts.icon}</IconContainer>}\n <TextContainer className={'description'}>{content}</TextContainer>\n {opts.action && (\n <ActionButtons>\n {opts.action.map((action, i) => (\n <Button\n size={Size.Small}\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\n key={i}\n onClick={() => {\n setShouldRemove(true);\n action.handler();\n }}\n className={'action'}>\n {action.label}\n </Button>\n ))}\n </ActionButtons>\n )}\n {opts.showCloseButton && (\n <CloseButton className={`close-button ${theme}`}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground action={(event) => setShouldRemove(true)}>\n <Close size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n </CloseButton>\n )}\n {!!opts.autoClose && <Loader className={`loader ${theme}`} duration={opts.delay ?? 0} />}\n </Container>\n );\n};\n\nexport default Toast;\n\nconst animations = {\n enter: {\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\n duration: '300ms',\n [ToastEntryDirection.TOP]: {\n fromHeight: -1,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.BOTTOM]: {\n fromHeight: 1,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.LEFT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: -1,\n toWidth: 0,\n },\n [ToastEntryDirection.RIGHT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 1,\n toWidth: 0,\n },\n },\n leave: {\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\n duration: '205ms',\n [ToastEntryDirection.TOP]: {\n fromHeight: 0,\n toHeight: -1,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.BOTTOM]: {\n fromHeight: 0,\n toHeight: 1,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.LEFT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 0,\n toWidth: -1,\n },\n [ToastEntryDirection.RIGHT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 1,\n },\n },\n};\n"],"file":"Toast.js"}
1
+ {"version":3,"sources":["../../../src/Toasters/Toast.tsx"],"names":["React","styled","keyframes","ToastActionType","ToastColor","ToastEntryDirection","ToastPosition","BOXSHADOWS","COLORS","Close","Size","Button","IconButton","ComponentSStyling","ComponentTextStyle","HyperLinkDefaultStyling","HyperLinkInvertedStyling","LoaderAnimationKeyframes","Loader","div","props","duration","BLACK","neutral_200","neutral_800","WHITE","neutral_400","white","BLUE","accent1_200","accent1_600","GREEN","correct_200","correct_500","ORANGE","warning_200","warning_500","RED","critical_200","critical_500","Container","BOXSHADOW_L2","animation","bezier","transform","withClose","withLoader","Regular","black","ActionButtons","CloseButton","neutral_600","TextContainer","span","IconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","TOPLEFT","enterFrom","TOP","Toast","content","remove","options","testId","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","theme","focus","icon","action","map","i","Small","type","SECONDARY","handler","label","event","enter","BOTTOM","LEFT","RIGHT","leave"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\nimport { BOXSHADOWS, COLORS, TYPOGRAPHY } from '../styles';\nimport { Close } from '../icons/systemicons/SystemIcons';\nimport { Size } from '../types' \nimport { Button, IconButton } from '../Button';\nimport { ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\n\nconst LoaderAnimationKeyframes = keyframes`\n 0% {\n background-position: right;\n }\n 100% {\n background-position: left;\n }\n`;\n\nconst Loader = styled.div<{ duration: number }>`\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 4px;\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n\n animation: ${LoaderAnimationKeyframes} ${(props) => props.duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\n\n &.${ToastColor[ToastColor.BLACK]} {\n background: linear-gradient(to right, ${COLORS.neutral_200} 50%, ${COLORS.neutral_800} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n background: linear-gradient(to right, ${COLORS.neutral_400} 50%, ${COLORS.white} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.BLUE]} {\n background: linear-gradient(to right, ${COLORS.accent1_200} 50%, ${COLORS.accent1_600} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.GREEN]} {\n background: linear-gradient(to right, ${COLORS.correct_200} 50%, ${COLORS.correct_500} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.ORANGE]} {\n background: linear-gradient(to right, ${COLORS.warning_200} 50%, ${COLORS.warning_500} 50%) left;\n background-size: 200% 100%;\n }\n\n &.${ToastColor[ToastColor.RED]} {\n background: linear-gradient(to right, ${COLORS.critical_200} 50%, ${COLORS.critical_500} 50%) left;\n background-size: 200% 100%;\n }\n`;\n\nconst Container = styled.div<{ animation: { duration: string; bezier: string; transform: string; keyframes: any }; withLoader: boolean; withClose: boolean }>`\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n border-radius: 4px;\n\n animation: ${(props) => props.animation.keyframes} ${(props) => props.animation.duration} ${(props) => props.animation.bezier};\n transform: ${(props) => props.animation.transform};\n\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\n\n padding: 0 ${(props) => (props.withClose ? '0' : '16px')} ${(props) => (props.withLoader ? '4px' : '0')} 16px;\n\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 16px;\n justify-content: left;\n\n position: relative;\n\n width: max-content;\n min-height: 48px;\n box-sizing: border-box;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.white)}\n\n & a {\n display: inline;\n ${HyperLinkInvertedStyling}\n }\n\n &.${ToastColor[ToastColor.BLACK]} {\n background-color: ${COLORS.neutral_800};\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n background-color: ${COLORS.white};\n color: ${COLORS.black};\n\n & a {\n ${HyperLinkDefaultStyling}\n }\n }\n\n &.${ToastColor[ToastColor.BLUE]} {\n background-color: ${COLORS.accent1_600};\n }\n\n &.${ToastColor[ToastColor.GREEN]} {\n background-color: ${COLORS.correct_500};\n }\n\n &.${ToastColor[ToastColor.ORANGE]} {\n background-color: ${COLORS.warning_500};\n }\n\n &.${ToastColor[ToastColor.RED]} {\n background-color: ${COLORS.critical_500};\n }\n`;\n\nconst ActionButtons = styled.div`\n display: flex;\n flex-direction: row;\n gap: 8px;\n align-items: center;\n\n & .action {\n height: unset;\n }\n`;\n\nconst CloseButton = styled.div`\n & > button {\n background-color: transparent;\n border: none;\n margin-left: 16px;\n\n & svg {\n padding: 0;\n }\n }\n\n & > button:focus:not(:disabled):not(:active):not(:hover) div svg path {\n fill: ${COLORS.white};\n }\n\n & div svg path {\n fill: ${COLORS.white};\n }\n\n &.${ToastColor[ToastColor.WHITE]} {\n & div svg path {\n fill: ${COLORS.neutral_600};\n }\n }\n`;\n\nconst TextContainer = styled.span`\n font-feature-settings: 'liga' off;\n width: 240px;\n display: flex;\n padding: 16px 0;\n`;\n\nconst IconContainer = styled.span`\n margin-right: -8px;\n`;\n\nexport type ToastOptions = {\n color?: ToastColor;\n autoClose?: boolean;\n delay?: number;\n showCloseButton?: boolean;\n action?: {\n label: string;\n handler: () => void;\n type?: ToastActionType;\n }[];\n position: ToastPosition;\n enterFrom?: ToastEntryDirection;\n icon?: React.ReactNode;\n};\n\ntype Props = {\n remove?: any;\n content: any;\n options?: ToastOptions;\n testId?: string;\n};\n\nconst DEFAULT_OPTIONS: ToastOptions = {\n color: ToastColor.BLACK,\n autoClose: true,\n delay: 5000,\n showCloseButton: false,\n position: ToastPosition.TOPLEFT,\n enterFrom: ToastEntryDirection.TOP,\n};\n\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\n const removeRef = React.useRef();\n removeRef.current = remove;\n\n const elementRef = React.useRef<any>(null);\n\n const [shouldRemove, setShouldRemove] = React.useState(false);\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\n\n const opts = { ...DEFAULT_OPTIONS, ...options };\n\n React.useEffect(() => {\n if (opts?.autoClose) {\n // @ts-ignore\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\n return () => clearTimeout(id);\n }\n return undefined;\n }, []);\n\n React.useEffect(() => {\n if (shouldRemove) {\n // @ts-ignore\n const id = setTimeout(() => removeRef.current(), 200);\n return () => clearTimeout(id);\n }\n }, [shouldRemove]);\n\n React.useEffect(() => {\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\n }, []);\n\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\n\n const fromY = dimensions.height * direction.fromHeight;\n const toY = dimensions.height * direction.toHeight;\n const fromX = dimensions.width * direction.fromWidth;\n const toX = dimensions.width * direction.toWidth;\n\n let prop = {\n duration: animation.duration,\n bezier: animation.bezier,\n transform: `translateY(${toY}) translateX(${toX})`,\n keyframes: keyframes`\n 0% {\n transform: translateY(${fromY}px) translateX(${fromX}px);\n }\n 100% {\n transform: translateY(${toY}px) translateX(${toX}px);\n }`,\n };\n\n if (!dimensions.height) {\n prop = {\n ...prop,\n ...{\n transform: 'translateY(-1000vh) translateX(-1000vw)',\n keyframes: keyframes``,\n },\n };\n }\n\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\n\n if (!shouldRemove){\n setTimeout(() => elementRef?.current?.focus());\n }\n\n return (\n <Container data-testid={testId} animation={prop} ref={elementRef} withLoader={!!opts.autoClose} className={theme} withClose={!!opts.showCloseButton} tabIndex={-1}>\n {opts.icon && <IconContainer>{opts.icon}</IconContainer>}\n <TextContainer className={'description'}>{content}</TextContainer>\n {opts.action && (\n <ActionButtons>\n {opts.action.map((action, i) => (\n <Button\n size={Size.Small}\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\n key={i}\n onClick={() => {\n setShouldRemove(true);\n action.handler();\n }}\n className={'action'}>\n {action.label}\n </Button>\n ))}\n </ActionButtons>\n )}\n {opts.showCloseButton && (\n <CloseButton className={`close-button ${theme}`}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground action={(event) => setShouldRemove(true)}>\n <Close size=\"24px\" color={COLORS.neutral_600} />\n </IconButton>\n </CloseButton>\n )}\n {!!opts.autoClose && <Loader className={`loader ${theme}`} duration={opts.delay ?? 0} />}\n </Container>\n );\n};\n\nexport default Toast;\n\nconst animations = {\n enter: {\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\n duration: '300ms',\n [ToastEntryDirection.TOP]: {\n fromHeight: -1,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.BOTTOM]: {\n fromHeight: 1,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.LEFT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: -1,\n toWidth: 0,\n },\n [ToastEntryDirection.RIGHT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 1,\n toWidth: 0,\n },\n },\n leave: {\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\n duration: '205ms',\n [ToastEntryDirection.TOP]: {\n fromHeight: 0,\n toHeight: -1,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.BOTTOM]: {\n fromHeight: 0,\n toHeight: 1,\n fromWidth: 0,\n toWidth: 0,\n },\n [ToastEntryDirection.LEFT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 0,\n toWidth: -1,\n },\n [ToastEntryDirection.RIGHT]: {\n fromHeight: 0,\n toHeight: 0,\n fromWidth: 0,\n toWidth: 1,\n },\n },\n};\n"],"file":"Toast.js"}
@@ -2,7 +2,6 @@ import _pt from "prop-types";
2
2
  import React from 'react';
3
3
  import styled, { css } from 'styled-components';
4
4
  import { COLORS } from '.';
5
- import { Size } from '../types';
6
5
  const TYPOGRAPHY = {
7
6
  fontFamily: 'Lato, sans-serif'
8
7
  };
@@ -511,44 +510,44 @@ const ComponentResponsive = ({
511
510
 
512
511
  if (!size) {
513
512
  if (width < 768) {
514
- fontsize = Size.Small;
513
+ fontsize = 'small';
515
514
  } else if (width < 992) {
516
- fontsize = Size.Medium;
515
+ fontsize = 'medium';
517
516
  } else {
518
- fontsize = Size.Large;
517
+ fontsize = 'large';
519
518
  }
520
519
  }
521
520
 
522
521
  switch (fontsize) {
523
- case Size.XXSmall:
522
+ case 'xxsmall':
524
523
  return /*#__PURE__*/React.createElement(ComponentXXS, {
525
524
  color: color,
526
525
  textStyle: textStyle,
527
526
  children: children
528
527
  });
529
528
 
530
- case Size.XSmall:
529
+ case 'xsmall':
531
530
  return /*#__PURE__*/React.createElement(ComponentXS, {
532
531
  color: color,
533
532
  textStyle: textStyle,
534
533
  children: children
535
534
  });
536
535
 
537
- case Size.Small:
536
+ case 'small':
538
537
  return /*#__PURE__*/React.createElement(ComponentS, {
539
538
  color: color,
540
539
  textStyle: textStyle,
541
540
  children: children
542
541
  });
543
542
 
544
- case Size.Medium:
543
+ case 'medium':
545
544
  return /*#__PURE__*/React.createElement(ComponentM, {
546
545
  color: color,
547
546
  textStyle: textStyle,
548
547
  children: children
549
548
  });
550
549
 
551
- case Size.Large:
550
+ case 'large':
552
551
  default:
553
552
  return /*#__PURE__*/React.createElement(ComponentL, {
554
553
  color: color,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","Size","TYPOGRAPHY","fontFamily","TypographyBase","color","lineHeight","fontSize","fontWeight","fontStyle","textTransform","textDecorationLine","black","HeadlineBaseStyling","HeadlineBase","HeadlineXLStyling","HeadlineXL","HeadlineLStyling","HeadlineL","HeadlineMStyling","HeadlineM","HeadlineSStyling","HeadlineS","HeadlineXSStyling","HeadlineXS","HeadlineXXSStyling","HeadlineXXS","ParagraphStyling","ParagraphBase","props","marginBetweenParagraphs","ParagraphTextStyle","paragraphFontWeight","textStyle","Bold","paragraphFontStyle","Italic","paragraphTextDecorationLine","textDecoration","Underline","ParagraphBaseStyling","ParagraphXlStyling","ParagraphXL","children","ParagraphLStyling","ParagraphL","ParagraphMStyling","ParagraphM","ParagraphSStyling","ParagraphS","ParagraphXSStyling","ParagraphXS","ComponentTextStyle","componentFontWeight","UppercaseBold","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize","Small","Medium","Large","XXSmall","XSmall"],"mappings":"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","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\nimport { Size } from '../types';\n\nconst TYPOGRAPHY = {\n fontFamily: 'Lato, sans-serif',\n};\n\ninterface ITypographyBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n fontWeight: number;\n fontStyle?: string;\n textTransform?: Property.TextTransform;\n textDecorationLine?: Property.TextDecorationLine;\n}\n\nconst TypographyBase = styled('div')<ITypographyBase>(({ color, lineHeight, fontSize, fontWeight, fontStyle, textTransform, textDecorationLine }) => ({\n fontFamily: TYPOGRAPHY.fontFamily,\n fontSize: fontSize,\n fontWeight: fontWeight,\n lineHeight: lineHeight + 'px',\n textTransform: textTransform ? textTransform : 'none',\n textDecorationLine: textDecorationLine ? textDecorationLine : 'none',\n fontStyle: fontStyle ? fontStyle : 'normal',\n color: color ? color : COLORS.black,\n}));\n\ninterface IHeadline {\n color?: string;\n}\n\ninterface IHeadlineBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n}\n\nconst HeadlineBaseStyling = (fontSize: string, lineHeight: string, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n line-height: ${lineHeight};\n font-weight: 700;\n color: ${color};\n `;\n}\nconst HeadlineBase = styled(TypographyBase)<IHeadlineBase>(({ color, lineHeight, fontSize }) => ({\n fontSize: fontSize,\n fontWeight: 700,\n lineHeight: lineHeight,\n color: color,\n}));\n\nconst HeadlineXLStyling = (color: string) => HeadlineBaseStyling('48px', '64px', color);\nconst HeadlineXL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '48px',\n lineHeight: '64px',\n color: color,\n}));\n\nconst HeadlineLStyling = (color: string) => HeadlineBaseStyling('40px', '52px', color);\nconst HeadlineL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '40px',\n lineHeight: '52px',\n color: color,\n}));\n\nconst HeadlineMStyling = (color: string) => HeadlineBaseStyling('32px', '40px', color);\nconst HeadlineM = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '32px',\n lineHeight: '40px',\n color: color,\n}));\n\nconst HeadlineSStyling = (color: string) => HeadlineBaseStyling('28px', '36px', color);\nconst HeadlineS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '28px',\n lineHeight: '36px',\n color: color,\n}));\n\nconst HeadlineXSStyling = (color: string) => HeadlineBaseStyling('24px', '32px', color);\nconst HeadlineXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '24px',\n lineHeight: '32px',\n color: color,\n}));\n\nconst HeadlineXXSStyling = (color: string) => HeadlineBaseStyling('20px', '24px', color);\nconst HeadlineXXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '20px',\n lineHeight: '24px',\n color: color,\n}));\n\nconst ParagraphStyling = css`\n :lang(ja-jp) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(ko-kr) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(zh-CN) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 34em;\n }\n`;\n\ninterface IParagraphBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n marginBetweenParagraphs?: string;\n}\n\nconst ParagraphBase = styled(TypographyBase)<IParagraphBase>`\n p {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n p:not(:only-of-type) {\n margin-bottom: ${(props) => props.marginBetweenParagraphs || '0'};\n }\n ${ParagraphStyling}\n`;\n\ninterface IParagraph {\n color?: string;\n}\n\nenum ParagraphTextStyle {\n Regular = 1,\n Bold,\n Italic,\n Underline,\n}\n\ntype ParagraphProps = {\n color?: string;\n textStyle?: ParagraphTextStyle;\n};\n\nconst paragraphFontWeight = (textStyle?: ParagraphTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ParagraphTextStyle.Bold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst paragraphFontStyle = (textStyle?: ParagraphTextStyle) => {\n let fontStyle = textStyle && textStyle === ParagraphTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst paragraphTextDecorationLine = (textStyle?: ParagraphTextStyle): Property.TextDecorationLine => {\n let textDecoration: Property.TextDecorationLine = textStyle && textStyle === ParagraphTextStyle.Underline ? 'underline' : 'none';\n return textDecoration;\n};\n\nconst ParagraphBaseStyling = (fontSize: string, lineHeight: string, textStyle: ParagraphTextStyle, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${paragraphFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${paragraphFontStyle(textStyle)};\n color: ${color};\n `;\n}\n\nconst ParagraphXlStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('24px', '36px', textStyle, color);\nconst ParagraphXL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={36} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"18px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphLStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('20px', '32px', textStyle, color);\nconst ParagraphL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={32} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"16px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphMStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('18px', '28px', textStyle, color);\nconst ParagraphM: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={28} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"14px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('16px', '24px', textStyle, color);\nconst ParagraphS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={24} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"12px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphXSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('14px', '20px', textStyle, color);\nconst ParagraphXS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={20} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"10px\">\n {children}\n </ParagraphBase>\n );\n};\n\nenum ComponentTextStyle {\n Regular = 1,\n Bold,\n Italic,\n UppercaseBold,\n}\n\ntype ComponentProps = {\n color?: string;\n textStyle?: ComponentTextStyle;\n};\n\nconst componentFontWeight = (textStyle?: ComponentTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ComponentTextStyle.Bold || textStyle === ComponentTextStyle.UppercaseBold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst componentFontStyle = (textStyle?: ComponentTextStyle) => {\n let fontStyle = textStyle && textStyle === ComponentTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst componentTextTransformation = (textStyle?: ComponentTextStyle): Property.TextTransform => {\n let fontStyle: Property.TextTransform = textStyle && textStyle === ComponentTextStyle.UppercaseBold ? 'uppercase' : 'none';\n return fontStyle;\n};\n\nconst ComponentStyling = (fontSize: string, lineHeight: string, textStyle: ComponentTextStyle, color: string | undefined | null) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${componentFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${componentFontStyle(textStyle)};\n ${color === null ? '' : `color: ${(color || COLORS.black)};`}\n `;\n};\n\nconst ComponentXLStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('24px', '28px', textStyle, color);\nconst ComponentXL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={28} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentLStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('20px', '24px', textStyle, color);\nconst ComponentL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentMStyling = (textStyle: ComponentTextStyle, color: string | undefined | null) => ComponentStyling('18px', '24px', textStyle, color);\nconst ComponentM: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('16px', '20px', textStyle, color);\nconst ComponentS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={20} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('14px', '16px', textStyle, color);\nconst ComponentXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXXSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('12px', '16px', textStyle, color);\nconst ComponentXXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={12} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: Size; width: number }> = ({\n color,\n textStyle,\n children,\n size,\n width,\n}) => {\n let fontsize = size;\n if (!size) {\n if (width < 768) {\n fontsize = Size.Small;\n } else if (width < 992) {\n fontsize = Size.Medium;\n } else {\n fontsize = Size.Large;\n }\n }\n switch (fontsize) {\n case Size.XXSmall:\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case Size.XSmall:\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case Size.Small:\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case Size.Medium:\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case Size.Large:\n default:\n return <ComponentL color={color} textStyle={textStyle} children={children} />;\n }\n};\n\nexport { TYPOGRAPHY };\nexport { HeadlineXL, HeadlineL, HeadlineM, HeadlineS, HeadlineXS, HeadlineXXS };\nexport { ParagraphTextStyle, ParagraphXL, ParagraphL, ParagraphM, ParagraphS, ParagraphXS };\nexport { ComponentTextStyle, ComponentXL, ComponentL, ComponentM, ComponentS, ComponentXS, ComponentXXS, ComponentResponsive };\nexport { ComponentXLStyling, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling };\nexport { ParagraphXlStyling, ParagraphLStyling, ParagraphMStyling, ParagraphSStyling, ParagraphXSStyling };\nexport { HeadlineXLStyling, HeadlineLStyling, HeadlineMStyling, HeadlineSStyling, HeadlineXSStyling, HeadlineXXSStyling };\n"],"file":"typography.js"}
1
+ {"version":3,"sources":["../../../src/styles/typography.tsx"],"names":["React","styled","css","COLORS","TYPOGRAPHY","fontFamily","TypographyBase","color","lineHeight","fontSize","fontWeight","fontStyle","textTransform","textDecorationLine","black","HeadlineBaseStyling","HeadlineBase","HeadlineXLStyling","HeadlineXL","HeadlineLStyling","HeadlineL","HeadlineMStyling","HeadlineM","HeadlineSStyling","HeadlineS","HeadlineXSStyling","HeadlineXS","HeadlineXXSStyling","HeadlineXXS","ParagraphStyling","ParagraphBase","props","marginBetweenParagraphs","ParagraphTextStyle","paragraphFontWeight","textStyle","Bold","paragraphFontStyle","Italic","paragraphTextDecorationLine","textDecoration","Underline","ParagraphBaseStyling","ParagraphXlStyling","ParagraphXL","children","ParagraphLStyling","ParagraphL","ParagraphMStyling","ParagraphM","ParagraphSStyling","ParagraphS","ParagraphXSStyling","ParagraphXS","ComponentTextStyle","componentFontWeight","UppercaseBold","componentFontStyle","componentTextTransformation","ComponentStyling","ComponentXLStyling","ComponentXL","ComponentLStyling","ComponentL","ComponentMStyling","ComponentM","ComponentSStyling","ComponentS","ComponentXSStyling","ComponentXS","ComponentXXSStyling","ComponentXXS","ComponentResponsive","size","width","fontsize"],"mappings":"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","sourcesContent":["import React, { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { COLORS } from '.';\nimport { Property } from 'csstype';\n\nconst TYPOGRAPHY = {\n fontFamily: 'Lato, sans-serif',\n};\n\ninterface ITypographyBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n fontWeight: number;\n fontStyle?: string;\n textTransform?: Property.TextTransform;\n textDecorationLine?: Property.TextDecorationLine;\n}\n\nconst TypographyBase = styled('div')<ITypographyBase>(({ color, lineHeight, fontSize, fontWeight, fontStyle, textTransform, textDecorationLine }) => ({\n fontFamily: TYPOGRAPHY.fontFamily,\n fontSize: fontSize,\n fontWeight: fontWeight,\n lineHeight: lineHeight + 'px',\n textTransform: textTransform ? textTransform : 'none',\n textDecorationLine: textDecorationLine ? textDecorationLine : 'none',\n fontStyle: fontStyle ? fontStyle : 'normal',\n color: color ? color : COLORS.black,\n}));\n\ninterface IHeadline {\n color?: string;\n}\n\ninterface IHeadlineBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n}\n\nconst HeadlineBaseStyling = (fontSize: string, lineHeight: string, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n line-height: ${lineHeight};\n font-weight: 700;\n color: ${color};\n `;\n}\nconst HeadlineBase = styled(TypographyBase)<IHeadlineBase>(({ color, lineHeight, fontSize }) => ({\n fontSize: fontSize,\n fontWeight: 700,\n lineHeight: lineHeight,\n color: color,\n}));\n\nconst HeadlineXLStyling = (color: string) => HeadlineBaseStyling('48px', '64px', color);\nconst HeadlineXL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '48px',\n lineHeight: '64px',\n color: color,\n}));\n\nconst HeadlineLStyling = (color: string) => HeadlineBaseStyling('40px', '52px', color);\nconst HeadlineL = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '40px',\n lineHeight: '52px',\n color: color,\n}));\n\nconst HeadlineMStyling = (color: string) => HeadlineBaseStyling('32px', '40px', color);\nconst HeadlineM = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '32px',\n lineHeight: '40px',\n color: color,\n}));\n\nconst HeadlineSStyling = (color: string) => HeadlineBaseStyling('28px', '36px', color);\nconst HeadlineS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '28px',\n lineHeight: '36px',\n color: color,\n}));\n\nconst HeadlineXSStyling = (color: string) => HeadlineBaseStyling('24px', '32px', color);\nconst HeadlineXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '24px',\n lineHeight: '32px',\n color: color,\n}));\n\nconst HeadlineXXSStyling = (color: string) => HeadlineBaseStyling('20px', '24px', color);\nconst HeadlineXXS = styled(HeadlineBase)<IHeadline>(({ color }) => ({\n fontSize: '20px',\n lineHeight: '24px',\n color: color,\n}));\n\nconst ParagraphStyling = css`\n :lang(ja-jp) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(ko-kr) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n :lang(zh-CN) > h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 30em;\n }\n h1,\n h2,\n h3,\n h4,\n p,\n span {\n max-width: 34em;\n }\n`;\n\ninterface IParagraphBase {\n color?: string;\n lineHeight: number;\n fontSize: number;\n marginBetweenParagraphs?: string;\n}\n\nconst ParagraphBase = styled(TypographyBase)<IParagraphBase>`\n p {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n p:not(:only-of-type) {\n margin-bottom: ${(props) => props.marginBetweenParagraphs || '0'};\n }\n ${ParagraphStyling}\n`;\n\ninterface IParagraph {\n color?: string;\n}\n\nenum ParagraphTextStyle {\n Regular = 1,\n Bold,\n Italic,\n Underline,\n}\n\ntype ParagraphProps = {\n color?: string;\n textStyle?: ParagraphTextStyle;\n};\n\nconst paragraphFontWeight = (textStyle?: ParagraphTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ParagraphTextStyle.Bold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst paragraphFontStyle = (textStyle?: ParagraphTextStyle) => {\n let fontStyle = textStyle && textStyle === ParagraphTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst paragraphTextDecorationLine = (textStyle?: ParagraphTextStyle): Property.TextDecorationLine => {\n let textDecoration: Property.TextDecorationLine = textStyle && textStyle === ParagraphTextStyle.Underline ? 'underline' : 'none';\n return textDecoration;\n};\n\nconst ParagraphBaseStyling = (fontSize: string, lineHeight: string, textStyle: ParagraphTextStyle, color: string) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${paragraphFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${paragraphFontStyle(textStyle)};\n color: ${color};\n `;\n}\n\nconst ParagraphXlStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('24px', '36px', textStyle, color);\nconst ParagraphXL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={36} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"18px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphLStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('20px', '32px', textStyle, color);\nconst ParagraphL: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={32} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"16px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphMStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('18px', '28px', textStyle, color);\nconst ParagraphM: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={28} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"14px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('16px', '24px', textStyle, color);\nconst ParagraphS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={24} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"12px\">\n {children}\n </ParagraphBase>\n );\n};\n\nconst ParagraphXSStyling = (textStyle: ParagraphTextStyle, color: string) => ParagraphBaseStyling('14px', '20px', textStyle, color);\nconst ParagraphXS: FunctionComponent<ParagraphProps> = ({ color, textStyle, children }) => {\n let fontWeight = paragraphFontWeight(textStyle);\n let fontStyle = paragraphFontStyle(textStyle);\n let textDecorationLine = paragraphTextDecorationLine(textStyle);\n return (\n <ParagraphBase color={color} lineHeight={20} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textDecorationLine={textDecorationLine} marginBetweenParagraphs=\"10px\">\n {children}\n </ParagraphBase>\n );\n};\n\nenum ComponentTextStyle {\n Regular = 1,\n Bold,\n Italic,\n UppercaseBold,\n}\n\ntype ComponentProps = {\n color?: string;\n textStyle?: ComponentTextStyle;\n};\n\nconst componentFontWeight = (textStyle?: ComponentTextStyle) => {\n let fontWeight = 400;\n if (textStyle === ComponentTextStyle.Bold || textStyle === ComponentTextStyle.UppercaseBold) {\n fontWeight = 700;\n }\n return fontWeight;\n};\n\nconst componentFontStyle = (textStyle?: ComponentTextStyle) => {\n let fontStyle = textStyle && textStyle === ComponentTextStyle.Italic ? 'italic' : '';\n return fontStyle;\n};\n\nconst componentTextTransformation = (textStyle?: ComponentTextStyle): Property.TextTransform => {\n let fontStyle: Property.TextTransform = textStyle && textStyle === ComponentTextStyle.UppercaseBold ? 'uppercase' : 'none';\n return fontStyle;\n};\n\nconst ComponentStyling = (fontSize: string, lineHeight: string, textStyle: ComponentTextStyle, color: string | undefined | null) => {\n return css`\n font-family: ${TYPOGRAPHY.fontFamily};\n font-size: ${fontSize};\n font-weight: ${componentFontWeight(textStyle)};\n line-height: ${lineHeight};\n font-style: ${componentFontStyle(textStyle)};\n ${color === null ? '' : `color: ${(color || COLORS.black)};`}\n `;\n};\n\nconst ComponentXLStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('24px', '28px', textStyle, color);\nconst ComponentXL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={28} fontSize={24} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentLStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('20px', '24px', textStyle, color);\nconst ComponentL: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={20} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentMStyling = (textStyle: ComponentTextStyle, color: string | undefined | null) => ComponentStyling('18px', '24px', textStyle, color);\nconst ComponentM: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={24} fontSize={18} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('16px', '20px', textStyle, color);\nconst ComponentS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n return (\n <TypographyBase color={color} lineHeight={20} fontSize={16} fontWeight={fontWeight} fontStyle={fontStyle}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('14px', '16px', textStyle, color);\nconst ComponentXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={14} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentXXSStyling = (textStyle: ComponentTextStyle, color: string | null) => ComponentStyling('12px', '16px', textStyle, color);\nconst ComponentXXS: FunctionComponent<ComponentProps> = ({ color, textStyle, children }) => {\n let fontWeight = componentFontWeight(textStyle);\n let fontStyle = componentFontStyle(textStyle);\n let textTransform = componentTextTransformation(textStyle);\n return (\n <TypographyBase color={color} lineHeight={16} fontSize={12} fontWeight={fontWeight} fontStyle={fontStyle} textTransform={textTransform}>\n {children}\n </TypographyBase>\n );\n};\n\nconst ComponentResponsive: FunctionComponent<ComponentProps & { size?: 'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large'; width: number }> = ({\n color,\n textStyle,\n children,\n size,\n width,\n}) => {\n let fontsize = size;\n if (!size) {\n if (width < 768) {\n fontsize = 'small';\n } else if (width < 992) {\n fontsize = 'medium';\n } else {\n fontsize = 'large';\n }\n }\n switch (fontsize) {\n case 'xxsmall':\n return <ComponentXXS color={color} textStyle={textStyle} children={children} />;\n case 'xsmall':\n return <ComponentXS color={color} textStyle={textStyle} children={children} />;\n case 'small':\n return <ComponentS color={color} textStyle={textStyle} children={children} />;\n case 'medium':\n return <ComponentM color={color} textStyle={textStyle} children={children} />;\n case 'large':\n default:\n return <ComponentL color={color} textStyle={textStyle} children={children} />;\n }\n};\n\nexport { TYPOGRAPHY };\nexport { HeadlineXL, HeadlineL, HeadlineM, HeadlineS, HeadlineXS, HeadlineXXS };\nexport { ParagraphTextStyle, ParagraphXL, ParagraphL, ParagraphM, ParagraphS, ParagraphXS };\nexport { ComponentTextStyle, ComponentXL, ComponentL, ComponentM, ComponentS, ComponentXS, ComponentXXS, ComponentResponsive };\nexport { ComponentXLStyling, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling };\nexport { ParagraphXlStyling, ParagraphLStyling, ParagraphMStyling, ParagraphSStyling, ParagraphXSStyling };\nexport { HeadlineXLStyling, HeadlineLStyling, HeadlineMStyling, HeadlineSStyling, HeadlineXSStyling, HeadlineXXSStyling };\n"],"file":"typography.js"}
package/dist/esm/types.js CHANGED
@@ -1,7 +1,6 @@
1
1
  export let Size;
2
2
 
3
3
  (function (Size) {
4
- Size["XXSmall"] = "xxsmall";
5
4
  Size["XSmall"] = "xsmall";
6
5
  Size["Small"] = "small";
7
6
  Size["Medium"] = "medium";
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/types.ts"],"names":["Size","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AA+BZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum Size {\n XXSmall = 'xxsmall',\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large'\n}\n\nexport interface NavOption {\n label: string;\n to: string;\n disabled?: boolean;\n exact?: boolean;\n onClick?: () => void;\n}\n\nexport interface NavButton {\n label: string;\n action: any;\n disabled?: boolean;\n}\n\nexport interface ActionOptions {\n search?: () => void;\n apps?: () => void;\n language?: () => void;\n notification?: () => void;\n settings?: () => void;\n user?: () => void;\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType{\n PRIMARY,\n SECONDARY\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection{\n TOP,\n BOTTOM,\n LEFT,\n RIGHT\n}\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n Icon?: any;\n as?: any;\n testId?: string;\n}\n\nexport interface UserMenuItem {\n label: string;\n to: string;\n icon: any;\n isExternal?: boolean;\n onClick?: () => void;\n}\n\nexport interface ListRowDropdownOption {\n key?: string;\n label: string;\n action: any;\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.js"}
1
+ {"version":3,"sources":["../../src/types.ts"],"names":["Size","ToastColor","ToastActionType","ToastPosition","ToastEntryDirection"],"mappings":"AAOA,WAAYA,IAAZ;;WAAYA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;AAAAA,EAAAA,I;GAAAA,I,KAAAA,I;;AA8BZ,WAAYC,UAAZ;;WAAYA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;AAAAA,EAAAA,U,CAAAA,U;GAAAA,U,KAAAA,U;;AASZ,WAAYC,eAAZ;;WAAYA,e;AAAAA,EAAAA,e,CAAAA,e;AAAAA,EAAAA,e,CAAAA,e;GAAAA,e,KAAAA,e;;AAKZ,WAAYC,aAAZ;;WAAYA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;AAAAA,EAAAA,a,CAAAA,a;GAAAA,a,KAAAA,a;;AASZ,WAAYC,mBAAZ;;WAAYA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;AAAAA,EAAAA,mB,CAAAA,mB;GAAAA,mB,KAAAA,mB","sourcesContent":["export interface Product {\n id: string;\n name: string;\n type: string;\n image: string;\n}\n\nexport enum Size {\n XSmall = 'xsmall',\n Small = 'small',\n Medium = 'medium',\n Large = 'large'\n}\n\nexport interface NavOption {\n label: string;\n to: string;\n disabled?: boolean;\n exact?: boolean;\n onClick?: () => void;\n}\n\nexport interface NavButton {\n label: string;\n action: any;\n disabled?: boolean;\n}\n\nexport interface ActionOptions {\n search?: () => void;\n apps?: () => void;\n language?: () => void;\n notification?: () => void;\n settings?: () => void;\n user?: () => void;\n}\n\nexport enum ToastColor {\n BLACK,\n WHITE,\n BLUE,\n GREEN,\n ORANGE,\n RED,\n}\n\nexport enum ToastActionType{\n PRIMARY,\n SECONDARY\n}\n\nexport enum ToastPosition {\n TOPLEFT,\n TOPMIDDLE,\n TOPRIGHT,\n BOTTOMLEFT,\n BOTTOMMIDDLE,\n BOTTOMRIGHT,\n}\n\nexport enum ToastEntryDirection{\n TOP,\n BOTTOM,\n LEFT,\n RIGHT\n}\n\nexport interface SwitcherNavItem {\n label: string;\n url: string;\n disabled?: boolean;\n Icon?: any;\n as?: any;\n testId?: string;\n}\n\nexport interface UserMenuItem {\n label: string;\n to: string;\n icon: any;\n isExternal?: boolean;\n onClick?: () => void;\n}\n\nexport interface ListRowDropdownOption {\n key?: string;\n label: string;\n action: any;\n}\n\nexport interface NavLink {\n label: string;\n to: string;\n target?: string;\n}\n\nexport interface NavSection {\n header: string;\n links: NavLink[];\n}\n\nexport interface NavOptions {\n sections: NavSection[];\n}\n"],"file":"types.js"}
@@ -1,7 +1,6 @@
1
1
  import * as React from 'react';
2
- import { Size } from '../types';
3
2
  declare type BannerProps = {
4
- size?: Size.Small | Size.Medium | Size.Large;
3
+ size?: 'small' | 'medium' | 'large';
5
4
  type?: string;
6
5
  link?: string;
7
6
  linkText?: string;
@@ -247,6 +247,7 @@ var Banner = function Banner(_ref) {
247
247
  };
248
248
 
249
249
  Banner.propTypes = {
250
+ size: _propTypes.default.oneOf(['small', 'medium', 'large']),
250
251
  type: _propTypes.default.string,
251
252
  link: _propTypes.default.string,
252
253
  linkText: _propTypes.default.string,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentTextStyle","Regular","color","ButtonWrapper","ButtonContainer","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {Close, Help, TechnicalWarning, ThumbsUp, Tip} from '../icons/systemicons/SystemIcons';\nimport {IconButton} from '../Button';\nimport {getButtonStyle} from './styles';\nimport {Size} from '../types';\nimport {ComponentMStyling, ComponentResponsive} from '../styles/typography';\nimport {HyperLink} from '../HyperLink';\n\n/**\n * Styles for <Banner />\n */\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.color)}\n \n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ type?: string }>`\n display: contents;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: Size.Small | Size.Medium | Size.Large;\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
1
+ {"version":3,"sources":["../../../src/Banners/Banner.tsx"],"names":["BannerContainer","styled","div","props","type","COLORS","correct_100","black","bottom","BREAKPOINTS","MEDIUM","LARGE","link","BannerCenter","ComponentTextStyle","Regular","color","ButtonWrapper","ButtonContainer","BannerContentWrapper","Banner","size","children","testId","linkText","onClose","icon","noIcon","React","useState","window","innerWidth","width","setWidth","useEffect","handleResize","addEventListener","formatTypeToLowerCase","toLowerCase","warning_100","warning_700","warning_20","Math","floor","random","white","warning_500","critical_100","critical_700","critical_20","critical_500","correct_700","correct_20","correct_500","primary_100","primary_700","primary_20","primary_500","hover"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACA;AACA,IAAMA,eAAe,GAAGC,0BAAOC,GAAV,8gBACL,UAACC,KAAD;AAAA,SAAyBA,KAAK,CAACC,IAAN,GAAaD,KAAK,CAACC,IAAnB,GAA0BC,eAAOC,WAA1D;AAAA,CADK,EAIVD,eAAOE,KAJG,EAKL,UAACJ,KAAD;AAAA,SAAyBA,KAAK,CAACK,MAAN,GAAe,MAAf,GAAwB,GAAjD;AAAA,CALK,EAUfC,oBAAYC,MAVG,EAafD,oBAAYE,KAbG,EA4BR,UAACR,KAAD;AAAA,SAAwBA,KAAK,CAACS,IAA9B;AAAA,CA5BQ,CAArB;;AAgCA,IAAMC,YAAY,GAAGZ,0BAAOC,GAAV,yaACd,UAACC,KAAD;AAAA,SAAW,mCAAkBW,2BAAmBC,OAArC,EAA8CZ,KAAK,CAACa,KAApD,CAAX;AAAA,CADc,EAMdP,oBAAYC,MANE,EASdD,oBAAYE,KATE,CAAlB;;AA4BA,IAAMM,aAAa,GAAGhB,0BAAOC,GAAV,gGAAnB;;AAIA,IAAMgB,eAAe,GAAGjB,0BAAOC,GAAV,yGAEjB,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,GAAa,6BAAeD,KAAK,CAACC,IAArB,CAAb,GAA0C,IAAtD;AAAA,CAFiB,CAArB;;AAKA,IAAMe,oBAAoB,GAAGlB,0BAAOC,GAAV,2LAA1B;;AAsBA,IAAMkB,MAA4C,GAAG,SAA/CA,MAA+C,OAAqF;AAAA,MAAlFC,IAAkF,QAAlFA,IAAkF;AAAA,MAA5EjB,IAA4E,QAA5EA,IAA4E;AAAA,MAAtEkB,QAAsE,QAAtEA,QAAsE;AAAA,MAA5Dd,MAA4D,QAA5DA,MAA4D;AAAA,MAApDe,MAAoD,QAApDA,MAAoD;AAAA,MAA5CC,QAA4C,QAA5CA,QAA4C;AAAA,MAAlCZ,IAAkC,QAAlCA,IAAkC;AAAA,MAA5Ba,OAA4B,QAA5BA,OAA4B;AAAA,MAAnBC,IAAmB,QAAnBA,IAAmB;AAAA,MAAbC,MAAa,QAAbA,MAAa;;AACxI,wBAA0BC,KAAK,CAACC,QAAN,CAAuBC,MAAM,CAACC,UAA9B,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AACAL,EAAAA,KAAK,CAACM,SAAN,CAAgB,YAAM;AACpB,aAASC,YAAT,GAAwB;AACtBF,MAAAA,QAAQ,CAACH,MAAM,CAACC,UAAR,CAAR;AACD;;AACDD,IAAAA,MAAM,CAACM,gBAAP,CAAwB,QAAxB,EAAkCD,YAAlC;AACD,GALD;AAOA,MAAME,qBAAqB,GAAGjC,IAAH,aAAGA,IAAH,uBAAGA,IAAI,CAAEkC,WAAN,EAA9B;;AACA,UAAQD,qBAAR;AACE,SAAK,SAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAad,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOkC,WAAnD;AAAgE,QAAA,IAAI,EAAElC,eAAOmC,WAA7E;AAA0F,QAAA,KAAK,EAAEnC,eAAOoC,UAAxG;AAAoH,QAAA,MAAM,EAAEjC;AAA5H,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEH,eAAOmC,WAA5B;AAAyC,QAAA,SAAS,EAAEnB;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,iBAAD;AAAM,QAAA,KAAK,EAAEtB,eAAOmC,WAApB;AAAiC,QAAA,IAAI,EAAC;AAAtC,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAEnB,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAOmC;AAA7D,SACGlB,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOyC,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF,SAAK,UAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAavB,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAO0C,YAAnD;AAAiE,QAAA,IAAI,EAAE1C,eAAO2C,YAA9E;AAA4F,QAAA,KAAK,EAAE3C,eAAO4C,WAA1G;AAAuH,QAAA,MAAM,EAAEzC,MAA/H;AAAuI,QAAA,SAAS,EAAEa;AAAlJ,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAO2C,YAA5B;AAA0C,QAAA,SAAS,EAAE3B;AAArD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,6BAAD;AAAkB,QAAA,KAAK,EAAEtB,eAAO2C,YAAhC;AAA8C,QAAA,IAAI,EAAC;AAAnD,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAE3B,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAO2C;AAA7D,SACG1B,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAO6C,YAArB;AAAmC,QAAA,IAAI,EAAC;AAAxC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF,SAAK,UAAL;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAa3B,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOC,WAAnD;AAAgE,QAAA,IAAI,EAAED,eAAO8C,WAA7E;AAA0F,QAAA,KAAK,EAAE9C,eAAO+C,UAAxG;AAAoH,QAAA,MAAM,EAAE5C,MAA5H;AAAoI,QAAA,SAAS,EAAEa;AAA/I,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAO8C,WAA5B;AAAyC,QAAA,SAAS,EAAE9B;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,qBAAD;AAAU,QAAA,KAAK,EAAEtB,eAAO8C,WAAxB;AAAqC,QAAA,IAAI,EAAC;AAA1C,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAE9B,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAO8C;AAA7D,SACG7B,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAEY;AAAvB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEhC,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOgD,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;;AA0BF;AACE,0BACE,oBAAC,eAAD;AAAiB,uBAAa9B,MAA9B;AAAsC,QAAA,IAAI,EAAElB,eAAOiD,WAAnD;AAAgE,QAAA,IAAI,EAAEjD,eAAOkD,WAA7E;AAA0F,QAAA,KAAK,EAAElD,eAAOmD,UAAxG;AAAoH,QAAA,MAAM,EAAEhD,MAA5H;AAAoI,QAAA,SAAS,EAAEa;AAA/I,sBACE,oBAAC,YAAD;AAAc,QAAA,KAAK,EAAEhB,eAAOkD,WAA5B;AAAyC,QAAA,SAAS,EAAElC;AAApD,SACGK,IAAI,GAAGA,IAAH,GAAUC,MAAM,GAAG,IAAH,gBAAU,oBAAC,gBAAD;AAAK,QAAA,KAAK,EAAEtB,eAAOkD,WAAnB;AAAgC,QAAA,IAAI,EAAC;AAArC,QADjC,eAEE,oBAAC,oBAAD,qBACE,oBAAC,+BAAD;AAAqB,QAAA,IAAI,EAAElC,IAA3B;AAAiC,QAAA,KAAK,EAAEW,KAAxC;AAA+C,QAAA,KAAK,EAAE3B,eAAOkD;AAA7D,SACGjC,QADH,cAEGV,IAAI,IAAIY,QAAR,iBACC,oBAAC,oBAAD;AAAW,QAAA,EAAE,YAAKkB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAAL,gBAAb;AAAyE,QAAA,IAAI,EAAEhC,IAA/E;AAAqF,QAAA,OAAO,EAAC;AAA7F,SACGY,QADH,CAHJ,CADF,CAFF,EAYGC,OAAO,iBACN,oBAAC,aAAD,qBACE,oBAAC,eAAD;AAAiB,QAAA,IAAI,EAAC;AAAtB,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,wBAAwB,MAAzE;AAA0E,QAAA,yBAAyB,EAAEpB,eAAOwC,KAA5G;AAAmH,QAAA,MAAM,EAAE;AAAA,iBAAMpB,OAAO,EAAb;AAAA;AAA3H,sBACE,oBAAC,kBAAD;AAAO,QAAA,KAAK,EAAEpB,eAAOoD,WAArB;AAAkC,QAAA,IAAI,EAAC;AAAvC,QADF,CADF,CADF,CAbJ,CADF,CADF;AAnFJ;AA8GD,CAxHD;;;AAZEpC,EAAAA,I,4BAAO,O,EAAU,Q,EAAW,O;AAC5BjB,EAAAA,I;AACAQ,EAAAA,I;AACAY,EAAAA,Q;AACAkC,EAAAA,K;AACAlD,EAAAA,M;AACAe,EAAAA,M;AACAG,EAAAA,I;AACAD,EAAAA,O;AACAE,EAAAA,M;;eA6HaP,M","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {Close, Help, TechnicalWarning, ThumbsUp, Tip} from '../icons/systemicons/SystemIcons';\nimport {IconButton} from '../Button';\nimport {getButtonStyle} from './styles';\nimport {ComponentMStyling, ComponentResponsive} from '../styles/typography';\nimport {HyperLink} from '../HyperLink';\n\n/**\n * Styles for <Banner />\n */\nconst BannerContainer = styled.div<BannerProps>`\n background: ${(props: BannerProps) => (props.type ? props.type : COLORS.correct_100)};\n min-height: 48px;\n display: flex;\n color: ${COLORS.black};\n margin-top: ${(props: BannerProps) => (props.bottom ? 'auto' : '0')};\n\n button:last-child {\n line-height: 0;\n margin: 0 0 0 8px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 0 0 16px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 0 0 32px;\n }\n &.small {\n margin: 0 0 0 8px;\n }\n &.medium {\n margin: 0 0 0 16px;\n }\n &.large {\n margin: 0 0 0 32px;\n }\n }\n\n a {\n color: ${(props: BannerProps) => props.link} !important;\n }\n`;\n\nconst BannerCenter = styled.div`\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.color)}\n \n display: flex;\n width: 100%;\n margin: 0 0 0 16px;\n ${BREAKPOINTS.MEDIUM} {\n margin: 0 16px 0 32px;\n }\n ${BREAKPOINTS.LARGE} {\n margin: 0 40px 0 56px;\n }\n &.small {\n margin: 0 0 0 16px;\n }\n &.medium {\n margin: 0 16px 0 32px;\n }\n &.large {\n margin: 0 40px 0 56px;\n }\n\n > svg {\n flex-shrink: 0;\n margin: 12px 0;\n }\n`;\n\nconst ButtonWrapper = styled.div`\n margin: 0 0 0 auto;\n`;\n\nconst ButtonContainer = styled.div<{ type?: string }>`\n display: contents;\n ${(props) => (props.type ? getButtonStyle(props.type) : null)};\n`;\n\nconst BannerContentWrapper = styled.div`\n display: flex;\n align-items: center;\n margin: 12px 0;\n &:not(:first-child) {\n margin-left: 8px;\n }\n`;\n\ntype BannerProps = {\n size?: 'small' | 'medium' | 'large';\n type?: string;\n link?: string;\n linkText?: string;\n hover?: string;\n bottom?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n onClose?: () => void;\n noIcon?: boolean;\n};\n\nconst Banner: React.FunctionComponent<BannerProps> = ({ size, type, children, bottom, testId, linkText, link, onClose, icon, noIcon }) => {\n const [width, setWidth] = React.useState<number>(window.innerWidth);\n React.useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n window.addEventListener('resize', handleResize);\n });\n\n const formatTypeToLowerCase = type?.toLowerCase();\n switch (formatTypeToLowerCase) {\n case 'warning':\n return (\n <BannerContainer data-testid={testId} type={COLORS.warning_100} link={COLORS.warning_700} hover={COLORS.warning_20} bottom={bottom}>\n <BannerCenter color={COLORS.warning_700} className={size}>\n {icon ? icon : noIcon ? null : <Help color={COLORS.warning_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.warning_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.warning_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'critical':\n return (\n <BannerContainer data-testid={testId} type={COLORS.critical_100} link={COLORS.critical_700} hover={COLORS.critical_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.critical_700} className={size}>\n {icon ? icon : noIcon ? null : <TechnicalWarning color={COLORS.critical_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.critical_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.critical_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n case 'positive':\n return (\n <BannerContainer data-testid={testId} type={COLORS.correct_100} link={COLORS.correct_700} hover={COLORS.correct_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.correct_700} className={size}>\n {icon ? icon : noIcon ? null : <ThumbsUp color={COLORS.correct_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.correct_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type={formatTypeToLowerCase}>\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.correct_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n default:\n return (\n <BannerContainer data-testid={testId} type={COLORS.primary_100} link={COLORS.primary_700} hover={COLORS.primary_20} bottom={bottom} className={size}>\n <BannerCenter color={COLORS.primary_700} className={size}>\n {icon ? icon : noIcon ? null : <Tip color={COLORS.primary_700} size=\"24px\" />}\n <BannerContentWrapper>\n <ComponentResponsive size={size} width={width} color={COLORS.primary_700}>\n {children}&nbsp;&nbsp;\n {link && linkText && (\n <HyperLink id={`${Math.floor(Math.random() * 999999999999)}_BannerLink`} href={link} variant=\"default\">\n {linkText}\n </HyperLink>\n )}\n </ComponentResponsive>\n </BannerContentWrapper>\n {onClose && (\n <ButtonWrapper>\n <ButtonContainer type=\"neutral\">\n <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground tabbedHereBackgroundColor={COLORS.white} action={() => onClose()}>\n <Close color={COLORS.primary_500} size=\"24px\" />\n </IconButton>\n </ButtonContainer>\n </ButtonWrapper>\n )}\n </BannerCenter>\n </BannerContainer>\n );\n }\n};\n\nexport default Banner;\n"],"file":"Banner.js"}
@@ -1,7 +1,6 @@
1
1
  import * as React from 'react';
2
- import { Size } from '../types';
3
2
  interface BackButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
4
- size: Size.Small | Size.XSmall;
3
+ size: 'Small' | 'XSmall';
5
4
  disabled?: boolean;
6
5
  }
7
6
  declare const BackButton: React.FunctionComponent<BackButtonProps>;
@@ -15,8 +15,6 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
15
15
 
16
16
  var _styles = require("../styles");
17
17
 
18
- var _types = require("../types");
19
-
20
18
  var _SystemIcons = require("../icons/systemicons/SystemIcons");
21
19
 
22
20
  var _typography = require("../styles/typography");
@@ -40,13 +38,13 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
40
38
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
41
39
 
42
40
  var Button = _styledComponents.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n box-sizing: border-box;\n min-height: 48px;\n padding: 0;\n margin: 0;\n outline:none;\n max-width: max-content;\n display: flex;\n align-items: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n\n ", ";\n font-feature-settings: 'liga' off;\n\n & > .button-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: max-content;\n padding: 4px 4px 4px 0;\n border-radius: 4px;\n cursor: inherit;\n min-width: 64px;\n\n }\n\n & > .button-content > span {\n display: flex;\n cursor: inherit;\n }\n & > .button-content > label {\n display: flex;\n cursor: inherit;\n flex-grow: 1;\n justify-content: center;\n }\n\n &:hover > .button-content,\n &.hover-state > .button-content {\n background-color: ", ";\n color: ", ";\n }\n &:focus > .button-content,\n &.focus-state > .button-content {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n }\n &:active > .button-content,\n &.active-state > .button-content {\n background-color: ", ";\n color: ", ";\n box-shadow: unset;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:disabled > .button-content {\n color: ", " !important;\n background-color: transparent !important;\n }\n"])), function (props) {
43
- return props.size === _types.Size.XSmall ? (0, _typography.ComponentXSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600) : (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600);
41
+ return props.size === 'XSmall' ? (0, _typography.ComponentXSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600) : (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600);
44
42
  }, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.neutral_300);
45
43
 
46
44
  var BackButton = function BackButton(_ref) {
47
45
  var children = _ref.children,
48
46
  _ref$size = _ref.size,
49
- size = _ref$size === void 0 ? _types.Size.Small : _ref$size,
47
+ size = _ref$size === void 0 ? 'Small' : _ref$size,
50
48
  props = _objectWithoutProperties(_ref, _excluded);
51
49
 
52
50
  return /*#__PURE__*/React.createElement(Button, _extends({}, props, {
@@ -54,11 +52,12 @@ var BackButton = function BackButton(_ref) {
54
52
  }), /*#__PURE__*/React.createElement("div", {
55
53
  className: 'button-content'
56
54
  }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(_SystemIcons.ArrowLineLeft, {
57
- size: size === _types.Size.XSmall ? '20' : '24'
55
+ size: size === 'XSmall' ? '20' : '24'
58
56
  })), /*#__PURE__*/React.createElement("label", null, children)));
59
57
  };
60
58
 
61
59
  BackButton.propTypes = {
60
+ size: _propTypes.default.oneOf(['Small', 'XSmall']).isRequired,
62
61
  disabled: _propTypes.default.bool
63
62
  };
64
63
  var _default = BackButton;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Button/BackButton.tsx"],"names":["Button","styled","button","props","size","Size","XSmall","ComponentTextStyle","Bold","COLORS","neutral_600","primary_20","primary_700","primary_100","primary_800","neutral_300","BackButton","children","Small","disabled"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,MAAM,GAAGC,0BAAOC,MAAV,23CAaR,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,KAAeC,YAAKC,MAApB,GAA6B,oCAAmBC,+BAAmBC,IAAtC,EAA4CC,eAAOC,WAAnD,CAA7B,GAA+F,mCAAkBH,+BAAmBC,IAArC,EAA2CC,eAAOC,WAAlD,CAA3G;AAAA,CAbQ,EA0CYD,eAAOE,UA1CnB,EA2CCF,eAAOG,WA3CR,EAmDYH,eAAOI,WAnDnB,EAoDCJ,eAAOK,WApDR,EA2DCL,eAAOM,WA3DR,CAAZ;;AAoEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAA+C;AAAA,MAA5CC,QAA4C,QAA5CA,QAA4C;AAAA,uBAAlCb,IAAkC;AAAA,MAAlCA,IAAkC,0BAA3BC,YAAKa,KAAsB;AAAA,MAAZf,KAAY;;AAC1G,sBACE,oBAAC,MAAD,eAAYA,KAAZ;AAAmB,IAAA,IAAI,EAAEC;AAAzB,mBACE;AAAK,IAAA,SAAS,EAAE;AAAhB,kBACE,+CACE,oBAAC,0BAAD;AAAe,IAAA,IAAI,EAAEA,IAAI,KAAKC,YAAKC,MAAd,GAAuB,IAAvB,GAA8B;AAAnD,IADF,CADF,eAIE,mCAAQW,QAAR,CAJF,CADF,CADF;AAUD,CAXD;;;AAFEE,EAAAA,Q;;eAeaH,U","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS } from '../styles';\nimport { Size } from '../types';\nimport { ArrowLineLeft } from '../icons/systemicons/SystemIcons';\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\n\nconst Button = styled.button<BackButtonProps>`\n box-sizing: border-box;\n min-height: 48px;\n padding: 0;\n margin: 0;\n outline:none;\n max-width: max-content;\n display: flex;\n align-items: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n\n ${(props) => (props.size === Size.XSmall ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\n font-feature-settings: 'liga' off;\n\n & > .button-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: max-content;\n padding: 4px 4px 4px 0;\n border-radius: 4px;\n cursor: inherit;\n min-width: 64px;\n\n }\n\n & > .button-content > span {\n display: flex;\n cursor: inherit;\n }\n & > .button-content > label {\n display: flex;\n cursor: inherit;\n flex-grow: 1;\n justify-content: center;\n }\n\n &:hover > .button-content,\n &.hover-state > .button-content {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n &:focus > .button-content,\n &.focus-state > .button-content {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n }\n &:active > .button-content,\n &.active-state > .button-content {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n box-shadow: unset;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:disabled > .button-content {\n color: ${COLORS.neutral_300} !important;\n background-color: transparent !important;\n }\n`;\n\ninterface BackButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n size: Size.Small | Size.XSmall;\n disabled?: boolean;\n}\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = Size.Small, ...props }) => {\n return (\n <Button {...props} size={size}>\n <div className={'button-content'}>\n <span>\n <ArrowLineLeft size={size === Size.XSmall ? '20' : '24'} />\n </span>\n <label>{children}</label>\n </div>\n </Button>\n );\n};\n\nexport default BackButton;\n"],"file":"BackButton.js"}
1
+ {"version":3,"sources":["../../../src/Button/BackButton.tsx"],"names":["Button","styled","button","props","size","ComponentTextStyle","Bold","COLORS","neutral_600","primary_20","primary_700","primary_100","primary_800","neutral_300","BackButton","children","disabled"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,MAAM,GAAGC,0BAAOC,MAAV,23CAaR,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,KAAe,QAAf,GAA0B,oCAAmBC,+BAAmBC,IAAtC,EAA4CC,eAAOC,WAAnD,CAA1B,GAA4F,mCAAkBH,+BAAmBC,IAArC,EAA2CC,eAAOC,WAAlD,CAAxG;AAAA,CAbQ,EA0CYD,eAAOE,UA1CnB,EA2CCF,eAAOG,WA3CR,EAmDYH,eAAOI,WAnDnB,EAoDCJ,eAAOK,WApDR,EA2DCL,eAAOM,WA3DR,CAAZ;;AAoEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAA4C;AAAA,MAAzCC,QAAyC,QAAzCA,QAAyC;AAAA,uBAA/BX,IAA+B;AAAA,MAA/BA,IAA+B,0BAAxB,OAAwB;AAAA,MAAZD,KAAY;;AACvG,sBACE,oBAAC,MAAD,eAAYA,KAAZ;AAAmB,IAAA,IAAI,EAAEC;AAAzB,mBACE;AAAK,IAAA,SAAS,EAAE;AAAhB,kBACE,+CACE,oBAAC,0BAAD;AAAe,IAAA,IAAI,EAAEA,IAAI,KAAK,QAAT,GAAoB,IAApB,GAA2B;AAAhD,IADF,CADF,eAIE,mCAAQW,QAAR,CAJF,CADF,CADF;AAUD,CAXD;;;AAHEX,EAAAA,I,4BAAM,O,EAAU,Q;AAChBY,EAAAA,Q;;eAeaF,U","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS } from '../styles';\nimport { ArrowLineLeft } from '../icons/systemicons/SystemIcons';\nimport { ComponentTextStyle, ComponentSStyling, ComponentXSStyling } from '../styles/typography';\n\nconst Button = styled.button<BackButtonProps>`\n box-sizing: border-box;\n min-height: 48px;\n padding: 0;\n margin: 0;\n outline:none;\n max-width: max-content;\n display: flex;\n align-items: center;\n border: none;\n background-color: transparent;\n cursor: pointer;\n\n ${(props) => (props.size === 'XSmall' ? ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600) : ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600))};\n font-feature-settings: 'liga' off;\n\n & > .button-content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: max-content;\n padding: 4px 4px 4px 0;\n border-radius: 4px;\n cursor: inherit;\n min-width: 64px;\n\n }\n\n & > .button-content > span {\n display: flex;\n cursor: inherit;\n }\n & > .button-content > label {\n display: flex;\n cursor: inherit;\n flex-grow: 1;\n justify-content: center;\n }\n\n &:hover > .button-content,\n &.hover-state > .button-content {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n &:focus > .button-content,\n &.focus-state > .button-content {\n box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2e7fa1;\n }\n &:active > .button-content,\n &.active-state > .button-content {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n box-shadow: unset;\n }\n &:disabled {\n cursor: not-allowed;\n }\n &:disabled > .button-content {\n color: ${COLORS.neutral_300} !important;\n background-color: transparent !important;\n }\n`;\n\ninterface BackButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n size: 'Small' | 'XSmall';\n disabled?: boolean;\n}\nconst BackButton: React.FunctionComponent<BackButtonProps> = ({ children, size = 'Small', ...props }) => {\n return (\n <Button {...props} size={size}>\n <div className={'button-content'}>\n <span>\n <ArrowLineLeft size={size === 'XSmall' ? '20' : '24'} />\n </span>\n <label>{children}</label>\n </div>\n </Button>\n );\n};\n\nexport default BackButton;\n"],"file":"BackButton.js"}
@@ -17,6 +17,7 @@ interface Props {
17
17
  tabbedHereBackgroundColor?: string;
18
18
  type?: 'submit' | 'reset' | 'button' | undefined;
19
19
  children?: React.ReactNode;
20
+ hidden?: boolean;
20
21
  }
21
22
  declare const IconButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
22
23
  export default IconButton;
@@ -116,7 +116,8 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
116
116
  borderRadius = _ref.borderRadius,
117
117
  onKeyPress = _ref.onKeyPress,
118
118
  tabbedHereBackgroundColor = _ref.tabbedHereBackgroundColor,
119
- type = _ref.type;
119
+ type = _ref.type,
120
+ hidden = _ref.hidden;
120
121
  var supressFocusRef = React.useRef(null);
121
122
 
122
123
  var _React$useState = React.useState(false),
@@ -169,6 +170,7 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
169
170
  },
170
171
  tabbedHere: tabbedHere,
171
172
  onKeyPress: onKeyPress,
173
+ hidden: hidden,
172
174
  tabbedHereBackgroundColor: tabbedHereBackgroundColor
173
175
  }, /*#__PURE__*/React.createElement("div", null, children));
174
176
 
@@ -207,6 +209,7 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
207
209
  },
208
210
  tabbedHere: tabbedHere,
209
211
  onKeyPress: onKeyPress,
212
+ hidden: hidden,
210
213
  tabbedHereBackgroundColor: tabbedHereBackgroundColor
211
214
  }, /*#__PURE__*/React.createElement("div", null, children));
212
215
  }
@@ -226,7 +229,8 @@ IconButton.propTypes = {
226
229
  borderRadius: _propTypes.default.number,
227
230
  onKeyPress: _propTypes.default.func,
228
231
  tabbedHereBackgroundColor: _propTypes.default.string,
229
- children: _propTypes.default.node
232
+ children: _propTypes.default.node,
233
+ hidden: _propTypes.default.bool
230
234
  };
231
235
  var _default = IconButton;
232
236
  exports.default = _default;