superdesk-ui-framework 3.0.1-beta.12 → 3.0.1-beta.14

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 (29) hide show
  1. package/app/styles/_table-list.scss +1 -0
  2. package/app/styles/dropdowns/_basic-dropdown.scss +6 -0
  3. package/app-typescript/components/Dropdown.tsx +106 -78
  4. package/app-typescript/components/DurationInput.tsx +14 -4
  5. package/app-typescript/components/Lists/ContentList.tsx +28 -4
  6. package/app-typescript/components/Lists/TableList.tsx +11 -9
  7. package/dist/examples.bundle.js +2267 -1761
  8. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +3 -9
  9. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +9 -19
  10. package/dist/react/ContentList.tsx +2 -10
  11. package/dist/react/Dropdowns.tsx +580 -48
  12. package/dist/react/TableList.tsx +28 -30
  13. package/dist/superdesk-ui.bundle.css +8 -3
  14. package/dist/superdesk-ui.bundle.js +1294 -1219
  15. package/dist/vendor.bundle.js +14 -14
  16. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +3 -9
  17. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +9 -19
  18. package/examples/pages/react/ContentList.tsx +2 -10
  19. package/examples/pages/react/Dropdowns.tsx +580 -48
  20. package/examples/pages/react/TableList.tsx +28 -30
  21. package/package.json +1 -1
  22. package/react/components/Dropdown.d.ts +4 -4
  23. package/react/components/Dropdown.js +44 -26
  24. package/react/components/DurationInput.d.ts +1 -1
  25. package/react/components/DurationInput.js +14 -4
  26. package/react/components/Lists/ContentList.d.ts +5 -0
  27. package/react/components/Lists/ContentList.js +36 -15
  28. package/react/components/Lists/TableList.d.ts +5 -5
  29. package/react/components/Lists/TableList.js +6 -4
@@ -1,11 +1,8 @@
1
1
  import * as React from 'react';
2
- import * as Components from './components/Index';
3
- import { ButtonGroup, Button, NavButton, SubNav, Dropdown, Input, IconButton, Divider, Tooltip, Select, Option, Switch, Icon, AvatarWrapper, AvatarContentImage, AvatarContentText, Text, EmptyState, Alert, SlidingToolbar, TabLabel, Tabs, Heading, RadioButtonGroup, Container, Label, IconLabel } from '../../../../app-typescript/index';
2
+ import { ButtonGroup, Button, NavButton, SubNav, Dropdown, Input, IconButton, Divider, Tooltip, Select, Option, Text, SlidingToolbar, Container, Label, IconLabel } from '../../../../app-typescript/index';
4
3
  import * as Layout from '../../../../app-typescript/components/Layouts';
5
4
  import * as Form from '../../../../app-typescript/components/Form';
6
5
  import * as Nav from '../../../../app-typescript/components/Navigation';
7
- import { BoxedList, BoxedListItem, BoxedListContentRow } from '../../../../app-typescript/components/Lists';
8
- import { SimpleList, SimpleListItem } from '../../../../app-typescript/components/Lists';
9
6
  import { TableList } from '../../../../app-typescript/components/Lists/TableList';
10
7
 
11
8
  interface IProps {
@@ -115,7 +112,6 @@ export class RundownEditor extends React.Component<IProps, IState> {
115
112
  onClick: () => { this.setState({rightPanelOpen: !this.state.rightPanelOpen})}
116
113
  },
117
114
  ]
118
-
119
115
  }
120
116
  this.handleTheme = this.handleTheme.bind(this);
121
117
  }
@@ -319,19 +315,17 @@ export class RundownEditor extends React.Component<IProps, IState> {
319
315
  <Text color='light' size='medium' className='sd-margin--0'>OF</Text>
320
316
  <IconLabel style='translucent' innerLabel='Planned:'text='00:45' size='large' />
321
317
  </ButtonGroup>
322
-
323
318
  <TableList
324
319
  className='sd-margin-y--4'
325
320
  dragAndDrop
326
321
  addItem
327
322
  array={this.state.array}
328
- itemsDropdown={[
323
+ itemsDropdown={() => [
329
324
  { label: <Label style='translucent' type='primary' text='aacc' />, onSelect: () => 1 },
330
325
  { label: <Label style='translucent' text='prlg' />, onSelect: () => 1 },
331
326
  { label: <Label style='translucent' type='primary' text='prlg' />, onSelect: () => 1 },
332
327
  ]}
333
- onClick={() => false}
334
- />
328
+ />
335
329
 
336
330
  </Layout.AuthoringMain>
337
331
  </Layout.MainPanel>
@@ -1,14 +1,9 @@
1
1
  import * as React from 'react';
2
- import * as Components from './components/Index';
3
2
  import { ButtonGroup, Button, NavButton, SubNav, Dropdown, CheckButtonGroup, RadioGroup, RadioButtonGroup, Input, Select, Option, Label, IconLabel, Icon, IconButton, Checkbox, GridList, Badge, Tooltip, CreateButton, Modal, EmptyState, Container, BoxedList, BoxedListItem, BoxedListContentRow, Text, Heading, FormLabel, SlidingToolbar, Switch, SwitchGroup, SearchBar } from '../../../../app-typescript/index';
4
3
  import * as Layout from '../../../../app-typescript/components/Layouts';
5
4
  import * as Form from '../../../../app-typescript/components/Form';
6
5
  import {RundownEditor} from './RundownEditor';
7
6
  import * as Nav from '../../../../app-typescript/components/Navigation';
8
- import * as GridElements from '../../../../app-typescript/components/GridItem';
9
-
10
-
11
- import dummy_items from '../dummy-data/items';
12
7
  import { ContentList } from '../../../../app-typescript/components/Lists/ContentList';
13
8
  import { TableList } from '../../../../app-typescript/components/Lists/TableList';
14
9
 
@@ -524,15 +519,14 @@ export class Rundowns extends React.Component<IProps, IState> {
524
519
  <IconLabel style='translucent' innerLabel='Planned:'text='01:00' />
525
520
  </ButtonGroup>
526
521
  <TableList
527
- className='sd-margin-y--4'
528
- array={this.state.array}
529
- itemsDropdown={[
530
- { label: <Label style='translucent' type='primary' text='aacc' />, onSelect: () => 1 },
531
- { label: <Label style='translucent' text='prlg' />, onSelect: () => 1 },
532
- { label: <Label style='translucent' type='primary' text='prlg' />, onSelect: () => 1 },
533
- ]}
534
- onClick={() => false}
535
- />
522
+ className='sd-margin-y--4'
523
+ array={this.state.array}
524
+ itemsDropdown={() => [
525
+ { label: <Label style='translucent' type='primary' text='aacc' />, onSelect: () => 1 },
526
+ { label: <Label style='translucent' text='prlg' />, onSelect: () => 1 },
527
+ { label: <Label style='translucent' type='primary' text='prlg' />, onSelect: () => 1 },
528
+ ]}
529
+ />
536
530
  </Layout.PanelContentBlock>
537
531
  </Layout.PanelContent>
538
532
  </Layout.Panel>
@@ -632,8 +626,6 @@ export class Rundowns extends React.Component<IProps, IState> {
632
626
  </Container>
633
627
  </BoxedListItem>
634
628
  </BoxedList> */}
635
-
636
-
637
629
  </Layout.PanelContent>
638
630
  </Layout.Panel>
639
631
  </Layout.LeftPanel>
@@ -692,8 +684,6 @@ export class Rundowns extends React.Component<IProps, IState> {
692
684
  The show <strong>Marker</strong> has been successfully created.<br />
693
685
  Do you want to cretate a template for this show right away?
694
686
  </Text>
695
-
696
-
697
687
  </Container>
698
688
  </Modal>
699
689
 
@@ -733,7 +723,7 @@ export class Rundowns extends React.Component<IProps, IState> {
733
723
  </ButtonGroup>
734
724
  </Container>
735
725
  <BoxedList>
736
- <BoxedListItem
726
+ <BoxedListItem
737
727
  alignVertical='center'
738
728
  clickable={true}
739
729
  density='compact'
@@ -1,28 +1,23 @@
1
1
  import * as React from 'react';
2
2
  import * as Markup from '../../js/react';
3
- import { BoxedList, BoxedListItem, BoxedListContentRow, Prop, PropsList, Icon, IconButton, AvatarWrapper, AvatarContentText, ButtonGroup, Button, Heading, Text, Label, Container, IconLabel } from '../../../app-typescript';
4
- import { TableList, TableListItem } from '../../../app-typescript/components/Lists/TableList';
5
- import { ContentList, ContentListItem } from '../../../app-typescript/components/Lists/ContentList';
3
+ import { Prop, PropsList, Icon, IconButton, Label, Container, IconLabel } from '../../../app-typescript';
4
+ import { ContentList } from '../../../app-typescript/components/Lists/ContentList';
6
5
 
7
6
  export default class ContentListDoc extends React.Component {
8
7
  render() {
9
8
  return (
10
9
  <section className='docs-page__container'>
11
10
  <h2 className='docs-page__h2'>ContentList</h2>
12
-
13
11
  <Markup.ReactMarkupCodePreview>{`
14
12
  <ContentList
15
13
  items: [...]
16
14
  />
17
15
  `}
18
16
  </Markup.ReactMarkupCodePreview>
19
-
20
17
  <p className="docs-page__paragraph">...</p>
21
-
22
18
  <Markup.ReactMarkup>
23
19
  <Markup.ReactMarkupPreview>
24
20
  <p className="docs-page__paragraph">// basic</p>
25
-
26
21
  <ContentList
27
22
  items={[
28
23
  {
@@ -140,7 +135,6 @@ export default class ContentListDoc extends React.Component {
140
135
  action: <IconButton icon='dots-vertical' ariaValue='More actions' onClick={()=> false} />,
141
136
  },
142
137
  ]} />
143
-
144
138
  </Markup.ReactMarkupPreview>
145
139
  <Markup.ReactMarkupCode>{`
146
140
  <ContentList
@@ -261,7 +255,6 @@ export default class ContentListDoc extends React.Component {
261
255
  `}
262
256
  </Markup.ReactMarkupCode>
263
257
  </Markup.ReactMarkup>
264
-
265
258
  <h3 className="docs-page__h3">Props</h3>
266
259
  <p className="docs-page__paragraph">ContentList</p>
267
260
  <PropsList>
@@ -279,7 +272,6 @@ export default class ContentListDoc extends React.Component {
279
272
  <Prop name='onClick' isRequired={false} type='function' default='/' description='onClick functionality.'/>
280
273
  <Prop name='onDoubleClick' isRequired={false} type='function' default='/' description='onDoubleClick functionality.'/>
281
274
  </PropsList>
282
-
283
275
  </section>
284
276
  )
285
277
  }