superdesk-ui-framework 4.0.47 → 4.0.49

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 (575) hide show
  1. package/.eslintrc.js +0 -1
  2. package/.eslintrc.json +2 -5
  3. package/.github/workflows/test.yml +22 -26
  4. package/.prettierignore +3 -0
  5. package/.prettierrc.js +9 -0
  6. package/.travis.yml +4 -4
  7. package/README.md +14 -1
  8. package/app/styles/_time.scss +28 -0
  9. package/app/styles/app.scss +1 -0
  10. package/app/styles/design-tokens/_design-tokens-general.scss +6 -3
  11. package/app/styles/form-elements/_forms-general.scss +0 -4
  12. package/app-typescript/components/Alert.tsx +12 -16
  13. package/app-typescript/components/Autocomplete.tsx +53 -42
  14. package/app-typescript/components/Badge.tsx +1 -1
  15. package/app-typescript/components/Button.tsx +5 -11
  16. package/app-typescript/components/ButtonGroup.tsx +15 -10
  17. package/app-typescript/components/Carousel.tsx +25 -26
  18. package/app-typescript/components/CheckButtonGroup.tsx +6 -10
  19. package/app-typescript/components/Checkbox.tsx +16 -10
  20. package/app-typescript/components/CheckboxButton.tsx +22 -13
  21. package/app-typescript/components/ContentDivider.tsx +6 -7
  22. package/app-typescript/components/CreateButton.tsx +8 -6
  23. package/app-typescript/components/DatePicker.tsx +59 -55
  24. package/app-typescript/components/DateTimePicker.tsx +51 -48
  25. package/app-typescript/components/Divider.tsx +2 -4
  26. package/app-typescript/components/DonutChart.tsx +11 -6
  27. package/app-typescript/components/DragHandle.tsx +10 -6
  28. package/app-typescript/components/DragHandleDots.tsx +1 -3
  29. package/app-typescript/components/DropZone.tsx +27 -25
  30. package/app-typescript/components/Dropdown.tsx +61 -102
  31. package/app-typescript/components/DropdownFirst.tsx +57 -69
  32. package/app-typescript/components/DurationInput.tsx +64 -54
  33. package/app-typescript/components/Editor/EditorButton.tsx +4 -3
  34. package/app-typescript/components/EmptyState.tsx +10 -14
  35. package/app-typescript/components/Form/FormGroup.tsx +9 -16
  36. package/app-typescript/components/Form/FormItem.tsx +1 -5
  37. package/app-typescript/components/Form/FormLabel.tsx +0 -1
  38. package/app-typescript/components/Form/FormRow.tsx +12 -19
  39. package/app-typescript/components/Form/FormRowNew.tsx +9 -16
  40. package/app-typescript/components/Form/FormText.tsx +1 -5
  41. package/app-typescript/components/Form/InputBase.tsx +12 -11
  42. package/app-typescript/components/Form/InputNew.tsx +11 -12
  43. package/app-typescript/components/Form/InputWrapper.tsx +9 -18
  44. package/app-typescript/components/Form/index.tsx +9 -9
  45. package/app-typescript/components/FormLabel.tsx +1 -5
  46. package/app-typescript/components/GridItem.tsx +38 -69
  47. package/app-typescript/components/GridList.tsx +2 -6
  48. package/app-typescript/components/HeadingText.tsx +4 -5
  49. package/app-typescript/components/IconButton.tsx +4 -10
  50. package/app-typescript/components/IconLabel.tsx +5 -5
  51. package/app-typescript/components/IconPicker.tsx +128 -126
  52. package/app-typescript/components/IllustrationButton.tsx +2 -8
  53. package/app-typescript/components/Input.tsx +2 -2
  54. package/app-typescript/components/Label.tsx +11 -7
  55. package/app-typescript/components/Layouts/AuthorinInnerSideBar.tsx +1 -5
  56. package/app-typescript/components/Layouts/AuthoringContainer.tsx +4 -6
  57. package/app-typescript/components/Layouts/AuthoringFrame.tsx +4 -20
  58. package/app-typescript/components/Layouts/AuthoringFrameContainer.tsx +1 -5
  59. package/app-typescript/components/Layouts/AuthoringFrameLeftBar.tsx +1 -5
  60. package/app-typescript/components/Layouts/AuthoringFrameMain.tsx +1 -5
  61. package/app-typescript/components/Layouts/AuthoringFrameNavBar.tsx +1 -5
  62. package/app-typescript/components/Layouts/AuthoringFrameOverlay.tsx +1 -5
  63. package/app-typescript/components/Layouts/AuthoringFrameRightBar.tsx +1 -5
  64. package/app-typescript/components/Layouts/AuthoringFrameSidePanel.tsx +1 -5
  65. package/app-typescript/components/Layouts/AuthoringFrameSidePanelOverlay.tsx +1 -3
  66. package/app-typescript/components/Layouts/AuthoringInnerBody.tsx +3 -6
  67. package/app-typescript/components/Layouts/AuthoringInnerHeader.tsx +5 -5
  68. package/app-typescript/components/Layouts/AuthoringMain.tsx +3 -4
  69. package/app-typescript/components/Layouts/AuthoringMainContainer.tsx +1 -5
  70. package/app-typescript/components/Layouts/AuthoringMainContent.tsx +1 -5
  71. package/app-typescript/components/Layouts/AuthoringMainToolBar.tsx +1 -6
  72. package/app-typescript/components/Layouts/BottomBarAction.tsx +8 -10
  73. package/app-typescript/components/Layouts/Container.tsx +13 -8
  74. package/app-typescript/components/Layouts/ContentSplitter.tsx +2 -6
  75. package/app-typescript/components/Layouts/CoreLayout.tsx +5 -12
  76. package/app-typescript/components/Layouts/CoreLayoutContainer.tsx +1 -1
  77. package/app-typescript/components/Layouts/CoreLayoutFooter.tsx +1 -5
  78. package/app-typescript/components/Layouts/CoreLayoutMain.tsx +4 -4
  79. package/app-typescript/components/Layouts/CoreLayoutOverlay.tsx +1 -5
  80. package/app-typescript/components/Layouts/CoreLayoutSlideInMenu.tsx +2 -4
  81. package/app-typescript/components/Layouts/CoreLayoutTopMenu.tsx +8 -9
  82. package/app-typescript/components/Layouts/HamburgerButton.tsx +13 -14
  83. package/app-typescript/components/Layouts/HeaderPanel.tsx +1 -5
  84. package/app-typescript/components/Layouts/Layout.tsx +10 -16
  85. package/app-typescript/components/Layouts/LayoutContainer.tsx +2 -7
  86. package/app-typescript/components/Layouts/LeftPanel.tsx +4 -11
  87. package/app-typescript/components/Layouts/MainMenu.tsx +18 -32
  88. package/app-typescript/components/Layouts/MainPanel.tsx +10 -11
  89. package/app-typescript/components/Layouts/NotificationPanel.tsx +20 -29
  90. package/app-typescript/components/Layouts/OverlayPanel.tsx +3 -5
  91. package/app-typescript/components/Layouts/PageLayout.tsx +4 -21
  92. package/app-typescript/components/Layouts/Panel.tsx +45 -81
  93. package/app-typescript/components/Layouts/index.tsx +39 -39
  94. package/app-typescript/components/LeftMenu.tsx +51 -53
  95. package/app-typescript/components/ListItemLoader.tsx +1 -1
  96. package/app-typescript/components/Lists/BoxedList.tsx +16 -41
  97. package/app-typescript/components/Lists/CalendarWeekDayItem.tsx +2 -10
  98. package/app-typescript/components/Lists/ContentList.tsx +68 -62
  99. package/app-typescript/components/Lists/SimpleList.tsx +13 -12
  100. package/app-typescript/components/Lists/TableList.tsx +169 -217
  101. package/app-typescript/components/Lists/index.tsx +2 -2
  102. package/app-typescript/components/Loader.tsx +1 -3
  103. package/app-typescript/components/Menu.tsx +2 -4
  104. package/app-typescript/components/Modal.tsx +21 -21
  105. package/app-typescript/components/MultiSelect.tsx +6 -6
  106. package/app-typescript/components/NavButton.tsx +10 -8
  107. package/app-typescript/components/Navigation/BottomNav.tsx +21 -17
  108. package/app-typescript/components/Navigation/QuickNavBar.tsx +40 -37
  109. package/app-typescript/components/Navigation/SideBarMenu.tsx +21 -17
  110. package/app-typescript/components/Navigation/SideBarTabs.tsx +13 -19
  111. package/app-typescript/components/Navigation/index.tsx +3 -3
  112. package/app-typescript/components/Popover.tsx +19 -21
  113. package/app-typescript/components/PropsList.tsx +2 -4
  114. package/app-typescript/components/RadioButtonGroup.tsx +48 -45
  115. package/app-typescript/components/RadioGroup.tsx +9 -8
  116. package/app-typescript/components/ResizablePanels.tsx +2 -3
  117. package/app-typescript/components/ResizeObserverComponent.tsx +1 -5
  118. package/app-typescript/components/SearchBar.tsx +53 -45
  119. package/app-typescript/components/Select.tsx +6 -8
  120. package/app-typescript/components/SelectGrid.tsx +32 -40
  121. package/app-typescript/components/SelectPreview.tsx +31 -25
  122. package/app-typescript/components/SelectWithTemplate.tsx +10 -11
  123. package/app-typescript/components/ShowPopup.tsx +32 -46
  124. package/app-typescript/components/SidebarMenu.tsx +19 -18
  125. package/app-typescript/components/Skeleton.tsx +12 -11
  126. package/app-typescript/components/SlidingToolbar.tsx +1 -6
  127. package/app-typescript/components/Spinner.tsx +2 -6
  128. package/app-typescript/components/StrechBar.tsx +1 -5
  129. package/app-typescript/components/SubNav.tsx +10 -8
  130. package/app-typescript/components/SvgIconIllustration.tsx +477 -105
  131. package/app-typescript/components/Switch.tsx +14 -12
  132. package/app-typescript/components/SwitchGroup.tsx +10 -10
  133. package/app-typescript/components/TabCustom.tsx +28 -35
  134. package/app-typescript/components/TabList.tsx +13 -10
  135. package/app-typescript/components/Tag.tsx +21 -24
  136. package/app-typescript/components/TagInput.tsx +4 -11
  137. package/app-typescript/components/Text/Heading.tsx +21 -41
  138. package/app-typescript/components/Text/Text.tsx +16 -12
  139. package/app-typescript/components/Text/Time.tsx +14 -10
  140. package/app-typescript/components/ThemeSelector.tsx +15 -14
  141. package/app-typescript/components/TimePicker.tsx +60 -6
  142. package/app-typescript/components/TimePickerPopover.tsx +274 -0
  143. package/app-typescript/components/TimePickerV2.tsx +20 -20
  144. package/app-typescript/components/Toast.tsx +11 -7
  145. package/app-typescript/components/ToastMessage.tsx +3 -14
  146. package/app-typescript/components/ToastText.tsx +30 -32
  147. package/app-typescript/components/ToastWrapper.tsx +76 -74
  148. package/app-typescript/components/ToggleBox/CustomHeaderToggleBox.tsx +30 -45
  149. package/app-typescript/components/ToggleBox/SimpleToggleBox.tsx +31 -33
  150. package/app-typescript/components/ToggleBox/index.tsx +3 -7
  151. package/app-typescript/components/Tooltip.tsx +1 -1
  152. package/app-typescript/components/TreeMenu.tsx +72 -81
  153. package/app-typescript/components/TreeSelect/KeyboardNavigation.tsx +1 -5
  154. package/app-typescript/components/TreeSelect/TreeSelect.tsx +221 -238
  155. package/app-typescript/components/TreeSelect/TreeSelectItem.tsx +20 -24
  156. package/app-typescript/components/TreeSelect/TreeSelectPill.tsx +12 -15
  157. package/app-typescript/components/WithPagination.tsx +34 -39
  158. package/app-typescript/components/WithPopover.tsx +0 -1
  159. package/app-typescript/components/WithPortal.tsx +4 -7
  160. package/app-typescript/components/WithSizeObserver.tsx +2 -6
  161. package/app-typescript/components/_Positioner.tsx +26 -26
  162. package/app-typescript/components/avatar/avatar-action-add.tsx +1 -6
  163. package/app-typescript/components/avatar/avatar-group.tsx +49 -68
  164. package/app-typescript/components/avatar/avatar-image.tsx +18 -12
  165. package/app-typescript/components/avatar/avatar-placeholder.tsx +3 -15
  166. package/app-typescript/components/avatar/avatar-text.tsx +1 -4
  167. package/app-typescript/components/avatar/avatar-wrapper.tsx +18 -30
  168. package/app-typescript/components/avatar/avatar.tsx +5 -8
  169. package/app-typescript/components/with-pagination.spec.tsx +8 -27
  170. package/app-typescript/helpers.tsx +2 -2
  171. package/app-typescript/index.ts +111 -100
  172. package/app-typescript/utils/time.tsx +31 -0
  173. package/declarations.d.ts +1 -1
  174. package/dist/components/Alerts.tsx +171 -78
  175. package/dist/components/Autocomplete.tsx +187 -78
  176. package/dist/components/Avatar.tsx +52 -112
  177. package/dist/components/Badges.tsx +111 -67
  178. package/dist/components/BigIconFont.tsx +29 -17
  179. package/dist/components/BoxedList.tsx +244 -114
  180. package/dist/components/ButtonGroups.tsx +213 -147
  181. package/dist/components/Buttons.tsx +409 -137
  182. package/dist/components/Card.tsx +6 -7
  183. package/dist/components/Carousel.tsx +126 -39
  184. package/dist/components/Checkboxs.tsx +446 -105
  185. package/dist/components/Container.tsx +95 -48
  186. package/dist/components/ContentDivider.tsx +110 -63
  187. package/dist/components/ContentList.tsx +577 -253
  188. package/dist/components/CreateButton.tsx +71 -21
  189. package/dist/components/DatePicker.tsx +102 -26
  190. package/dist/components/DateTimePicker.tsx +49 -11
  191. package/dist/components/DragHandleDocs.tsx +56 -26
  192. package/dist/components/DropZone.tsx +67 -29
  193. package/dist/components/Dropdowns.tsx +220 -131
  194. package/dist/components/DurationInput.tsx +92 -32
  195. package/dist/components/EmptyStates.tsx +61 -26
  196. package/dist/components/GridItem.tsx +190 -91
  197. package/dist/components/GridList.tsx +37 -17
  198. package/dist/components/Heading.tsx +81 -35
  199. package/dist/components/IconButtons.tsx +125 -32
  200. package/dist/components/IconFont.tsx +24 -12
  201. package/dist/components/IconLabels.tsx +146 -39
  202. package/dist/components/IconPicker.tsx +30 -13
  203. package/dist/components/IllustrationButton.tsx +40 -20
  204. package/dist/components/Index.tsx +128 -114
  205. package/dist/components/Inputs.tsx +153 -51
  206. package/dist/components/Labels.tsx +191 -117
  207. package/dist/components/LeftNavigations.tsx +327 -100
  208. package/dist/components/ListItems.tsx +8 -9
  209. package/dist/components/Loader.tsx +5 -4
  210. package/dist/components/Menu.tsx +48 -26
  211. package/dist/components/Modal.tsx +298 -104
  212. package/dist/components/MultiSelect.tsx +189 -53
  213. package/dist/components/NavButtons.tsx +86 -30
  214. package/dist/components/Panel.tsx +367 -120
  215. package/dist/components/Popover.tsx +37 -17
  216. package/dist/components/QuickNavigationBar.tsx +222 -86
  217. package/dist/components/RadioGroup.tsx +375 -137
  218. package/dist/components/ResizablePanels.tsx +8 -14
  219. package/dist/components/SelectGrid.tsx +79 -38
  220. package/dist/components/SelectWithTemplate.tsx +23 -14
  221. package/dist/components/Selects.tsx +94 -29
  222. package/dist/components/SimpleList.tsx +91 -41
  223. package/dist/components/SubNav.tsx +57 -37
  224. package/dist/components/Switch.tsx +168 -42
  225. package/dist/components/TableList.tsx +220 -66
  226. package/dist/components/Tabs.tsx +149 -64
  227. package/dist/components/TagInputDocs.tsx +73 -17
  228. package/dist/components/Tags.tsx +104 -73
  229. package/dist/components/Text.tsx +108 -58
  230. package/dist/components/TimePicker.tsx +76 -22
  231. package/dist/components/Toasts.tsx +162 -80
  232. package/dist/components/Togglebox.tsx +164 -62
  233. package/dist/components/Tooltips.tsx +27 -15
  234. package/dist/components/TreeMenu.tsx +95 -59
  235. package/dist/components/TreeSelect.tsx +297 -162
  236. package/dist/components/WithPaginationDocs.tsx +15 -16
  237. package/dist/components/WithSizeObserver.tsx +9 -9
  238. package/dist/components/tree-select/TreeSelect.tsx +126 -77
  239. package/dist/components/tree-select/example-1.tsx +8 -12
  240. package/dist/components/tree-select/example-2.tsx +2 -5
  241. package/dist/components/utilities/BorderRadiusUtilities.tsx +28 -13
  242. package/dist/components/utilities/BorderUtilities.tsx +31 -32
  243. package/dist/components/utilities/DisplayUtilities.tsx +4 -5
  244. package/dist/components/utilities/FlexAndGridUtilities.tsx +38 -38
  245. package/dist/components/utilities/ObjectFitUtilities.tsx +4 -6
  246. package/dist/components/utilities/ObjectPositionUtilities.tsx +3 -4
  247. package/dist/components/utilities/OpacityUtilities.tsx +4 -7
  248. package/dist/components/utilities/OverflowUtilities.tsx +4 -5
  249. package/dist/components/utilities/PositionUtilities.tsx +4 -5
  250. package/dist/components/utilities/ShadowUtilities.tsx +15 -16
  251. package/dist/components/utilities/SpacingUtilities.tsx +483 -178
  252. package/dist/components/utilities/TextUtilities.tsx +109 -60
  253. package/dist/design-patterns/Index.tsx +8 -11
  254. package/dist/design-patterns/ThreePaneLayoutPattern.tsx +92 -76
  255. package/dist/examples.bundle.css +1257 -1155
  256. package/dist/examples.bundle.js +7904 -7035
  257. package/dist/playgrounds/dummy-data/items.ts +9 -8
  258. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +559 -277
  259. package/dist/playgrounds/react-playgrounds/EditorTest.tsx +387 -204
  260. package/dist/playgrounds/react-playgrounds/FirstPlayground.tsx +74 -52
  261. package/dist/playgrounds/react-playgrounds/Index.tsx +11 -11
  262. package/dist/playgrounds/react-playgrounds/Multiedit.tsx +294 -218
  263. package/dist/playgrounds/react-playgrounds/PageLayoutTest.tsx +151 -105
  264. package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx +481 -261
  265. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +261 -149
  266. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +757 -395
  267. package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx +173 -91
  268. package/dist/playgrounds/react-playgrounds/TestGround.tsx +1364 -818
  269. package/dist/playgrounds/react-playgrounds/UiPlayground.tsx +178 -86
  270. package/dist/playgrounds/react-playgrounds/components/AuthoringContainer.tsx +6 -7
  271. package/dist/playgrounds/react-playgrounds/components/AuthoringContent.tsx +42 -42
  272. package/dist/playgrounds/react-playgrounds/components/ContentSplitter.tsx +5 -8
  273. package/dist/playgrounds/react-playgrounds/components/GraphicButton.tsx +11 -11
  274. package/dist/playgrounds/react-playgrounds/components/GraphicButtonsGroup.tsx +2 -6
  275. package/dist/playgrounds/react-playgrounds/components/HeaderPanel.tsx +1 -5
  276. package/dist/playgrounds/react-playgrounds/components/Index.tsx +19 -21
  277. package/dist/playgrounds/react-playgrounds/components/Layout.tsx +11 -17
  278. package/dist/playgrounds/react-playgrounds/components/LayoutContainer.tsx +1 -1
  279. package/dist/playgrounds/react-playgrounds/components/MainPanel.tsx +11 -12
  280. package/dist/playgrounds/react-playgrounds/components/OverlayPanel.tsx +3 -5
  281. package/dist/playgrounds/react-playgrounds/components/Panel.tsx +6 -7
  282. package/dist/playgrounds/react-playgrounds/components/PanelContent.tsx +1 -5
  283. package/dist/playgrounds/react-playgrounds/components/PanelContentBlock.tsx +1 -6
  284. package/dist/playgrounds/react-playgrounds/components/PanelHeader.tsx +3 -3
  285. package/dist/playgrounds/react-playgrounds/components/SearchBar.tsx +16 -12
  286. package/dist/playgrounds/react-playgrounds/components/SidebarMenu.tsx +23 -14
  287. package/dist/playgrounds/react-playgrounds/components/SubNav.tsx +1 -5
  288. package/dist/playgrounds/react-playgrounds/components/ThemeDropdown.tsx +14 -11
  289. package/dist/playgrounds/react-playgrounds/tsconfig.json +1 -1
  290. package/dist/superdesk-ui.bundle.css +25 -4
  291. package/dist/superdesk-ui.bundle.js +3072 -2903
  292. package/dist/vendor.bundle.js +18 -18
  293. package/examples/css/docs-page.css +1135 -1116
  294. package/examples/css/reset.css +124 -43
  295. package/examples/css/vendor.css +125 -125
  296. package/examples/index.js +138 -139
  297. package/examples/js/doc.js +41 -40
  298. package/examples/js/react.js +82 -48
  299. package/examples/pages/components/Alerts.tsx +171 -78
  300. package/examples/pages/components/Autocomplete.tsx +187 -78
  301. package/examples/pages/components/Avatar.tsx +52 -112
  302. package/examples/pages/components/Badges.tsx +111 -67
  303. package/examples/pages/components/BigIconFont.tsx +29 -17
  304. package/examples/pages/components/BoxedList.tsx +244 -114
  305. package/examples/pages/components/ButtonGroups.tsx +213 -147
  306. package/examples/pages/components/Buttons.tsx +409 -137
  307. package/examples/pages/components/Card.tsx +6 -7
  308. package/examples/pages/components/Carousel.tsx +126 -39
  309. package/examples/pages/components/Checkboxs.tsx +446 -105
  310. package/examples/pages/components/Container.tsx +95 -48
  311. package/examples/pages/components/ContentDivider.tsx +110 -63
  312. package/examples/pages/components/ContentList.tsx +577 -253
  313. package/examples/pages/components/CreateButton.tsx +71 -21
  314. package/examples/pages/components/DatePicker.tsx +102 -26
  315. package/examples/pages/components/DateTimePicker.tsx +49 -11
  316. package/examples/pages/components/DragHandleDocs.tsx +56 -26
  317. package/examples/pages/components/DropZone.tsx +67 -29
  318. package/examples/pages/components/Dropdowns.tsx +220 -131
  319. package/examples/pages/components/DurationInput.tsx +92 -32
  320. package/examples/pages/components/EmptyStates.tsx +61 -26
  321. package/examples/pages/components/GridItem.tsx +190 -91
  322. package/examples/pages/components/GridList.tsx +37 -17
  323. package/examples/pages/components/Heading.tsx +81 -35
  324. package/examples/pages/components/IconButtons.tsx +125 -32
  325. package/examples/pages/components/IconFont.tsx +24 -12
  326. package/examples/pages/components/IconLabels.tsx +146 -39
  327. package/examples/pages/components/IconPicker.tsx +30 -13
  328. package/examples/pages/components/IllustrationButton.tsx +40 -20
  329. package/examples/pages/components/Index.tsx +128 -114
  330. package/examples/pages/components/Inputs.tsx +153 -51
  331. package/examples/pages/components/Labels.tsx +191 -117
  332. package/examples/pages/components/LeftNavigations.tsx +327 -100
  333. package/examples/pages/components/ListItems.tsx +8 -9
  334. package/examples/pages/components/Loader.tsx +5 -4
  335. package/examples/pages/components/Menu.tsx +48 -26
  336. package/examples/pages/components/Modal.tsx +298 -104
  337. package/examples/pages/components/MultiSelect.tsx +189 -53
  338. package/examples/pages/components/NavButtons.tsx +86 -30
  339. package/examples/pages/components/Panel.tsx +367 -120
  340. package/examples/pages/components/Popover.tsx +37 -17
  341. package/examples/pages/components/QuickNavigationBar.tsx +222 -86
  342. package/examples/pages/components/RadioGroup.tsx +375 -137
  343. package/examples/pages/components/ResizablePanels.tsx +8 -14
  344. package/examples/pages/components/SelectGrid.tsx +79 -38
  345. package/examples/pages/components/SelectWithTemplate.tsx +23 -14
  346. package/examples/pages/components/Selects.tsx +94 -29
  347. package/examples/pages/components/SimpleList.tsx +91 -41
  348. package/examples/pages/components/SubNav.tsx +57 -37
  349. package/examples/pages/components/Switch.tsx +168 -42
  350. package/examples/pages/components/TableList.tsx +220 -66
  351. package/examples/pages/components/Tabs.tsx +149 -64
  352. package/examples/pages/components/TagInputDocs.tsx +73 -17
  353. package/examples/pages/components/Tags.tsx +104 -73
  354. package/examples/pages/components/Text.tsx +108 -58
  355. package/examples/pages/components/TimePicker.tsx +76 -22
  356. package/examples/pages/components/Toasts.tsx +162 -80
  357. package/examples/pages/components/Togglebox.tsx +164 -62
  358. package/examples/pages/components/Tooltips.tsx +27 -15
  359. package/examples/pages/components/TreeMenu.tsx +95 -59
  360. package/examples/pages/components/TreeSelect.tsx +297 -162
  361. package/examples/pages/components/WithPaginationDocs.tsx +15 -16
  362. package/examples/pages/components/WithSizeObserver.tsx +9 -9
  363. package/examples/pages/components/tree-select/TreeSelect.tsx +126 -77
  364. package/examples/pages/components/tree-select/example-1.tsx +8 -12
  365. package/examples/pages/components/tree-select/example-2.tsx +2 -5
  366. package/examples/pages/components/utilities/BorderRadiusUtilities.tsx +28 -13
  367. package/examples/pages/components/utilities/BorderUtilities.tsx +31 -32
  368. package/examples/pages/components/utilities/DisplayUtilities.tsx +4 -5
  369. package/examples/pages/components/utilities/FlexAndGridUtilities.tsx +38 -38
  370. package/examples/pages/components/utilities/ObjectFitUtilities.tsx +4 -6
  371. package/examples/pages/components/utilities/ObjectPositionUtilities.tsx +3 -4
  372. package/examples/pages/components/utilities/OpacityUtilities.tsx +4 -7
  373. package/examples/pages/components/utilities/OverflowUtilities.tsx +4 -5
  374. package/examples/pages/components/utilities/PositionUtilities.tsx +4 -5
  375. package/examples/pages/components/utilities/ShadowUtilities.tsx +15 -16
  376. package/examples/pages/components/utilities/SpacingUtilities.tsx +483 -178
  377. package/examples/pages/components/utilities/TextUtilities.tsx +109 -60
  378. package/examples/pages/design-patterns/Index.tsx +8 -11
  379. package/examples/pages/design-patterns/ThreePaneLayoutPattern.tsx +92 -76
  380. package/examples/pages/playgrounds/dummy-data/items.ts +9 -8
  381. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +559 -277
  382. package/examples/pages/playgrounds/react-playgrounds/EditorTest.tsx +387 -204
  383. package/examples/pages/playgrounds/react-playgrounds/FirstPlayground.tsx +74 -52
  384. package/examples/pages/playgrounds/react-playgrounds/Index.tsx +11 -11
  385. package/examples/pages/playgrounds/react-playgrounds/Multiedit.tsx +294 -218
  386. package/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.tsx +151 -105
  387. package/examples/pages/playgrounds/react-playgrounds/PersonalProfile.tsx +481 -261
  388. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +261 -149
  389. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +757 -395
  390. package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx +173 -91
  391. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +1364 -818
  392. package/examples/pages/playgrounds/react-playgrounds/UiPlayground.tsx +178 -86
  393. package/examples/pages/playgrounds/react-playgrounds/components/AuthoringContainer.tsx +6 -7
  394. package/examples/pages/playgrounds/react-playgrounds/components/AuthoringContent.tsx +42 -42
  395. package/examples/pages/playgrounds/react-playgrounds/components/ContentSplitter.tsx +5 -8
  396. package/examples/pages/playgrounds/react-playgrounds/components/GraphicButton.tsx +11 -11
  397. package/examples/pages/playgrounds/react-playgrounds/components/GraphicButtonsGroup.tsx +2 -6
  398. package/examples/pages/playgrounds/react-playgrounds/components/HeaderPanel.tsx +1 -5
  399. package/examples/pages/playgrounds/react-playgrounds/components/Index.tsx +19 -21
  400. package/examples/pages/playgrounds/react-playgrounds/components/Layout.tsx +11 -17
  401. package/examples/pages/playgrounds/react-playgrounds/components/LayoutContainer.tsx +1 -1
  402. package/examples/pages/playgrounds/react-playgrounds/components/MainPanel.tsx +11 -12
  403. package/examples/pages/playgrounds/react-playgrounds/components/OverlayPanel.tsx +3 -5
  404. package/examples/pages/playgrounds/react-playgrounds/components/Panel.tsx +6 -7
  405. package/examples/pages/playgrounds/react-playgrounds/components/PanelContent.tsx +1 -5
  406. package/examples/pages/playgrounds/react-playgrounds/components/PanelContentBlock.tsx +1 -6
  407. package/examples/pages/playgrounds/react-playgrounds/components/PanelHeader.tsx +3 -3
  408. package/examples/pages/playgrounds/react-playgrounds/components/SearchBar.tsx +16 -12
  409. package/examples/pages/playgrounds/react-playgrounds/components/SidebarMenu.tsx +23 -14
  410. package/examples/pages/playgrounds/react-playgrounds/components/SubNav.tsx +1 -5
  411. package/examples/pages/playgrounds/react-playgrounds/components/ThemeDropdown.tsx +14 -11
  412. package/examples/pages/playgrounds/react-playgrounds/tsconfig.json +1 -1
  413. package/globals.d.ts +1 -1
  414. package/mocha-setup.ts +3 -3
  415. package/package.json +119 -117
  416. package/react/components/Alert.js +6 -9
  417. package/react/components/Autocomplete.js +15 -23
  418. package/react/components/Badge.js +1 -1
  419. package/react/components/Button.js +4 -6
  420. package/react/components/ButtonGroup.js +1 -1
  421. package/react/components/Carousel.js +3 -3
  422. package/react/components/CheckButtonGroup.js +3 -6
  423. package/react/components/CheckboxButton.js +2 -4
  424. package/react/components/ContentDivider.js +1 -1
  425. package/react/components/DatePicker.js +29 -26
  426. package/react/components/DateTimePicker.d.ts +8 -4
  427. package/react/components/DateTimePicker.js +6 -8
  428. package/react/components/Divider.js +1 -1
  429. package/react/components/DonutChart.js +1 -1
  430. package/react/components/DragHandle.js +1 -1
  431. package/react/components/DragHandleDots.js +1 -1
  432. package/react/components/DropZone.js +6 -8
  433. package/react/components/Dropdown.d.ts +1 -1
  434. package/react/components/Dropdown.js +34 -38
  435. package/react/components/DropdownFirst.d.ts +11 -11
  436. package/react/components/DropdownFirst.js +20 -24
  437. package/react/components/DurationInput.js +37 -34
  438. package/react/components/EmptyState.js +5 -5
  439. package/react/components/Form/FormGroup.js +1 -1
  440. package/react/components/Form/FormItem.js +1 -1
  441. package/react/components/Form/FormRow.js +1 -1
  442. package/react/components/Form/FormRowNew.js +3 -3
  443. package/react/components/Form/FormText.js +1 -1
  444. package/react/components/Form/InputNew.js +3 -3
  445. package/react/components/Form/InputWrapper.js +7 -10
  446. package/react/components/GridItem.d.ts +1 -1
  447. package/react/components/GridItem.js +16 -16
  448. package/react/components/GridList.js +1 -1
  449. package/react/components/HeadingText.js +4 -5
  450. package/react/components/IconLabel.js +3 -5
  451. package/react/components/IconPicker.d.ts +1 -1
  452. package/react/components/IconPicker.js +111 -104
  453. package/react/components/IllustrationButton.js +1 -1
  454. package/react/components/Input.js +1 -1
  455. package/react/components/Layouts/AuthorinInnerSideBar.js +1 -1
  456. package/react/components/Layouts/AuthoringContainer.js +1 -1
  457. package/react/components/Layouts/AuthoringFrame.js +4 -4
  458. package/react/components/Layouts/AuthoringFrameContainer.js +1 -1
  459. package/react/components/Layouts/AuthoringFrameLeftBar.js +1 -1
  460. package/react/components/Layouts/AuthoringFrameMain.js +1 -1
  461. package/react/components/Layouts/AuthoringFrameNavBar.js +1 -1
  462. package/react/components/Layouts/AuthoringFrameOverlay.js +1 -1
  463. package/react/components/Layouts/AuthoringFrameRightBar.js +1 -1
  464. package/react/components/Layouts/AuthoringFrameSidePanel.js +1 -1
  465. package/react/components/Layouts/AuthoringFrameSidePanelOverlay.js +1 -1
  466. package/react/components/Layouts/AuthoringMainContainer.js +1 -1
  467. package/react/components/Layouts/AuthoringMainContent.js +1 -1
  468. package/react/components/Layouts/AuthoringMainToolBar.js +1 -1
  469. package/react/components/Layouts/BottomBarAction.js +2 -2
  470. package/react/components/Layouts/ContentSplitter.js +1 -1
  471. package/react/components/Layouts/CoreLayout.js +2 -2
  472. package/react/components/Layouts/CoreLayoutContainer.js +1 -1
  473. package/react/components/Layouts/CoreLayoutFooter.js +1 -1
  474. package/react/components/Layouts/CoreLayoutOverlay.js +1 -1
  475. package/react/components/Layouts/CoreLayoutSlideInMenu.js +2 -2
  476. package/react/components/Layouts/CoreLayoutTopMenu.js +3 -3
  477. package/react/components/Layouts/HamburgerButton.js +1 -1
  478. package/react/components/Layouts/HeaderPanel.js +1 -1
  479. package/react/components/Layouts/Layout.d.ts +1 -1
  480. package/react/components/Layouts/Layout.js +9 -9
  481. package/react/components/Layouts/LayoutContainer.js +1 -1
  482. package/react/components/Layouts/LeftPanel.js +1 -1
  483. package/react/components/Layouts/MainMenu.js +8 -10
  484. package/react/components/Layouts/MainPanel.js +1 -1
  485. package/react/components/Layouts/NotificationPanel.d.ts +1 -1
  486. package/react/components/Layouts/NotificationPanel.js +7 -7
  487. package/react/components/Layouts/OverlayPanel.js +3 -3
  488. package/react/components/Layouts/PageLayout.js +2 -2
  489. package/react/components/Layouts/Panel.d.ts +1 -1
  490. package/react/components/Layouts/Panel.js +12 -18
  491. package/react/components/LeftMenu.d.ts +3 -3
  492. package/react/components/LeftMenu.js +11 -13
  493. package/react/components/Lists/BoxedList.js +6 -6
  494. package/react/components/Lists/CalendarWeekDayItem.js +2 -2
  495. package/react/components/Lists/ContentList.js +24 -26
  496. package/react/components/Lists/TableList.d.ts +1 -1
  497. package/react/components/Lists/TableList.js +59 -79
  498. package/react/components/Loader.js +1 -1
  499. package/react/components/Menu.js +1 -1
  500. package/react/components/Modal.d.ts +1 -1
  501. package/react/components/MultiSelect.d.ts +1 -1
  502. package/react/components/MultiSelect.js +2 -2
  503. package/react/components/NavButton.js +2 -4
  504. package/react/components/Navigation/BottomNav.js +9 -8
  505. package/react/components/Navigation/QuickNavBar.js +17 -20
  506. package/react/components/Navigation/SideBarMenu.js +11 -9
  507. package/react/components/Navigation/SideBarTabs.js +9 -8
  508. package/react/components/Popover.js +1 -1
  509. package/react/components/RadioButtonGroup.js +15 -23
  510. package/react/components/ResizablePanels.js +1 -3
  511. package/react/components/ResizeObserverComponent.js +1 -3
  512. package/react/components/SearchBar.js +14 -16
  513. package/react/components/Select.js +3 -3
  514. package/react/components/SelectGrid.js +15 -20
  515. package/react/components/SelectPreview.js +13 -13
  516. package/react/components/SelectWithTemplate.js +3 -5
  517. package/react/components/ShowPopup.d.ts +1 -0
  518. package/react/components/ShowPopup.js +7 -10
  519. package/react/components/Skeleton.js +1 -1
  520. package/react/components/SlidingToolbar.js +1 -1
  521. package/react/components/Spinner.js +1 -1
  522. package/react/components/StrechBar.js +1 -1
  523. package/react/components/SubNav.js +1 -1
  524. package/react/components/Switch.js +4 -6
  525. package/react/components/SwitchGroup.js +1 -1
  526. package/react/components/TabCustom.js +6 -4
  527. package/react/components/TabList.js +4 -8
  528. package/react/components/Tag.js +13 -17
  529. package/react/components/TagInput.js +1 -1
  530. package/react/components/Text/Heading.js +6 -6
  531. package/react/components/ThemeSelector.js +1 -1
  532. package/react/components/TimePicker.d.ts +9 -2
  533. package/react/components/TimePicker.js +29 -4
  534. package/react/components/TimePickerPopover.d.ts +19 -0
  535. package/react/components/TimePickerPopover.js +225 -0
  536. package/react/components/TimePickerV2.js +17 -17
  537. package/react/components/Toast.js +3 -3
  538. package/react/components/ToastMessage.d.ts +1 -1
  539. package/react/components/ToastMessage.js +1 -1
  540. package/react/components/ToastText.js +5 -8
  541. package/react/components/ToastWrapper.js +3 -5
  542. package/react/components/ToggleBox/CustomHeaderToggleBox.d.ts +1 -1
  543. package/react/components/ToggleBox/CustomHeaderToggleBox.js +7 -7
  544. package/react/components/ToggleBox/SimpleToggleBox.d.ts +1 -1
  545. package/react/components/ToggleBox/SimpleToggleBox.js +5 -5
  546. package/react/components/ToggleBox/index.js +3 -3
  547. package/react/components/TreeMenu.d.ts +1 -1
  548. package/react/components/TreeMenu.js +38 -44
  549. package/react/components/TreeSelect/TreeSelect.d.ts +2 -2
  550. package/react/components/TreeSelect/TreeSelect.js +105 -127
  551. package/react/components/TreeSelect/TreeSelectItem.d.ts +1 -1
  552. package/react/components/TreeSelect/TreeSelectItem.js +10 -13
  553. package/react/components/TreeSelect/TreeSelectPill.d.ts +1 -1
  554. package/react/components/TreeSelect/TreeSelectPill.js +8 -9
  555. package/react/components/WithPagination.js +18 -21
  556. package/react/components/WithPortal.d.ts +1 -1
  557. package/react/components/WithPortal.js +2 -1
  558. package/react/components/WithSizeObserver.js +1 -3
  559. package/react/components/_Positioner.js +11 -11
  560. package/react/components/avatar/avatar-action-add.js +1 -1
  561. package/react/components/avatar/avatar-group.js +11 -14
  562. package/react/components/avatar/avatar-image.js +6 -4
  563. package/react/components/avatar/avatar-placeholder.js +1 -1
  564. package/react/components/avatar/avatar-wrapper.js +2 -4
  565. package/react/components/avatar/avatar.js +4 -3
  566. package/react/helpers.js +2 -2
  567. package/react/index.d.ts +1 -1
  568. package/react/utils/time.d.ts +5 -0
  569. package/react/utils/time.js +36 -0
  570. package/tasks/webpack.dev.js +1 -1
  571. package/tasks/webpack.js +5 -5
  572. package/tasks/webpack.prod.js +1 -5
  573. package/tsconfig.json +2 -5
  574. package/tslint.json +6 -12
  575. package/webpack.config.js +2 -5
@@ -1,12 +1,9 @@
1
1
  import * as React from 'react';
2
2
 
3
- import { ReactNav, ReactDefault } from '../../js/react';
4
- import { ButtonGroup, Button, NavButton, Dropdown, IllustrationButton } from '../../../app-typescript/index';
3
+ import {ReactNav, ReactDefault} from '../../js/react';
4
+ import {ButtonGroup, Button, NavButton, Dropdown, IllustrationButton} from '../../../app-typescript/index';
5
5
 
6
- import {
7
- Switch,
8
- Route,
9
- } from "react-router-dom";
6
+ import {Switch, Route} from 'react-router-dom';
10
7
 
11
8
  import InputsDoc from './Inputs';
12
9
  import AutocompleteDoc from './Autocomplete';
@@ -46,13 +43,13 @@ import ToggleboxDocs from './Togglebox';
46
43
  import ListItemsDoc from './ListItems';
47
44
  import PanelDoc from './Panel';
48
45
  import SelectGridDocs from './SelectGrid';
49
- import IconPickerDocs from "./IconPicker";
50
- import SimpleListDoc from "./SimpleList";
51
- import BoxedListDoc from "./BoxedList";
52
- import TableListDoc from "./TableList";
53
- import ContentListDoc from "./ContentList";
54
- import HeadingDoc from "./Heading";
55
- import TextDoc from "./Text";
46
+ import IconPickerDocs from './IconPicker';
47
+ import SimpleListDoc from './SimpleList';
48
+ import BoxedListDoc from './BoxedList';
49
+ import TableListDoc from './TableList';
50
+ import ContentListDoc from './ContentList';
51
+ import HeadingDoc from './Heading';
52
+ import TextDoc from './Text';
56
53
  import ContainerDoc from './Container';
57
54
  import DropZoneDoc from './DropZone';
58
55
  import CreateButtonDoc from './CreateButton';
@@ -60,35 +57,34 @@ import TagInputDocs from './TagInputDocs';
60
57
  import DragHandleDocs from './DragHandleDocs';
61
58
 
62
59
  import * as Playgrounds from '../playgrounds/react-playgrounds/Index';
63
- import { SelectWithTemplateDocs } from './SelectWithTemplate';
64
- import { MultiselectDocs } from './MultiSelect';
65
- import { TreeSelectDocs } from './TreeSelect';
66
- import { TreeMenuDocs } from './TreeMenu';
60
+ import {SelectWithTemplateDocs} from './SelectWithTemplate';
61
+ import {MultiselectDocs} from './MultiSelect';
62
+ import {TreeSelectDocs} from './TreeSelect';
63
+ import {TreeMenuDocs} from './TreeMenu';
67
64
  import DurationInputDoc from './DurationInput';
68
- import { WithPaginationDocs } from './WithPaginationDocs';
69
- import { PopoverDoc } from './Popover';
70
- import { MenuDocs } from './Menu';
71
- import { WithSizeObserverDocs } from './WithSizeObserver';
72
- import { ResizablePanelsDoc } from './ResizablePanels';
73
- import { IllustrationButtonDoc } from './IllustrationButton';
65
+ import {WithPaginationDocs} from './WithPaginationDocs';
66
+ import {PopoverDoc} from './Popover';
67
+ import {MenuDocs} from './Menu';
68
+ import {WithSizeObserverDocs} from './WithSizeObserver';
69
+ import {ResizablePanelsDoc} from './ResizablePanels';
70
+ import {IllustrationButtonDoc} from './IllustrationButton';
74
71
 
75
72
  // Utilities
76
- import { SpacingUtilitiesDoc } from './utilities/SpacingUtilities';
77
- import { TextUtilitiesDoc } from './utilities/TextUtilities';
78
- import { ShadowUtilitiesDoc } from './utilities/ShadowUtilities';
79
- import { PositionUtilitiesDoc } from './utilities/PositionUtilities';
80
- import { OverflowUtilitiesDoc } from './utilities/OverflowUtilities';
81
- import { DisplayUtilitiesDoc } from './utilities/DisplayUtilities';
82
- import { FlexAndGridUtilitiesDoc } from './utilities/FlexAndGridUtilities';
83
- import { BorderRadiusUtilitiesDoc } from './utilities/BorderRadiusUtilities';
84
- import { BorderUtilitiesDoc } from './utilities/BorderUtilities';
85
- import { OpacityUtilitiesDoc } from './utilities/OpacityUtilities';
86
- import { ObjectFitUtilitiesDoc } from './utilities/ObjectFitUtilities';
87
- import { ObjectPositionUtilitiesDoc } from './utilities/ObjectPositionUtilities';
73
+ import {SpacingUtilitiesDoc} from './utilities/SpacingUtilities';
74
+ import {TextUtilitiesDoc} from './utilities/TextUtilities';
75
+ import {ShadowUtilitiesDoc} from './utilities/ShadowUtilities';
76
+ import {PositionUtilitiesDoc} from './utilities/PositionUtilities';
77
+ import {OverflowUtilitiesDoc} from './utilities/OverflowUtilities';
78
+ import {DisplayUtilitiesDoc} from './utilities/DisplayUtilities';
79
+ import {FlexAndGridUtilitiesDoc} from './utilities/FlexAndGridUtilities';
80
+ import {BorderRadiusUtilitiesDoc} from './utilities/BorderRadiusUtilities';
81
+ import {BorderUtilitiesDoc} from './utilities/BorderUtilities';
82
+ import {OpacityUtilitiesDoc} from './utilities/OpacityUtilities';
83
+ import {ObjectFitUtilitiesDoc} from './utilities/ObjectFitUtilities';
84
+ import {ObjectPositionUtilitiesDoc} from './utilities/ObjectPositionUtilities';
88
85
  import LoaderDoc from './Loader';
89
86
  import CardDoc from './Card';
90
87
 
91
-
92
88
  interface IPages {
93
89
  [group: string]: {
94
90
  name: string;
@@ -96,7 +92,7 @@ interface IPages {
96
92
  [urlId: string]: {
97
93
  name: string;
98
94
  component: React.ComponentType<any>;
99
- }
95
+ };
100
96
  };
101
97
  };
102
98
  }
@@ -105,11 +101,11 @@ const pages: IPages = {
105
101
  basicComponents: {
106
102
  name: 'Basic Components',
107
103
  items: {
108
- 'card': {
104
+ card: {
109
105
  name: 'Card',
110
106
  component: CardDoc,
111
107
  },
112
- 'buttons': {
108
+ buttons: {
113
109
  name: 'Buttons',
114
110
  component: ButtonsDoc,
115
111
  },
@@ -121,7 +117,7 @@ const pages: IPages = {
121
117
  name: 'Button Group & Divider',
122
118
  component: ButtonGroupsDoc,
123
119
  },
124
- 'labels': {
120
+ labels: {
125
121
  name: 'Labels',
126
122
  component: LabelsDoc,
127
123
  },
@@ -129,27 +125,27 @@ const pages: IPages = {
129
125
  name: 'Icon Labels',
130
126
  component: IconLabelDoc,
131
127
  },
132
- 'badges': {
128
+ badges: {
133
129
  name: 'Badges',
134
130
  component: BadgesDoc,
135
131
  },
136
- 'alerts': {
132
+ alerts: {
137
133
  name: 'Alerts',
138
134
  component: AlertDoc,
139
135
  },
140
- 'avatar': {
136
+ avatar: {
141
137
  name: 'Avatar',
142
138
  component: AvatarDoc,
143
139
  },
144
- 'tooltips': {
140
+ tooltips: {
145
141
  name: 'Tooltips',
146
142
  component: TooltipDoc,
147
143
  },
148
- 'tags': {
144
+ tags: {
149
145
  name: 'Tags',
150
146
  component: TagDoc,
151
147
  },
152
- 'dropdowns': {
148
+ dropdowns: {
153
149
  name: 'Dropdowns',
154
150
  component: DropdownDoc,
155
151
  },
@@ -157,48 +153,48 @@ const pages: IPages = {
157
153
  name: 'Nav buttons',
158
154
  component: NavButtonsDoc,
159
155
  },
160
- 'toast': {
156
+ toast: {
161
157
  name: 'Toasts',
162
158
  component: ToastsDoc,
163
159
  },
164
- 'popover': {
160
+ popover: {
165
161
  name: 'Popover',
166
162
  component: PopoverDoc,
167
163
  },
168
- 'modal': {
164
+ modal: {
169
165
  name: 'Modal',
170
166
  component: ModalDoc,
171
167
  },
172
- 'carousel': {
168
+ carousel: {
173
169
  name: 'Carousel',
174
170
  component: CarouselDoc,
175
171
  },
176
- 'menu': {
172
+ menu: {
177
173
  name: 'Menu',
178
174
  component: MenuDocs,
179
175
  },
180
- 'treemenu': {
176
+ treemenu: {
181
177
  name: 'TreeMenu',
182
178
  component: TreeMenuDocs,
183
179
  },
184
- "drag-handle": {
180
+ 'drag-handle': {
185
181
  name: 'Drag handle',
186
182
  component: DragHandleDocs,
187
183
  },
188
- "illustration-button": {
184
+ 'illustration-button': {
189
185
  name: 'Illustration Button',
190
186
  component: IllustrationButtonDoc,
191
187
  },
192
- "loader": {
188
+ loader: {
193
189
  name: 'Loader',
194
190
  component: LoaderDoc,
195
191
  },
196
- }
192
+ },
197
193
  },
198
194
  navigationComponents: {
199
- name: "Navigation",
195
+ name: 'Navigation',
200
196
  items: {
201
- 'tab': {
197
+ tab: {
202
198
  name: 'Tabs',
203
199
  component: TabsDoc,
204
200
  },
@@ -214,12 +210,12 @@ const pages: IPages = {
214
210
  name: 'Sub navigation bar',
215
211
  component: SubNavDoc,
216
212
  },
217
- }
213
+ },
218
214
  },
219
215
  containerComponents: {
220
- name: "Containers",
216
+ name: 'Containers',
221
217
  items: {
222
- 'container': {
218
+ container: {
223
219
  name: 'Container component',
224
220
  component: ContainerDoc,
225
221
  },
@@ -231,44 +227,44 @@ const pages: IPages = {
231
227
  name: 'Grid Item',
232
228
  component: GridItemDoc,
233
229
  },
234
- 'panel': {
230
+ panel: {
235
231
  name: 'Panel',
236
232
  component: PanelDoc,
237
233
  },
238
- }
234
+ },
239
235
  },
240
236
  layoutComponents: {
241
- name: "Layout",
237
+ name: 'Layout',
242
238
  items: {
243
239
  'content-divider': {
244
240
  name: 'Content Divider',
245
241
  component: ContentDividerDoc,
246
242
  },
247
- "togglebox": {
248
- name: "Togglebox",
243
+ togglebox: {
244
+ name: 'Togglebox',
249
245
  component: ToggleboxDocs,
250
246
  },
251
- "resizable-panels": {
252
- name: "Resizable panels",
247
+ 'resizable-panels': {
248
+ name: 'Resizable panels',
253
249
  component: ResizablePanelsDoc,
254
250
  },
255
- }
251
+ },
256
252
  },
257
253
  textComponents: {
258
- name: "Text",
254
+ name: 'Text',
259
255
  items: {
260
- 'heading': {
256
+ heading: {
261
257
  name: 'Heading component',
262
258
  component: HeadingDoc,
263
259
  },
264
- 'text': {
260
+ text: {
265
261
  name: 'Text component',
266
262
  component: TextDoc,
267
263
  },
268
- }
264
+ },
269
265
  },
270
266
  listComponents: {
271
- name: "Lists",
267
+ name: 'Lists',
272
268
  items: {
273
269
  'grid-list': {
274
270
  name: 'Grid List',
@@ -298,16 +294,16 @@ const pages: IPages = {
298
294
  name: 'With pagination',
299
295
  component: WithPaginationDocs,
300
296
  },
301
- }
297
+ },
302
298
  },
303
299
  formComponents: {
304
- name: "Form Components",
300
+ name: 'Form Components',
305
301
  items: {
306
- 'inputs': {
302
+ inputs: {
307
303
  name: 'Inputs',
308
304
  component: InputsDoc,
309
305
  },
310
- 'autocomplete': {
306
+ autocomplete: {
311
307
  name: 'Autocomplete',
312
308
  component: AutocompleteDoc,
313
309
  },
@@ -315,7 +311,7 @@ const pages: IPages = {
315
311
  name: 'Tag Input',
316
312
  component: TagInputDocs,
317
313
  },
318
- 'select': {
314
+ select: {
319
315
  name: 'Select',
320
316
  component: SelectsDoc,
321
317
  },
@@ -331,11 +327,11 @@ const pages: IPages = {
331
327
  name: 'With size observer',
332
328
  component: WithSizeObserverDocs,
333
329
  },
334
- 'multiselect': {
330
+ multiselect: {
335
331
  name: 'MultiSelect',
336
332
  component: MultiselectDocs,
337
333
  },
338
- 'treeselect': {
334
+ treeselect: {
339
335
  name: 'TreeSelect',
340
336
  component: TreeSelectDocs,
341
337
  },
@@ -359,19 +355,19 @@ const pages: IPages = {
359
355
  name: 'Duration Input',
360
356
  component: DurationInputDoc,
361
357
  },
362
- 'switch': {
358
+ switch: {
363
359
  name: 'Switch',
364
360
  component: SwitchDoc,
365
361
  },
366
- 'radiogroup': {
362
+ radiogroup: {
367
363
  name: 'RadioGroup',
368
364
  component: RadioGroupDoc,
369
365
  },
370
- 'checkbox': {
366
+ checkbox: {
371
367
  name: 'Checkbox',
372
368
  component: CheckboxsDoc,
373
369
  },
374
- 'dropzone': {
370
+ dropzone: {
375
371
  name: 'DropZone',
376
372
  component: DropZoneDoc,
377
373
  },
@@ -379,10 +375,10 @@ const pages: IPages = {
379
375
  name: 'CreateButton',
380
376
  component: CreateButtonDoc,
381
377
  },
382
- }
378
+ },
383
379
  },
384
380
  generalComponents: {
385
- name: "General",
381
+ name: 'General',
386
382
  items: {
387
383
  'icon-font': {
388
384
  name: 'Icon font',
@@ -391,11 +387,11 @@ const pages: IPages = {
391
387
  'big-icon-font': {
392
388
  name: 'Big icon font',
393
389
  component: BigIconFontDoc,
394
- }
395
- }
390
+ },
391
+ },
396
392
  },
397
393
  utilityClasses: {
398
- name: "Utility classes",
394
+ name: 'Utility classes',
399
395
  items: {
400
396
  'border-utilities': {
401
397
  name: 'Border',
@@ -445,9 +441,9 @@ const pages: IPages = {
445
441
  name: 'Text',
446
442
  component: TextUtilitiesDoc,
447
443
  },
448
- }
449
- }
450
- }
444
+ },
445
+ },
446
+ };
451
447
 
452
448
  const routes: Array<{path: string; component: React.ComponentType<any>}> = [];
453
449
 
@@ -464,15 +460,15 @@ class ReactDoc extends React.Component {
464
460
  <ReactNav pages={pages} />
465
461
  <main className="docs-page__content docs-page__container-fluid">
466
462
  <Switch>
467
- {
468
- routes.map((route) => <Route key={route.path} path={route.path} component={route.component} />)
469
- }
463
+ {routes.map((route) => (
464
+ <Route key={route.path} path={route.path} component={route.component} />
465
+ ))}
470
466
 
471
467
  <Route path="/" component={ReactDefault} />
472
468
  </Switch>
473
469
  </main>
474
470
  </React.Fragment>
475
- )
471
+ );
476
472
  }
477
473
  }
478
474
 
@@ -484,9 +480,12 @@ class ReactPlayground extends React.Component<IProps> {
484
480
  render() {
485
481
  return (
486
482
  <Switch>
487
- <Route path="/playgrounds/react/:id" render={(props) => parsePlayground(props, this.props.playgrounds)} />
483
+ <Route
484
+ path="/playgrounds/react/:id"
485
+ render={(props) => parsePlayground(props, this.props.playgrounds)}
486
+ />
488
487
  </Switch>
489
- )
488
+ );
490
489
  }
491
490
  }
492
491
 
@@ -501,7 +500,7 @@ class ReactThemePicker extends React.Component<IProps, IState> {
501
500
  super(props);
502
501
  this.state = {
503
502
  theme: 'light-ui',
504
- }
503
+ };
505
504
  this.handleTheme = this.handleTheme.bind(this);
506
505
  }
507
506
 
@@ -509,8 +508,8 @@ class ReactThemePicker extends React.Component<IProps, IState> {
509
508
  document.body.setAttribute('data-theme', newTheme);
510
509
 
511
510
  this.setState({
512
- theme: newTheme
513
- })
511
+ theme: newTheme,
512
+ });
514
513
  }
515
514
 
516
515
  checkTheme(theme: string) {
@@ -522,14 +521,32 @@ class ReactThemePicker extends React.Component<IProps, IState> {
522
521
  <Dropdown
523
522
  items={[
524
523
  {
525
- type: 'group', label: 'Chose a theme', items: [
524
+ type: 'group',
525
+ label: 'Chose a theme',
526
+ items: [
526
527
  'divider',
527
- { label: 'Light', icon: 'adjust', active: this.checkTheme('light-ui'), onSelect: () => this.handleTheme('light-ui') },
528
- { label: 'Dark', icon: 'adjust', active: this.checkTheme('dark-ui'), onSelect: () => this.handleTheme('dark-ui') },
529
- { label: 'Accessible Light', active: this.checkTheme('accessible-light-ui'), icon: 'adjust', onSelect: () => this.handleTheme('accessible-light-ui') },
530
- ]
528
+ {
529
+ label: 'Light',
530
+ icon: 'adjust',
531
+ active: this.checkTheme('light-ui'),
532
+ onSelect: () => this.handleTheme('light-ui'),
533
+ },
534
+ {
535
+ label: 'Dark',
536
+ icon: 'adjust',
537
+ active: this.checkTheme('dark-ui'),
538
+ onSelect: () => this.handleTheme('dark-ui'),
539
+ },
540
+ {
541
+ label: 'Accessible Light',
542
+ active: this.checkTheme('accessible-light-ui'),
543
+ icon: 'adjust',
544
+ onSelect: () => this.handleTheme('accessible-light-ui'),
545
+ },
546
+ ],
531
547
  },
532
- ]}>
548
+ ]}
549
+ >
533
550
  <button className="docs-page__header-button" aria-label="Change theme" onClick={() => false}>
534
551
  <i className="icon-adjust"></i>
535
552
  </button>
@@ -538,12 +555,9 @@ class ReactThemePicker extends React.Component<IProps, IState> {
538
555
  }
539
556
  }
540
557
 
541
- const parsePlayground = ({ match }, playgrounds) => {
558
+ const parsePlayground = ({match}, playgrounds) => {
542
559
  const Component = Playgrounds[playgrounds[match.params.id].component];
543
- return (
544
- <Component />
545
- );
560
+ return <Component />;
546
561
  };
547
562
 
548
- export { ReactDoc, ReactPlayground, ReactThemePicker };
549
-
563
+ export {ReactDoc, ReactPlayground, ReactThemePicker};