superdesk-ui-framework 3.0.1-beta.1 → 3.0.1-beta.4

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 (472) hide show
  1. package/.vscode/settings.json +5 -0
  2. package/app/fonts/sd_big-icons.eot +0 -0
  3. package/app/fonts/sd_big-icons.svg +55 -53
  4. package/app/fonts/sd_big-icons.ttf +0 -0
  5. package/app/fonts/sd_big-icons.woff +0 -0
  6. package/app/fonts/sd_icons.eot +0 -0
  7. package/app/fonts/sd_icons.svg +1 -0
  8. package/app/fonts/sd_icons.ttf +0 -0
  9. package/app/fonts/sd_icons.woff +0 -0
  10. package/app/img/SD-logo.svg +52 -0
  11. package/app/img/dots.svg +3 -0
  12. package/app/styles/_accessibility.scss +4 -3
  13. package/app/styles/_big-icon-font.scss +63 -23
  14. package/app/styles/_boxed-list.scss +29 -3
  15. package/app/styles/_buttons.scss +4 -0
  16. package/app/styles/_hamburger.scss +160 -0
  17. package/app/styles/_helpers.scss +15 -7
  18. package/app/styles/_icon-font.scss +344 -307
  19. package/app/styles/_icon-labels.scss +66 -10
  20. package/app/styles/_sd-tag-input.scss +201 -296
  21. package/app/styles/_table-list.scss +244 -0
  22. package/app/styles/app.scss +4 -0
  23. package/app/styles/components/_list-item.scss +37 -21
  24. package/app/styles/components/_sd-dropzone.scss +52 -16
  25. package/app/styles/components/_sd-notification-panel.scss +48 -0
  26. package/app/styles/components/_sd-photo-preview.scss +1 -1
  27. package/app/styles/components/_subnav.scss +87 -80
  28. package/app/styles/design-tokens/_design-tokens-general.scss +9 -5
  29. package/app/styles/design-tokens/_new-colors.scss +10 -3
  30. package/app/styles/form-elements/_forms-general.scss +22 -7
  31. package/app/styles/form-elements/_inputs.scss +360 -62
  32. package/app/styles/grids/_grid-layout.scss +139 -45
  33. package/app/styles/layout/_container.scss +3 -0
  34. package/app/styles/layout/_editor.scss +108 -16
  35. package/app/styles/menus/_sd-bottom-tabs.scss +70 -0
  36. package/app/styles/menus/_sd-left-navigation.scss +24 -1
  37. package/app/styles/menus/_sd-sidebar-menu.scss +16 -14
  38. package/app/styles/menus/_sd-top-menu.scss +19 -5
  39. package/app/styles/primereact/_pr-dialog.scss +39 -7
  40. package/app/styles/primereact/_pr-dropdown.scss +0 -2
  41. package/app-typescript/components/Badge.tsx +3 -2
  42. package/app-typescript/components/CreateButton.tsx +38 -0
  43. package/app-typescript/components/DatePicker.tsx +71 -36
  44. package/app-typescript/components/DonutChart.tsx +1 -1
  45. package/app-typescript/components/DropZone.tsx +4 -4
  46. package/app-typescript/components/DurationInput.tsx +306 -0
  47. package/app-typescript/components/Form/InputBase.tsx +85 -0
  48. package/app-typescript/components/Form/InputNew.tsx +105 -0
  49. package/app-typescript/components/Form/InputWrapper.tsx +79 -0
  50. package/app-typescript/components/Form/index.tsx +3 -0
  51. package/app-typescript/components/Icon.tsx +4 -2
  52. package/app-typescript/components/IconButton.tsx +5 -1
  53. package/app-typescript/components/IconLabel.tsx +8 -1
  54. package/app-typescript/components/Input.tsx +40 -41
  55. package/app-typescript/components/Label.tsx +49 -10
  56. package/app-typescript/components/Layouts/AuthoringContainer.tsx +27 -0
  57. package/app-typescript/components/Layouts/AuthoringInnerHeader.tsx +2 -0
  58. package/app-typescript/components/Layouts/AuthoringMain.tsx +11 -7
  59. package/app-typescript/components/Layouts/AuthoringMainToolBar.tsx +7 -1
  60. package/app-typescript/components/Layouts/BottomBarAction.tsx +35 -0
  61. package/app-typescript/components/Layouts/Container.tsx +1 -1
  62. package/app-typescript/components/Layouts/ContentSplitter.tsx +23 -0
  63. package/app-typescript/components/Layouts/CoreLayout.tsx +62 -0
  64. package/app-typescript/components/Layouts/CoreLayoutContainer.tsx +16 -0
  65. package/app-typescript/components/Layouts/CoreLayoutFooter.tsx +15 -0
  66. package/app-typescript/components/Layouts/CoreLayoutMain.tsx +16 -0
  67. package/app-typescript/components/Layouts/CoreLayoutOverlay.tsx +15 -0
  68. package/app-typescript/components/Layouts/CoreLayoutSlideInMenu.tsx +24 -0
  69. package/app-typescript/components/Layouts/CoreLayoutTopMenu.tsx +35 -0
  70. package/app-typescript/components/Layouts/HamburgerButton.tsx +41 -0
  71. package/app-typescript/components/Layouts/Layout.tsx +33 -0
  72. package/app-typescript/components/Layouts/LayoutContainer.tsx +1 -4
  73. package/app-typescript/components/Layouts/MainMenu.tsx +101 -0
  74. package/app-typescript/components/Layouts/MainPanel.tsx +10 -5
  75. package/app-typescript/components/Layouts/NotificationPanel.tsx +109 -0
  76. package/app-typescript/components/Layouts/OverlayPanel.tsx +19 -0
  77. package/app-typescript/components/Layouts/Panel.tsx +1 -0
  78. package/app-typescript/components/Layouts/index.tsx +20 -2
  79. package/app-typescript/components/LeftMenu.tsx +6 -0
  80. package/app-typescript/components/Lists/BoxedList.tsx +41 -5
  81. package/app-typescript/components/Lists/ContentList.tsx +100 -0
  82. package/app-typescript/components/Lists/TableList.tsx +208 -0
  83. package/app-typescript/components/Menu.tsx +31 -7
  84. package/app-typescript/components/Modal.tsx +31 -18
  85. package/app-typescript/components/MultiSelect.tsx +35 -5
  86. package/app-typescript/components/NavButton.tsx +4 -0
  87. package/app-typescript/components/Navigation/BottomNav.tsx +83 -0
  88. package/app-typescript/components/Navigation/SideBarTabs.tsx +10 -0
  89. package/app-typescript/components/SearchBar.tsx +79 -0
  90. package/app-typescript/components/Select.tsx +28 -36
  91. package/app-typescript/components/SelectGrid.tsx +1 -1
  92. package/app-typescript/components/SelectWithTemplate.tsx +32 -7
  93. package/app-typescript/components/SidebarMenu.tsx +68 -0
  94. package/app-typescript/components/Skeleton.tsx +1 -1
  95. package/app-typescript/components/Spinner.tsx +1 -1
  96. package/app-typescript/components/SwitchGroup.tsx +2 -1
  97. package/app-typescript/components/Text/Time.tsx +34 -0
  98. package/app-typescript/components/TimePicker.tsx +48 -16
  99. package/app-typescript/components/Togglebox.tsx +1 -1
  100. package/app-typescript/components/Tooltip.tsx +7 -5
  101. package/app-typescript/components/TreeSelect.tsx +423 -195
  102. package/app-typescript/components/WithSizeObserver.tsx +88 -0
  103. package/app-typescript/dist/components/Alert.d.ts +16 -0
  104. package/app-typescript/dist/components/Autocomplete.d.ts +48 -0
  105. package/app-typescript/dist/components/Avatar.d.ts +33 -0
  106. package/app-typescript/dist/components/Badge.d.ts +13 -0
  107. package/app-typescript/dist/components/Button.d.ts +23 -0
  108. package/app-typescript/dist/components/ButtonGroup.d.ts +12 -0
  109. package/app-typescript/dist/components/CheckButtonGroup.d.ts +11 -0
  110. package/app-typescript/dist/components/CheckGroup.d.ts +9 -0
  111. package/app-typescript/dist/components/Checkbox.d.ts +19 -0
  112. package/app-typescript/dist/components/CheckboxButton.d.ts +19 -0
  113. package/app-typescript/dist/components/DatePicker.d.ts +37 -0
  114. package/app-typescript/dist/components/Divider.d.ts +9 -0
  115. package/app-typescript/dist/components/DonutChart.d.ts +12 -0
  116. package/app-typescript/dist/components/Dropdown.d.ts +28 -0
  117. package/app-typescript/dist/components/DropdownFirst.d.ts +42 -0
  118. package/app-typescript/dist/components/EmptyState.d.ts +11 -0
  119. package/app-typescript/dist/components/FormLabel.d.ts +9 -0
  120. package/app-typescript/dist/components/Genie.d.ts +13 -0
  121. package/app-typescript/dist/components/GridItem.d.ts +69 -0
  122. package/app-typescript/dist/components/GridList.d.ts +14 -0
  123. package/app-typescript/dist/components/HeadingText.d.ts +10 -0
  124. package/app-typescript/dist/components/HelloWorld.d.ts +8 -0
  125. package/app-typescript/dist/components/Icon.d.ts +12 -0
  126. package/app-typescript/dist/components/IconButton.d.ts +12 -0
  127. package/app-typescript/dist/components/IconLabel.d.ts +11 -0
  128. package/app-typescript/dist/components/Input.d.ts +24 -0
  129. package/app-typescript/dist/components/Label.d.ts +15 -0
  130. package/app-typescript/dist/components/LeftMenu.d.ts +26 -0
  131. package/app-typescript/dist/components/Loader.d.ts +8 -0
  132. package/app-typescript/dist/components/NavButton.d.ts +15 -0
  133. package/app-typescript/dist/components/Popover.d.ts +13 -0
  134. package/app-typescript/dist/components/PropsList.d.ts +15 -0
  135. package/app-typescript/dist/components/Radio.d.ts +19 -0
  136. package/app-typescript/dist/components/RadioButton.d.ts +20 -0
  137. package/app-typescript/dist/components/Select.d.ts +29 -0
  138. package/app-typescript/dist/components/SelectWithTemplate.d.ts +32 -0
  139. package/app-typescript/dist/components/SlidingToolbar.d.ts +8 -0
  140. package/app-typescript/dist/components/StrechBar.d.ts +4 -0
  141. package/app-typescript/dist/components/SubNav.d.ts +10 -0
  142. package/app-typescript/dist/components/Switch.d.ts +12 -0
  143. package/app-typescript/dist/components/TabCustom.d.ts +25 -0
  144. package/app-typescript/dist/components/TabList.d.ts +22 -0
  145. package/app-typescript/dist/components/Tag.d.ts +9 -0
  146. package/app-typescript/dist/components/TagInput.d.ts +7 -0
  147. package/app-typescript/dist/components/TagInputTest.d.ts +18 -0
  148. package/app-typescript/dist/components/TimePicker.d.ts +11 -0
  149. package/app-typescript/dist/components/Tooltip.d.ts +11 -0
  150. package/app-typescript/dist/components/_Positioner.d.ts +27 -0
  151. package/app-typescript/dist/index.d.ts +56 -0
  152. package/app-typescript/helpers.tsx +3 -0
  153. package/app-typescript/index.ts +8 -0
  154. package/dist/SD-logo.svg +52 -0
  155. package/dist/dots.svg +3 -0
  156. package/dist/examples.bundle.css +8532 -380
  157. package/dist/examples.bundle.js +97940 -81230
  158. package/dist/playgrounds/accessible-theme-test.html +1 -1
  159. package/dist/playgrounds/layout-test-2.html +1 -1
  160. package/dist/playgrounds/list-item-test.html +1 -1
  161. package/dist/playgrounds/master-desk.html +1 -1
  162. package/dist/playgrounds/media-carousel.html +1 -1
  163. package/dist/playgrounds/photo-desk.html +1 -1
  164. package/dist/playgrounds/planning.html +1 -1
  165. package/dist/playgrounds/publish.html +1 -1
  166. package/dist/playgrounds/publisher-content-analytics.html +1 -1
  167. package/dist/playgrounds/publisher-content-list-automatic.html +1 -1
  168. package/dist/playgrounds/publisher-content-list-manual.html +1 -1
  169. package/dist/playgrounds/publisher-content-lists.html +1 -1
  170. package/dist/playgrounds/publisher-dashboard.html +1 -1
  171. package/dist/playgrounds/publisher-output-control.html +1 -1
  172. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +155 -0
  173. package/dist/playgrounds/react-playgrounds/EditorTest.tsx +9 -4
  174. package/dist/playgrounds/react-playgrounds/Index.tsx +4 -1
  175. package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx +13 -0
  176. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +474 -0
  177. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +1002 -0
  178. package/dist/playgrounds/react-playgrounds/TestGround.tsx +301 -182
  179. package/dist/playgrounds/react-playgrounds/UiPlayground.tsx +4 -0
  180. package/dist/playgrounds/react-playgrounds/components/AuthoringContainer.tsx +26 -0
  181. package/dist/playgrounds/react-playgrounds/components/ContentSplitter.tsx +22 -0
  182. package/dist/playgrounds/react-playgrounds/components/Index.tsx +6 -1
  183. package/dist/playgrounds/react-playgrounds/components/Layout.tsx +2 -2
  184. package/dist/playgrounds/react-playgrounds/components/MainPanel.tsx +11 -1
  185. package/dist/playgrounds/react-playgrounds/components/SearchBar.tsx +51 -9
  186. package/dist/playgrounds/swimlane-view.html +1 -1
  187. package/dist/playgrounds/toasts.html +1 -1
  188. package/dist/playgrounds/video-editor.html +1 -1
  189. package/dist/react/Badges.tsx +18 -0
  190. package/dist/react/Container.tsx +1 -1
  191. package/dist/react/ContentList.tsx +286 -0
  192. package/dist/react/CreateButton.tsx +71 -0
  193. package/dist/react/DatePicker.tsx +31 -6
  194. package/dist/react/DropZone.tsx +14 -6
  195. package/dist/react/DurationInput.tsx +104 -0
  196. package/dist/react/IconButtons.tsx +6 -6
  197. package/dist/react/IconLabels.tsx +24 -2
  198. package/dist/react/Index.tsx +25 -0
  199. package/dist/react/Inputs.tsx +290 -7
  200. package/dist/react/Labels.tsx +51 -1
  201. package/dist/react/Modal.tsx +1 -0
  202. package/dist/react/MultiSelect.tsx +9 -1
  203. package/dist/react/SelectWithTemplate.tsx +6 -1
  204. package/dist/react/Selects.tsx +55 -0
  205. package/dist/react/TableList.tsx +246 -0
  206. package/dist/react/TimePicker.tsx +16 -8
  207. package/dist/react/TreeSelect.tsx +301 -48
  208. package/dist/react/WithSizeObserver.tsx +44 -0
  209. package/dist/react/tree-select/TreeSelect.tsx +273 -0
  210. package/dist/react/tree-select/example-1.tsx +71 -0
  211. package/dist/react/tree-select/example-2.tsx +59 -0
  212. package/dist/sd_big-icons.eot +0 -0
  213. package/dist/sd_big-icons.svg +55 -53
  214. package/dist/sd_big-icons.ttf +0 -0
  215. package/dist/sd_big-icons.woff +0 -0
  216. package/dist/sd_icons.eot +0 -0
  217. package/dist/sd_icons.svg +1 -0
  218. package/dist/sd_icons.ttf +0 -0
  219. package/dist/sd_icons.woff +0 -0
  220. package/dist/superdesk-ui.bundle.css +48574 -26200
  221. package/dist/superdesk-ui.bundle.js +56836 -53777
  222. package/dist/vendor.bundle.js +25027 -25027
  223. package/examples/css/docs-page.css +2 -3
  224. package/examples/index.js +12 -0
  225. package/examples/pages/playgrounds/accessible-theme-test.html +1 -1
  226. package/examples/pages/playgrounds/layout-test-2.html +1 -1
  227. package/examples/pages/playgrounds/list-item-test.html +1 -1
  228. package/examples/pages/playgrounds/master-desk.html +1 -1
  229. package/examples/pages/playgrounds/media-carousel.html +1 -1
  230. package/examples/pages/playgrounds/photo-desk.html +1 -1
  231. package/examples/pages/playgrounds/planning.html +1 -1
  232. package/examples/pages/playgrounds/publish.html +1 -1
  233. package/examples/pages/playgrounds/publisher-content-analytics.html +1 -1
  234. package/examples/pages/playgrounds/publisher-content-list-automatic.html +1 -1
  235. package/examples/pages/playgrounds/publisher-content-list-manual.html +1 -1
  236. package/examples/pages/playgrounds/publisher-content-lists.html +1 -1
  237. package/examples/pages/playgrounds/publisher-dashboard.html +1 -1
  238. package/examples/pages/playgrounds/publisher-output-control.html +1 -1
  239. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +155 -0
  240. package/examples/pages/playgrounds/react-playgrounds/EditorTest.tsx +9 -4
  241. package/examples/pages/playgrounds/react-playgrounds/Index.tsx +4 -1
  242. package/examples/pages/playgrounds/react-playgrounds/PersonalProfile.tsx +13 -0
  243. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +474 -0
  244. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +1002 -0
  245. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +301 -182
  246. package/examples/pages/playgrounds/react-playgrounds/UiPlayground.tsx +4 -0
  247. package/examples/pages/playgrounds/react-playgrounds/components/AuthoringContainer.tsx +26 -0
  248. package/examples/pages/playgrounds/react-playgrounds/components/ContentSplitter.tsx +22 -0
  249. package/examples/pages/playgrounds/react-playgrounds/components/Index.tsx +6 -1
  250. package/examples/pages/playgrounds/react-playgrounds/components/Layout.tsx +2 -2
  251. package/examples/pages/playgrounds/react-playgrounds/components/MainPanel.tsx +11 -1
  252. package/examples/pages/playgrounds/react-playgrounds/components/SearchBar.tsx +51 -9
  253. package/examples/pages/playgrounds/swimlane-view.html +1 -1
  254. package/examples/pages/playgrounds/toasts.html +1 -1
  255. package/examples/pages/playgrounds/video-editor.html +1 -1
  256. package/examples/pages/react/Badges.tsx +18 -0
  257. package/examples/pages/react/Container.tsx +1 -1
  258. package/examples/pages/react/ContentList.tsx +286 -0
  259. package/examples/pages/react/CreateButton.tsx +71 -0
  260. package/examples/pages/react/DatePicker.tsx +31 -6
  261. package/examples/pages/react/DropZone.tsx +14 -6
  262. package/examples/pages/react/DurationInput.tsx +104 -0
  263. package/examples/pages/react/IconButtons.tsx +6 -6
  264. package/examples/pages/react/IconLabels.tsx +24 -2
  265. package/examples/pages/react/Index.tsx +25 -0
  266. package/examples/pages/react/Inputs.tsx +290 -7
  267. package/examples/pages/react/Labels.tsx +51 -1
  268. package/examples/pages/react/Modal.tsx +1 -0
  269. package/examples/pages/react/MultiSelect.tsx +9 -1
  270. package/examples/pages/react/SelectWithTemplate.tsx +6 -1
  271. package/examples/pages/react/Selects.tsx +55 -0
  272. package/examples/pages/react/TableList.tsx +246 -0
  273. package/examples/pages/react/TimePicker.tsx +16 -8
  274. package/examples/pages/react/TreeSelect.tsx +301 -48
  275. package/examples/pages/react/WithSizeObserver.tsx +44 -0
  276. package/examples/pages/react/tree-select/TreeSelect.tsx +273 -0
  277. package/examples/pages/react/tree-select/example-1.tsx +71 -0
  278. package/examples/pages/react/tree-select/example-2.tsx +59 -0
  279. package/package.json +6 -4
  280. package/patches/@superdesk+primereact+5.0.2-4.patch +44 -0
  281. package/react/components/Alert.js +10 -8
  282. package/react/components/Autocomplete.js +16 -12
  283. package/react/components/Avatar.js +8 -6
  284. package/react/components/Badge.d.ts +1 -0
  285. package/react/components/Badge.js +9 -7
  286. package/react/components/Button.js +8 -6
  287. package/react/components/ButtonGroup.js +7 -5
  288. package/react/components/Carousel.js +4 -2
  289. package/react/components/CheckButtonGroup.js +6 -4
  290. package/react/components/CheckGroup.js +5 -3
  291. package/react/components/Checkbox.js +5 -3
  292. package/react/components/CheckboxButton.js +6 -4
  293. package/react/components/ContentDivider.js +8 -6
  294. package/react/components/CreateButton.d.ts +17 -0
  295. package/react/components/CreateButton.js +68 -0
  296. package/react/components/DatePicker.d.ts +11 -0
  297. package/react/components/DatePicker.js +44 -35
  298. package/react/components/Divider.js +6 -4
  299. package/react/components/DonutChart.d.ts +1 -1
  300. package/react/components/DonutChart.js +24 -6
  301. package/react/components/DropZone.d.ts +2 -2
  302. package/react/components/DropZone.js +8 -6
  303. package/react/components/Dropdown.js +7 -6
  304. package/react/components/DropdownFirst.js +18 -11
  305. package/react/components/DurationInput.d.ts +38 -0
  306. package/react/components/DurationInput.js +271 -0
  307. package/react/components/EmptyState.js +7 -5
  308. package/react/components/Form/FormGroup.js +7 -5
  309. package/react/components/Form/FormItem.js +5 -3
  310. package/react/components/Form/FormLabel.js +5 -3
  311. package/react/components/Form/FormRow.js +5 -3
  312. package/react/components/Form/FormText.js +4 -2
  313. package/react/components/Form/InputBase.d.ts +42 -0
  314. package/react/components/Form/InputBase.js +72 -0
  315. package/react/components/Form/InputNew.d.ts +45 -0
  316. package/react/components/Form/InputNew.js +73 -0
  317. package/react/components/Form/InputWrapper.d.ts +28 -0
  318. package/react/components/Form/InputWrapper.js +91 -0
  319. package/react/components/Form/index.d.ts +3 -0
  320. package/react/components/Form/index.js +7 -0
  321. package/react/components/FormLabel.js +5 -3
  322. package/react/components/GridItem.js +9 -7
  323. package/react/components/GridList.js +8 -6
  324. package/react/components/HeadingText.js +4 -2
  325. package/react/components/HelloWorld.js +4 -2
  326. package/react/components/Icon.d.ts +2 -1
  327. package/react/components/Icon.js +9 -6
  328. package/react/components/IconButton.js +8 -6
  329. package/react/components/IconLabel.d.ts +2 -0
  330. package/react/components/IconLabel.js +12 -7
  331. package/react/components/IconPicker.js +13 -9
  332. package/react/components/Input.d.ts +7 -2
  333. package/react/components/Input.js +16 -30
  334. package/react/components/Label.d.ts +1 -0
  335. package/react/components/Label.js +28 -10
  336. package/react/components/Layouts/AuthorinInnerSideBar.js +4 -2
  337. package/react/components/Layouts/AuthoringContainer.d.ts +11 -0
  338. package/react/components/Layouts/AuthoringContainer.js +60 -0
  339. package/react/components/Layouts/AuthoringFrame.js +4 -2
  340. package/react/components/Layouts/AuthoringFrameContainer.js +4 -2
  341. package/react/components/Layouts/AuthoringFrameLeftBar.js +4 -2
  342. package/react/components/Layouts/AuthoringFrameMain.js +4 -2
  343. package/react/components/Layouts/AuthoringFrameNavBar.js +4 -2
  344. package/react/components/Layouts/AuthoringFrameOverlay.js +4 -2
  345. package/react/components/Layouts/AuthoringFrameRightBar.js +4 -2
  346. package/react/components/Layouts/AuthoringFrameSidePanel.js +5 -3
  347. package/react/components/Layouts/AuthoringFrameSidePanelOverlay.js +5 -3
  348. package/react/components/Layouts/AuthoringInnerBody.js +4 -2
  349. package/react/components/Layouts/AuthoringInnerHeader.d.ts +1 -0
  350. package/react/components/Layouts/AuthoringInnerHeader.js +10 -5
  351. package/react/components/Layouts/AuthoringMain.d.ts +3 -1
  352. package/react/components/Layouts/AuthoringMain.js +6 -4
  353. package/react/components/Layouts/AuthoringMainContainer.js +4 -2
  354. package/react/components/Layouts/AuthoringMainContent.js +4 -2
  355. package/react/components/Layouts/AuthoringMainToolBar.d.ts +1 -0
  356. package/react/components/Layouts/AuthoringMainToolBar.js +12 -3
  357. package/react/components/Layouts/BottomBarAction.d.ts +12 -0
  358. package/react/components/Layouts/BottomBarAction.js +59 -0
  359. package/react/components/Layouts/Container.d.ts +1 -1
  360. package/react/components/Layouts/Container.js +9 -7
  361. package/react/components/Layouts/ContentSplitter.d.ts +10 -0
  362. package/react/components/Layouts/ContentSplitter.js +58 -0
  363. package/react/components/Layouts/CoreLayout.d.ts +19 -0
  364. package/react/components/Layouts/CoreLayout.js +55 -0
  365. package/react/components/Layouts/CoreLayoutContainer.d.ts +9 -0
  366. package/react/components/Layouts/CoreLayoutContainer.js +49 -0
  367. package/react/components/Layouts/CoreLayoutFooter.d.ts +8 -0
  368. package/react/components/Layouts/CoreLayoutFooter.js +49 -0
  369. package/react/components/Layouts/CoreLayoutMain.d.ts +9 -0
  370. package/react/components/Layouts/CoreLayoutMain.js +49 -0
  371. package/react/components/Layouts/CoreLayoutOverlay.d.ts +8 -0
  372. package/react/components/Layouts/CoreLayoutOverlay.js +49 -0
  373. package/react/components/Layouts/CoreLayoutSlideInMenu.d.ts +11 -0
  374. package/react/components/Layouts/CoreLayoutSlideInMenu.js +58 -0
  375. package/react/components/Layouts/CoreLayoutTopMenu.d.ts +14 -0
  376. package/react/components/Layouts/CoreLayoutTopMenu.js +54 -0
  377. package/react/components/Layouts/HamburgerButton.d.ts +14 -0
  378. package/react/components/Layouts/HamburgerButton.js +63 -0
  379. package/react/components/Layouts/HeaderPanel.js +4 -2
  380. package/react/components/Layouts/Layout.d.ts +8 -0
  381. package/react/components/Layouts/Layout.js +36 -0
  382. package/react/components/Layouts/LayoutContainer.js +5 -3
  383. package/react/components/Layouts/LeftPanel.js +5 -3
  384. package/react/components/Layouts/MainMenu.d.ts +41 -0
  385. package/react/components/Layouts/MainMenu.js +103 -0
  386. package/react/components/Layouts/MainPanel.d.ts +1 -0
  387. package/react/components/Layouts/MainPanel.js +15 -6
  388. package/react/components/Layouts/NotificationPanel.d.ts +45 -0
  389. package/react/components/Layouts/NotificationPanel.js +110 -0
  390. package/react/components/Layouts/OverlayPanel.d.ts +8 -0
  391. package/react/components/Layouts/OverlayPanel.js +51 -0
  392. package/react/components/Layouts/PageLayout.js +4 -2
  393. package/react/components/Layouts/Panel.d.ts +1 -0
  394. package/react/components/Layouts/Panel.js +16 -14
  395. package/react/components/Layouts/RightPanel.js +4 -2
  396. package/react/components/Layouts/index.d.ts +17 -2
  397. package/react/components/Layouts/index.js +35 -4
  398. package/react/components/LeftMenu.d.ts +2 -0
  399. package/react/components/LeftMenu.js +19 -12
  400. package/react/components/ListItemLoader.js +4 -2
  401. package/react/components/Lists/BoxedList.d.ts +8 -0
  402. package/react/components/Lists/BoxedList.js +39 -16
  403. package/react/components/Lists/ContentList.d.ts +45 -0
  404. package/react/components/Lists/ContentList.js +85 -0
  405. package/react/components/Lists/SimpleList.js +9 -7
  406. package/react/components/Lists/index.js +1 -0
  407. package/react/components/Loader.js +4 -2
  408. package/react/components/Menu.d.ts +2 -1
  409. package/react/components/Menu.js +48 -12
  410. package/react/components/Modal.d.ts +4 -1
  411. package/react/components/Modal.js +35 -6
  412. package/react/components/NavButton.d.ts +1 -0
  413. package/react/components/NavButton.js +9 -4
  414. package/react/components/Navigation/BottomNav.d.ts +24 -0
  415. package/react/components/Navigation/BottomNav.js +88 -0
  416. package/react/components/Navigation/QuickNavBar.js +13 -9
  417. package/react/components/Navigation/SideBarMenu.js +4 -2
  418. package/react/components/Navigation/SideBarTabs.d.ts +1 -0
  419. package/react/components/Navigation/SideBarTabs.js +8 -2
  420. package/react/components/Navigation/index.js +1 -0
  421. package/react/components/Popover.js +4 -2
  422. package/react/components/PropsList.js +4 -2
  423. package/react/components/RadioButtonGroup.js +9 -7
  424. package/react/components/RadioGroup.js +6 -4
  425. package/react/components/SearchBar.d.ts +23 -0
  426. package/react/components/SearchBar.js +89 -0
  427. package/react/components/Select.d.ts +6 -1
  428. package/react/components/Select.js +9 -22
  429. package/react/components/SelectGrid.d.ts +1 -1
  430. package/react/components/SelectGrid.js +44 -23
  431. package/react/components/SelectWithTemplate.d.ts +11 -1
  432. package/react/components/SelectWithTemplate.js +23 -12
  433. package/react/components/Skeleton.d.ts +1 -1
  434. package/react/components/Skeleton.js +26 -5
  435. package/react/components/SlidingToolbar.js +6 -4
  436. package/react/components/Spinner.js +7 -5
  437. package/react/components/StrechBar.js +4 -2
  438. package/react/components/SubNav.js +9 -7
  439. package/react/components/Switch.js +6 -4
  440. package/react/components/SwitchGroup.d.ts +1 -0
  441. package/react/components/SwitchGroup.js +6 -4
  442. package/react/components/TabCustom.js +11 -7
  443. package/react/components/TabList.js +6 -4
  444. package/react/components/Tag.js +5 -4
  445. package/react/components/TagInput.js +7 -6
  446. package/react/components/TagInputTest.js +13 -9
  447. package/react/components/Text/Heading.js +10 -8
  448. package/react/components/Text/Text.js +10 -8
  449. package/react/components/Text/Time.d.ts +15 -0
  450. package/react/components/Text/Time.js +65 -0
  451. package/react/components/ThemeSelector.js +7 -5
  452. package/react/components/TimePicker.d.ts +15 -2
  453. package/react/components/TimePicker.js +19 -6
  454. package/react/components/Toast.js +1 -1
  455. package/react/components/ToastMessage.js +6 -5
  456. package/react/components/ToastText.js +1 -1
  457. package/react/components/ToastWrapper.d.ts +2 -2
  458. package/react/components/ToastWrapper.js +14 -10
  459. package/react/components/Togglebox.d.ts +1 -1
  460. package/react/components/Togglebox.js +36 -15
  461. package/react/components/Tooltip.d.ts +1 -0
  462. package/react/components/Tooltip.js +14 -10
  463. package/react/components/TreeSelect.d.ts +75 -0
  464. package/react/components/TreeSelect.js +448 -0
  465. package/react/components/WithSizeObserver.d.ts +25 -0
  466. package/react/components/WithSizeObserver.js +95 -0
  467. package/react/components/_Positioner.js +4 -2
  468. package/react/helpers.d.ts +1 -0
  469. package/react/helpers.js +7 -0
  470. package/react/index.d.ts +8 -0
  471. package/react/index.js +19 -1
  472. package/yarn-error.log +111 -0
@@ -807,7 +807,7 @@
807
807
 
808
808
  </div>
809
809
  </section>
810
- <footer class="bottom-bar">
810
+ <footer class="sd-bottom-bar">
811
811
  This is the optional footer.
812
812
  </footer>
813
813
  </div>
@@ -789,7 +789,7 @@
789
789
 
790
790
  </div>
791
791
  </section>
792
- <footer class="bottom-bar">
792
+ <footer class="sd-bottom-bar">
793
793
  This is the optional footer.
794
794
  </footer>
795
795
  </div>
@@ -627,7 +627,7 @@
627
627
  <!-- END Editor content -->
628
628
  </div>
629
629
  </section>
630
- <footer class="bottom-bar ">
630
+ <footer class="sd-bottom-bar">
631
631
  This is the optional footer.
632
632
  </footer>
633
633
  </div>
@@ -1566,7 +1566,7 @@
1566
1566
 
1567
1567
  </div>
1568
1568
  </section>
1569
- <footer class="bottom-bar">
1569
+ <footer class="sd-bottom-bar">
1570
1570
  This is the optional footer.
1571
1571
  </footer>
1572
1572
  </div>
@@ -1032,7 +1032,7 @@
1032
1032
  <!-- END Editor content -->
1033
1033
  </div>
1034
1034
  </section>
1035
- <footer class="bottom-bar ">
1035
+ <footer class="sd-bottom-bar ">
1036
1036
  This is the optional footer.
1037
1037
  </footer>
1038
1038
  </div>
@@ -911,7 +911,7 @@
911
911
  <!-- END Editor content -->
912
912
  </div>
913
913
  </section>
914
- <footer class="bottom-bar ">
914
+ <footer class="sd-bottom-bar">
915
915
  This is the optional footer.
916
916
  </footer>
917
917
 
@@ -887,7 +887,7 @@
887
887
  <!-- END Editor content -->
888
888
  </div>
889
889
  </section>
890
- <footer class="bottom-bar ">
890
+ <footer class="sd-bottom-bar">
891
891
  This is the optional footer.
892
892
  </footer>
893
893
 
@@ -538,7 +538,7 @@
538
538
  <!-- END Editor content -->
539
539
  </div>
540
540
  </section>
541
- <footer class="bottom-bar ">
541
+ <footer class="sd-bottom-bar">
542
542
  This is the optional footer.
543
543
  </footer>
544
544
  </div>
@@ -370,7 +370,7 @@
370
370
 
371
371
 
372
372
  </section>
373
- <footer class="bottom-bar ">
373
+ <footer class="sd-bottom-bar">
374
374
  This is the optional footer.
375
375
  </footer>
376
376
  </div>
@@ -290,7 +290,7 @@
290
290
 
291
291
 
292
292
  </section>
293
- <footer class="bottom-bar ">
293
+ <footer class="sd-bottom-bar">
294
294
  This is the optional footer.
295
295
  </footer>
296
296
  </div>
@@ -605,7 +605,7 @@
605
605
 
606
606
 
607
607
  </section>
608
- <footer class="bottom-bar ">
608
+ <footer class="sd-bottom-bar">
609
609
  This is the optional footer.
610
610
  </footer>
611
611
  </div>
@@ -249,7 +249,7 @@
249
249
 
250
250
 
251
251
  </section>
252
- <footer class="bottom-bar ">
252
+ <footer class="sd-bottom-bar">
253
253
  This is the optional footer.
254
254
  </footer>
255
255
  </div>
@@ -317,7 +317,7 @@
317
317
 
318
318
 
319
319
  </section>
320
- <footer class="bottom-bar ">
320
+ <footer class="sd-bottom-bar">
321
321
  This is the optional footer.
322
322
  </footer>
323
323
  </div>
@@ -3653,7 +3653,7 @@
3653
3653
 
3654
3654
 
3655
3655
  </section>
3656
- <footer class="bottom-bar ">
3656
+ <footer class="sd-bottom-bar">
3657
3657
  This is the optional footer.
3658
3658
  </footer>
3659
3659
  </div>
@@ -0,0 +1,155 @@
1
+ import * as React from 'react';
2
+ import * as Components from './components/Index';
3
+ import { ButtonGroup, Button, NavButton, SubNav, Dropdown, Input, IconButton, LeftMenu, BoxedList, BoxedListItem, BoxedListContentRow, Heading, Text, Time } from '../../../../app-typescript/index';
4
+ import * as Layout from '../../../../app-typescript/components/Layouts';
5
+ import * as Form from '../../../../app-typescript/components/Form';
6
+ import * as Nav from '../../../../app-typescript/components/Navigation';
7
+ import { BottomNav } from '../../../../app-typescript/components/Navigation/BottomNav';
8
+ import { clone } from 'lodash';
9
+
10
+ interface IProps {
11
+ children?: React.ReactNode;
12
+ heading?: string;
13
+ active?: boolean;
14
+ onClick(): void;
15
+ ariaControls?: string;
16
+ menuId?: string;
17
+ }
18
+
19
+ interface IState {
20
+ theme: 'dark' | 'light' | string;
21
+ mainMenuOpen: boolean;
22
+ notificationsOpen: boolean;
23
+ botNavArray: any;
24
+ }
25
+
26
+ export class CoreLayout extends React.Component<IProps, IState> {
27
+ constructor(props: IProps) {
28
+ super(props);
29
+ this.state = {
30
+ theme: 'light',
31
+ mainMenuOpen: false,
32
+ notificationsOpen: false,
33
+ botNavArray: [
34
+ { icon:'photo', title: 'Sed posuere consectetur est at lobortis.', onClick: () => false, onRemove: (e) => this.handleDelete(e) },
35
+ { title: 'Nullam id dolor id nibh ultricies.', onClick: () => false, onRemove: (e) => this.handleDelete(e)},
36
+ { icon:'video', title: 'Nulla vitae elit libero, a pharetra augue.', onClick: () => false, onRemove: (e) => this.handleDelete(e)},
37
+ { title: 'Donec sed odio dui.', onClick: () => false, onRemove: (e) => this.handleDelete(e)},
38
+ ]
39
+ }
40
+ this.handleMainMenu = this.handleMainMenu.bind(this);
41
+ this.handleNotifications = this.handleNotifications.bind(this);
42
+ this.handleDelete = this.handleDelete.bind(this);
43
+ }
44
+
45
+ handleMainMenu() {
46
+ this.setState((state) => ({
47
+ mainMenuOpen: !state.mainMenuOpen,
48
+ }));
49
+ }
50
+
51
+ handleNotifications() {
52
+ this.setState((state) => ({
53
+ notificationsOpen: !state.notificationsOpen,
54
+ }));
55
+ }
56
+
57
+ handleDelete(indexNumber: number) {
58
+ const newItems = clone(this.state.botNavArray);
59
+ newItems.splice(indexNumber, 1);
60
+
61
+ this.setState({
62
+ botNavArray: newItems,
63
+ });
64
+ }
65
+
66
+ render() {
67
+ return (
68
+ <Layout.CoreLayout
69
+ heading='Core Layout'
70
+ menuOpen={this.state.mainMenuOpen}
71
+ onClick={this.handleMainMenu}
72
+ active={this.state.mainMenuOpen}
73
+ ariaControls='main-menu'
74
+ menuId='main-menu'
75
+ slideInMenu={(
76
+ <Layout.MainMenu
77
+ headerTitle='Main Menu'
78
+ poweredBy='Powered by Superdesk technology'
79
+ header={(null)}
80
+ footerContent={true}
81
+ footer={(
82
+ <p>Menu footer testing</p>
83
+ )}>
84
+ <LeftMenu
85
+ style='blanc'
86
+ reverseItemBorder={true}
87
+ size='large'
88
+ ariaLabel={'Left navigation'}
89
+ activeItemId='1'
90
+ groups={[
91
+ { label: 'MAIN SECTIONS', items: [
92
+ { id: '1', label: 'Section 1', ref:'section1'},
93
+ { id: '2', label: 'Section 2', ref: 'section2' },
94
+ { id: '3', label: 'Section 3', ref: 'section3' },
95
+
96
+ ]},
97
+ { label:'OTHER SECTIONS', items: [
98
+ { id: '4', label: 'Section 4', ref: 'section4' },
99
+ { id: '5', label: 'Section 5', ref: 'section5' },
100
+ ]},
101
+ { label:'OTHER SECTIONS', items: [
102
+ { id: '6', label: 'Section 6', ref: 'section6' },
103
+ { id: '7', label: 'Section 7', ref: 'section7' },
104
+ ]}
105
+ ]}
106
+ onSelect={() => false} />
107
+ </Layout.MainMenu>
108
+ )}
109
+ topMenu={(
110
+ <NavButton badgeValue='6' icon='bell' text='Show notifications' onClick={this.handleNotifications} />
111
+ )}
112
+ footer={(
113
+ <>
114
+ <Layout.BottomBarAction onClick={()=> false} />
115
+ <BottomNav
116
+ items={this.state.botNavArray} />
117
+ </>
118
+ )}
119
+ overlay={(
120
+ <Layout.NotificationPanel
121
+ header={(null)}
122
+ headerTitle='Notifications'
123
+ open={this.state.notificationsOpen}
124
+ onClick={this.handleNotifications}
125
+ theme='dark'>
126
+ <BoxedList>
127
+ <BoxedListItem unread={true}>
128
+ <Time datetime='29.06.2022'>29.06.2022</Time>
129
+ <BoxedListContentRow>
130
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cum sociis natoque penatibus et
131
+ magnis dis parturient montes, nascetur ridiculus mus.
132
+ </BoxedListContentRow>
133
+ </BoxedListItem>
134
+ <BoxedListItem>
135
+ <Time datetime='29.06.2022'>29.06.2022</Time>
136
+ <BoxedListContentRow>
137
+ Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Vestibulum id ligula
138
+ porta felis euismod semper.
139
+ </BoxedListContentRow>
140
+ </BoxedListItem>
141
+ <BoxedListItem>
142
+ <Time datetime='29.06.2022'>29.06.2022</Time>
143
+ <BoxedListContentRow>
144
+ Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer
145
+ posuere erat a ante venenatis dapibus posuere velit aliquet.
146
+ </BoxedListContentRow>
147
+ </BoxedListItem>
148
+ </BoxedList>
149
+
150
+ </Layout.NotificationPanel>
151
+ )}>
152
+ </Layout.CoreLayout>
153
+ );
154
+ }
155
+ }
@@ -112,6 +112,7 @@ export class EditorTest extends React.Component<IProps, IState> {
112
112
  )}
113
113
  main={(
114
114
  <Layout.AuthoringMain
115
+ headerPadding='medium'
115
116
  toolBar={(
116
117
  <React.Fragment>
117
118
  <div className="sd-editor-toolbar__content">
@@ -126,18 +127,19 @@ export class EditorTest extends React.Component<IProps, IState> {
126
127
  <dd><time title="July 29, 2021 3:58 PM">07/29</time></dd>
127
128
  </dl>
128
129
  </div>
129
- <ButtonGroup align='end'>
130
+ <ButtonGroup align='end'>
130
131
  <IconButton icon="preview-mode" toolTipAppend={true} ariaValue="Print preview" onClick={()=> false} />
131
132
  <IconButton icon="adjust" ariaValue="Toogle theme" onClick={()=> false} />
132
133
  <IconButton icon="switches" ariaValue="Theme settings" onClick={()=> false} />
133
134
  </ButtonGroup>
134
135
  </React.Fragment>
135
136
  )}
136
- authoringHeader={(
137
+ authoringHeader ={(
137
138
  <React.Fragment>
138
139
  <Form.FormGroup inlineLabel={true}>
139
140
  <Form.FormItem>
140
141
  <Input
142
+ type='text'
141
143
  label='Slugline'
142
144
  value='This is some value'
143
145
  maxLength={30}
@@ -146,10 +148,11 @@ export class EditorTest extends React.Component<IProps, IState> {
146
148
  required={false}
147
149
  disabled={false}
148
150
  invalid={false}
149
- onChange={(value) => {}} />
151
+ onChange={(value) => {}} />
150
152
  </Form.FormItem>
151
153
  <Form.FormItem>
152
154
  <Input
155
+ type='text'
153
156
  label='Slugline'
154
157
  value='This is some value'
155
158
  maxLength={30}
@@ -164,6 +167,7 @@ export class EditorTest extends React.Component<IProps, IState> {
164
167
  <Form.FormGroup inlineLabel={true}>
165
168
  <Form.FormItem>
166
169
  <Input
170
+ type='text'
167
171
  label='Genre'
168
172
  value='This is some value'
169
173
  maxLength={30}
@@ -177,7 +181,8 @@ export class EditorTest extends React.Component<IProps, IState> {
177
181
  </Form.FormGroup>
178
182
  <Form.FormGroup marginBottom='0' inlineLabel={true}>
179
183
  <Form.FormItem>
180
- <Input
184
+ <Input
185
+ type='text'
181
186
  label='Subject'
182
187
  value='This is some value'
183
188
  maxLength={30}
@@ -4,4 +4,7 @@ export { TestGround } from './TestGround';
4
4
  export { UiPlayground } from './UiPlayground';
5
5
  export { PageLayoutTest } from './PageLayoutTest';
6
6
  export { EditorTest } from './EditorTest';
7
- export { PersonalProfile } from './PersonalProfile';
7
+ export { RundownEditor } from './RundownEditor';
8
+ export { PersonalProfile } from './PersonalProfile';
9
+ export { Rundowns } from './Rundowns';
10
+ export { CoreLayout } from './CoreLayout';
@@ -200,6 +200,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
200
200
  <Form.FormItem>
201
201
  <Input
202
202
  label='First Name'
203
+ type='text'
203
204
  value='Jeffrey'
204
205
  error='Error message'
205
206
  required={false}
@@ -212,6 +213,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
212
213
  <Form.FormItem>
213
214
  <Input
214
215
  label='Last Name'
216
+ type='text'
215
217
  value='Lebowski'
216
218
  error='Error message'
217
219
  required={false}
@@ -224,6 +226,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
224
226
  <Form.FormItem>
225
227
  <Input
226
228
  label='Username'
229
+ type='text'
227
230
  value='the_dude'
228
231
  error='Error message'
229
232
  required={false}
@@ -238,6 +241,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
238
241
  <Form.FormItem>
239
242
  <Input
240
243
  label='Email'
244
+ type='text'
241
245
  value='jeffrey.lebowski@bloodsimple.org'
242
246
  error='Error message'
243
247
  required={false}
@@ -250,6 +254,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
250
254
  <Form.FormItem>
251
255
  <Input
252
256
  label='Phone number'
257
+ type='text'
253
258
  value='+381 64 155 22 55'
254
259
  error='Error message'
255
260
  required={false}
@@ -345,6 +350,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
345
350
  <Form.FormItem>
346
351
  <Input
347
352
  label='Sign-Off'
353
+ type='text'
348
354
  value='the_dude'
349
355
  error='Error message'
350
356
  required={false}
@@ -357,6 +363,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
357
363
  <Form.FormItem>
358
364
  <Input
359
365
  label='Byline'
366
+ type='text'
360
367
  value='Jeffrey Lebowski'
361
368
  error='Error message'
362
369
  required={false}
@@ -369,6 +376,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
369
376
  <Form.FormItem>
370
377
  <Input
371
378
  label='Job Title'
379
+ type='text'
372
380
  value='the_dude'
373
381
  error='Error message'
374
382
  required={false}
@@ -381,6 +389,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
381
389
  <Form.FormItem>
382
390
  <Input
383
391
  label='Biography'
392
+ type='text'
384
393
  value='the_dude'
385
394
  error='Error message'
386
395
  required={false}
@@ -394,6 +403,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
394
403
  <Form.FormItem>
395
404
  <Input
396
405
  label='Facebook'
406
+ type='text'
397
407
  value='the_dude'
398
408
  error='Error message'
399
409
  required={false}
@@ -406,6 +416,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
406
416
  <Form.FormItem>
407
417
  <Input
408
418
  label='Instagram'
419
+ type='text'
409
420
  value='the_dude'
410
421
  error='Error message'
411
422
  required={false}
@@ -418,6 +429,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
418
429
  <Form.FormItem>
419
430
  <Input
420
431
  label='Twitter'
432
+ type='text'
421
433
  value='the_dude'
422
434
  error='Error message'
423
435
  required={false}
@@ -518,6 +530,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
518
530
  <Form.FormItem>
519
531
  <Input
520
532
  label='Dateline / Located'
533
+ type='text'
521
534
  value=''
522
535
  error='This is error message'
523
536
  required={false}