superdesk-ui-framework 3.0.66 → 3.0.68

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 (78) hide show
  1. package/app/styles/components/_list-item.scss +22 -11
  2. package/app-typescript/components/Autocomplete.tsx +9 -3
  3. package/app-typescript/components/Badge.tsx +16 -2
  4. package/app-typescript/components/Dropdown.tsx +3 -1
  5. package/app-typescript/components/DropdownFirst.tsx +14 -2
  6. package/app-typescript/components/DurationInput.tsx +19 -4
  7. package/app-typescript/components/EmptyState.tsx +11 -2
  8. package/app-typescript/components/Layouts/Panel.tsx +12 -1
  9. package/app-typescript/components/Lists/ContentList.tsx +5 -1
  10. package/app-typescript/components/Modal.tsx +10 -1
  11. package/app-typescript/components/Navigation/BottomNav.tsx +9 -2
  12. package/app-typescript/components/Navigation/QuickNavBar.tsx +10 -2
  13. package/app-typescript/components/Navigation/SideBarMenu.tsx +9 -4
  14. package/app-typescript/components/SidebarMenu.tsx +8 -1
  15. package/app-typescript/components/TabList.tsx +5 -1
  16. package/app-typescript/components/TagInput.tsx +4 -1
  17. package/app-typescript/components/ThemeSelector.tsx +13 -2
  18. package/app-typescript/components/TreeMenu.tsx +127 -122
  19. package/app-typescript/components/TreeSelect/TreeSelect.tsx +157 -141
  20. package/app-typescript/components/WithPortal.tsx +49 -0
  21. package/app-typescript/components/avatar/avatar-image.tsx +2 -0
  22. package/app-typescript/components/avatar/avatar.tsx +2 -1
  23. package/dist/examples.bundle.js +1446 -1318
  24. package/dist/playgrounds/planning.html +121 -43
  25. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +398 -385
  26. package/dist/playgrounds/react-playgrounds/EditorTest.tsx +359 -365
  27. package/dist/playgrounds/react-playgrounds/FirstPlayground.tsx +33 -33
  28. package/dist/playgrounds/react-playgrounds/Multiedit.tsx +227 -231
  29. package/dist/playgrounds/react-playgrounds/PageLayoutTest.tsx +41 -38
  30. package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx +76 -96
  31. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +73 -101
  32. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +788 -729
  33. package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx +35 -26
  34. package/dist/playgrounds/react-playgrounds/TestGround.tsx +99 -128
  35. package/dist/playgrounds/react-playgrounds/UiPlayground.tsx +40 -25
  36. package/dist/playgrounds/react-playgrounds/components/GraphicButton.tsx +6 -5
  37. package/dist/playgrounds/react-playgrounds/components/Layout.tsx +0 -2
  38. package/dist/playgrounds/react-playgrounds/components/SearchBar.tsx +16 -9
  39. package/dist/playgrounds/react-playgrounds/tsconfig.json +4 -0
  40. package/dist/superdesk-ui.bundle.css +24 -14
  41. package/dist/superdesk-ui.bundle.js +830 -727
  42. package/dist/vendor.bundle.js +14 -14
  43. package/examples/pages/playgrounds/planning.html +121 -43
  44. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +398 -385
  45. package/examples/pages/playgrounds/react-playgrounds/EditorTest.tsx +359 -365
  46. package/examples/pages/playgrounds/react-playgrounds/FirstPlayground.tsx +33 -33
  47. package/examples/pages/playgrounds/react-playgrounds/Multiedit.tsx +227 -231
  48. package/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.tsx +41 -38
  49. package/examples/pages/playgrounds/react-playgrounds/PersonalProfile.tsx +76 -96
  50. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +73 -101
  51. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +788 -729
  52. package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx +35 -26
  53. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +99 -128
  54. package/examples/pages/playgrounds/react-playgrounds/UiPlayground.tsx +40 -25
  55. package/examples/pages/playgrounds/react-playgrounds/components/GraphicButton.tsx +6 -5
  56. package/examples/pages/playgrounds/react-playgrounds/components/Layout.tsx +0 -2
  57. package/examples/pages/playgrounds/react-playgrounds/components/SearchBar.tsx +16 -9
  58. package/examples/pages/playgrounds/react-playgrounds/tsconfig.json +4 -0
  59. package/package.json +3 -2
  60. package/react/components/Autocomplete.js +2 -2
  61. package/react/components/Badge.js +1 -1
  62. package/react/components/Dropdown.js +3 -1
  63. package/react/components/DropdownFirst.js +6 -2
  64. package/react/components/DurationInput.js +5 -1
  65. package/react/components/EmptyState.js +2 -1
  66. package/react/components/Lists/ContentList.js +1 -1
  67. package/react/components/Navigation/BottomNav.js +4 -1
  68. package/react/components/Navigation/QuickNavBar.js +2 -1
  69. package/react/components/Navigation/SideBarMenu.js +3 -1
  70. package/react/components/TabList.js +2 -1
  71. package/react/components/TagInput.js +1 -1
  72. package/react/components/TreeSelect/TreeSelect.d.ts +3 -2
  73. package/react/components/TreeSelect/TreeSelect.js +81 -73
  74. package/react/components/WithPortal.d.ts +14 -0
  75. package/react/components/WithPortal.js +69 -0
  76. package/react/components/avatar/avatar.js +2 -1
  77. /package/dist/playgrounds/dummy-data/{items.js → items.ts} +0 -0
  78. /package/examples/pages/playgrounds/dummy-data/{items.js → items.ts} +0 -0
package/dist/playgrounds/planning.html CHANGED
@@ -297,7 +297,7 @@
297
297
  <time title="March 22, 2017 11:08 AM">12:50, 15.09.2017</time>
298
298
  </div>
299
299
  <div class="sd-list-item__row" ng-show="planningType === 'events-planning'">
300
- <span class="sd-overflow-ellipsis sd-list-item--element-grow"> <a class="text-link" ng-click="openNested = !openNested; leftPreviewOpen = false"><i class="icon-calendar"></i>(2) <span ng-show="openNested">Hide planning items</span><span ng-show="!openNested">Show planning items</span></a></span>
300
+ <span class="sd-overflow-ellipsis sd-list-item--element-grow"> <a class="text-link" ng-click="openNested = !openNested; leftPreviewOpen = false"><i class="icon-calendar"></i>(5) <span ng-show="openNested">Hide planning items</span><span ng-show="!openNested">Show planning items</span></a></span>
301
301
  </div>
302
302
  </div>
303
303
  <div class="sd-list-item__action-menu">
@@ -337,56 +337,134 @@
337
337
  </div>
338
338
  <!-- Nested items -->
339
339
  <div class="sd-list-item-nested__childs sd-shadow--z1" ng-show="planningType === 'events-planning'">
340
- <!-- Child 1 -->
341
- <div class="sd-list-item">
342
- <div class="sd-list-item__border"></div>
343
- <div class="sd-list-item__column">
344
- <i class="icon-calendar icon--light-blue"></i>
345
- </div>
346
- <div class="sd-list-item__column">
347
- <span class="badge badge--light">&nbsp;</span>
348
- </div>
349
- <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
350
- <div class="sd-list-item__row">
351
- <i class="icon-text sd-list-item__inline-icon"></i><i class="icon-photo sd-list-item__inline-icon"></i>
352
- <span class="label label--hollow">Draft</span>
353
- <span class="sd-overflow-ellipsis sd-list-item--element-grow">
354
- <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Molestie consequatvel illum dolore eu feugiat nulla facilisis.</span>
355
- </span>
356
- <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
340
+ <!-- <div class="sd-list-item-nested__childs-inner"> -->
341
+ <!-- Child 1 -->
342
+ <div class="sd-list-item">
343
+ <div class="sd-list-item__border"></div>
344
+ <div class="sd-list-item__column">
345
+ <i class="icon-calendar icon--light-blue"></i>
357
346
  </div>
358
- </div>
359
- <div class="sd-list-item__action-menu">
360
- <button class="icn-btn">
361
- <i class="icon-dots-vertical"></i>
362
- </button>
363
- </div>
364
- </div>
365
- <!-- Child 2 -->
366
- <div class="sd-list-item">
367
- <div class="sd-list-item__border"></div>
368
- <div class="sd-list-item__column">
369
- <i class="icon-calendar icon--light-blue"></i>
370
- </div>
371
- <div class="sd-list-item__column">
372
- <span class="badge badge--success">P</span>
373
- </div>
374
- <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
347
+ <div class="sd-list-item__column">
348
+ <span class="badge badge--light">&nbsp;</span>
349
+ </div>
350
+ <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
375
351
  <div class="sd-list-item__row">
376
- <i class="icon-text sd-list-item__inline-icon"></i>
377
- <span class="label label--success label--hollow">Scheduled</span>
352
+ <i class="icon-text sd-list-item__inline-icon"></i><i class="icon-photo sd-list-item__inline-icon"></i>
353
+ <span class="label label--hollow">Draft</span>
378
354
  <span class="sd-overflow-ellipsis sd-list-item--element-grow">
379
- <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.</span>
355
+ <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Molestie consequatvel illum dolore eu feugiat nulla facilisis.</span>
380
356
  </span>
381
357
  <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
382
358
  </div>
383
359
  </div>
384
- <div class="sd-list-item__action-menu">
385
- <button class="icn-btn">
386
- <i class="icon-dots-vertical"></i>
387
- </button>
360
+ <div class="sd-list-item__action-menu">
361
+ <button class="icn-btn">
362
+ <i class="icon-dots-vertical"></i>
363
+ </button>
364
+ </div>
388
365
  </div>
389
- </div>
366
+ <!-- Child 2 -->
367
+ <div class="sd-list-item">
368
+ <div class="sd-list-item__border"></div>
369
+ <div class="sd-list-item__column">
370
+ <i class="icon-calendar icon--light-blue"></i>
371
+ </div>
372
+ <div class="sd-list-item__column">
373
+ <span class="badge badge--success">P</span>
374
+ </div>
375
+ <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
376
+ <div class="sd-list-item__row">
377
+ <i class="icon-text sd-list-item__inline-icon"></i>
378
+ <span class="label label--success label--hollow">Scheduled</span>
379
+ <span class="sd-overflow-ellipsis sd-list-item--element-grow">
380
+ <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.</span>
381
+ </span>
382
+ <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
383
+ </div>
384
+ </div>
385
+ <div class="sd-list-item__action-menu">
386
+ <button class="icn-btn">
387
+ <i class="icon-dots-vertical"></i>
388
+ </button>
389
+ </div>
390
+ </div>
391
+ <!-- Child 3 -->
392
+ <div class="sd-list-item">
393
+ <div class="sd-list-item__border"></div>
394
+ <div class="sd-list-item__column">
395
+ <i class="icon-calendar icon--light-blue"></i>
396
+ </div>
397
+ <div class="sd-list-item__column">
398
+ <span class="badge badge--success">P</span>
399
+ </div>
400
+ <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
401
+ <div class="sd-list-item__row">
402
+ <i class="icon-text sd-list-item__inline-icon"></i>
403
+ <span class="label label--success label--hollow">Scheduled</span>
404
+ <span class="sd-overflow-ellipsis sd-list-item--element-grow">
405
+ <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.</span>
406
+ </span>
407
+ <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
408
+ </div>
409
+ </div>
410
+ <div class="sd-list-item__action-menu">
411
+ <button class="icn-btn">
412
+ <i class="icon-dots-vertical"></i>
413
+ </button>
414
+ </div>
415
+ </div>
416
+ <!-- Child 4 -->
417
+ <div class="sd-list-item">
418
+ <div class="sd-list-item__border"></div>
419
+ <div class="sd-list-item__column">
420
+ <i class="icon-calendar icon--light-blue"></i>
421
+ </div>
422
+ <div class="sd-list-item__column">
423
+ <span class="badge badge--success">P</span>
424
+ </div>
425
+ <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
426
+ <div class="sd-list-item__row">
427
+ <i class="icon-text sd-list-item__inline-icon"></i>
428
+ <span class="label label--success label--hollow">Scheduled</span>
429
+ <span class="sd-overflow-ellipsis sd-list-item--element-grow">
430
+ <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.</span>
431
+ </span>
432
+ <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
433
+ </div>
434
+ </div>
435
+ <div class="sd-list-item__action-menu">
436
+ <button class="icn-btn">
437
+ <i class="icon-dots-vertical"></i>
438
+ </button>
439
+ </div>
440
+ </div>
441
+ <!-- Child 5 -->
442
+ <div class="sd-list-item">
443
+ <div class="sd-list-item__border"></div>
444
+ <div class="sd-list-item__column">
445
+ <i class="icon-calendar icon--light-blue"></i>
446
+ </div>
447
+ <div class="sd-list-item__column">
448
+ <span class="badge badge--success">P</span>
449
+ </div>
450
+ <div class="sd-list-item__column sd-list-item__column--grow sd-list-item__column--no-border">
451
+ <div class="sd-list-item__row">
452
+ <i class="icon-text sd-list-item__inline-icon"></i>
453
+ <span class="label label--success label--hollow">Scheduled</span>
454
+ <span class="sd-overflow-ellipsis sd-list-item--element-grow">
455
+ <span class="sd-list-item__slugline">Lipsum Ipsum</span><span class="sd-list-item__text-label">agenda:</span><span class="sd-overflow-ellipsis sd-list-item__text-strong sd-list-item__element-rm-10">Daily agenda</span><span>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.</span>
456
+ </span>
457
+ <time title="March 22, 2017 11:08 AM">13:00–14:00, 15.09.2017</time>
458
+ </div>
459
+ </div>
460
+ <div class="sd-list-item__action-menu">
461
+ <button class="icn-btn">
462
+ <i class="icon-dots-vertical"></i>
463
+ </button>
464
+ </div>
465
+ </div>
466
+ <!-- </div> -->
467
+
390
468
  </div>
391
469
  <!-- END nested items -->
392
470
  </div>