superdesk-ui-framework 3.0.1-beta.13 → 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.
- package/.vscode/settings.json +5 -0
- package/app/styles/_table-list.scss +1 -0
- package/app/styles/dropdowns/_basic-dropdown.scss +6 -0
- package/app-typescript/components/Dropdown.tsx +65 -65
- package/app-typescript/components/DurationInput.tsx +14 -4
- package/app-typescript/components/Lists/ContentList.tsx +28 -4
- package/app-typescript/components/Lists/TableList.tsx +11 -9
- package/app-typescript/dist/components/Alert.d.ts +16 -0
- package/app-typescript/dist/components/Autocomplete.d.ts +48 -0
- package/app-typescript/dist/components/Avatar.d.ts +33 -0
- package/app-typescript/dist/components/Badge.d.ts +13 -0
- package/app-typescript/dist/components/Button.d.ts +23 -0
- package/app-typescript/dist/components/ButtonGroup.d.ts +12 -0
- package/app-typescript/dist/components/CheckButtonGroup.d.ts +11 -0
- package/app-typescript/dist/components/CheckGroup.d.ts +9 -0
- package/app-typescript/dist/components/Checkbox.d.ts +19 -0
- package/app-typescript/dist/components/CheckboxButton.d.ts +19 -0
- package/app-typescript/dist/components/DatePicker.d.ts +37 -0
- package/app-typescript/dist/components/Divider.d.ts +9 -0
- package/app-typescript/dist/components/DonutChart.d.ts +12 -0
- package/app-typescript/dist/components/Dropdown.d.ts +28 -0
- package/app-typescript/dist/components/DropdownFirst.d.ts +42 -0
- package/app-typescript/dist/components/EmptyState.d.ts +11 -0
- package/app-typescript/dist/components/FormLabel.d.ts +9 -0
- package/app-typescript/dist/components/Genie.d.ts +13 -0
- package/app-typescript/dist/components/GridItem.d.ts +69 -0
- package/app-typescript/dist/components/GridList.d.ts +14 -0
- package/app-typescript/dist/components/HeadingText.d.ts +10 -0
- package/app-typescript/dist/components/HelloWorld.d.ts +8 -0
- package/app-typescript/dist/components/Icon.d.ts +12 -0
- package/app-typescript/dist/components/IconButton.d.ts +12 -0
- package/app-typescript/dist/components/IconLabel.d.ts +11 -0
- package/app-typescript/dist/components/Input.d.ts +24 -0
- package/app-typescript/dist/components/Label.d.ts +15 -0
- package/app-typescript/dist/components/LeftMenu.d.ts +26 -0
- package/app-typescript/dist/components/Loader.d.ts +8 -0
- package/app-typescript/dist/components/NavButton.d.ts +15 -0
- package/app-typescript/dist/components/Popover.d.ts +13 -0
- package/app-typescript/dist/components/PropsList.d.ts +15 -0
- package/app-typescript/dist/components/Radio.d.ts +19 -0
- package/app-typescript/dist/components/RadioButton.d.ts +20 -0
- package/app-typescript/dist/components/Select.d.ts +29 -0
- package/app-typescript/dist/components/SelectWithTemplate.d.ts +32 -0
- package/app-typescript/dist/components/SlidingToolbar.d.ts +8 -0
- package/app-typescript/dist/components/StrechBar.d.ts +4 -0
- package/app-typescript/dist/components/SubNav.d.ts +10 -0
- package/app-typescript/dist/components/Switch.d.ts +12 -0
- package/app-typescript/dist/components/TabCustom.d.ts +25 -0
- package/app-typescript/dist/components/TabList.d.ts +22 -0
- package/app-typescript/dist/components/Tag.d.ts +9 -0
- package/app-typescript/dist/components/TagInput.d.ts +7 -0
- package/app-typescript/dist/components/TagInputTest.d.ts +18 -0
- package/app-typescript/dist/components/TimePicker.d.ts +11 -0
- package/app-typescript/dist/components/Tooltip.d.ts +11 -0
- package/app-typescript/dist/components/_Positioner.d.ts +27 -0
- package/app-typescript/dist/index.d.ts +56 -0
- package/dist/examples.bundle.js +538 -122
- package/dist/playgrounds/react-playgrounds/RundownEditor.tsx +3 -9
- package/dist/playgrounds/react-playgrounds/Rundowns.tsx +9 -19
- package/dist/react/ContentList.tsx +2 -10
- package/dist/react/Dropdowns.tsx +357 -5
- package/dist/react/TableList.tsx +28 -30
- package/dist/superdesk-ui.bundle.css +8 -3
- package/dist/superdesk-ui.bundle.js +232 -94
- package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx +3 -9
- package/examples/pages/playgrounds/react-playgrounds/Rundowns.tsx +9 -19
- package/examples/pages/react/ContentList.tsx +2 -10
- package/examples/pages/react/Dropdowns.tsx +357 -5
- package/examples/pages/react/TableList.tsx +28 -30
- package/package.json +1 -1
- package/react/components/Dropdown.d.ts +4 -4
- package/react/components/Dropdown.js +19 -15
- package/react/components/DurationInput.d.ts +1 -1
- package/react/components/DurationInput.js +14 -4
- package/react/components/Lists/ContentList.d.ts +5 -0
- package/react/components/Lists/ContentList.js +36 -15
- package/react/components/Lists/TableList.d.ts +5 -5
- package/react/components/Lists/TableList.js +6 -4
- package/yarn-error.log +111 -0
package/dist/examples.bundle.js
CHANGED
@@ -39266,7 +39266,7 @@ var DurationInput = /** @class */ (function (_super) {
|
|
39266
39266
|
return DurationInput;
|
39267
39267
|
}(React.PureComponent));
|
39268
39268
|
exports.DurationInput = DurationInput;
|
39269
|
-
function getDurationString(seconds) {
|
39269
|
+
function getDurationString(seconds, zero) {
|
39270
39270
|
function zeroPad(value) {
|
39271
39271
|
if (value.toString().length === 1 || value === 0) {
|
39272
39272
|
return "0".concat(value);
|
@@ -39278,9 +39278,19 @@ function getDurationString(seconds) {
|
|
39278
39278
|
return value;
|
39279
39279
|
}
|
39280
39280
|
}
|
39281
|
-
var hour
|
39282
|
-
var minute
|
39283
|
-
var second
|
39281
|
+
var hour;
|
39282
|
+
var minute;
|
39283
|
+
var second;
|
39284
|
+
if (zero) {
|
39285
|
+
hour = zeroPad(Math.floor(seconds / 3600));
|
39286
|
+
minute = zeroPad(Math.floor((seconds % 3600) / 60));
|
39287
|
+
second = zeroPad(Math.floor(seconds % 60));
|
39288
|
+
}
|
39289
|
+
else {
|
39290
|
+
hour = Math.floor(seconds / 3600);
|
39291
|
+
minute = Math.floor((seconds % 3600) / 60);
|
39292
|
+
second = Math.floor(seconds % 60);
|
39293
|
+
}
|
39284
39294
|
if (Number(hour) === 0 && Number(minute) > 0) {
|
39285
39295
|
return "".concat(minute, "m ").concat(second, "s");
|
39286
39296
|
}
|
@@ -41124,7 +41134,7 @@ var TableList = /** @class */ (function (_super) {
|
|
41124
41134
|
this.props.onDrag(result.source.index, result.destination.index) : null;
|
41125
41135
|
};
|
41126
41136
|
TableList.prototype.dropDown = function () {
|
41127
|
-
return (React.createElement(Dropdown_1.Dropdown, { items: this.props.itemsDropdown ? this.props.itemsDropdown : [] },
|
41137
|
+
return (React.createElement(Dropdown_1.Dropdown, { items: this.props.itemsDropdown ? this.props.itemsDropdown() : [] },
|
41128
41138
|
React.createElement(Button_1.Button, { type: "primary", icon: "plus-large", text: "Add item", size: "small", shape: "round", iconOnly: true, onClick: function () { return false; } })));
|
41129
41139
|
};
|
41130
41140
|
TableList.prototype.render = function () {
|
@@ -41143,7 +41153,9 @@ var TableList = /** @class */ (function (_super) {
|
|
41143
41153
|
_this.state.items.map(function (item, index) { return (React.createElement(react_beautiful_dnd_1.Draggable, { key: index, draggableId: "".concat(index), index: index }, function (provided2, _snapshot2) { return (React.createElement("div", __assign({ ref: provided2.innerRef }, provided2.draggableProps, provided2.dragHandleProps),
|
41144
41154
|
React.createElement(TableListItem, { dragAndDrop: _this.props.dragAndDrop, start: item.start, center: item.center, end: item.end, action: item.action, onClick: item.onClick ? item.onClick : undefined, onDoubleClick: item.onDoubleClick
|
41145
41155
|
? item.onDoubleClick
|
41146
|
-
: undefined, addItem: _this.props.addItem, itemsDropdown:
|
41156
|
+
: undefined, addItem: _this.props.addItem, itemsDropdown: function () { return _this.props.itemsDropdown
|
41157
|
+
? _this.props.itemsDropdown(index)
|
41158
|
+
: []; }, hexColor: item.hexColor, onAddItem: function () { return _this.props.onAddItem
|
41147
41159
|
&& _this.props.onAddItem(index, item); }, showDragHandle: _this.props.showDragHandle }))); })); }),
|
41148
41160
|
provided.placeholder,
|
41149
41161
|
(_this.props.addItem && !_this.props.readOnly) &&
|
@@ -41153,7 +41165,7 @@ var TableList = /** @class */ (function (_super) {
|
|
41153
41165
|
: React.createElement("ul", { className: classes },
|
41154
41166
|
this.state.items.map(function (item, index) { return (React.createElement(TableListItem, { key: index, start: item.start, center: item.center, end: item.end, action: item.action, onClick: item.onClick ? item.onClick : undefined, onDoubleClick: item.onDoubleClick
|
41155
41167
|
? item.onDoubleClick
|
41156
|
-
: undefined, addItem: _this.props.addItem, itemsDropdown: _this.props.itemsDropdown, hexColor: item.hexColor, onAddItem: function () { return _this.props.onAddItem
|
41168
|
+
: undefined, addItem: _this.props.addItem, itemsDropdown: function () { return _this.props.itemsDropdown ? _this.props.itemsDropdown(index) : []; }, hexColor: item.hexColor, onAddItem: function () { return _this.props.onAddItem
|
41157
41169
|
&& _this.props.onAddItem(index, item); } })); }),
|
41158
41170
|
(this.props.addItem && !this.props.readOnly) &&
|
41159
41171
|
React.createElement("li", { className: "table-list__add-item table-list__item--margin" },
|
@@ -41215,7 +41227,7 @@ var TableListItem = /** @class */ (function (_super) {
|
|
41215
41227
|
React.createElement("div", { className: 'table-list__add-bar-container' },
|
41216
41228
|
React.createElement(Tooltip_1.Tooltip, { text: 'Add item', flow: 'top', appendToBody: true },
|
41217
41229
|
React.createElement("div", { className: 'table-list__add-bar' },
|
41218
|
-
React.createElement(Dropdown_1.Dropdown, { onChange: this.props.onAddItem, items: this.props.itemsDropdown ? this.props.itemsDropdown : [] },
|
41230
|
+
React.createElement(Dropdown_1.Dropdown, { onChange: this.props.onAddItem, items: this.props.itemsDropdown ? this.props.itemsDropdown() : [] },
|
41219
41231
|
React.createElement(Button_1.Button, { type: "primary", icon: "plus-large", text: "Add item", size: "small", shape: "round", iconOnly: true, onClick: function () { return false; } }))))))
|
41220
41232
|
: React.createElement("li", { className: "".concat(classes, " table-list__item--margin"), onClick: function () { return _this.onSingleClick(); }, onDoubleClick: function () { return _this.onDoubleClick(); } },
|
41221
41233
|
React.createElement("div", { className: 'table-list__item-border', style: { backgroundColor: this.props.hexColor } }),
|
@@ -57384,12 +57396,12 @@ var React = __importStar(__webpack_require__(0));
|
|
57384
57396
|
var ReactDOM = __importStar(__webpack_require__(9));
|
57385
57397
|
var core_1 = __webpack_require__(61);
|
57386
57398
|
var react_id_generator_1 = __webpack_require__(8);
|
57399
|
+
var DROPDOWN_ID_CONTAINER = "sd-dropdown-constainer";
|
57387
57400
|
var Dropdown = function (_a) {
|
57388
57401
|
var items = _a.items, header = _a.header, footer = _a.footer, children = _a.children, append = _a.append, align = _a.align, onChange = _a.onChange;
|
57389
57402
|
var _b = React.useState(false), open = _b[0], setOpen = _b[1];
|
57390
57403
|
var _c = React.useState(false), change = _c[0], setChange = _c[1];
|
57391
57404
|
var menuID = (0, react_id_generator_1.useId)()[0];
|
57392
|
-
var DROPDOWN_ID = "react-placeholder";
|
57393
57405
|
var ref = React.useRef(null);
|
57394
57406
|
var buttonRef = React.useRef(null);
|
57395
57407
|
var headerElements = header === null || header === void 0 ? void 0 : header.map(function (el, index) {
|
@@ -57402,11 +57414,10 @@ var Dropdown = function (_a) {
|
|
57402
57414
|
return each(el, index);
|
57403
57415
|
});
|
57404
57416
|
React.useEffect(function () {
|
57405
|
-
var existingElement = document.getElementById(
|
57417
|
+
var existingElement = document.getElementById(DROPDOWN_ID_CONTAINER);
|
57406
57418
|
if (!existingElement) {
|
57407
57419
|
var el = document.createElement("div");
|
57408
|
-
el.id =
|
57409
|
-
// style placeholder
|
57420
|
+
el.id = DROPDOWN_ID_CONTAINER;
|
57410
57421
|
el.style.position = 'absolute';
|
57411
57422
|
el.style.top = '0';
|
57412
57423
|
el.style.left = '0';
|
@@ -57421,7 +57432,6 @@ var Dropdown = function (_a) {
|
|
57421
57432
|
}
|
57422
57433
|
setChange(true);
|
57423
57434
|
}, [open]);
|
57424
|
-
// structure for append menu
|
57425
57435
|
function createAppendMenu() {
|
57426
57436
|
if (header && footer) {
|
57427
57437
|
return (React.createElement("div", { className: 'dropdown__menu dropdown__menu--has-head-foot', id: menuID, role: 'menu', ref: ref },
|
@@ -57443,7 +57453,6 @@ var Dropdown = function (_a) {
|
|
57443
57453
|
return (React.createElement("ul", { className: 'dropdown__menu ', id: menuID, role: 'menu', ref: ref }, dropdownElements));
|
57444
57454
|
}
|
57445
57455
|
}
|
57446
|
-
// toggle menu
|
57447
57456
|
function toggleDisplay() {
|
57448
57457
|
if (!open) {
|
57449
57458
|
var menuRef_1;
|
@@ -57492,15 +57501,14 @@ var Dropdown = function (_a) {
|
|
57492
57501
|
}
|
57493
57502
|
}
|
57494
57503
|
function addInPlaceholder() {
|
57495
|
-
var placeholder = document.getElementById(
|
57504
|
+
var placeholder = document.getElementById(DROPDOWN_ID_CONTAINER);
|
57496
57505
|
var menu = createAppendMenu();
|
57497
57506
|
if (open) {
|
57498
57507
|
return ReactDOM.render(menu, placeholder);
|
57499
57508
|
}
|
57500
57509
|
else {
|
57501
|
-
|
57502
|
-
|
57503
|
-
menuDOM.style.display = 'none';
|
57510
|
+
if (placeholder) {
|
57511
|
+
ReactDOM.unmountComponentAtNode(placeholder);
|
57504
57512
|
}
|
57505
57513
|
}
|
57506
57514
|
}
|
@@ -57510,7 +57518,7 @@ var Dropdown = function (_a) {
|
|
57510
57518
|
item['items'].forEach(function (el, key) {
|
57511
57519
|
submenuItems_1.push(each(el, key));
|
57512
57520
|
});
|
57513
|
-
return (React.createElement(DropdownItemWithSubmenu, { key: index, item: item, subMenuItems: submenuItems_1 }));
|
57521
|
+
return (React.createElement(DropdownItemWithSubmenu, { key: index, index: index, item: item, menuID: menuID, subMenuItems: submenuItems_1, onChange: onChange }));
|
57514
57522
|
}
|
57515
57523
|
else if (item['type'] === 'group') {
|
57516
57524
|
var groupItems_1 = [];
|
@@ -57580,19 +57588,20 @@ var DropdownItem = function (_a) {
|
|
57580
57588
|
label)));
|
57581
57589
|
};
|
57582
57590
|
var DropdownItemWithSubmenu = function (_a) {
|
57583
|
-
var index = _a.index, item = _a.item, subMenuItems = _a.subMenuItems;
|
57591
|
+
var index = _a.index, item = _a.item, menuID = _a.menuID, subMenuItems = _a.subMenuItems, onChange = _a.onChange;
|
57584
57592
|
var _b = React.useState(undefined), open = _b[0], setOpen = _b[1];
|
57585
57593
|
var refButtonSubMenu = React.useRef(null);
|
57586
57594
|
var refSubMenu = React.useRef(null);
|
57595
|
+
var placeholder = document.getElementById(menuID);
|
57587
57596
|
React.useEffect(function () {
|
57588
57597
|
var subMenuRef = refSubMenu.current;
|
57589
57598
|
var subToggleRef = refButtonSubMenu.current;
|
57590
57599
|
if (open === true) {
|
57591
|
-
|
57600
|
+
placeholder === null || placeholder === void 0 ? void 0 : placeholder.appendChild(subMenuRef);
|
57592
57601
|
subMenuRef.style.display = 'block';
|
57593
57602
|
}
|
57594
57603
|
else if (open === false) {
|
57595
|
-
|
57604
|
+
placeholder === null || placeholder === void 0 ? void 0 : placeholder.removeChild(subMenuRef);
|
57596
57605
|
subMenuRef.style.display = 'none';
|
57597
57606
|
}
|
57598
57607
|
if (subMenuRef && subToggleRef) {
|
@@ -57603,7 +57612,14 @@ var DropdownItemWithSubmenu = function (_a) {
|
|
57603
57612
|
}, [open]);
|
57604
57613
|
return (React.createElement("li", { key: index, ref: refButtonSubMenu },
|
57605
57614
|
React.createElement("div", { className: 'dropdown', onMouseLeave: function () { return setOpen(false); } },
|
57606
|
-
React.createElement("button", { className: 'dropdown__toggle dropdown-toggle', "aria-haspopup": "menu", tabIndex: 0,
|
57615
|
+
React.createElement("button", { className: 'dropdown__toggle dropdown-toggle', "aria-haspopup": "menu", tabIndex: 0, onClick: function () {
|
57616
|
+
if (item.onSelect) {
|
57617
|
+
item.onSelect();
|
57618
|
+
}
|
57619
|
+
if (onChange) {
|
57620
|
+
onChange();
|
57621
|
+
}
|
57622
|
+
}, onMouseOver: function () { return setOpen(true); } },
|
57607
57623
|
item['icon'] ? React.createElement("i", { className: 'icon-' + item['icon'] }) : null,
|
57608
57624
|
item['label']),
|
57609
57625
|
React.createElement("ul", { role: 'menu', ref: refSubMenu, style: { display: 'none' }, className: 'dropdown__menu' }, subMenuItems))));
|
@@ -59731,28 +59747,49 @@ var classnames_1 = __importDefault(__webpack_require__(2));
|
|
59731
59747
|
var ContentListItem = /** @class */ (function (_super) {
|
59732
59748
|
__extends(ContentListItem, _super);
|
59733
59749
|
function ContentListItem() {
|
59734
|
-
|
59750
|
+
var _this = _super !== null && _super.apply(this, arguments) || this;
|
59751
|
+
_this.delay = 200;
|
59752
|
+
_this.prevent = false;
|
59753
|
+
_this.onSingleClick = function () {
|
59754
|
+
_this.timer = setTimeout(function () {
|
59755
|
+
if (!_this.prevent) {
|
59756
|
+
if (_this.props.onClick) {
|
59757
|
+
_this.props.onClick();
|
59758
|
+
}
|
59759
|
+
}
|
59760
|
+
}, _this.delay);
|
59761
|
+
};
|
59762
|
+
_this.onDoubleClick = function () {
|
59763
|
+
clearTimeout(_this.timer);
|
59764
|
+
_this.prevent = true;
|
59765
|
+
if (_this.props.onDoubleClick) {
|
59766
|
+
_this.props.onDoubleClick();
|
59767
|
+
}
|
59768
|
+
setTimeout(function () {
|
59769
|
+
_this.prevent = false;
|
59770
|
+
}, _this.delay);
|
59771
|
+
};
|
59772
|
+
return _this;
|
59735
59773
|
}
|
59736
59774
|
ContentListItem.prototype.render = function () {
|
59737
|
-
var classes = (0, classnames_1.default)('sd-list-item sd-
|
59775
|
+
var classes = (0, classnames_1.default)('sd-list-item sd-shadow--z1', {
|
59738
59776
|
'sd-list-item--activated': this.props.activated,
|
59739
59777
|
'sd-list-item--selected': this.props.selected,
|
59740
59778
|
'fetched': this.props.archived,
|
59741
59779
|
'actioning': this.props.loading,
|
59742
59780
|
});
|
59743
|
-
return (React.createElement("div", { className: classes, onClick: this.
|
59744
|
-
|
59745
|
-
|
59746
|
-
|
59747
|
-
|
59748
|
-
|
59749
|
-
return
|
59750
|
-
|
59751
|
-
|
59752
|
-
|
59753
|
-
|
59754
|
-
|
59755
|
-
React.createElement("div", { className: "sd-list-item__action-menu" }, this.props.action))));
|
59781
|
+
return (React.createElement("div", { className: classes, onClick: this.onSingleClick, onDoubleClick: this.onDoubleClick },
|
59782
|
+
this.props.locked
|
59783
|
+
? React.createElement("div", { className: "sd-list-item__border sd-list-item__border--locked" })
|
59784
|
+
: React.createElement("div", { className: "sd-list-item__border" }),
|
59785
|
+
this.props.itemColum.map(function (item, index) {
|
59786
|
+
return React.createElement("div", { className: "sd-list-item__column ".concat(item.fullwidth && 'sd-list-item__column--grow', " ").concat(!item.border && 'sd-list-item__column--no-border'), key: index }, item.itemRow.map(function (e, i) {
|
59787
|
+
return (item.itemRow.length <= 1
|
59788
|
+
? React.createElement(React.Fragment, { key: i }, e.content)
|
59789
|
+
: React.createElement("div", { className: "sd-list-item__row", key: i }, e.content));
|
59790
|
+
}));
|
59791
|
+
}),
|
59792
|
+
React.createElement("div", { className: "sd-list-item__action-menu" }, this.props.action)));
|
59756
59793
|
};
|
59757
59794
|
return ContentListItem;
|
59758
59795
|
}(React.PureComponent));
|
@@ -98172,7 +98209,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
|
|
98172
98209
|
Object.defineProperty(exports, "__esModule", {
|
98173
98210
|
value: true
|
98174
98211
|
});
|
98175
|
-
exports.TieredMenu = void 0;
|
98212
|
+
exports.TieredMenu = exports.LocationRetrieved = void 0;
|
98176
98213
|
|
98177
98214
|
var _react = _interopRequireWildcard(__webpack_require__(0));
|
98178
98215
|
|
@@ -98198,6 +98235,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
98198
98235
|
|
98199
98236
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
98200
98237
|
|
98238
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
98239
|
+
|
98201
98240
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
98202
98241
|
|
98203
98242
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
@@ -98218,27 +98257,97 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
|
|
98218
98257
|
|
98219
98258
|
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
98220
98259
|
|
98221
|
-
|
98260
|
+
// interface IProps {
|
98261
|
+
// children(args: {direction: 'left' | 'right'}): JSX.Element;
|
98262
|
+
// }
|
98263
|
+
// interface IState {
|
98264
|
+
// direction: 'left' | 'right' | null;
|
98265
|
+
// }
|
98266
|
+
|
98267
|
+
/**
|
98268
|
+
* Checks whether there is more space on the left or right,
|
98269
|
+
* in order to choose which direction submenus open to.
|
98270
|
+
*/
|
98271
|
+
var LocationRetrieved = /*#__PURE__*/function (_React$PureComponent) {
|
98272
|
+
_inherits(LocationRetrieved, _React$PureComponent);
|
98273
|
+
|
98274
|
+
var _super = _createSuper(LocationRetrieved);
|
98275
|
+
|
98276
|
+
// <IProps, IState>
|
98277
|
+
function LocationRetrieved(props) {
|
98278
|
+
var _this;
|
98279
|
+
|
98280
|
+
_classCallCheck(this, LocationRetrieved);
|
98281
|
+
|
98282
|
+
_this = _super.call(this, props);
|
98283
|
+
_this.state = {
|
98284
|
+
direction: null
|
98285
|
+
};
|
98286
|
+
_this.recompute = _this.recompute.bind(_assertThisInitialized(_this));
|
98287
|
+
return _this;
|
98288
|
+
}
|
98289
|
+
|
98290
|
+
_createClass(LocationRetrieved, [{
|
98291
|
+
key: "recompute",
|
98292
|
+
value: function recompute(callback) {
|
98293
|
+
// public, used in TieredMenu#show
|
98294
|
+
this.setState({
|
98295
|
+
direction: null
|
98296
|
+
});
|
98297
|
+
setTimeout(callback, 0);
|
98298
|
+
}
|
98299
|
+
}, {
|
98300
|
+
key: "render",
|
98301
|
+
value: function render() {
|
98302
|
+
var _this2 = this;
|
98303
|
+
|
98304
|
+
if (this.state.direction == null) {
|
98305
|
+
return /*#__PURE__*/_react.default.createElement("span", {
|
98306
|
+
ref: function ref(el) {
|
98307
|
+
if (el != null) {
|
98308
|
+
var rect = el.getBoundingClientRect();
|
98309
|
+
var left = rect.left;
|
98310
|
+
var availableSpaceH = document.body.offsetWidth;
|
98311
|
+
var direction = left < availableSpaceH / 2 ? 'right' : 'left';
|
98312
|
+
|
98313
|
+
_this2.setState({
|
98314
|
+
direction: direction
|
98315
|
+
});
|
98316
|
+
}
|
98317
|
+
}
|
98318
|
+
});
|
98319
|
+
} else {
|
98320
|
+
return this.props.children({
|
98321
|
+
direction: this.state.direction
|
98322
|
+
});
|
98323
|
+
}
|
98324
|
+
}
|
98325
|
+
}]);
|
98326
|
+
|
98327
|
+
return LocationRetrieved;
|
98328
|
+
}(_react.default.PureComponent);
|
98329
|
+
|
98330
|
+
exports.LocationRetrieved = LocationRetrieved;
|
98222
98331
|
|
98223
98332
|
var TieredMenu = /*#__PURE__*/function (_Component) {
|
98224
98333
|
_inherits(TieredMenu, _Component);
|
98225
98334
|
|
98226
|
-
var
|
98335
|
+
var _super2 = _createSuper(TieredMenu);
|
98227
98336
|
|
98228
98337
|
function TieredMenu(props) {
|
98229
|
-
var
|
98338
|
+
var _this3;
|
98230
98339
|
|
98231
98340
|
_classCallCheck(this, TieredMenu);
|
98232
98341
|
|
98233
|
-
|
98234
|
-
|
98342
|
+
_this3 = _super2.call(this, props);
|
98343
|
+
_this3.state = {
|
98235
98344
|
visible: !props.popup
|
98236
98345
|
};
|
98237
|
-
|
98238
|
-
|
98239
|
-
|
98240
|
-
|
98241
|
-
return
|
98346
|
+
_this3.onEnter = _this3.onEnter.bind(_assertThisInitialized(_this3));
|
98347
|
+
_this3.onEntered = _this3.onEntered.bind(_assertThisInitialized(_this3));
|
98348
|
+
_this3.onExit = _this3.onExit.bind(_assertThisInitialized(_this3));
|
98349
|
+
_this3.id = _this3.props.id || (0, _UniqueComponentId.default)();
|
98350
|
+
return _this3;
|
98242
98351
|
}
|
98243
98352
|
|
98244
98353
|
_createClass(TieredMenu, [{
|
@@ -98251,29 +98360,31 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98251
98360
|
}, {
|
98252
98361
|
key: "show",
|
98253
98362
|
value: function show(event) {
|
98254
|
-
var
|
98363
|
+
var _this4 = this;
|
98255
98364
|
|
98256
98365
|
this.target = event.currentTarget;
|
98257
98366
|
var currentEvent = event;
|
98258
|
-
this.
|
98259
|
-
|
98260
|
-
|
98261
|
-
|
98262
|
-
|
98263
|
-
|
98367
|
+
this.locator.recompute(function () {
|
98368
|
+
_this4.setState({
|
98369
|
+
visible: true
|
98370
|
+
}, function () {
|
98371
|
+
if (_this4.props.onShow) {
|
98372
|
+
_this4.props.onShow(currentEvent);
|
98373
|
+
}
|
98374
|
+
});
|
98264
98375
|
});
|
98265
98376
|
}
|
98266
98377
|
}, {
|
98267
98378
|
key: "hide",
|
98268
98379
|
value: function hide(event) {
|
98269
|
-
var
|
98380
|
+
var _this5 = this;
|
98270
98381
|
|
98271
98382
|
var currentEvent = event;
|
98272
98383
|
this.setState({
|
98273
98384
|
visible: false
|
98274
98385
|
}, function () {
|
98275
|
-
if (
|
98276
|
-
|
98386
|
+
if (_this5.props.onHide) {
|
98387
|
+
_this5.props.onHide(currentEvent);
|
98277
98388
|
}
|
98278
98389
|
});
|
98279
98390
|
}
|
@@ -98314,12 +98425,12 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98314
98425
|
}, {
|
98315
98426
|
key: "bindDocumentClickListener",
|
98316
98427
|
value: function bindDocumentClickListener() {
|
98317
|
-
var
|
98428
|
+
var _this6 = this;
|
98318
98429
|
|
98319
98430
|
if (!this.documentClickListener) {
|
98320
98431
|
this.documentClickListener = function (event) {
|
98321
|
-
if (
|
98322
|
-
|
98432
|
+
if (_this6.props.popup && _this6.state.visible && !_this6.container.contains(event.target)) {
|
98433
|
+
_this6.hide(event);
|
98323
98434
|
}
|
98324
98435
|
};
|
98325
98436
|
|
@@ -98337,12 +98448,12 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98337
98448
|
}, {
|
98338
98449
|
key: "bindDocumentResizeListener",
|
98339
98450
|
value: function bindDocumentResizeListener() {
|
98340
|
-
var
|
98451
|
+
var _this7 = this;
|
98341
98452
|
|
98342
98453
|
if (!this.documentResizeListener) {
|
98343
98454
|
this.documentResizeListener = function (event) {
|
98344
|
-
if (
|
98345
|
-
|
98455
|
+
if (_this7.state.visible) {
|
98456
|
+
_this7.hide(event);
|
98346
98457
|
}
|
98347
98458
|
};
|
98348
98459
|
|
@@ -98360,12 +98471,12 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98360
98471
|
}, {
|
98361
98472
|
key: "bindScrollListener",
|
98362
98473
|
value: function bindScrollListener() {
|
98363
|
-
var
|
98474
|
+
var _this8 = this;
|
98364
98475
|
|
98365
98476
|
if (!this.scrollHandler) {
|
98366
98477
|
this.scrollHandler = new _ConnectedOverlayScrollHandler.default(this.target, function (event) {
|
98367
|
-
if (
|
98368
|
-
|
98478
|
+
if (_this8.state.visible) {
|
98479
|
+
_this8.hide(event);
|
98369
98480
|
}
|
98370
98481
|
});
|
98371
98482
|
}
|
@@ -98391,8 +98502,8 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98391
98502
|
}
|
98392
98503
|
}, {
|
98393
98504
|
key: "renderElement",
|
98394
|
-
value: function renderElement() {
|
98395
|
-
var
|
98505
|
+
value: function renderElement(direction) {
|
98506
|
+
var _this9 = this;
|
98396
98507
|
|
98397
98508
|
var className = (0, _ClassNames.classNames)('p-tieredmenu p-component', {
|
98398
98509
|
'p-tieredmenu-overlay': this.props.popup
|
@@ -98410,7 +98521,7 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98410
98521
|
onExit: this.onExit
|
98411
98522
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
98412
98523
|
ref: function ref(el) {
|
98413
|
-
return
|
98524
|
+
return _this9.container = el;
|
98414
98525
|
},
|
98415
98526
|
id: this.id,
|
98416
98527
|
className: className,
|
@@ -98419,14 +98530,28 @@ var TieredMenu = /*#__PURE__*/function (_Component) {
|
|
98419
98530
|
}, /*#__PURE__*/_react.default.createElement(_TieredMenuSub.TieredMenuSub, {
|
98420
98531
|
model: this.props.model,
|
98421
98532
|
root: true,
|
98422
|
-
popup: this.props.popup
|
98533
|
+
popup: this.props.popup,
|
98534
|
+
direction: direction
|
98423
98535
|
})));
|
98424
98536
|
}
|
98425
98537
|
}, {
|
98426
98538
|
key: "render",
|
98427
98539
|
value: function render() {
|
98428
|
-
var
|
98429
|
-
|
98540
|
+
var _this10 = this;
|
98541
|
+
|
98542
|
+
return /*#__PURE__*/_react.default.createElement(LocationRetrieved, {
|
98543
|
+
ref: function ref(instance) {
|
98544
|
+
if (instance != null) {
|
98545
|
+
_this10.locator = instance;
|
98546
|
+
}
|
98547
|
+
}
|
98548
|
+
}, function (_ref) {
|
98549
|
+
var direction = _ref.direction;
|
98550
|
+
|
98551
|
+
var element = _this10.renderElement(direction);
|
98552
|
+
|
98553
|
+
if (_this10.props.appendTo) return /*#__PURE__*/_reactDom.default.createPortal(element, _this10.props.appendTo);else return element;
|
98554
|
+
});
|
98430
98555
|
}
|
98431
98556
|
}]);
|
98432
98557
|
|
@@ -98590,6 +98715,8 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98590
98715
|
}, {
|
98591
98716
|
key: "onItemClick",
|
98592
98717
|
value: function onItemClick(event, item) {
|
98718
|
+
var _item$items$length, _item$items;
|
98719
|
+
|
98593
98720
|
if (item.disabled) {
|
98594
98721
|
event.preventDefault();
|
98595
98722
|
return;
|
@@ -98606,21 +98733,27 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98606
98733
|
});
|
98607
98734
|
}
|
98608
98735
|
|
98609
|
-
if (
|
98610
|
-
if (item.
|
98611
|
-
|
98612
|
-
|
98613
|
-
|
98614
|
-
|
98615
|
-
|
98616
|
-
|
98617
|
-
|
98618
|
-
});
|
98619
|
-
}
|
98736
|
+
if (((_item$items$length = (_item$items = item.items) === null || _item$items === void 0 ? void 0 : _item$items.length) !== null && _item$items$length !== void 0 ? _item$items$length : 0) > 0) {
|
98737
|
+
if (this.state.activeItem && item === this.state.activeItem) {
|
98738
|
+
this.setState({
|
98739
|
+
activeItem: null
|
98740
|
+
});
|
98741
|
+
} else {
|
98742
|
+
this.setState({
|
98743
|
+
activeItem: item
|
98744
|
+
});
|
98620
98745
|
}
|
98621
98746
|
}
|
98622
98747
|
|
98623
|
-
|
98748
|
+
var target = event.target;
|
98749
|
+
var isKeyboardEvent = event.clientX === 0 && event.clientY === 0;
|
98750
|
+
|
98751
|
+
if (isKeyboardEvent) {
|
98752
|
+
setTimeout(function () {
|
98753
|
+
var el = target.parentElement.querySelectorAll('.p-submenu-list > .p-menuitem')[0].querySelector('button');
|
98754
|
+
el.focus();
|
98755
|
+
}, 0);
|
98756
|
+
} else if (!item.items) {
|
98624
98757
|
this.onLeafClick();
|
98625
98758
|
}
|
98626
98759
|
}
|
@@ -98677,8 +98810,10 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98677
98810
|
}, {
|
98678
98811
|
key: "onChildItemKeyDown",
|
98679
98812
|
value: function onChildItemKeyDown(event, childListItem) {
|
98680
|
-
|
98681
|
-
|
98813
|
+
var leftArrow = event.which === 37;
|
98814
|
+
var escape = event.which === 27;
|
98815
|
+
|
98816
|
+
if (leftArrow || escape) {
|
98682
98817
|
this.setState({
|
98683
98818
|
activeItem: null
|
98684
98819
|
});
|
@@ -98750,7 +98885,8 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98750
98885
|
onLeafClick: this.onLeafClick,
|
98751
98886
|
popup: this.props.popup,
|
98752
98887
|
onKeyDown: this.onChildItemKeyDown,
|
98753
|
-
parentActive: item === this.state.activeItem
|
98888
|
+
parentActive: item === this.state.activeItem,
|
98889
|
+
direction: this.props.direction
|
98754
98890
|
});
|
98755
98891
|
}
|
98756
98892
|
|
@@ -98778,10 +98914,8 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98778
98914
|
return _this3.onItemMouseEnter(event, item);
|
98779
98915
|
},
|
98780
98916
|
role: "none"
|
98781
|
-
}, /*#__PURE__*/_react.default.createElement("
|
98782
|
-
href: item.url || '#',
|
98917
|
+
}, /*#__PURE__*/_react.default.createElement("button", {
|
98783
98918
|
className: linkClassName,
|
98784
|
-
target: item.target,
|
98785
98919
|
role: "menuitem",
|
98786
98920
|
"aria-haspopup": item.items != null,
|
98787
98921
|
onClick: function onClick(event) {
|
@@ -98827,7 +98961,10 @@ var TieredMenuSub = /*#__PURE__*/function (_Component) {
|
|
98827
98961
|
},
|
98828
98962
|
className: className,
|
98829
98963
|
role: this.props.root ? 'menubar' : 'menu',
|
98830
|
-
"aria-orientation": "horizontal"
|
98964
|
+
"aria-orientation": "horizontal",
|
98965
|
+
style: {
|
98966
|
+
left: this.props.direction === 'left' ? '-100%' : '100%'
|
98967
|
+
}
|
98831
98968
|
}, submenu);
|
98832
98969
|
}
|
98833
98970
|
}]);
|
@@ -98854,7 +98991,8 @@ _defineProperty(TieredMenuSub, "propTypes", {
|
|
98854
98991
|
popup: _propTypes.default.bool,
|
98855
98992
|
onLeafClick: _propTypes.default.func,
|
98856
98993
|
onKeyDown: _propTypes.default.func,
|
98857
|
-
parentActive: _propTypes.default.bool
|
98994
|
+
parentActive: _propTypes.default.bool,
|
98995
|
+
direction: _propTypes.default.string
|
98858
98996
|
});
|
98859
98997
|
|
98860
98998
|
/***/ }),
|
@@ -116573,11 +116711,11 @@ var RundownEditor = /** @class */ (function (_super) {
|
|
116573
116711
|
React.createElement(index_1.IconLabel, { style: 'translucent', innerLabel: 'Duration:', text: '00:38', size: 'large', type: 'warning' }),
|
116574
116712
|
React.createElement(index_1.Text, { color: 'light', size: 'medium', className: 'sd-margin--0' }, "OF"),
|
116575
116713
|
React.createElement(index_1.IconLabel, { style: 'translucent', innerLabel: 'Planned:', text: '00:45', size: 'large' })),
|
116576
|
-
React.createElement(TableList_1.TableList, { className: 'sd-margin-y--4', dragAndDrop: true, addItem: true, array: this.state.array, itemsDropdown: [
|
116714
|
+
React.createElement(TableList_1.TableList, { className: 'sd-margin-y--4', dragAndDrop: true, addItem: true, array: this.state.array, itemsDropdown: function () { return [
|
116577
116715
|
{ label: React.createElement(index_1.Label, { style: 'translucent', type: 'primary', text: 'aacc' }), onSelect: function () { return 1; } },
|
116578
116716
|
{ label: React.createElement(index_1.Label, { style: 'translucent', text: 'prlg' }), onSelect: function () { return 1; } },
|
116579
116717
|
{ label: React.createElement(index_1.Label, { style: 'translucent', type: 'primary', text: 'prlg' }), onSelect: function () { return 1; } },
|
116580
|
-
]
|
116718
|
+
]; } }))),
|
116581
116719
|
React.createElement(Layout.RightPanel, { open: this.state.rightPanelOpen },
|
116582
116720
|
React.createElement(Layout.Panel, { size: 'full', side: 'right' },
|
116583
116721
|
React.createElement(Layout.PanelContent, null,
|
@@ -129291,7 +129429,7 @@ var DropdownDoc = /** @class */ (function (_super) {
|
|
129291
129429
|
" to the dropdown element to append to the inner dropdown menu to the body. This is useful when the dropdown button is inside a div with overflow: hidden, and the menu would otherwise be hidden."),
|
129292
129430
|
React.createElement(Markup.ReactMarkup, null,
|
129293
129431
|
React.createElement(Markup.ReactMarkupPreview, null,
|
129294
|
-
React.createElement(app_typescript_1.Dropdown, { header: [
|
129432
|
+
React.createElement(app_typescript_1.Dropdown, { append: true, header: [
|
129295
129433
|
{
|
129296
129434
|
type: 'group',
|
129297
129435
|
label: 'Create new',
|
@@ -129305,7 +129443,14 @@ var DropdownDoc = /** @class */ (function (_super) {
|
|
129305
129443
|
type: 'submenu',
|
129306
129444
|
label: 'Show 1',
|
129307
129445
|
icon: 'plus-sign',
|
129308
|
-
items: [
|
129446
|
+
items: [
|
129447
|
+
{
|
129448
|
+
type: 'submenu',
|
129449
|
+
label: 'Show 1',
|
129450
|
+
icon: 'plus-sign',
|
129451
|
+
items: []
|
129452
|
+
}
|
129453
|
+
],
|
129309
129454
|
},
|
129310
129455
|
{
|
129311
129456
|
type: 'submenu',
|
@@ -129341,6 +129486,272 @@ var DropdownDoc = /** @class */ (function (_super) {
|
|
129341
129486
|
},
|
129342
129487
|
],
|
129343
129488
|
},
|
129489
|
+
{
|
129490
|
+
type: 'submenu',
|
129491
|
+
label: 'Rundown',
|
129492
|
+
icon: 'plus-sign',
|
129493
|
+
items: [
|
129494
|
+
{
|
129495
|
+
type: 'submenu',
|
129496
|
+
label: 'Show 1',
|
129497
|
+
icon: 'plus-sign',
|
129498
|
+
items: [],
|
129499
|
+
},
|
129500
|
+
{
|
129501
|
+
type: 'submenu',
|
129502
|
+
label: 'Show 2',
|
129503
|
+
icon: 'plus-sign',
|
129504
|
+
items: [],
|
129505
|
+
},
|
129506
|
+
],
|
129507
|
+
},
|
129508
|
+
{
|
129509
|
+
type: 'submenu',
|
129510
|
+
label: 'Rundown',
|
129511
|
+
icon: 'plus-sign',
|
129512
|
+
items: [
|
129513
|
+
{
|
129514
|
+
type: 'submenu',
|
129515
|
+
label: 'Show 1',
|
129516
|
+
icon: 'plus-sign',
|
129517
|
+
items: [],
|
129518
|
+
},
|
129519
|
+
{
|
129520
|
+
type: 'submenu',
|
129521
|
+
label: 'Show 2',
|
129522
|
+
icon: 'plus-sign',
|
129523
|
+
items: [],
|
129524
|
+
},
|
129525
|
+
],
|
129526
|
+
},
|
129527
|
+
{
|
129528
|
+
type: 'submenu',
|
129529
|
+
label: 'Rundown',
|
129530
|
+
icon: 'plus-sign',
|
129531
|
+
items: [
|
129532
|
+
{
|
129533
|
+
type: 'submenu',
|
129534
|
+
label: 'Show 1',
|
129535
|
+
icon: 'plus-sign',
|
129536
|
+
items: [],
|
129537
|
+
},
|
129538
|
+
{
|
129539
|
+
type: 'submenu',
|
129540
|
+
label: 'Show 2',
|
129541
|
+
icon: 'plus-sign',
|
129542
|
+
items: [],
|
129543
|
+
},
|
129544
|
+
],
|
129545
|
+
},
|
129546
|
+
{
|
129547
|
+
type: 'submenu',
|
129548
|
+
label: 'Rundown',
|
129549
|
+
icon: 'plus-sign',
|
129550
|
+
items: [
|
129551
|
+
{
|
129552
|
+
type: 'submenu',
|
129553
|
+
label: 'Show 1',
|
129554
|
+
icon: 'plus-sign',
|
129555
|
+
items: [],
|
129556
|
+
},
|
129557
|
+
{
|
129558
|
+
type: 'submenu',
|
129559
|
+
label: 'Show 2',
|
129560
|
+
icon: 'plus-sign',
|
129561
|
+
items: [],
|
129562
|
+
},
|
129563
|
+
],
|
129564
|
+
},
|
129565
|
+
{
|
129566
|
+
type: 'submenu',
|
129567
|
+
label: 'Rundown',
|
129568
|
+
icon: 'plus-sign',
|
129569
|
+
items: [
|
129570
|
+
{
|
129571
|
+
type: 'submenu',
|
129572
|
+
label: 'Show 1',
|
129573
|
+
icon: 'plus-sign',
|
129574
|
+
items: [],
|
129575
|
+
},
|
129576
|
+
{
|
129577
|
+
type: 'submenu',
|
129578
|
+
label: 'Show 2',
|
129579
|
+
icon: 'plus-sign',
|
129580
|
+
items: [],
|
129581
|
+
},
|
129582
|
+
],
|
129583
|
+
},
|
129584
|
+
{
|
129585
|
+
type: 'submenu',
|
129586
|
+
label: 'Rundown',
|
129587
|
+
icon: 'plus-sign',
|
129588
|
+
items: [
|
129589
|
+
{
|
129590
|
+
type: 'submenu',
|
129591
|
+
label: 'Show 1',
|
129592
|
+
icon: 'plus-sign',
|
129593
|
+
items: [],
|
129594
|
+
},
|
129595
|
+
{
|
129596
|
+
type: 'submenu',
|
129597
|
+
label: 'Show 2',
|
129598
|
+
icon: 'plus-sign',
|
129599
|
+
items: [],
|
129600
|
+
},
|
129601
|
+
],
|
129602
|
+
},
|
129603
|
+
{
|
129604
|
+
type: 'submenu',
|
129605
|
+
label: 'Rundown',
|
129606
|
+
icon: 'plus-sign',
|
129607
|
+
items: [
|
129608
|
+
{
|
129609
|
+
type: 'submenu',
|
129610
|
+
label: 'Show 1',
|
129611
|
+
icon: 'plus-sign',
|
129612
|
+
items: [],
|
129613
|
+
},
|
129614
|
+
{
|
129615
|
+
type: 'submenu',
|
129616
|
+
label: 'Show 2',
|
129617
|
+
icon: 'plus-sign',
|
129618
|
+
items: [],
|
129619
|
+
},
|
129620
|
+
],
|
129621
|
+
},
|
129622
|
+
{
|
129623
|
+
type: 'submenu',
|
129624
|
+
label: 'Rundown',
|
129625
|
+
icon: 'plus-sign',
|
129626
|
+
items: [
|
129627
|
+
{
|
129628
|
+
type: 'submenu',
|
129629
|
+
label: 'Show 1',
|
129630
|
+
icon: 'plus-sign',
|
129631
|
+
items: [],
|
129632
|
+
},
|
129633
|
+
{
|
129634
|
+
type: 'submenu',
|
129635
|
+
label: 'Show 2',
|
129636
|
+
icon: 'plus-sign',
|
129637
|
+
items: [],
|
129638
|
+
},
|
129639
|
+
],
|
129640
|
+
},
|
129641
|
+
{
|
129642
|
+
type: 'submenu',
|
129643
|
+
label: 'Rundown',
|
129644
|
+
icon: 'plus-sign',
|
129645
|
+
items: [
|
129646
|
+
{
|
129647
|
+
type: 'submenu',
|
129648
|
+
label: 'Show 1',
|
129649
|
+
icon: 'plus-sign',
|
129650
|
+
items: [],
|
129651
|
+
},
|
129652
|
+
{
|
129653
|
+
type: 'submenu',
|
129654
|
+
label: 'Show 2',
|
129655
|
+
icon: 'plus-sign',
|
129656
|
+
items: [],
|
129657
|
+
},
|
129658
|
+
],
|
129659
|
+
},
|
129660
|
+
{
|
129661
|
+
type: 'submenu',
|
129662
|
+
label: 'Rundown',
|
129663
|
+
icon: 'plus-sign',
|
129664
|
+
items: [
|
129665
|
+
{
|
129666
|
+
type: 'submenu',
|
129667
|
+
label: 'Show 1',
|
129668
|
+
icon: 'plus-sign',
|
129669
|
+
items: [],
|
129670
|
+
},
|
129671
|
+
{
|
129672
|
+
type: 'submenu',
|
129673
|
+
label: 'Show 2',
|
129674
|
+
icon: 'plus-sign',
|
129675
|
+
items: [],
|
129676
|
+
},
|
129677
|
+
],
|
129678
|
+
},
|
129679
|
+
{
|
129680
|
+
type: 'submenu',
|
129681
|
+
label: 'Rundown',
|
129682
|
+
icon: 'plus-sign',
|
129683
|
+
items: [
|
129684
|
+
{
|
129685
|
+
type: 'submenu',
|
129686
|
+
label: 'Show 1',
|
129687
|
+
icon: 'plus-sign',
|
129688
|
+
items: [],
|
129689
|
+
},
|
129690
|
+
{
|
129691
|
+
type: 'submenu',
|
129692
|
+
label: 'Show 2',
|
129693
|
+
icon: 'plus-sign',
|
129694
|
+
items: [],
|
129695
|
+
},
|
129696
|
+
],
|
129697
|
+
},
|
129698
|
+
{
|
129699
|
+
type: 'submenu',
|
129700
|
+
label: 'Rundown',
|
129701
|
+
icon: 'plus-sign',
|
129702
|
+
items: [
|
129703
|
+
{
|
129704
|
+
type: 'submenu',
|
129705
|
+
label: 'Show 1',
|
129706
|
+
icon: 'plus-sign',
|
129707
|
+
items: [],
|
129708
|
+
},
|
129709
|
+
{
|
129710
|
+
type: 'submenu',
|
129711
|
+
label: 'Show 2',
|
129712
|
+
icon: 'plus-sign',
|
129713
|
+
items: [],
|
129714
|
+
},
|
129715
|
+
],
|
129716
|
+
},
|
129717
|
+
{
|
129718
|
+
type: 'submenu',
|
129719
|
+
label: 'Rundown',
|
129720
|
+
icon: 'plus-sign',
|
129721
|
+
items: [
|
129722
|
+
{
|
129723
|
+
type: 'submenu',
|
129724
|
+
label: 'Show 1',
|
129725
|
+
icon: 'plus-sign',
|
129726
|
+
items: [],
|
129727
|
+
},
|
129728
|
+
{
|
129729
|
+
type: 'submenu',
|
129730
|
+
label: 'Show 2',
|
129731
|
+
icon: 'plus-sign',
|
129732
|
+
items: [],
|
129733
|
+
},
|
129734
|
+
],
|
129735
|
+
},
|
129736
|
+
{
|
129737
|
+
type: 'submenu',
|
129738
|
+
label: 'Rundown',
|
129739
|
+
icon: 'plus-sign',
|
129740
|
+
items: [
|
129741
|
+
{
|
129742
|
+
type: 'submenu',
|
129743
|
+
label: 'Show 1',
|
129744
|
+
icon: 'plus-sign',
|
129745
|
+
items: [],
|
129746
|
+
},
|
129747
|
+
{
|
129748
|
+
type: 'submenu',
|
129749
|
+
label: 'Show 2',
|
129750
|
+
icon: 'plus-sign',
|
129751
|
+
items: [],
|
129752
|
+
},
|
129753
|
+
],
|
129754
|
+
},
|
129344
129755
|
],
|
129345
129756
|
},
|
129346
129757
|
], footer: [
|
@@ -129350,7 +129761,7 @@ var DropdownDoc = /** @class */ (function (_super) {
|
|
129350
129761
|
{
|
129351
129762
|
icon: 'rundown',
|
129352
129763
|
label: 'Create new Show',
|
129353
|
-
onSelect: function () { return
|
129764
|
+
onSelect: function () { return console.log('aaa'); },
|
129354
129765
|
},
|
129355
129766
|
],
|
129356
129767
|
},
|
@@ -129508,7 +129919,13 @@ var DropdownDoc = /** @class */ (function (_super) {
|
|
129508
129919
|
type: 'submenu',
|
129509
129920
|
label: 'Show 1',
|
129510
129921
|
icon: 'plus-sign',
|
129511
|
-
items: [
|
129922
|
+
items: [
|
129923
|
+
{
|
129924
|
+
type: 'submenu',
|
129925
|
+
label: 'Show 1',
|
129926
|
+
items: []
|
129927
|
+
}
|
129928
|
+
],
|
129512
129929
|
},
|
129513
129930
|
{
|
129514
129931
|
type: 'submenu',
|
@@ -131546,9 +131963,8 @@ var TableListDoc = /** @class */ (function (_super) {
|
|
131546
131963
|
center: React.createElement("span", null, "Item 2"),
|
131547
131964
|
end: React.createElement(app_typescript_1.IconLabel, { style: 'translucent', text: 'Label success', type: 'success', icon: 'time' }),
|
131548
131965
|
action: React.createElement(app_typescript_1.IconButton, { icon: 'dots-vertical', size: 'small', ariaValue: 'More actions', onClick: function () { return false; } }),
|
131549
|
-
onClick: function () {
|
131550
|
-
|
131551
|
-
}
|
131966
|
+
onClick: function () { return console.log('single'); },
|
131967
|
+
onDoubleClick: function () { return console.log('double'); },
|
131552
131968
|
},
|
131553
131969
|
{
|
131554
131970
|
start: React.createElement(React.Fragment, null,
|
@@ -131557,9 +131973,9 @@ var TableListDoc = /** @class */ (function (_super) {
|
|
131557
131973
|
center: React.createElement("span", null, "Item 3"),
|
131558
131974
|
end: React.createElement(app_typescript_1.IconLabel, { style: 'translucent', text: 'Label success', type: 'success', icon: 'time' }),
|
131559
131975
|
action: React.createElement(app_typescript_1.IconButton, { icon: 'dots-vertical', size: 'small', ariaValue: 'More actions', onClick: function () { return false; } }),
|
131560
|
-
onClick: function () {
|
131561
|
-
|
131562
|
-
|
131976
|
+
onClick: function () { return console.log('single'); },
|
131977
|
+
onDoubleClick: function () { return console.log('double'); },
|
131978
|
+
hexColor: '#ff9808'
|
131563
131979
|
},
|
131564
131980
|
]
|
131565
131981
|
};
|
@@ -131568,35 +131984,35 @@ var TableListDoc = /** @class */ (function (_super) {
|
|
131568
131984
|
TableListDoc.prototype.render = function () {
|
131569
131985
|
return (React.createElement("section", { className: 'docs-page__container' },
|
131570
131986
|
React.createElement("h2", { className: 'docs-page__h2' }, "TableList"),
|
131571
|
-
React.createElement(Markup.ReactMarkupCodePreview, null, "\n <TableList\n dragAndDrop\n addItem\n array={this.state.array}\n itemsDropdown={[\n { label: '
|
131987
|
+
React.createElement(Markup.ReactMarkupCodePreview, null, "\n <TableList\n dragAndDrop\n addItem\n array={this.state.array}\n itemsDropdown={(index) => [\n { label: <Label style='translucent' type='primary' text='aacc' />, onSelect: () => console.log(index) },\n { label: <Label style='translucent' text='prlg' />, onSelect: () => console.log(index) },\n { label: <Label style='translucent' type='primary' text='prlg' />, onSelect: () => console.log(index) },\n ]} />\n "),
|
131572
131988
|
React.createElement("p", { className: "docs-page__paragraph" }, "With drag and drop functionality:"),
|
131573
131989
|
React.createElement(Markup.ReactMarkup, null,
|
131574
131990
|
React.createElement(Markup.ReactMarkupPreview, null,
|
131575
|
-
React.createElement(TableList_1.TableList, { dragAndDrop: true, addItem: true,
|
131576
|
-
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', type: 'primary', text: 'aacc' }), onSelect: function () { return
|
131577
|
-
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', text: 'prlg' }), onSelect: function () { return
|
131578
|
-
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', type: 'primary', text: 'prlg' }), onSelect: function () { return
|
131579
|
-
], onDrag: function (start, end) { return console.log(start, end); } })),
|
131580
|
-
React.createElement(Markup.ReactMarkupCode, null, "\n <TableList\n dragAndDrop\n addItem\n array={this.state.array}\n itemsDropdown={[\n
|
131991
|
+
React.createElement(TableList_1.TableList, { dragAndDrop: true, addItem: true, array: this.state.array, itemsDropdown: function (index) { return [
|
131992
|
+
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', type: 'primary', text: 'aacc' }), onSelect: function () { return console.log(index); } },
|
131993
|
+
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', text: 'prlg' }), onSelect: function () { return console.log(index); } },
|
131994
|
+
{ label: React.createElement(app_typescript_1.Label, { style: 'translucent', type: 'primary', text: 'prlg' }), onSelect: function () { return console.log(index); } },
|
131995
|
+
]; }, onDrag: function (start, end) { return console.log(start, end); } })),
|
131996
|
+
React.createElement(Markup.ReactMarkupCode, null, "\n <TableList\n dragAndDrop\n addItem\n array={this.state.array}\n itemsDropdown={(index) => [\n { label: <Label style='translucent' type='primary' text='aacc' />, onSelect: () => console.log(index) },\n { label: <Label style='translucent' text='prlg' />, onSelect: () => console.log(index) },\n { label: <Label style='translucent' type='primary' text='prlg' />, onSelect: () => console.log(index) },\n ]\n }\n onDrag={(start, end) => console.log(start, end)}\n />\n ")),
|
131581
131997
|
React.createElement("h3", { className: "docs-page__h3" }, "Props"),
|
131582
131998
|
React.createElement("p", { className: "docs-page__paragraph" }, "TableList"),
|
131583
131999
|
React.createElement(app_typescript_1.PropsList, null,
|
131584
|
-
React.createElement(app_typescript_1.Prop, { name: 'array', isRequired:
|
131585
|
-
React.createElement(app_typescript_1.Prop, { name: 'children', isRequired: false, type: 'React.ReactNode', default: 'false', description: 'Children of component.' }),
|
132000
|
+
React.createElement(app_typescript_1.Prop, { name: 'array', isRequired: true, type: 'Array', default: 'false', description: 'Array of object.' }),
|
131586
132001
|
React.createElement(app_typescript_1.Prop, { name: 'addItem', isRequired: false, type: 'boolean', default: 'false', description: 'Functionality to add items to the list.' }),
|
131587
132002
|
React.createElement(app_typescript_1.Prop, { name: 'dragAndDrop', isRequired: false, type: 'boolean', default: 'false', description: 'Drag&Drop functionality.' }),
|
131588
|
-
React.createElement(app_typescript_1.Prop, { name: 'itemsDropdown', isRequired: false, type: 'React.ReactNode | any', default: 'false', description: 'Dropdown for functionality to add items to the list.' }),
|
131589
132003
|
React.createElement(app_typescript_1.Prop, { name: 'className', isRequired: false, type: 'string', default: 'false', description: 'Add class on TableList container.' }),
|
131590
|
-
React.createElement(app_typescript_1.Prop, { name: 'showDragHandle', isRequired: false, type: 'string', default: 'always', description: '' }),
|
131591
|
-
React.createElement(app_typescript_1.Prop, { name: '
|
132004
|
+
React.createElement(app_typescript_1.Prop, { name: 'showDragHandle', isRequired: false, type: 'string', default: 'always', description: '"always" | "onHover" | "none".' }),
|
132005
|
+
React.createElement(app_typescript_1.Prop, { name: 'readOnly', isRequired: false, type: 'boolean', default: 'false', description: 'When specified, component changes are not enabled.' }),
|
131592
132006
|
React.createElement(app_typescript_1.Prop, { name: 'onDrag', isRequired: false, type: 'function', default: 'false', description: 'Returns start and end position of draggable item' }),
|
131593
|
-
React.createElement(app_typescript_1.Prop, { name: 'onAddItem', isRequired: false, type: 'function', default: 'false', description: 'Returns index of draggable item.' })
|
132007
|
+
React.createElement(app_typescript_1.Prop, { name: 'onAddItem', isRequired: false, type: 'function', default: 'false', description: 'Returns index of draggable item.' }),
|
132008
|
+
React.createElement(app_typescript_1.Prop, { name: 'itemsDropdown', isRequired: false, type: 'function', default: 'false', description: 'Dropdown for adding items in the list. Returns index of draggable item.' })),
|
131594
132009
|
React.createElement("p", { className: "docs-page__paragraph" }, "array:"),
|
131595
132010
|
React.createElement(app_typescript_1.PropsList, null,
|
131596
132011
|
React.createElement(app_typescript_1.Prop, { name: 'start', isRequired: false, type: 'React.ReactNode', default: 'false', description: 'Column of individual items of list.' }),
|
131597
132012
|
React.createElement(app_typescript_1.Prop, { name: 'center', isRequired: false, type: 'React.ReactNode', default: 'false', description: 'Column of individual items of list.' }),
|
131598
132013
|
React.createElement(app_typescript_1.Prop, { name: 'end', isRequired: false, type: 'React.ReactNode', default: 'false', description: 'Column of individual items of list.' }),
|
131599
132014
|
React.createElement(app_typescript_1.Prop, { name: 'action', isRequired: false, type: 'React.ReactNode', default: 'false', description: 'Column of individual list items that is displayed on hover.' }),
|
132015
|
+
React.createElement(app_typescript_1.Prop, { name: 'hexColor', isRequired: false, type: 'string', default: 'false', description: '' }),
|
131600
132016
|
React.createElement(app_typescript_1.Prop, { name: 'onClick', isRequired: false, type: 'function', default: 'false', description: 'onClick functionality.' }),
|
131601
132017
|
React.createElement(app_typescript_1.Prop, { name: 'onDoubleClick', isRequired: false, type: 'function', default: 'false', description: 'onDoubleClick functionality.' }))));
|
131602
132018
|
};
|
@@ -134425,11 +134841,11 @@ var Rundowns = /** @class */ (function (_super) {
|
|
134425
134841
|
React.createElement(index_1.IconLabel, { style: 'translucent', innerLabel: 'Duration:', text: '00:56', type: 'warning' }),
|
134426
134842
|
React.createElement(index_1.Text, { color: 'light', size: 'small', className: 'sd-margin--0' }, "OF"),
|
134427
134843
|
React.createElement(index_1.IconLabel, { style: 'translucent', innerLabel: 'Planned:', text: '01:00' })),
|
134428
|
-
React.createElement(TableList_1.TableList, { className: 'sd-margin-y--4', array: this.state.array, itemsDropdown: [
|
134844
|
+
React.createElement(TableList_1.TableList, { className: 'sd-margin-y--4', array: this.state.array, itemsDropdown: function () { return [
|
134429
134845
|
{ label: React.createElement(index_1.Label, { style: 'translucent', type: 'primary', text: 'aacc' }), onSelect: function () { return 1; } },
|
134430
134846
|
{ label: React.createElement(index_1.Label, { style: 'translucent', text: 'prlg' }), onSelect: function () { return 1; } },
|
134431
134847
|
{ label: React.createElement(index_1.Label, { style: 'translucent', type: 'primary', text: 'prlg' }), onSelect: function () { return 1; } },
|
134432
|
-
]
|
134848
|
+
]; } }))))),
|
134433
134849
|
React.createElement(Layout.OverlayPanel, null)),
|
134434
134850
|
React.createElement(Layout.ContentSplitter, { visible: this.state.openEditor }),
|
134435
134851
|
React.createElement(Layout.AuthoringContainer, { open: this.state.openEditor },
|
@@ -137331,7 +137747,7 @@ exports.WithSizeObserverDocs = WithSizeObserverDocs;
|
|
137331
137747
|
/* 649 */
|
137332
137748
|
/***/ (function(module, exports) {
|
137333
137749
|
|
137334
|
-
module.exports = {"name":"superdesk-ui-framework","version":"3.0.1-beta.
|
137750
|
+
module.exports = {"name":"superdesk-ui-framework","version":"3.0.1-beta.14","license":"AGPL-3.0","repository":{"type":"git","url":"https://github.com/superdesk/superdesk-ui-framework.git"},"main":"dist/superdesk-ui.bundle.js","types":"react/index.d.ts","contributors":["Nemanja Pavlovic","Vladimir Stefanovic","Darko Tomic","Aleksandar Jelicic","Tomas Kikutis","Dragana Zivkovic"],"scripts":{"start":"webpack-dev-server --config tasks/webpack.dev.js","server":"webpack --watch --config tasks/webpack.prod.js && tsc-watch","build":"webpack --config tasks/webpack.prod.js && tsc","build-ui":"webpack && tsc && npm run lint","lint":"eslint --parser=@typescript-eslint/parser app && tslint -c tslint.json 'app-typescript/**/*.{ts,tsx}'","lint-fix":"tsc -p tsconfig.json --noEmit && tslint --fix -c tslint.json 'app-typescript/**/*.{ts,tsx}'","prepublishOnly":"npm run build"},"devDependencies":{"@types/chart.js":"^2.9.24","@types/classnames":"^2.2.9","@types/lodash":"^4.14.161","@types/react":"16.8.23","@types/react-beautiful-dnd":"^13.1.2","@types/react-dom":"16.8.0","@types/react-router-dom":"^5.1.2","@types/react-scrollspy":"^3.3.5","@typescript-eslint/parser":"5.14.0","angular":"^1.7.9","angular-animate":"^1.7.9","angular-route":"^1.7.9","babel-core":"^6.26.0","babel-loader":"^7.1.2","babel-plugin-transform-object-rest-spread":"^6.26.0","babel-preset-es2015":"^6.24.1","babel-preset-react":"^6.24.1","classnames":"^2.2.5","clean-webpack-plugin":"^1.0.0","code-prettify":"^0.1.0","copy-webpack-plugin":"^4.6.0","css-loader":"^2.1.1","eslint":"^4.6.1","eslint-loader":"^1.9.0","eslint-plugin-angular":"^3.1.1","eslint-plugin-react":"^7.3.0","extract-text-webpack-plugin":"^3.0.2","file-loader":"^0.11.2","html-loader":"^0.5.1","html-webpack-plugin":"^2.30.1","jquery":"^3.1.1","jquery-ui":"^1.12.1","lodash":"4.17.21","node-sass":"6.0","prismjs":"^1.28.0","prop-types":"^15.6.0","react":"16.8.6","react-bootstrap":"^0.31.2","react-dom":"16.8.6","react-redux":"^5.0.6","react-router-dom":"^5.1.2","redux":"^3.7.2","redux-form":"^7.0.4","sass-loader":"^6.0.6","style-loader":"^0.18.2","superdesk-code-style":"^1.1.2","ts-loader":"^6.0.2","tslint":"^5.18.0","typescript":"4.5.2","url-loader":"^1.1.2","webpack":"^3.5.5","webpack-cli":"3.3.10","webpack-dev-server":"2.11.1","webpack-merge":"^4.2.1"},"dependencies":{"@material-ui/lab":"^4.0.0-alpha.56","@popperjs/core":"^2.4.0","@superdesk/primereact":"^5.0.2-6","@types/node":"^14.10.2","chart.js":"^2.9.3","date-fns":"2.7.0","moment":"^2.29.3","popper.js":"1.14.4","primeicons":"2.0.0","react-beautiful-dnd":"^13.0.0","react-id-generator":"^3.0.0","react-popper":"^2.2.3","react-scrollspy":"^3.4.3"}}
|
137335
137751
|
|
137336
137752
|
/***/ }),
|
137337
137753
|
/* 650 */
|