superdesk-ui-framework 4.0.45 → 4.0.47

package/dist/vendor.bundle.js

@@ -7,7 +7,7 @@
 		var a = typeof exports === 'object' ? factory(require("react"), require("react-dom"), require("angular")) : factory(root["react"], root["react-dom"], root["angular"]);
 		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
 	}
-})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_9__, __WEBPACK_EXTERNAL_MODULE_842__) {
+})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_9__, __WEBPACK_EXTERNAL_MODULE_824__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -70,7 +70,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/ 	__webpack_require__.p = "";
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 839);
+/******/ 	return __webpack_require__(__webpack_require__.s = 821);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -82,7 +82,7 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
 
 /***/ }),
 
-/***/ 18:
+/***/ 19:
 /***/ (function(module, exports, __webpack_require__) {
 
 /* WEBPACK VAR INJECTION */(function(global, module) {var __WEBPACK_AMD_DEFINE_RESULT__;/**
@@ -17296,11 +17296,11 @@ module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
   }
 }.call(this));
 
-/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(35), __webpack_require__(47)(module)))
+/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(42), __webpack_require__(59)(module)))
 
 /***/ }),
 
-/***/ 35:
+/***/ 42:
 /***/ (function(module, exports) {
 
 var g;
@@ -17328,7 +17328,7 @@ module.exports = g;
 
 /***/ }),
 
-/***/ 47:
+/***/ 59:
 /***/ (function(module, exports) {
 
 module.exports = function(module) {
@@ -28246,21 +28246,21 @@ return jQuery;
 
 /***/ }),
 
-/***/ 839:
+/***/ 821:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 
-__webpack_require__(18);
+__webpack_require__(19);
 
 __webpack_require__(74);
 
-__webpack_require__(840);
+__webpack_require__(822);
 
-__webpack_require__(842);
+__webpack_require__(824);
 
-__webpack_require__(843);
+__webpack_require__(825);
 
 __webpack_require__(0);
 
@@ -28268,7 +28268,7 @@ __webpack_require__(9);
 
 /***/ }),
 
-/***/ 840:
+/***/ 822:
 /***/ (function(module, exports, __webpack_require__) {
 
 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
@@ -28292,7 +28292,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
 	if ( true ) {
 
 		// AMD. Register as an anonymous module.
-		!(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(74), __webpack_require__(841) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
+		!(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(74), __webpack_require__(823) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
 				__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
 				(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
 				__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
@@ -29030,7 +29030,7 @@ return $.widget;
 
 /***/ }),
 
-/***/ 841:
+/***/ 823:
 /***/ (function(module, exports, __webpack_require__) {
 
 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;( function( factory ) {
@@ -29060,23 +29060,23 @@ return $.ui.version = "1.13.0";
 
 /***/ }),
 
-/***/ 842:
+/***/ 824:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_842__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_824__;
 
 /***/ }),
 
-/***/ 843:
+/***/ 825:
 /***/ (function(module, exports, __webpack_require__) {
 
-__webpack_require__(844);
+__webpack_require__(826);
 module.exports = 'ngAnimate';
 
 
 /***/ }),
 
-/***/ 844:
+/***/ 826:
 /***/ (function(module, exports) {
 
 /**

package/examples/pages/playgrounds/react-playgrounds/Multiedit.tsx

@@ -4,7 +4,7 @@ import * as Layout from '../../../../app-typescript/components/Layouts';
 import * as Form from '../../../../app-typescript/components/Form';
 import * as Nav from '../../../../app-typescript/components/Navigation';
 import { BoxedList, BoxedListItem, BoxedListContentRow } from '../../../../app-typescript/components/Lists';
-import { Spacer } from '@superdesk/common';
+import { Spacer } from '@sourcefabric/common';
 
 interface IProps {
     children?: React.ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "superdesk-ui-framework",
-  "version": "4.0.45",
+  "version": "4.0.47",
   "license": "AGPL-3.0",
   "repository": {
     "type": "git",
@@ -97,7 +97,6 @@
   "dependencies": {
     "@popperjs/core": "^2.4.0",
     "@sourcefabric/common": "0.0.63",
-    "@superdesk/common": "0.0.28",
     "@superdesk/primereact": "^5.0.2-13",
     "@superdesk/react-resizable-panels": "0.0.39",
     "chart.js": "^2.9.3",

package/react/components/DateTimePicker.d.ts

@@ -1,7 +1,8 @@
 import * as React from "react";
 import { InputWrapper } from "./Form";
 import { IInputWrapper } from "./Form/InputWrapper";
-interface IProps extends IInputWrapper {
+interface IPropsValueDate extends IInputWrapper {
+    valueType: 'date';
     value: Date | null;
     dateFormat: string;
     onChange: (value: Date | null) => void;
@@ -13,11 +14,32 @@ interface IProps extends IInputWrapper {
     ref?: React.LegacyRef<InputWrapper>;
     'data-test-id'?: string;
 }
+type IValue = {
+    date?: string;
+    time?: string;
+};
+interface IPropsValueObject extends IInputWrapper {
+    valueType: 'object';
+    value: IValue;
+    dateFormat: string;
+    onChange: (value: IValue) => void;
+    preview?: boolean;
+    fullWidth?: boolean;
+    allowSeconds?: boolean;
+    required?: boolean;
+    disabled?: boolean;
+    ref?: React.LegacyRef<InputWrapper>;
+    'data-test-id'?: string;
+}
+type IProps = IPropsValueDate | IPropsValueObject;
 export declare class DateTimePicker extends React.PureComponent<IProps> {
     private htmlId;
     handleTimeChange: (time: string) => void;
     handleDateChange: (date: Date | null) => void;
     prepareFormat(unitOfTime: number): string;
+    getTimeValue(): string;
+    getDateValue(): Date | null;
+    handleClear: () => void;
     render(): JSX.Element;
 }
 export {};

package/react/components/DateTimePicker.js

@@ -14,6 +14,17 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -54,59 +65,105 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DateTimePicker = void 0;
 var React = __importStar(require("react"));
 var DatePicker_1 = require("../components/DatePicker");
-var common_1 = require("@superdesk/common");
+var common_1 = require("@sourcefabric/common");
 var lodash_1 = require("lodash");
 var TimePicker_1 = require("./TimePicker");
 var IconButton_1 = require("./IconButton");
 var Form_1 = require("./Form");
 var react_id_generator_1 = __importDefault(require("react-id-generator"));
+var date_fns_1 = require("date-fns");
+var helpers_1 = require("../helpers");
 var DateTimePicker = /** @class */ (function (_super) {
     __extends(DateTimePicker, _super);
     function DateTimePicker() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.htmlId = (0, react_id_generator_1.default)();
         _this.handleTimeChange = function (time) {
-            var _a = time
-                .split(":")
-                .map(function (x) { return (0, lodash_1.defaultTo)(parseInt(x, 10), 0); }), hours = _a[0], minutes = _a[1]; // handle NaN value
-            var origDate = _this.props.value ? new Date(_this.props.value) : new Date();
-            origDate.setHours(hours, minutes);
-            _this.props.onChange(origDate);
+            if (_this.props.valueType === 'date') {
+                var _a = time
+                    .split(":")
+                    .map(function (x) { return (0, lodash_1.defaultTo)(parseInt(x, 10), 0); }), hours = _a[0], minutes = _a[1];
+                var origDate = _this.props.value ? new Date(_this.props.value) : new Date();
+                origDate.setHours(hours, minutes);
+                _this.props.onChange(origDate);
+            }
+            else if (_this.props.valueType === 'object') {
+                _this.props.onChange(__assign(__assign({}, _this.props.value), { time: time }));
+            }
+            else {
+                (0, helpers_1.assertNever)(_this.props);
+            }
         };
         _this.handleDateChange = function (date) {
             var _a;
-            if (date == null) {
+            if (_this.props.valueType === 'date') {
+                if (date == null) {
+                    _this.props.onChange(null);
+                    return;
+                }
+                var origDate = (_a = _this.props.value) !== null && _a !== void 0 ? _a : new Date();
+                var selectedDate = new Date(date);
+                selectedDate.setHours(origDate.getHours(), origDate.getMinutes());
+                _this.props.onChange(selectedDate);
+            }
+            else if (_this.props.valueType === 'object') {
+                _this.props.onChange(__assign(__assign({}, _this.props.value), { date: date ? (0, date_fns_1.format)(date, 'yyyy-MM-dd') : undefined }));
+            }
+            else {
+                (0, helpers_1.assertNever)(_this.props);
+            }
+        };
+        _this.handleClear = function () {
+            if (_this.props.valueType === 'date') {
                 _this.props.onChange(null);
-                return;
             }
-            var origDate = (_a = _this.props.value) !== null && _a !== void 0 ? _a : new Date();
-            var selectedDate = new Date(date);
-            selectedDate.setHours(origDate.getHours(), origDate.getMinutes());
-            _this.props.onChange(selectedDate);
+            else if (_this.props.valueType === 'object') {
+                _this.props.onChange({ date: undefined, time: undefined });
+            }
+            else {
+                (0, helpers_1.assertNever)(_this.props);
+            }
         };
         return _this;
     }
     DateTimePicker.prototype.prepareFormat = function (unitOfTime) {
         return unitOfTime.toString().padStart(2, "0");
     };
+    DateTimePicker.prototype.getTimeValue = function () {
+        var _a;
+        if (this.props.valueType === 'date') {
+            return this.props.value != null
+                ? "".concat(this.prepareFormat(this.props.value.getHours()), ":").concat(this.prepareFormat(this.props.value.getMinutes()))
+                : "";
+        }
+        else if (this.props.valueType === 'object') {
+            return (_a = this.props.value.time) !== null && _a !== void 0 ? _a : '';
+        }
+        else {
+            (0, helpers_1.assertNever)(this.props);
+        }
+    };
+    DateTimePicker.prototype.getDateValue = function () {
+        if (this.props.valueType === 'date') {
+            return this.props.value;
+        }
+        else if (this.props.valueType === 'object') {
+            return this.props.value.date ? new Date(this.props.value.date) : null;
+        }
+        else {
+            (0, helpers_1.assertNever)(this.props);
+        }
+    };
     DateTimePicker.prototype.render = function () {
-        var _this = this;
-        var convertedTimeValue = this.props.value != null
-            ? "".concat(this.prepareFormat(this.props.value.getHours()), ":").concat(this.prepareFormat(this.props.value.getMinutes()))
-            : "";
+        var timeValue = this.getTimeValue();
+        var dateValue = this.getDateValue();
         return (React.createElement(Form_1.InputWrapper, { label: this.props.label, error: this.props.error, invalid: this.props.error != null, required: this.props.required, disabled: this.props.disabled, info: this.props.info, inlineLabel: this.props.inlineLabel, labelHidden: this.props.labelHidden, htmlId: this.htmlId, tabindex: this.props.tabindex, fullWidth: this.props.fullWidth, inputWrapper: this.props.inputWrapper, "data-test-id": this.props["data-test-id"], ref: this.props.ref },
             React.createElement(common_1.Spacer, { h: true, gap: "8", alignItems: "end", noWrap: true },
                 React.createElement("div", { style: { flexGrow: 1 } },
-                    React.createElement(DatePicker_1.DatePicker, { disabled: this.props.disabled, preview: this.props.preview, required: this.props.required, hideClearButton: true, value: this.props.value, onChange: function (val) {
-                            _this.handleDateChange(val);
-                        }, dateFormat: this.props.dateFormat, inlineLabel: true, labelHidden: true, fullWidth: this.props.fullWidth })),
+                    React.createElement(DatePicker_1.DatePicker, { disabled: this.props.disabled, preview: this.props.preview, required: this.props.required, hideClearButton: true, value: dateValue, onChange: this.handleDateChange, dateFormat: this.props.dateFormat, inlineLabel: true, labelHidden: true, fullWidth: this.props.fullWidth })),
                 React.createElement("div", { style: { flexGrow: 1 } },
-                    React.createElement(TimePicker_1.TimePicker, { disabled: this.props.disabled, preview: this.props.preview, value: convertedTimeValue, onChange: function (val) {
-                            _this.handleTimeChange(val);
-                        }, inlineLabel: true, labelHidden: true, allowSeconds: this.props.allowSeconds, fullWidth: this.props.fullWidth, required: this.props.required })),
-                this.props.preview !== true && (React.createElement(IconButton_1.IconButton, { disabled: this.props.disabled, icon: "remove-sign", onClick: function () {
-                        _this.props.onChange(null);
-                    }, ariaValue: "Clear" })))));
+                    React.createElement(TimePicker_1.TimePicker, { disabled: this.props.disabled, preview: this.props.preview, value: timeValue, onChange: this.handleTimeChange, inlineLabel: true, labelHidden: true, allowSeconds: this.props.allowSeconds, fullWidth: this.props.fullWidth, required: this.props.required })),
+                this.props.preview !== true && (React.createElement(IconButton_1.IconButton, { disabled: this.props.disabled, icon: "remove-sign", onClick: this.handleClear, ariaValue: "Clear" })))));
     };
     return DateTimePicker;
 }(React.PureComponent));

package/react/components/TreeSelect/TreeSelect.js

@@ -88,7 +88,7 @@ var KeyboardNavigation_1 = require("./KeyboardNavigation");
 var WithPortal_1 = require("../WithPortal");
 var react_beautiful_dnd_1 = require("react-beautiful-dnd");
 var zIndex_1 = require("../../zIndex");
-var common_1 = require("@superdesk/common");
+var common_1 = require("@sourcefabric/common");
 var TreeSelect = /** @class */ (function (_super) {
     __extends(TreeSelect, _super);
     function TreeSelect(props) {

package/react/components/avatar/avatar-group.js

@@ -69,7 +69,7 @@ var avatar_1 = require("./avatar");
 var avatar_wrapper_1 = require("./avatar-wrapper");
 var avatar_number_1 = require("./avatar-number");
 var avatar_placeholder_1 = require("./avatar-placeholder");
-var common_1 = require("@superdesk/common");
+var common_1 = require("@sourcefabric/common");
 var WithPopover_1 = require("../WithPopover");
 function isAvatar(item) {
     return item['kind'] == null;

package/react/index.d.ts

@@ -94,7 +94,7 @@ export { MultiSelect } from './components/MultiSelect';
 export { ResizablePanels } from './components/ResizablePanels';
 export { WithPopover } from './components/WithPopover';
 export { PopupPositioner, showPopup } from './components/ShowPopup';
-export { Spacer, SpacerBlock } from '@superdesk/common';
+export { Spacer, SpacerBlock } from '@sourcefabric/common';
 export { ResizeObserverComponent } from './components/ResizeObserverComponent';
 export { DragHandleDots } from './components/DragHandleDots';
 export { DragHandle } from './components/DragHandle';

package/react/index.js

@@ -229,7 +229,7 @@ Object.defineProperty(exports, "WithPopover", { enumerable: true, get: function
 var ShowPopup_1 = require("./components/ShowPopup");
 Object.defineProperty(exports, "PopupPositioner", { enumerable: true, get: function () { return ShowPopup_1.PopupPositioner; } });
 Object.defineProperty(exports, "showPopup", { enumerable: true, get: function () { return ShowPopup_1.showPopup; } });
-var common_1 = require("@superdesk/common");
+var common_1 = require("@sourcefabric/common");
 Object.defineProperty(exports, "Spacer", { enumerable: true, get: function () { return common_1.Spacer; } });
 Object.defineProperty(exports, "SpacerBlock", { enumerable: true, get: function () { return common_1.SpacerBlock; } });
 var ResizeObserverComponent_1 = require("./components/ResizeObserverComponent");