superdesk-ui-framework 3.1.2 → 3.1.3

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 (33) hide show
  1. package/app/fonts/sd_big-icons.eot +0 -0
  2. package/app/fonts/sd_big-icons.svg +57 -55
  3. package/app/fonts/sd_big-icons.ttf +0 -0
  4. package/app/fonts/sd_big-icons.woff +0 -0
  5. package/app/fonts/sd_icons.eot +0 -0
  6. package/app/fonts/sd_icons.svg +3 -0
  7. package/app/fonts/sd_icons.ttf +0 -0
  8. package/app/fonts/sd_icons.woff +0 -0
  9. package/app/styles/_big-icon-font.scss +2 -0
  10. package/app/styles/_drag-handle.scss +2 -2
  11. package/app/styles/_icon-font.scss +3 -0
  12. package/app/styles/_sd-tag-input.scss +10 -5
  13. package/app/styles/_tag-labels.scss +10 -1
  14. package/app-typescript/components/Tag.tsx +6 -2
  15. package/dist/examples.bundle.css +191 -0
  16. package/dist/examples.bundle.js +819 -813
  17. package/dist/react/DragHandleDocs.tsx +5 -5
  18. package/dist/react/Tags.tsx +27 -22
  19. package/dist/sd_big-icons.eot +0 -0
  20. package/dist/sd_big-icons.svg +57 -55
  21. package/dist/sd_big-icons.ttf +0 -0
  22. package/dist/sd_big-icons.woff +0 -0
  23. package/dist/sd_icons.eot +0 -0
  24. package/dist/sd_icons.svg +3 -0
  25. package/dist/sd_icons.ttf +0 -0
  26. package/dist/sd_icons.woff +0 -0
  27. package/dist/superdesk-ui.bundle.css +478 -9
  28. package/dist/superdesk-ui.bundle.js +793 -789
  29. package/examples/pages/react/DragHandleDocs.tsx +5 -5
  30. package/examples/pages/react/Tags.tsx +27 -22
  31. package/package.json +1 -1
  32. package/react/components/Tag.d.ts +2 -1
  33. package/react/components/Tag.js +5 -1
package/examples/pages/react/DragHandleDocs.tsx CHANGED
@@ -57,11 +57,11 @@ export default class DragHandleDocs extends React.Component {
57
57
  // The number of dotted rows and dots in each row can be adjusted independently,
58
58
  offering a wide range of size options.
59
59
 
60
- <DragHandle dotsInRow='2' dotsInCol='5' />
61
- <DragHandle dotsInRow='2' dotsInCol='8' />
62
- <DragHandle dotsInRow='3' dotsInCol='6' />
63
- <DragHandle dotsInRow='3' dotsInCol='8' />
64
- <DragHandle dotsInRow='3' dotsInCol='10' />
60
+ <DragHandle dotsInRow='2' dotRows='5' />
61
+ <DragHandle dotsInRow='2' dotRows='8' />
62
+ <DragHandle dotsInRow='3' dotRows='6' />
63
+ <DragHandle dotsInRow='3' dotRows='8' />
64
+ <DragHandle dotsInRow='3' dotRows='10' />
65
65
  <DragHandle dotsInRow='5' dotRows='4' />
66
66
 
67
67
  // Blank
package/examples/pages/react/Tags.tsx CHANGED
@@ -17,10 +17,12 @@ export default class TagDoc extends React.Component<{}, ITag> {
17
17
  {text: 'Inverse tag', shade:'inverse'},
18
18
  {text: 'Lorem ipsum', shade:'highlight1'},
19
19
  {text: 'Dolor amet', shade:'highlight2', shape:'square'},
20
- {text: 'Read only tag', readOnly: true}
20
+ {text: 'Read only tag', readOnly: true},
21
+ {text: 'Draggable tag', draggable: true},
21
22
  ],
22
23
  tags2: [
23
24
  {text: 'Tag with label', label: 'Label'},
25
+ {text: 'I am', draggable: true, label: 'Draggable'}
24
26
  ],
25
27
  }
26
28
  this.handleClick=this.handleClick.bind(this);
@@ -53,19 +55,21 @@ export default class TagDoc extends React.Component<{}, ITag> {
53
55
 
54
56
  <Markup.ReactMarkup>
55
57
  <Markup.ReactMarkupPreview>
56
- <div className='docs-page__content-row'>
58
+ <div className='docs-page__content-row sd-display--flex sd-gap--small'>
57
59
  {this.state.tags.map((tag,index)=>{
58
- return (
59
- <React.Fragment key={index}>
60
- <Tag keyValue={index}
61
- text={tag.text}
62
- shade={tag.shade}
63
- shape={tag.shape}
64
- readOnly={tag.readOnly}
65
- onClick={()=>this.handleClick(index)}/>
66
- </React.Fragment>
60
+ return (
61
+ <React.Fragment key={index}>
62
+ <Tag keyValue={index}
63
+ text={tag.text}
64
+ shade={tag.shade}
65
+ shape={tag.shape}
66
+ label={tag.label}
67
+ readOnly={tag.readOnly}
68
+ draggable={tag.draggable}
69
+ onClick={()=>this.handleClick(index)}/>
70
+ </React.Fragment>
67
71
  )
68
- })}
72
+ })}
69
73
  </div>
70
74
  </Markup.ReactMarkupPreview>
71
75
  <Markup.ReactMarkupCode>{`
@@ -74,7 +78,7 @@ export default class TagDoc extends React.Component<{}, ITag> {
74
78
  <Tag text='Inverse tag' shade='inverse' onClick={()=>false}/>
75
79
  <Tag text='Lorem ipsum' shade='highlight1' onClick={()=>false}/>
76
80
  <Tag text='Dolor amet' shade='highlight2' shape='square' onClick={()=>false}/>
77
- <Tag text='Read only tag' readOnly={trye} onClick={()=>false}/>
81
+ <Tag text='Read only tag' readOnly={true} onClick={()=>false}/>
78
82
 
79
83
  `}
80
84
  </Markup.ReactMarkupCode>
@@ -82,17 +86,18 @@ export default class TagDoc extends React.Component<{}, ITag> {
82
86
 
83
87
  <Markup.ReactMarkup>
84
88
  <Markup.ReactMarkupPreview>
85
- <div className='docs-page__content-row'>
89
+ <div className='docs-page__content-row sd-display--flex sd-gap--small'>
86
90
  {this.state.tags2.map((tag,index)=>{
87
- return (
88
- <React.Fragment key={index}>
89
- <Tag keyValue={index}
90
- text={tag.text}
91
- label={tag.label}
92
- onClick={() => this.handleClick2(index)}/>
93
- </React.Fragment>
91
+ return (
92
+ <React.Fragment key={index}>
93
+ <Tag keyValue={index}
94
+ text={tag.text}
95
+ label={tag.label}
96
+ draggable={tag.draggable}
97
+ onClick={() => this.handleClick2(index)}/>
98
+ </React.Fragment>
94
99
  )
95
- })}
100
+ })}
96
101
  </div>
97
102
  </Markup.ReactMarkupPreview>
98
103
  <Markup.ReactMarkupCode>{`
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "superdesk-ui-framework",
3
- "version": "3.1.2",
3
+ "version": "3.1.3",
4
4
  "license": "AGPL-3.0",
5
5
  "repository": {
6
6
  "type": "git",
package/react/components/Tag.d.ts CHANGED
@@ -5,7 +5,8 @@ interface IProps {
5
5
  shade?: 'light' | 'darker' | 'highlight1' | 'highlight2' | 'inverse';
6
6
  shape?: 'round' | 'square';
7
7
  readOnly?: boolean;
8
+ draggable?: boolean;
8
9
  onClick(): void;
9
10
  }
10
- export declare const Tag: ({ text, keyValue, shade, shape, readOnly, onClick, label }: IProps) => JSX.Element;
11
+ export declare const Tag: ({ text, keyValue, shade, shape, readOnly, onClick, label, draggable }: IProps) => JSX.Element;
11
12
  export {};
package/react/components/Tag.js CHANGED
@@ -29,16 +29,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
29
29
  exports.Tag = void 0;
30
30
  var React = __importStar(require("react"));
31
31
  var classnames_1 = __importDefault(require("classnames"));
32
+ var DragHandle_1 = require("./DragHandle");
32
33
  var Tag = function (_a) {
33
34
  var _b;
34
- var text = _a.text, keyValue = _a.keyValue, shade = _a.shade, shape = _a.shape, readOnly = _a.readOnly, onClick = _a.onClick, label = _a.label;
35
+ var text = _a.text, keyValue = _a.keyValue, shade = _a.shade, shape = _a.shape, readOnly = _a.readOnly, onClick = _a.onClick, label = _a.label, draggable = _a.draggable;
35
36
  var classes = (0, classnames_1.default)('tag-label', (_b = {},
36
37
  _b["tag-label--".concat(shade)] = shade && shade !== 'light',
37
38
  _b['tag-label--square'] = shape === 'square',
39
+ _b['tag-label--draggable'] = draggable === true,
38
40
  _b));
39
41
  return (React.createElement(React.Fragment, null, label
40
42
  ?
41
43
  React.createElement("span", { className: classes, key: keyValue },
44
+ draggable && React.createElement(DragHandle_1.DragHandle, { blank: true, dotsInRow: '3', dotRows: '4' }),
42
45
  React.createElement("span", { className: 'tag-label--text-wrapper' },
43
46
  React.createElement("span", { className: 'tag-label--text-label' },
44
47
  label,
@@ -48,6 +51,7 @@ var Tag = function (_a) {
48
51
  React.createElement("i", { className: 'icon-close-small' })) : null)
49
52
  :
50
53
  React.createElement("span", { className: classes, key: keyValue },
54
+ draggable && React.createElement(DragHandle_1.DragHandle, { blank: true, dotsInRow: '3', dotRows: '4' }),
51
55
  React.createElement("span", { className: 'tag-label--text' }, text),
52
56
  !readOnly ? React.createElement("button", { className: 'tag-label__remove', onClick: onClick },
53
57
  React.createElement("i", { className: 'icon-close-small' })) : null)));