superdesk-ui-framework 3.1.29 → 4.0.1

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 (96) hide show
  1. package/app-typescript/components/Dropdown.tsx +120 -165
  2. package/app-typescript/components/Layouts/AuthoringInnerHeader.tsx +9 -4
  3. package/app-typescript/components/Layouts/AuthoringMain.tsx +2 -0
  4. package/app-typescript/components/Layouts/Panel.tsx +3 -2
  5. package/app-typescript/components/Menu.tsx +3 -4
  6. package/app-typescript/components/Modal.tsx +4 -2
  7. package/app-typescript/components/MultiSelect.tsx +3 -2
  8. package/app-typescript/components/Popover.tsx +0 -2
  9. package/app-typescript/components/SelectWithTemplate.tsx +3 -1
  10. package/app-typescript/components/ShowPopup.tsx +9 -5
  11. package/app-typescript/components/SubNav.tsx +5 -6
  12. package/app-typescript/components/TreeMenu.tsx +3 -2
  13. package/app-typescript/components/TreeSelect/TreeSelect.tsx +3 -2
  14. package/app-typescript/components/WithPopover.tsx +0 -2
  15. package/app-typescript/components/_Positioner.tsx +3 -4
  16. package/app-typescript/components/avatar/avatar-group.tsx +0 -3
  17. package/app-typescript/index.ts +1 -0
  18. package/app-typescript/zIndex.tsx +5 -0
  19. package/dist/components/CreateButton.tsx +2 -2
  20. package/dist/components/Dropdowns.tsx +4 -483
  21. package/dist/components/Modal.tsx +0 -12
  22. package/dist/components/MultiSelect.tsx +0 -2
  23. package/dist/components/NavButtons.tsx +4 -4
  24. package/dist/components/Panel.tsx +0 -1
  25. package/dist/components/Popover.tsx +0 -3
  26. package/dist/components/SubNav.tsx +9 -10
  27. package/dist/components/TableList.tsx +1 -1
  28. package/dist/design-patterns/ThreePaneLayoutPattern.tsx +3 -3
  29. package/dist/examples.bundle.js +3115 -3481
  30. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +2 -3
  31. package/dist/playgrounds/react-playgrounds/EditorTest.tsx +1 -1
  32. package/dist/playgrounds/react-playgrounds/Multiedit.tsx +1 -2
  33. package/dist/playgrounds/react-playgrounds/PageLayoutTest.tsx +1 -1
  34. package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx +2 -2
  35. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +3 -10
  36. package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx +2 -3
  37. package/dist/playgrounds/react-playgrounds/TestGround.tsx +0 -4
  38. package/dist/playgrounds/react-playgrounds/UiPlayground.tsx +2 -3
  39. package/dist/superdesk-ui.bundle.js +2411 -2402
  40. package/dist/vendor.bundle.js +21 -21
  41. package/examples/pages/components/CreateButton.tsx +2 -2
  42. package/examples/pages/components/Dropdowns.tsx +4 -483
  43. package/examples/pages/components/Modal.tsx +0 -12
  44. package/examples/pages/components/MultiSelect.tsx +0 -2
  45. package/examples/pages/components/NavButtons.tsx +4 -4
  46. package/examples/pages/components/Panel.tsx +0 -1
  47. package/examples/pages/components/Popover.tsx +0 -3
  48. package/examples/pages/components/SubNav.tsx +9 -10
  49. package/examples/pages/components/TableList.tsx +1 -1
  50. package/examples/pages/design-patterns/ThreePaneLayoutPattern.tsx +3 -3
  51. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +2 -3
  52. package/examples/pages/playgrounds/react-playgrounds/EditorTest.tsx +1 -1
  53. package/examples/pages/playgrounds/react-playgrounds/Multiedit.tsx +1 -2
  54. package/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.tsx +1 -1
  55. package/examples/pages/playgrounds/react-playgrounds/PersonalProfile.tsx +2 -2
  56. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +3 -10
  57. package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx +2 -3
  58. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +0 -4
  59. package/examples/pages/playgrounds/react-playgrounds/UiPlayground.tsx +2 -3
  60. package/package.json +1 -1
  61. package/react/components/Dropdown.d.ts +1 -3
  62. package/react/components/Dropdown.js +31 -60
  63. package/react/components/Layouts/AuthoringInnerHeader.d.ts +1 -0
  64. package/react/components/Layouts/AuthoringInnerHeader.js +4 -2
  65. package/react/components/Layouts/AuthoringMain.d.ts +1 -0
  66. package/react/components/Layouts/AuthoringMain.js +1 -1
  67. package/react/components/Layouts/Panel.d.ts +1 -1
  68. package/react/components/Layouts/Panel.js +5 -2
  69. package/react/components/Menu.d.ts +1 -1
  70. package/react/components/Menu.js +3 -3
  71. package/react/components/Modal.d.ts +1 -1
  72. package/react/components/Modal.js +5 -2
  73. package/react/components/MultiSelect.d.ts +1 -1
  74. package/react/components/MultiSelect.js +3 -1
  75. package/react/components/Popover.d.ts +0 -1
  76. package/react/components/Popover.js +1 -1
  77. package/react/components/SelectWithTemplate.d.ts +3 -0
  78. package/react/components/SelectWithTemplate.js +3 -0
  79. package/react/components/ShowPopup.d.ts +20 -1
  80. package/react/components/ShowPopup.js +12 -5
  81. package/react/components/SubNav.d.ts +0 -1
  82. package/react/components/SubNav.js +1 -4
  83. package/react/components/TreeMenu.d.ts +1 -1
  84. package/react/components/TreeMenu.js +3 -1
  85. package/react/components/TreeSelect/TreeSelect.d.ts +1 -1
  86. package/react/components/TreeSelect/TreeSelect.js +3 -1
  87. package/react/components/WithPopover.d.ts +0 -1
  88. package/react/components/WithPopover.js +1 -1
  89. package/react/components/_Positioner.d.ts +0 -1
  90. package/react/components/_Positioner.js +3 -3
  91. package/react/components/avatar/avatar-group.d.ts +0 -1
  92. package/react/components/avatar/avatar-group.js +2 -3
  93. package/react/index.d.ts +1 -0
  94. package/react/index.js +4 -1
  95. package/react/zIndex.d.ts +2 -0
  96. package/react/zIndex.js +8 -0
package/dist/playgrounds/react-playgrounds/CoreLayout.tsx CHANGED
@@ -296,7 +296,7 @@ export class CoreLayout extends React.Component<IProps, IState> {
296
296
  {!this.state.fullEditor && !this.state.rightPanel
297
297
  && <Layout.LayoutContainer>
298
298
  <Layout.HeaderPanel>
299
- <SubNav zIndex={2}>
299
+ <SubNav>
300
300
  <SearchBar placeholder='Search media'></SearchBar>
301
301
  <ButtonGroup align='end' spaces='no-space'>
302
302
  <Dropdown
@@ -346,7 +346,7 @@ export class CoreLayout extends React.Component<IProps, IState> {
346
346
  </Dropdown>
347
347
  </ButtonGroup>
348
348
  </SubNav>
349
- <SubNav zIndex={1}>
349
+ <SubNav>
350
350
  <ButtonGroup align='start'>
351
351
  <NavButton icon='filter-large' onClick={this.handleFilter} />
352
352
  </ButtonGroup>
@@ -585,7 +585,6 @@ export class CoreLayout extends React.Component<IProps, IState> {
585
585
  <Layout.Container className='sd-margin-s--auto sd-flex--items-center'>
586
586
  {/* <Dropdown
587
587
  align = 'right'
588
- append = {true}
589
588
  items={[
590
589
  {
591
590
  type: 'group', label: 'Actions', items: [
package/dist/playgrounds/react-playgrounds/EditorTest.tsx CHANGED
@@ -68,7 +68,7 @@ export class EditorTest extends React.Component<IProps, IState> {
68
68
  return (
69
69
  <Layout.AuthoringFrame
70
70
  header={(
71
- <SubNav zIndex={2}>
71
+ <SubNav>
72
72
  <ButtonGroup align='end'>
73
73
  <Button
74
74
  text="Open pinned"
package/dist/playgrounds/react-playgrounds/Multiedit.tsx CHANGED
@@ -84,7 +84,6 @@ export class Multiedit extends React.Component<IProps, IState> {
84
84
  }}
85
85
  >
86
86
  <Dropdown
87
- append
88
87
  items={[
89
88
  { label: 'Action 1', onSelect: () => this.setState({arr: [...this.state.arr, <Editor />]}) },
90
89
  ]}
@@ -116,7 +115,7 @@ export class Editor extends React.Component<{}, IEditor> {
116
115
  <div style={{borderRight: '4px solid grey'}}>
117
116
  <Layout.AuthoringFrame
118
117
  header={(
119
- <SubNav zIndex={2}>
118
+ <SubNav>
120
119
  <ButtonGroup align='end'>
121
120
  <ButtonGroup subgroup={true} spaces="no-space">
122
121
  <Tooltip text='More actions' flow='left'>
package/dist/playgrounds/react-playgrounds/PageLayoutTest.tsx CHANGED
@@ -56,7 +56,7 @@ export class PageLayoutTest extends React.Component<IProps, IState> {
56
56
  return (
57
57
  <Layout.PageLayout
58
58
  header={(
59
- <SubNav zIndex={2}>
59
+ <SubNav>
60
60
  <ButtonGroup align="start" padded={true}>
61
61
  <Button
62
62
  text="Open left panel"
package/dist/playgrounds/react-playgrounds/PersonalProfile.tsx CHANGED
@@ -123,7 +123,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
123
123
  <Components.Layout header='My Profile' theme={this.state.theme}>
124
124
  <Components.LayoutContainer>
125
125
  <Components.HeaderPanel>
126
- <SubNav zIndex={2}>
126
+ <SubNav>
127
127
  <ButtonGroup align='start' spaces='no-space'>
128
128
  <Tooltip text='User list' flow='right'>
129
129
  <NavButton icon='arrow-left' onClick={() => false} />
@@ -135,7 +135,7 @@ export class PersonalProfile extends React.Component<IProps, IState> {
135
135
  </AvatarWrapper>
136
136
  <h2 className='subnav__page-title'>Jeffrey Lebowski</h2>
137
137
  </SubNav>
138
- <SubNav zIndex={1}>
138
+ <SubNav>
139
139
  <SubNavDivider width='small' />
140
140
  <Tabs onClick={this.handleClick}>
141
141
  <TabLabel label='Overview' indexValue={0}/>
package/dist/playgrounds/react-playgrounds/Rundowns.tsx CHANGED
@@ -176,7 +176,7 @@ export class Rundowns extends React.Component<IProps, IState> {
176
176
 
177
177
  <Layout.LayoutContainer>
178
178
  <Layout.HeaderPanel>
179
- <SubNav zIndex={2}>
179
+ <SubNav>
180
180
  <SearchBar placeholder='Search media'></SearchBar>
181
181
  <ButtonGroup align='end' spaces='no-space'>
182
182
  <Dropdown
@@ -227,7 +227,7 @@ export class Rundowns extends React.Component<IProps, IState> {
227
227
  </Dropdown>
228
228
  </ButtonGroup>
229
229
  </SubNav>
230
- <SubNav zIndex={1}>
230
+ <SubNav>
231
231
  <ButtonGroup align='start'>
232
232
  <NavButton icon='filter-large' onClick={this.handleFilter} />
233
233
  </ButtonGroup>
@@ -503,7 +503,6 @@ export class Rundowns extends React.Component<IProps, IState> {
503
503
  <Container className='sd-margin-s--auto sd-flex--items-center'>
504
504
  {/* <Dropdown
505
505
  align = 'right'
506
- append = {true}
507
506
  items={[
508
507
  {
509
508
  type: 'group', label: 'Actions', items: [
@@ -588,7 +587,6 @@ export class Rundowns extends React.Component<IProps, IState> {
588
587
  <Modal
589
588
  headerTemplate="Manage Templates"
590
589
  visible={this.state.modalManageTemplate}
591
- zIndex={1000}
592
590
  contentBg='medium'
593
591
  contentPadding='none'
594
592
  size='x-large' onHide={() => {this.setState({modalManageTemplate: false})}}
@@ -691,7 +689,6 @@ export class Rundowns extends React.Component<IProps, IState> {
691
689
  <Modal
692
690
  headerTemplate="Create new Show"
693
691
  visible={this.state.modalNewShow}
694
- zIndex={1000}
695
692
  footerTemplate={newShowFooter}
696
693
  contentBg='medium'
697
694
  size='medium' onHide={() => {this.setState({modalNewShow: false})}}
@@ -723,7 +720,6 @@ export class Rundowns extends React.Component<IProps, IState> {
723
720
  <Modal
724
721
  headerTemplate="Create new Show"
725
722
  visible={this.state.modalNewShowSuccess}
726
- zIndex={1000}
727
723
  footerTemplate={newShowFooter2}
728
724
  contentBg='medium'
729
725
  size='medium' onHide={() => {this.setState({modalNewShowSuccess: false})}}
@@ -740,7 +736,6 @@ export class Rundowns extends React.Component<IProps, IState> {
740
736
  {/* New Template Modal */}
741
737
  <Modal headerTemplate="Create new Template"
742
738
  visible={this.state.modalNewTemplate}
743
- zIndex={1000}
744
739
  contentBg='medium'
745
740
  contentPadding='none'
746
741
  size='x-large' onHide={() => {this.setState({modalNewTemplate: false})}}
@@ -866,14 +861,13 @@ export class Rundowns extends React.Component<IProps, IState> {
866
861
  headerTemplate="Manage Shows"
867
862
  maximizable
868
863
  visible={this.state.modalManageShow}
869
- zIndex={1000}
870
864
  contentBg='medium'
871
865
  contentPadding='none'
872
866
  size='x-large' onHide={() => {this.setState({modalManageShow: false})}}
873
867
  >
874
868
  <Layout.LayoutContainer>
875
869
  <Layout.HeaderPanel>
876
- <SubNav zIndex={2}>
870
+ <SubNav>
877
871
  <SearchBar placeholder='Search shows'></SearchBar>
878
872
  <ButtonGroup align='end' spaces='no-space'>
879
873
  <CreateButton ariaValue='New show' onClick={() => false} />
@@ -962,7 +956,6 @@ export class Rundowns extends React.Component<IProps, IState> {
962
956
  <Container className='sd-margin-s--auto sd-flex--items-center'>
963
957
  <Dropdown
964
958
  align = 'right'
965
- append = {true}
966
959
  items={[
967
960
  {
968
961
  type: 'group', label: 'Actions', items: [
package/dist/playgrounds/react-playgrounds/SamsPlayground.tsx CHANGED
@@ -83,7 +83,7 @@ export class SamsPlayground extends React.Component<IProps, IState> {
83
83
 
84
84
  <Components.LayoutContainer>
85
85
  <Components.HeaderPanel>
86
- <SubNav zIndex={2}>
86
+ <SubNav>
87
87
  <ButtonGroup align='inline'>
88
88
  <Dropdown
89
89
  items={[
@@ -107,7 +107,7 @@ export class SamsPlayground extends React.Component<IProps, IState> {
107
107
  <NavButton icon='dots-vertical' onClick={() => false} />
108
108
  </ButtonGroup>
109
109
  </SubNav>
110
- <SubNav zIndex={1}>
110
+ <SubNav>
111
111
  <ButtonGroup align='inline'>
112
112
  <NavButton icon='filter-large' onClick={this.handleFilter} />
113
113
  </ButtonGroup>
@@ -270,7 +270,6 @@ export class SamsPlayground extends React.Component<IProps, IState> {
270
270
  <div className="side-panel__content-block-inner side-panel__content-block-inner--right">
271
271
  <Dropdown
272
272
  align = 'right'
273
- append = {true}
274
273
  items={[
275
274
  {
276
275
  type: 'group', label: 'Actions', items: [
package/dist/playgrounds/react-playgrounds/TestGround.tsx CHANGED
@@ -1008,7 +1008,6 @@ export class TestGround extends React.Component<IProps, IState> {
1008
1008
  {/* Event Only (This one existed Before) */}
1009
1009
  <Modal
1010
1010
  headerTemplate="Save Event"
1011
- zIndex={10000}
1012
1011
  visible={this.state.modalSaveEvent}
1013
1012
  contentPadding='medium'
1014
1013
  contentBg='medium'
@@ -1059,7 +1058,6 @@ export class TestGround extends React.Component<IProps, IState> {
1059
1058
  {/* Event and Planning */}
1060
1059
  <Modal
1061
1060
  headerTemplate="Save Event"
1062
- zIndex={10000}
1063
1061
  visible={this.state.modalSaveEvent2}
1064
1062
  contentPadding='medium'
1065
1063
  contentBg='medium'
@@ -1158,7 +1156,6 @@ export class TestGround extends React.Component<IProps, IState> {
1158
1156
  {/* Planning only */}
1159
1157
  <Modal
1160
1158
  headerTemplate="Save Event"
1161
- zIndex={10000}
1162
1159
  visible={this.state.modalSaveEvent3}
1163
1160
  contentPadding='medium'
1164
1161
  contentBg='medium'
@@ -1266,7 +1263,6 @@ export class TestGround extends React.Component<IProps, IState> {
1266
1263
 
1267
1264
  {/* Planning templates modal */}
1268
1265
  <Modal headerTemplate="Planning templates"
1269
- zIndex={10000}
1270
1266
  visible={this.state.modalPlanningTemplates}
1271
1267
  contentPadding='medium'
1272
1268
  contentBg='medium'
package/dist/playgrounds/react-playgrounds/UiPlayground.tsx CHANGED
@@ -83,7 +83,7 @@ export class UiPlayground extends React.Component<IProps, IState> {
83
83
 
84
84
  <Components.LayoutContainer>
85
85
  <Components.HeaderPanel>
86
- <SubNav zIndex={2}>
86
+ <SubNav>
87
87
  <ButtonGroup align='inline'>
88
88
  <Dropdown
89
89
  items={[
@@ -107,7 +107,7 @@ export class UiPlayground extends React.Component<IProps, IState> {
107
107
  <NavButton icon='dots-vertical' onClick={() => false} />
108
108
  </ButtonGroup>
109
109
  </SubNav>
110
- <SubNav zIndex={1}>
110
+ <SubNav>
111
111
  <ButtonGroup align='inline'>
112
112
  <NavButton icon='filter-large' onClick={this.handleFilter} />
113
113
  </ButtonGroup>
@@ -269,7 +269,6 @@ export class UiPlayground extends React.Component<IProps, IState> {
269
269
  <div className="side-panel__content-block-inner side-panel__content-block-inner--right">
270
270
  <Dropdown
271
271
  align = 'right'
272
- append = {true}
273
272
  items={[
274
273
  {
275
274
  type: 'group', label: 'Actions', items: [