superdesk-ui-framework 4.0.13 → 4.0.16

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 (31) hide show
  1. package/.github/workflows/publish-to-npm.yml +1 -0
  2. package/app/styles/app.scss +1 -0
  3. package/app-typescript/components/CreateButton.tsx +1 -1
  4. package/app-typescript/components/DateTimePicker.tsx +33 -29
  5. package/app-typescript/components/Editor/EditorButton.tsx +1 -1
  6. package/app-typescript/components/IconButton.tsx +1 -3
  7. package/app-typescript/components/Lists/TableList.tsx +4 -4
  8. package/app-typescript/components/Switch.tsx +0 -1
  9. package/app-typescript/components/Tooltip.tsx +76 -48
  10. package/app-typescript/components/TreeSelect/TreeSelect.tsx +14 -1
  11. package/dist/components/Tooltips.tsx +1 -44
  12. package/dist/components/TreeSelect.tsx +10 -15
  13. package/dist/examples.bundle.js +3588 -1104
  14. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +1 -1
  15. package/dist/playgrounds/react-playgrounds/TestGround.tsx +26 -26
  16. package/dist/superdesk-ui.bundle.css +1 -1
  17. package/dist/superdesk-ui.bundle.js +3545 -1041
  18. package/examples/pages/components/Tooltips.tsx +1 -44
  19. package/examples/pages/components/TreeSelect.tsx +10 -15
  20. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +1 -1
  21. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +26 -26
  22. package/package.json +3 -2
  23. package/react/components/CreateButton.js +1 -1
  24. package/react/components/DateTimePicker.js +9 -7
  25. package/react/components/IconButton.js +1 -1
  26. package/react/components/Lists/TableList.js +4 -4
  27. package/react/components/Switch.js +1 -1
  28. package/react/components/Tooltip.d.ts +10 -4
  29. package/react/components/Tooltip.js +64 -64
  30. package/react/components/TreeSelect/TreeSelect.d.ts +1 -0
  31. package/react/components/TreeSelect/TreeSelect.js +8 -1
package/dist/playgrounds/react-playgrounds/RundownEditor.tsx CHANGED
@@ -146,7 +146,7 @@ export class RundownEditor extends React.Component<IProps, IState> {
146
146
  <Layout.LayoutContainer>
147
147
  <Layout.HeaderPanel>
148
148
  <SubNav>
149
- <Tooltip text={this.state.isExpanded ? "Revert Authoring" : "Expand Authoring"} flow='right' appendToBody={true}>
149
+ <Tooltip text={this.state.isExpanded ? "Revert Authoring" : "Expand Authoring"} flow='right'>
150
150
  <button
151
151
  className={`expand-button ${this.state.isExpanded ? "expand-button--expanded" : ""}`}
152
152
  onClick={this.toggleExpand}
package/dist/playgrounds/react-playgrounds/TestGround.tsx CHANGED
@@ -221,7 +221,7 @@ export class TestGround extends React.Component<IProps, IState> {
221
221
  </div>
222
222
  <div className="sd-list-item__action-menu sd-list-item__action-menu--direction-row ps-0">
223
223
  <ButtonGroup orientation='vertical' spaces='compact'>
224
- <IconButton size='small' icon='external' ariaValue='Open in modal' onClick={()=> false} />
224
+ <IconButton size='small' icon='external' ariaValue='Open in modal' onClick={()=> false} />
225
225
  <IconButton size='small' icon='trash' ariaValue='Delete Coverage' onClick={()=> false} />
226
226
  </ButtonGroup>
227
227
  </div>
@@ -378,7 +378,7 @@ export class TestGround extends React.Component<IProps, IState> {
378
378
  <div className='sd-border--medium border-dashed p-1-5 radius-md d-flex items-center justify-center'>
379
379
  <span className='text-sm text-color-subdued'>No Coverages yet</span>
380
380
  </div>
381
-
381
+
382
382
  {/* <ContentDivider type="dashed" margin='x-small' /> */}
383
383
 
384
384
  {/* NESTED BOX */}
@@ -404,7 +404,7 @@ export class TestGround extends React.Component<IProps, IState> {
404
404
  <span className="sd-list-item__text-light">//</span>
405
405
  <span className="sd-list-item__text">Archive</span>
406
406
  </span>
407
-
407
+
408
408
  </span>
409
409
  <time className="sd-margin-s--auto" title="June 01, 2022 11:08 AM">11:08, 01.06.2022</time>
410
410
  </div>
@@ -460,8 +460,8 @@ export class TestGround extends React.Component<IProps, IState> {
460
460
  <span className="sd-list-item__text-light">//</span>
461
461
  <span className="sd-list-item__text">Archive</span>
462
462
  </span>
463
-
464
-
463
+
464
+
465
465
  </span>
466
466
  <Label text='Draft' style='translucent' type='default' />
467
467
  </div>
@@ -662,7 +662,7 @@ export class TestGround extends React.Component<IProps, IState> {
662
662
 
663
663
  <hr />
664
664
 
665
- <Avatar
665
+ <Avatar
666
666
  displayName="Jeffrey Lebowski"
667
667
  imageUrl={null}
668
668
  initials='JL'
@@ -757,7 +757,7 @@ export class TestGround extends React.Component<IProps, IState> {
757
757
  <span className="sd-list-item__text-light">//</span>
758
758
  <span className="sd-list-item__text">Archive</span>
759
759
  </span>
760
-
760
+
761
761
  </span>
762
762
  <time className="sd-margin-s--auto" title="June 01, 2022 11:08 AM">11:08, 01.06.2022</time>
763
763
  </div>
@@ -881,8 +881,8 @@ export class TestGround extends React.Component<IProps, IState> {
881
881
  <hr />
882
882
 
883
883
  <SubNav color='darker'>
884
- <Tooltip text={this.state.isExpanded ? "Revert Authoring" : "Expand Authoring"} flow='right' appendToBody={true}>
885
- <button
884
+ <Tooltip text={this.state.isExpanded ? "Revert Authoring" : "Expand Authoring"} flow='right'>
885
+ <button
886
886
  className={`expand-button ${this.state.isExpanded ? "expand-button--expanded" : ""}`}
887
887
  onClick={this.toggleExpand}
888
888
  >
@@ -911,11 +911,11 @@ export class TestGround extends React.Component<IProps, IState> {
911
911
  </ButtonGroup>
912
912
  </ButtonGroup>
913
913
  </SubNav>
914
-
914
+
915
915
  <hr />
916
916
 
917
917
  <div className='sd-grid-list sd-grid-list--xx-small sd-grid-list--gap-s sd-grid-list--no-margin' style={{width:'290px'}}>
918
-
918
+
919
919
  <IllustrationButton text='Headlines' onClick={()=> false}>
920
920
  <SvgIconIllustration illustration='headlines' />
921
921
  </IllustrationButton>
@@ -997,16 +997,16 @@ export class TestGround extends React.Component<IProps, IState> {
997
997
  </span>
998
998
  <Icon name='chevron-down-thin' />
999
999
  </button> */}
1000
-
1000
+
1001
1001
  <hr />
1002
1002
 
1003
1003
  <Button text="Planning Templates" onClick={() => this.setState({modalPlanningTemplates: true})} />
1004
1004
  <span></span>
1005
-
1006
-
1005
+
1006
+
1007
1007
  {/* Event Saving modals */}
1008
1008
  {/* Event Only (This one existed Before) */}
1009
- <Modal
1009
+ <Modal
1010
1010
  headerTemplate="Save Event"
1011
1011
  visible={this.state.modalSaveEvent}
1012
1012
  contentPadding='medium'
@@ -1056,7 +1056,7 @@ export class TestGround extends React.Component<IProps, IState> {
1056
1056
  </Modal>
1057
1057
 
1058
1058
  {/* Event and Planning */}
1059
- <Modal
1059
+ <Modal
1060
1060
  headerTemplate="Save Event"
1061
1061
  visible={this.state.modalSaveEvent2}
1062
1062
  contentPadding='medium'
@@ -1154,7 +1154,7 @@ export class TestGround extends React.Component<IProps, IState> {
1154
1154
  </Modal>
1155
1155
 
1156
1156
  {/* Planning only */}
1157
- <Modal
1157
+ <Modal
1158
1158
  headerTemplate="Save Event"
1159
1159
  visible={this.state.modalSaveEvent3}
1160
1160
  contentPadding='medium'
@@ -1373,7 +1373,7 @@ export class TestGround extends React.Component<IProps, IState> {
1373
1373
 
1374
1374
  <img
1375
1375
  src="/path/toimage"
1376
- alt="my image"
1376
+ alt="my image"
1377
1377
  onError={({ currentTarget }) => {
1378
1378
  currentTarget.onerror = null; // prevents looping
1379
1379
  currentTarget.src="/illustration--playground.svg";
@@ -1417,7 +1417,7 @@ export class TestGround extends React.Component<IProps, IState> {
1417
1417
  labelHidden={true}
1418
1418
  type='text'
1419
1419
  />
1420
-
1420
+
1421
1421
  <hr />
1422
1422
 
1423
1423
  <div className='form__group-new'>
@@ -1776,7 +1776,7 @@ export class TestGround extends React.Component<IProps, IState> {
1776
1776
  </div>
1777
1777
 
1778
1778
  <div className='table-list__add-bar-container'>
1779
- <Tooltip text='Add item' flow='top' appendToBody={true}>
1779
+ <Tooltip text='Add item' flow='top'>
1780
1780
  <div className='table-list__add-bar'>
1781
1781
  <Button type="primary" icon="plus-large" text="Add item" size="small" shape="round" iconOnly={true} onClick={()=> false} />
1782
1782
  </div>
@@ -1804,7 +1804,7 @@ export class TestGround extends React.Component<IProps, IState> {
1804
1804
  </div>
1805
1805
 
1806
1806
  <div className='table-list__add-bar-container'>
1807
- <Tooltip text='Add item' flow='top' appendToBody={true}>
1807
+ <Tooltip text='Add item' flow='top'>
1808
1808
  <div className='table-list__add-bar'>
1809
1809
  <Button type="primary" icon="plus-large" text="Add item" size="small" shape="round" iconOnly={true} onClick={()=> false} />
1810
1810
  </div>
@@ -1833,7 +1833,7 @@ export class TestGround extends React.Component<IProps, IState> {
1833
1833
  </div>
1834
1834
 
1835
1835
  <div className='table-list__add-bar-container'>
1836
- <Tooltip text='Add item' flow='top' appendToBody={true}>
1836
+ <Tooltip text='Add item' flow='top'>
1837
1837
  <div className='table-list__add-bar'>
1838
1838
  <Button type="primary" icon="plus-large" text="Add item" size="small" shape="round" iconOnly={true} onClick={()=> false} />
1839
1839
  </div>
@@ -1861,7 +1861,7 @@ export class TestGround extends React.Component<IProps, IState> {
1861
1861
  <hr />
1862
1862
 
1863
1863
  <Checkbox label={{text: 'The label is hidden here', hidden: true}} onChange={(value) => console.log('value changed', value)} />
1864
-
1864
+
1865
1865
  <hr />
1866
1866
 
1867
1867
  <div className="sd-check-button__group sd-check-button__group--start">
@@ -1974,9 +1974,9 @@ export class TestGround extends React.Component<IProps, IState> {
1974
1974
  </ul>
1975
1975
  </div>
1976
1976
  <div className="sd-thumb-carousel__description">
1977
- Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.
1978
- Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod.
1979
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cum sociis natoque penatibus et magnis dis
1977
+ Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue.
1978
+ Donec id elit non mi porta gravida at eget metus. Etiam porta sem malesuada magna mollis euismod.
1979
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cum sociis natoque penatibus et magnis dis
1980
1980
  parturient montes, nascetur ridiculus mus.
1981
1981
  </div>
1982
1982
  </div>
package/dist/superdesk-ui.bundle.css CHANGED
@@ -11646,7 +11646,7 @@
11646
11646
  .pi-spinner:before {
11647
11647
  content: "\e926";
11648
11648
  }
11649
- @charset "UTF-8";
11649
+ .tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}@charset "UTF-8";
11650
11650
  :root {
11651
11651
  --base-increment: 0.8rem;
11652
11652
  --space--0: 0;