superdesk-ui-framework 3.0.0-rc12 → 3.0.0

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 (107) hide show
  1. package/.vscode/settings.json +5 -0
  2. package/app/fonts/sd_icons.eot +0 -0
  3. package/app/fonts/sd_icons.svg +1 -0
  4. package/app/fonts/sd_icons.ttf +0 -0
  5. package/app/fonts/sd_icons.woff +0 -0
  6. package/app/styles/_icon-font.scss +1 -0
  7. package/app/styles/_master-desk.scss +2 -2
  8. package/app/styles/_modals.scss +1 -0
  9. package/app/styles/app.scss +1 -0
  10. package/app/styles/components/_sd-pagination.scss +41 -0
  11. package/app/styles/grids/_grid-layout.scss +4 -14
  12. package/app/styles/menus/_sd-sidebar-menu.scss +1 -1
  13. package/app/styles/primereact/_pr-datepicker.scss +12 -0
  14. package/app/styles/primereact/_pr-dialog.scss +4 -0
  15. package/app/styles/variables/_colors.scss +37 -37
  16. package/app/template/search-handler.html +2 -2
  17. package/app-typescript/components/DatePicker.tsx +8 -9
  18. package/app-typescript/components/Layouts/CoreLayout.tsx +2 -1
  19. package/app-typescript/components/Layouts/CoreLayoutMain.tsx +4 -1
  20. package/app-typescript/components/Lists/ContentList.tsx +3 -2
  21. package/app-typescript/components/Lists/TableList.tsx +17 -8
  22. package/app-typescript/components/Modal.tsx +6 -2
  23. package/app-typescript/components/Navigation/SideBarMenu.tsx +30 -4
  24. package/app-typescript/dist/components/Alert.d.ts +16 -0
  25. package/app-typescript/dist/components/Autocomplete.d.ts +48 -0
  26. package/app-typescript/dist/components/Avatar.d.ts +33 -0
  27. package/app-typescript/dist/components/Badge.d.ts +13 -0
  28. package/app-typescript/dist/components/Button.d.ts +23 -0
  29. package/app-typescript/dist/components/ButtonGroup.d.ts +12 -0
  30. package/app-typescript/dist/components/CheckButtonGroup.d.ts +11 -0
  31. package/app-typescript/dist/components/CheckGroup.d.ts +9 -0
  32. package/app-typescript/dist/components/Checkbox.d.ts +19 -0
  33. package/app-typescript/dist/components/CheckboxButton.d.ts +19 -0
  34. package/app-typescript/dist/components/DatePicker.d.ts +37 -0
  35. package/app-typescript/dist/components/Divider.d.ts +9 -0
  36. package/app-typescript/dist/components/DonutChart.d.ts +12 -0
  37. package/app-typescript/dist/components/Dropdown.d.ts +28 -0
  38. package/app-typescript/dist/components/DropdownFirst.d.ts +42 -0
  39. package/app-typescript/dist/components/EmptyState.d.ts +11 -0
  40. package/app-typescript/dist/components/FormLabel.d.ts +9 -0
  41. package/app-typescript/dist/components/Genie.d.ts +13 -0
  42. package/app-typescript/dist/components/GridItem.d.ts +69 -0
  43. package/app-typescript/dist/components/GridList.d.ts +14 -0
  44. package/app-typescript/dist/components/HeadingText.d.ts +10 -0
  45. package/app-typescript/dist/components/HelloWorld.d.ts +8 -0
  46. package/app-typescript/dist/components/Icon.d.ts +12 -0
  47. package/app-typescript/dist/components/IconButton.d.ts +12 -0
  48. package/app-typescript/dist/components/IconLabel.d.ts +11 -0
  49. package/app-typescript/dist/components/Input.d.ts +24 -0
  50. package/app-typescript/dist/components/Label.d.ts +15 -0
  51. package/app-typescript/dist/components/LeftMenu.d.ts +26 -0
  52. package/app-typescript/dist/components/Loader.d.ts +8 -0
  53. package/app-typescript/dist/components/NavButton.d.ts +15 -0
  54. package/app-typescript/dist/components/Popover.d.ts +13 -0
  55. package/app-typescript/dist/components/PropsList.d.ts +15 -0
  56. package/app-typescript/dist/components/Radio.d.ts +19 -0
  57. package/app-typescript/dist/components/RadioButton.d.ts +20 -0
  58. package/app-typescript/dist/components/Select.d.ts +29 -0
  59. package/app-typescript/dist/components/SelectWithTemplate.d.ts +32 -0
  60. package/app-typescript/dist/components/SlidingToolbar.d.ts +8 -0
  61. package/app-typescript/dist/components/StrechBar.d.ts +4 -0
  62. package/app-typescript/dist/components/SubNav.d.ts +10 -0
  63. package/app-typescript/dist/components/Switch.d.ts +12 -0
  64. package/app-typescript/dist/components/TabCustom.d.ts +25 -0
  65. package/app-typescript/dist/components/TabList.d.ts +22 -0
  66. package/app-typescript/dist/components/Tag.d.ts +9 -0
  67. package/app-typescript/dist/components/TagInput.d.ts +7 -0
  68. package/app-typescript/dist/components/TagInputTest.d.ts +18 -0
  69. package/app-typescript/dist/components/TimePicker.d.ts +11 -0
  70. package/app-typescript/dist/components/Tooltip.d.ts +11 -0
  71. package/app-typescript/dist/components/_Positioner.d.ts +27 -0
  72. package/app-typescript/dist/index.d.ts +56 -0
  73. package/dist/examples.bundle.css +39 -0
  74. package/dist/examples.bundle.js +1905 -1471
  75. package/dist/playgrounds/react-playgrounds/CoreLayout.tsx +505 -3
  76. package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +12 -9
  77. package/dist/playgrounds/react-playgrounds/Rundowns.tsx +6 -6
  78. package/dist/playgrounds/react-playgrounds/TestGround.tsx +29 -1
  79. package/dist/react/DatePicker.tsx +50 -2
  80. package/dist/react/Modal.tsx +154 -22
  81. package/dist/sd_icons.eot +0 -0
  82. package/dist/sd_icons.svg +1 -0
  83. package/dist/sd_icons.ttf +0 -0
  84. package/dist/sd_icons.woff +0 -0
  85. package/dist/superdesk-ui.bundle.css +175 -21
  86. package/dist/superdesk-ui.bundle.js +1059 -1033
  87. package/dist/vendor.bundle.js +7 -7
  88. package/examples/pages/playgrounds/react-playgrounds/CoreLayout.tsx +505 -3
  89. package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +12 -9
  90. package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +6 -6
  91. package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx +29 -1
  92. package/examples/pages/react/DatePicker.tsx +50 -2
  93. package/examples/pages/react/Modal.tsx +154 -22
  94. package/package.json +1 -1
  95. package/react/components/DatePicker.d.ts +2 -2
  96. package/react/components/DatePicker.js +3 -3
  97. package/react/components/Layouts/CoreLayout.d.ts +1 -0
  98. package/react/components/Layouts/CoreLayout.js +1 -1
  99. package/react/components/Layouts/CoreLayoutMain.d.ts +1 -0
  100. package/react/components/Layouts/CoreLayoutMain.js +1 -1
  101. package/react/components/Lists/ContentList.js +3 -2
  102. package/react/components/Lists/TableList.js +12 -4
  103. package/react/components/Modal.d.ts +2 -0
  104. package/react/components/Modal.js +3 -3
  105. package/react/components/Navigation/SideBarMenu.d.ts +6 -0
  106. package/react/components/Navigation/SideBarMenu.js +19 -2
  107. package/yarn-error.log +111 -0
@@ -0,0 +1,32 @@
1
+ import * as React from 'react';
2
+ import { Dropdown } from '@superdesk/primereact/dropdown';
3
+ interface IProps<T> {
4
+ getItems(searchString: string | null): Promise<Array<T>>;
5
+ value: T;
6
+ getLabel(option: T): string;
7
+ onChange(value: T): void;
8
+ areEqual(a: T, b: T): boolean;
9
+ itemTemplate: React.ComponentType<{
10
+ option: T | null;
11
+ }>;
12
+ noResultsFoundMessage: string;
13
+ filterPlaceholder?: string;
14
+ disabled?: boolean;
15
+ required?: boolean;
16
+ autoFocus?: boolean;
17
+ autoOpen?: boolean;
18
+ width?: 'min' | '100%';
19
+ zIndex?: number;
20
+ 'data-test-id'?: string;
21
+ }
22
+ interface IState<T> {
23
+ options: Array<T>;
24
+ loading: boolean;
25
+ }
26
+ export declare class SelectWithTemplate<T> extends React.Component<IProps<T>, IState<T>> {
27
+ componentRef: Dropdown | null;
28
+ constructor(props: IProps<T>);
29
+ componentDidMount(): void;
30
+ render(): JSX.Element;
31
+ }
32
+ export {};
@@ -0,0 +1,8 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ multi: boolean;
4
+ }
5
+ export declare class SlidingToolbar extends React.PureComponent<IProps> {
6
+ render(): JSX.Element;
7
+ }
8
+ export {};
@@ -0,0 +1,4 @@
1
+ import * as React from 'react';
2
+ export declare class StrechBar extends React.PureComponent {
3
+ render(): JSX.Element;
4
+ }
@@ -0,0 +1,10 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ color?: 'light' | 'darker' | 'blueGrey' | 'blueGreyDarker' | 'darkUi';
4
+ zIndex?: number;
5
+ theme?: 'light' | 'dark';
6
+ }
7
+ export declare class SubNav extends React.PureComponent<IProps> {
8
+ render(): JSX.Element;
9
+ }
10
+ export {};
@@ -0,0 +1,12 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ value: boolean;
4
+ disabled?: boolean;
5
+ onChange(nextValue: boolean): void;
6
+ }
7
+ export declare class Switch extends React.PureComponent<IProps> {
8
+ constructor(props: IProps);
9
+ onClick(): void;
10
+ render(): JSX.Element;
11
+ }
12
+ export {};
@@ -0,0 +1,25 @@
1
+ interface ITabs {
2
+ size?: 'normal' | 'large' | 'small';
3
+ theme?: 'light' | 'dark';
4
+ ariaLabel?: string;
5
+ children: Array<any>;
6
+ onClick(i: number): void;
7
+ }
8
+ interface ITabLabel {
9
+ label: string;
10
+ indexValue: number;
11
+ }
12
+ interface ITabContent {
13
+ theme?: 'light' | 'dark';
14
+ children: any;
15
+ activePanel: number;
16
+ }
17
+ interface ITabPanel {
18
+ indexValue: number;
19
+ children: any;
20
+ }
21
+ export declare const TabLabel: ({ label }: ITabLabel) => JSX.Element;
22
+ export declare const Tabs: ({ size, theme, ariaLabel, children, onClick }: ITabs) => JSX.Element;
23
+ export declare const TabContent: ({ theme, children, activePanel }: ITabContent) => JSX.Element;
24
+ export declare const TabPanel: ({ children, indexValue }: ITabPanel) => JSX.Element;
25
+ export {};
@@ -0,0 +1,22 @@
1
+ import * as React from 'react';
2
+ interface ITabList {
3
+ size?: 'normal' | 'large' | 'small';
4
+ theme?: 'light' | 'dark';
5
+ children: Array<any>;
6
+ }
7
+ interface IState {
8
+ index: number;
9
+ }
10
+ interface ITab {
11
+ label: string;
12
+ }
13
+ declare class Tab extends React.PureComponent<ITab> {
14
+ render(): JSX.Element;
15
+ }
16
+ declare class TabList extends React.PureComponent<ITabList, IState> {
17
+ constructor(props: ITabList);
18
+ private handleChange;
19
+ goTo(label: string): void;
20
+ render(): JSX.Element;
21
+ }
22
+ export { Tab, TabList };
@@ -0,0 +1,9 @@
1
+ interface IProps {
2
+ text: string;
3
+ keyValue?: number;
4
+ shade?: 'light' | 'darker' | 'highlight1' | 'highlight2';
5
+ shape?: 'round' | 'square';
6
+ onClick(): void;
7
+ }
8
+ export declare const Tag: ({ text, keyValue, shade, shape, onClick }: IProps) => JSX.Element;
9
+ export {};
@@ -0,0 +1,7 @@
1
+ interface ITagInput {
2
+ items?: Array<any>;
3
+ label: string;
4
+ freetype?: boolean;
5
+ }
6
+ export declare const TagInput: ({ items, label, freetype }: ITagInput) => JSX.Element;
7
+ export {};
@@ -0,0 +1,18 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ items: Array<any>;
4
+ keyValue: string;
5
+ minLength?: number;
6
+ }
7
+ interface IState {
8
+ selectedItem: any;
9
+ filteredItems: any;
10
+ }
11
+ export declare class TagInputTest extends React.Component<IProps, IState> {
12
+ constructor(props: IProps);
13
+ searchItem(event: any): void;
14
+ itemTemplate(item: any): JSX.Element;
15
+ handleItem(e: any): void;
16
+ render(): JSX.Element;
17
+ }
18
+ export {};
@@ -0,0 +1,11 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ value: string;
4
+ onChange(valueNext: string): void;
5
+ required?: boolean;
6
+ disabled?: boolean;
7
+ }
8
+ export declare class TimePicker extends React.PureComponent<IProps> {
9
+ render(): JSX.Element;
10
+ }
11
+ export {};
@@ -0,0 +1,11 @@
1
+ import * as React from 'react';
2
+ interface IProps {
3
+ text: string;
4
+ flow?: 'top' | 'left' | 'right' | 'down';
5
+ }
6
+ export declare class Tooltip extends React.PureComponent<IProps> {
7
+ htmlId: string;
8
+ componentDidMount(): void;
9
+ render(): JSX.Element;
10
+ }
11
+ export {};
@@ -0,0 +1,27 @@
1
+ import * as React from 'react';
2
+ import { PopperOptions } from 'popper.js';
3
+ declare type ICloseOthersEvent = CustomEvent<{
4
+ triggerElement: HTMLElement;
5
+ }>;
6
+ interface IPropsPositioner {
7
+ triggerSelector: string;
8
+ placement: PopperOptions['placement'];
9
+ zIndex?: number;
10
+ className?: string;
11
+ }
12
+ interface IStatePositioner {
13
+ open: boolean;
14
+ }
15
+ export declare class Positioner extends React.Component<IPropsPositioner, IStatePositioner> {
16
+ elementForPositioner: HTMLDivElement;
17
+ triggerElement: HTMLElement;
18
+ constructor(props: IPropsPositioner);
19
+ handleCloseOthers(event: ICloseOthersEvent): void;
20
+ componentDidMount(): void;
21
+ componentWillUnmount(): void;
22
+ toggleDropdown(e: MouseEvent): void;
23
+ closeDropdownOnOutsideClick(wrapper: HTMLElement, event: MouseEvent): void;
24
+ componentDidUpdate(): void;
25
+ render(): null;
26
+ }
27
+ export {};
@@ -0,0 +1,56 @@
1
+ export { HelloWorld } from './components/HelloWorld';
2
+ export { Button } from './components/Button';
3
+ export { Input } from './components/Input';
4
+ export { Select, Option } from './components/Select';
5
+ export { SelectWithTemplate } from './components/SelectWithTemplate';
6
+ export { Popover } from './components/Popover';
7
+ export { Label } from './components/Label';
8
+ export { Badge } from './components/Badge';
9
+ export { Alert } from './components/Alert';
10
+ export { AvatarWrapper } from './components/Avatar';
11
+ export { AvatarContentText } from './components/Avatar';
12
+ export { AvatarContentImage } from './components/Avatar';
13
+ export { IconButton } from './components/IconButton';
14
+ export { IconLabel } from './components/IconLabel';
15
+ export { Tooltip } from './components/Tooltip';
16
+ export { DatePicker } from './components/DatePicker';
17
+ export { DatePickerISO } from './components/DatePicker';
18
+ export { DatePickerLocaleSettings } from './components/DatePicker';
19
+ export { TimePicker } from './components/TimePicker';
20
+ export { FormLabel } from './components/FormLabel';
21
+ export { Switch } from './components/Switch';
22
+ export { ButtonGroup } from './components/ButtonGroup';
23
+ export { Loader } from './components/Loader';
24
+ export { Radio } from './components/Radio';
25
+ export { Checkbox } from './components/Checkbox';
26
+ export { RadioButton } from './components/RadioButton';
27
+ export { CheckboxButton } from './components/CheckboxButton';
28
+ export { CheckGroup } from './components/CheckGroup';
29
+ export { CheckButtonGroup } from './components/CheckButtonGroup';
30
+ export { NavButton } from './components/NavButton';
31
+ export { Tab, TabList } from './components/TabList';
32
+ export { LeftMenu } from './components/LeftMenu';
33
+ export { SubNav } from './components/SubNav';
34
+ export { SlidingToolbar } from './components/SlidingToolbar';
35
+ export { StrechBar } from './components/StrechBar';
36
+ export { PropsList, Prop } from './components/PropsList';
37
+ export { Icon } from './components/Icon';
38
+ export { Divider } from './components/Divider';
39
+ export { HeadingText } from './components/HeadingText';
40
+ export { DropdownFirst } from './components/DropdownFirst';
41
+ export { DropdownItem } from './components/DropdownFirst';
42
+ export { DropdownLabel } from './components/DropdownFirst';
43
+ export { DropdownDivider } from './components/DropdownFirst';
44
+ export { Dropdown } from './components/Dropdown';
45
+ export { Tag } from './components/Tag';
46
+ export { TabLabel, TabPanel, TabContent, Tabs } from './components/TabCustom';
47
+ export { EmptyState } from './components/EmptyState';
48
+ export { Autocomplete } from './components/Autocomplete';
49
+ export { DonutChart } from './components/DonutChart';
50
+ export { TagInput } from './components/TagInput';
51
+ export { TagInputTest } from './components/TagInputTest';
52
+ export { Genie } from './components/Genie';
53
+ export { GridList } from './components/GridList';
54
+ export { GridItem, GridItemContent, GridItemMedia, GridItemFooter, GridItemContentBlock, GridItemTime, GridItemTitle, GridItemText, GridItemSlug, GridItemFooterBlock, GridItemFooterActions, GridItemTopActions, GridItemCheckWrapper } from './components/GridItem';
55
+ export declare const ToggleBoxNext: any;
56
+ export declare const reactToAngular1: any;
@@ -11105,6 +11105,45 @@ doc-react-playground {
11105
11105
  --icon-base-size: 64px
11106
11106
  ; }
11107
11107
 
11108
+ .icon-text-block:before {
11109
+ content: ""; }
11110
+
11111
+ .icon-text-block.color--default {
11112
+ color: var(--color-icon-default); }
11113
+
11114
+ .icon-text-block.color--primary {
11115
+ color: var(--sd-colour-primary) !important; }
11116
+
11117
+ .icon-text-block.color--success {
11118
+ color: var(--sd-colour-success) !important; }
11119
+
11120
+ .icon-text-block.color--warning {
11121
+ color: var(--sd-colour-warning) !important; }
11122
+
11123
+ .icon-text-block.color--alert {
11124
+ color: var(--sd-colour-alert) !important; }
11125
+
11126
+ .icon-text-block.color--highlight {
11127
+ color: var(--sd-colour-highlight) !important; }
11128
+
11129
+ .icon-text-block.color--light {
11130
+ color: var(--color-text-lighter) !important; }
11131
+
11132
+ .icon-text-block.color--white {
11133
+ color: #e2e5e9 !important; }
11134
+
11135
+ .icon-text-block.scale--2x {
11136
+ --icon-base-size: 32px
11137
+ ; }
11138
+
11139
+ .icon-text-block.scale--3x {
11140
+ --icon-base-size: 48px
11141
+ ; }
11142
+
11143
+ .icon-text-block.scale--4x {
11144
+ --icon-base-size: 64px
11145
+ ; }
11146
+
11108
11147
  .icn-mix {
11109
11148
  position: relative;
11110
11149
  display: inline-flex !important;