superdesk-ui-framework 3.0.1-beta.2 → 3.0.1-beta.3

package/react/components/CheckboxButton.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -42,7 +44,7 @@ var CheckboxButton = /** @class */ (function (_super) {
     __extends(CheckboxButton, _super);
     function CheckboxButton(props) {
         var _this = _super.call(this, props) || this;
-        _this.htmlId = react_id_generator_1.default();
+        _this.htmlId = (0, react_id_generator_1.default)();
         _this.handleChange = _this.handleChange.bind(_this);
         return _this;
     }
@@ -56,7 +58,7 @@ var CheckboxButton = /** @class */ (function (_super) {
             React.createElement("input", { type: "checkbox", className: "sd-check-button__input", id: this.htmlId, tabIndex: this.props.tabindex, checked: this.props.checked, onChange: this.handleChange, disabled: this.props.disabled, required: this.props.required }),
             React.createElement("label", { className: "sd-check-button__text-label", htmlFor: this.htmlId, "aria-label": this.props.label.hidden ? this.props.label.text : undefined },
                 this.props.label.icon ?
-                    React.createElement("i", { className: "icon-" + this.props.label.icon, "aria-hidden": "true" }) : null,
+                    React.createElement("i", { className: "icon-".concat(this.props.label.icon), "aria-hidden": "true" }) : null,
                 !this.props.label.hidden || !this.props.label.icon ?
                     React.createElement("span", { className: "sd-check-button__text-label-inner" }, this.props.label.text) : null)));
     };

package/react/components/ContentDivider.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -45,13 +47,13 @@ var ContentDivider = /** @class */ (function (_super) {
     }
     ContentDivider.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('sd-content-divider', (_a = {
+        var classes = (0, classnames_1.default)('sd-content-divider', (_a = {
                 'sd-content-divider--horizontal': this.props.orientation === undefined,
                 'sd-content-divider--no-border': this.props.border === false
             },
-            _a["sd-content-divider--" + this.props.type] = this.props.type || this.props.type !== undefined,
-            _a["sd-content-divider--text-" + this.props.align] = this.props.align || this.props.align !== undefined,
-            _a["sd-content-divider--" + this.props.orientation] = this.props.orientation || this.props.orientation !== undefined,
+            _a["sd-content-divider--".concat(this.props.type)] = this.props.type || this.props.type !== undefined,
+            _a["sd-content-divider--text-".concat(this.props.align)] = this.props.align || this.props.align !== undefined,
+            _a["sd-content-divider--".concat(this.props.orientation)] = this.props.orientation || this.props.orientation !== undefined,
             _a));
         if (this.props.children) {
             return (React.createElement("div", { className: "sd-content-divider--with-text " + classes, role: "separator" },

package/react/components/CreateButton.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -47,10 +49,10 @@ var CreateButton = /** @class */ (function (_super) {
     }
     CreateButton.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('sd-create-btn', (_a = {
+        var classes = (0, classnames_1.default)('sd-create-btn', (_a = {
                 'sd-navbtn--active': this.props.state === 'active'
             },
-            _a["sd-navbtn--" + this.props.type] = this.props.type,
+            _a["sd-navbtn--".concat(this.props.type)] = this.props.type,
             _a));
         var value = this.props.value === undefined ? 'button' : this.props.value;
         return (React.createElement(Tooltip_1.Tooltip, { text: this.props.ariaValue, flow: this.props.toolTipFlow, appendToBody: true },

package/react/components/DatePicker.d.ts

@@ -9,6 +9,15 @@ interface IDatePickerBase {
         label: string;
     }>;
     locale?: DatePickerLocaleSettings;
+    inlineLabel?: boolean;
+    required?: boolean;
+    fullWidth?: boolean;
+    invalid?: boolean;
+    labelHidden?: boolean;
+    tabindex?: number;
+    label?: string;
+    info?: string;
+    error?: string;
 }
 interface IDatePicker extends IDatePickerBase {
     value: Date | null;
@@ -17,6 +26,7 @@ interface IDatePicker extends IDatePickerBase {
 interface IState {
     value: CalendarProps['value'];
     valid: boolean;
+    invalid: boolean;
 }
 export declare class DatePicker extends React.PureComponent<IDatePicker, IState> {
     private instance;

package/react/components/DatePicker.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -38,7 +40,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -52,6 +54,8 @@ var addDays_1 = __importDefault(require("date-fns/addDays"));
 var format_1 = __importDefault(require("date-fns/format"));
 var calendar_1 = require("@superdesk/primereact/calendar");
 var lodash_1 = require("lodash");
+var classnames_1 = __importDefault(require("classnames"));
+var react_id_generator_1 = __importDefault(require("react-id-generator"));
 var internalPrimereactClassnames = {
     overlayVisible: 'p-input-overlay-visible',
 };
@@ -77,12 +81,14 @@ function parseToPrimeReactCalendarFormat(value) {
 var DatePicker = /** @class */ (function (_super) {
     __extends(DatePicker, _super);
     function DatePicker(props) {
+        var _a;
         var _this = _super.call(this, props) || this;
         _this.state = {
             value: parseToPrimeReactCalendarFormat(_this.props.value),
             valid: true,
+            invalid: (_a = _this.props.invalid) !== null && _a !== void 0 ? _a : false,
         };
-        _this.hidePopupOnScroll = lodash_1.throttle(function () {
+        _this.hidePopupOnScroll = (0, lodash_1.throttle)(function () {
             if (_this.instance != null
                 && _this.instance.panel != null
                 && _this.instance.hideOverlay != null
@@ -118,37 +124,56 @@ var DatePicker = /** @class */ (function (_super) {
         if (this.props.locale != null) {
             locale = __assign(__assign({}, this.props.locale), { today: 'today', clear: 'clear' });
         }
-        return (React.createElement(calendar_1.Calendar, { ref: function (ref) {
-                _this.instance = ref;
-            }, value: this.state.value === null ? undefined : this.state.value, onChange: function (event) {
-                var result = parseFromPrimeReactCalendarFormat(event.value);
-                if (result !== 'failed-to-parse') {
-                    _this.setState({ value: event.value, valid: true });
-                    _this.props.onChange(result);
-                }
-                else {
-                    // updating internal state so a user can continue typing and enter a valid value
-                    _this.setState({ value: event.value, valid: false });
-                }
-            }, locale: locale, dateFormat: this.props.dateFormat.replace('YYYY', 'yy').replace('MM', 'mm').replace('DD', 'dd'), showIcon: true, icon: "icon-calendar", headerTemplate: function () { return _this.props.shortcuts == null ? null : (React.createElement("div", { style: { width: '100%', display: 'flex', justifyContent: 'space-between', marginBottom: 10 } }, _this.props.shortcuts.map(function (_a, i) {
-                var label = _a.label, days = _a.days;
-                return (React.createElement("button", { key: i, className: "btn btn--hollow btn--small", onClick: function () {
-                        _this.props.onChange(addDays_1.default(new Date(), days));
-                        if (_this.instance != null && typeof _this.instance.hideOverlay === 'function') {
-                            _this.instance.hideOverlay();
-                        }
-                    } }, label));
-            }))); }, appendTo: document.body, disabled: this.props.disabled, onBlur: function (event) {
-                // @ts-ignore: Object is possibly 'null'.
-                if (!(event === null || event === void 0 ? void 0 : event.target.value)) {
+        var classes = (0, classnames_1.default)('sd-input', {
+            'sd-input--inline-label': this.props.inlineLabel,
+            'sd-input--required': this.props.required,
+            'sd-input--disabled': this.props.disabled,
+            'sd-input--full-width': this.props.fullWidth,
+            'sd-input--invalid': this.props.invalid || this.state.invalid,
+        });
+        var labelClasses = (0, classnames_1.default)('sd-input__label', {
+            'a11y-only': this.props.labelHidden,
+        });
+        var htmlId = (0, react_id_generator_1.default)();
+        return (React.createElement("div", { className: classes },
+            React.createElement("label", { className: labelClasses, htmlFor: htmlId, id: htmlId + 'label', tabIndex: this.props.tabindex === undefined ? undefined : -1 }, this.props.label),
+            React.createElement(calendar_1.Calendar, { ref: function (ref) {
+                    _this.instance = ref;
+                }, value: this.state.value === null ? undefined : this.state.value, onChange: function (event) {
+                    var result = parseFromPrimeReactCalendarFormat(event.value);
+                    if (result !== 'failed-to-parse') {
+                        _this.setState({ value: event.value, valid: true });
+                        _this.props.onChange(result);
+                    }
+                    else {
+                        // updating internal state so a user can continue typing and enter a valid value
+                        _this.setState({ value: event.value, valid: false });
+                    }
+                }, locale: locale, dateFormat: this.props.dateFormat.replace('YYYY', 'yy').replace('MM', 'mm').replace('DD', 'dd'), showIcon: true, icon: "icon-calendar", headerTemplate: function () { return _this.props.shortcuts == null ? null : (React.createElement("div", { style: { width: '100%', display: 'flex', justifyContent: 'space-between', marginBottom: 10 } }, _this.props.shortcuts.map(function (_a, i) {
+                    var label = _a.label, days = _a.days;
+                    return (React.createElement("button", { key: i, className: "btn btn--hollow btn--small", onClick: function () {
+                            _this.props.onChange((0, addDays_1.default)(new Date(), days));
+                            if (_this.instance != null && typeof _this.instance.hideOverlay === 'function') {
+                                _this.instance.hideOverlay();
+                            }
+                        } }, label));
+                }))); }, appendTo: document.body, disabled: this.props.disabled, onBlur: function (event) {
                     // @ts-ignore: Object is possibly 'null'.
-                    _this.setState({ valid: true, value: null });
-                }
-                else {
-                    // restoring internal state to current props value
-                    _this.setState({ valid: true, value: parseToPrimeReactCalendarFormat(_this.props.value) });
-                }
-            } }));
+                    if (!(event === null || event === void 0 ? void 0 : event.target.value)) {
+                        // @ts-ignore: Object is possibly 'null'.
+                        _this.setState({ valid: true, value: null });
+                    }
+                    else {
+                        // restoring internal state to current props value
+                        _this.setState({ valid: true, value: parseToPrimeReactCalendarFormat(_this.props.value) });
+                    }
+                } }),
+            React.createElement("div", { className: 'sd-input__message-box' },
+                this.props.info && !this.props.invalid && !this.state.invalid ?
+                    React.createElement("div", { className: 'sd-input__hint' }, this.props.info) : null,
+                this.props.invalid || this.state.invalid ?
+                    React.createElement("div", { className: 'sd-input__message' }, this.props.error)
+                    : null)));
     };
     return DatePicker;
 }(React.PureComponent));
@@ -165,9 +190,9 @@ var DatePickerISO = /** @class */ (function (_super) {
                     _this.props.onChange('');
                 }
                 else {
-                    _this.props.onChange(format_1.default(value, 'yyyy-MM-dd'));
+                    _this.props.onChange((0, format_1.default)(value, 'yyyy-MM-dd'));
                 }
-            }, disabled: this.props.disabled, shortcuts: this.props.shortcuts, dateFormat: this.props.dateFormat, locale: this.props.locale }));
+            }, disabled: this.props.disabled, shortcuts: this.props.shortcuts, dateFormat: this.props.dateFormat, locale: this.props.locale, inlineLabel: this.props.inlineLabel, required: this.props.required, fullWidth: this.props.fullWidth, invalid: this.props.invalid, labelHidden: this.props.labelHidden, tabindex: this.props.tabindex, label: this.props.label, info: this.props.info, error: this.props.error }));
     };
     return DatePickerISO;
 }(React.PureComponent));

package/react/components/Divider.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -45,11 +47,11 @@ var Divider = /** @class */ (function (_super) {
     }
     Divider.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('button-group__divider', (_a = {
+        var classes = (0, classnames_1.default)('button-group__divider', (_a = {
                 'button-group__divider--small': this.props.size === undefined,
                 'button-group__divider--border': this.props.border === true
             },
-            _a["button-group__divider--" + this.props.size] = this.props.size || this.props.size !== undefined,
+            _a["button-group__divider--".concat(this.props.size)] = this.props.size || this.props.size !== undefined,
             _a));
         return (React.createElement("div", { className: classes }));
     };

package/react/components/DonutChart.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ChartData, ChartOptions } from 'chart.js';
 interface IProps {
     data: ChartData;

package/react/components/DonutChart.js

@@ -3,21 +3,39 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DonutChart = void 0;
-var react_1 = __importDefault(require("react"));
+var React = __importStar(require("react"));
 var chart_1 = require("@superdesk/primereact/chart");
 var DonutChart = /** @class */ (function (_super) {
     __extends(DonutChart, _super);
@@ -25,8 +43,8 @@ var DonutChart = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     DonutChart.prototype.render = function () {
-        return react_1.default.createElement(chart_1.Chart, { type: "doughnut", width: this.props.width, height: this.props.height, data: this.props.data, options: this.props.options });
+        return React.createElement(chart_1.Chart, { type: "doughnut", width: this.props.width, height: this.props.height, data: this.props.data, options: this.props.options });
     };
     return DonutChart;
-}(react_1.default.Component));
+}(React.Component));
 exports.DonutChart = DonutChart;

package/react/components/DropZone.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -72,11 +74,11 @@ var DropZone = /** @class */ (function (_super) {
     DropZone.prototype.render = function () {
         var _a;
         var _this = this;
-        var classes = classnames_1.default('sd-dropzone__drop-target', (_a = {
+        var classes = (0, classnames_1.default)('sd-dropzone__drop-target', (_a = {
                 'sd-dropzone__drop-target--ondragover': this.state.dragClass,
                 'sd-dropzone__drop-target--ondrop': this.state.dropClass
             },
-            _a["sd-dropzone__drop-target--" + this.props.type] = this.props.type,
+            _a["sd-dropzone__drop-target--".concat(this.props.type)] = this.props.type,
             _a), this.props.className);
         return (React.createElement("div", { className: classes, onDragLeave: function (event) { return _this.dragLeave(event); }, onDragEnter: function (event) { return _this.dragEnter(event); }, onDragOver: function (event) { return _this.dragOver(event); }, onDrop: function (event) { return _this.drop(event); }, onDragStart: function () { return false; }, onDragEnd: function () { return false; } },
             React.createElement("div", { className: 'sd-dropzone__target-border' }),

package/react/components/Dropdown.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -24,11 +24,11 @@ var React = __importStar(require("react"));
 var ReactDOM = __importStar(require("react-dom"));
 var core_1 = require("@popperjs/core");
 var react_id_generator_1 = require("react-id-generator");
-exports.Dropdown = function (_a) {
+var Dropdown = function (_a) {
     var items = _a.items, header = _a.header, footer = _a.footer, children = _a.children, append = _a.append, align = _a.align;
     var _b = React.useState(false), open = _b[0], setOpen = _b[1];
     var _c = React.useState(false), change = _c[0], setChange = _c[1];
-    var menuID = react_id_generator_1.useId()[0];
+    var menuID = (0, react_id_generator_1.useId)()[0];
     var DROPDOWN_ID = "react-placeholder";
     var ref = React.useRef(null);
     var refSubMenu = React.useRef(null);
@@ -94,7 +94,7 @@ exports.Dropdown = function (_a) {
                 menuRef_1 = ref.current;
                 var toggleRef = buttonRef.current;
                 if (toggleRef && menuRef_1) {
-                    core_1.createPopper(toggleRef, menuRef_1, {
+                    (0, core_1.createPopper)(toggleRef, menuRef_1, {
                         placement: checkAlign() ? 'bottom-end' : 'bottom-start',
                     });
                 }
@@ -104,7 +104,7 @@ exports.Dropdown = function (_a) {
                     menuRef_1 = ref.current;
                     var toggleRef = buttonRef.current;
                     if (toggleRef && menuRef_1) {
-                        core_1.createPopper(toggleRef, menuRef_1, {
+                        (0, core_1.createPopper)(toggleRef, menuRef_1, {
                             placement: checkAlign() ? 'bottom-end' : 'bottom-start',
                             strategy: 'fixed',
                         });
@@ -158,7 +158,7 @@ exports.Dropdown = function (_a) {
                             var subMenuRef = refSubMenu.current;
                             var subToggleRef = refButtonSubMenu.current;
                             if (subMenuRef && subToggleRef) {
-                                core_1.createPopper(subToggleRef, subMenuRef, {
+                                (0, core_1.createPopper)(subToggleRef, subMenuRef, {
                                     placement: 'right-start',
                                 });
                             }
@@ -221,6 +221,7 @@ exports.Dropdown = function (_a) {
             }
         })()));
 };
+exports.Dropdown = Dropdown;
 var DropdownItem = function (_a) {
     var label = _a.label, icon = _a.icon, active = _a.active, onSelect = _a.onSelect;
     return (React.createElement("li", { role: 'none', className: active ? 'dropdown__menu-item--active' : '' },

package/react/components/DropdownFirst.js

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -25,7 +25,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DropdownFooter = exports.DropdownBody = exports.DropdownHeader = exports.DropdownLabel = exports.DropdownDivider = exports.DropdownItem = exports.DropdownFirst = void 0;
 var React = __importStar(require("react"));
 var classnames_1 = __importDefault(require("classnames"));
-exports.DropdownFirst = function (_a) {
+var DropdownFirst = function (_a) {
     var _b, _c;
     var name = _a.name, align = _a.align, side = _a.side, level = _a.level, icon = _a.icon, headerFooter = _a.headerFooter, navDropdown = _a.navDropdown, children = _a.children;
     var _d = React.useState(false), open = _d[0], setOpen = _d[1];
@@ -60,10 +60,10 @@ exports.DropdownFirst = function (_a) {
             clearTimeout(inDebounce);
         };
     }, [open]);
-    var classes = classnames_1.default('dropdown', (_b = {},
+    var classes = (0, classnames_1.default)('dropdown', (_b = {},
         _b['open'] = open,
         _b['dropdown--align-right'] = align === 'right',
-        _b["dropdown--drop" + side] = side,
+        _b["dropdown--drop".concat(side)] = side,
         _b['dropdown--dropup'] = height,
         _b));
     function isOpen() {
@@ -112,7 +112,7 @@ exports.DropdownFirst = function (_a) {
     }
     else {
         if (level) {
-            var classesMenu = classnames_1.default('dropdown__menu', (_c = {},
+            var classesMenu = (0, classnames_1.default)('dropdown__menu', (_c = {},
                 _c['dropdown__menu--submenu-left'] = align === 'left',
                 _c));
             return (React.createElement("li", null,
@@ -133,7 +133,8 @@ exports.DropdownFirst = function (_a) {
         }
     }
 };
-exports.DropdownItem = function (_a) {
+exports.DropdownFirst = DropdownFirst;
+var DropdownItem = function (_a) {
     var text = _a.text, icon = _a.icon, noLink = _a.noLink, onSelect = _a.onSelect;
     if (noLink) {
         return React.createElement("li", { className: 'dropdown__menu-item--no-link' }, text);
@@ -145,32 +146,38 @@ exports.DropdownItem = function (_a) {
                 text)));
     }
 };
-exports.DropdownDivider = function (_a) {
+exports.DropdownItem = DropdownItem;
+var DropdownDivider = function (_a) {
     return (React.createElement("li", { className: "dropdown__menu-divider" }));
 };
-exports.DropdownLabel = function (_a) {
+exports.DropdownDivider = DropdownDivider;
+var DropdownLabel = function (_a) {
     var text = _a.text;
     return (React.createElement("li", null,
         React.createElement("div", { className: "dropdown__menu-label" }, text)));
 };
-exports.DropdownHeader = function (_a) {
+exports.DropdownLabel = DropdownLabel;
+var DropdownHeader = function (_a) {
     var title = _a.title, children = _a.children;
     return (React.createElement("ul", { className: 'dropdown__menu-header' },
         React.createElement(exports.DropdownLabel, { text: title }),
         children));
 };
-exports.DropdownBody = function (_a) {
+exports.DropdownHeader = DropdownHeader;
+var DropdownBody = function (_a) {
     var title = _a.title, children = _a.children;
     return (React.createElement("ul", { className: 'dropdown__menu-body' },
         React.createElement(exports.DropdownLabel, { text: title }),
         children));
 };
-exports.DropdownFooter = function (_a) {
+exports.DropdownBody = DropdownBody;
+var DropdownFooter = function (_a) {
     var title = _a.title, children = _a.children;
     return (React.createElement("ul", { className: 'dropdown__menu-footer dropdown__menu-footer--has-list' },
         React.createElement(exports.DropdownLabel, { text: title }),
         children));
 };
+exports.DropdownFooter = DropdownFooter;
 exports.DropdownFirst.Item = exports.DropdownItem;
 exports.DropdownFirst.Divider = exports.DropdownDivider;
 exports.DropdownFirst.Label = exports.DropdownLabel;

package/react/components/EmptyState.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -27,7 +29,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -45,12 +47,12 @@ var EmptyState = /** @class */ (function (_super) {
     }
     EmptyState.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('content-state__image', (_a = {
+        var classes = (0, classnames_1.default)('content-state__image', (_a = {
                 'content-state__image--small': this.props.size === undefined
             },
-            _a["content-state__image--" + this.props.size] = this.props.size || this.props.size !== undefined,
+            _a["content-state__image--".concat(this.props.size)] = this.props.size || this.props.size !== undefined,
             _a));
-        var image = require("../../app/img/empty_states/empty-state--" + (this.props.size ? this.props.size : 'small') + "-" + (this.props.illustration ? this.props.illustration : '1') + ".svg");
+        var image = require("../../app/img/empty_states/empty-state--".concat(this.props.size ? this.props.size : 'small', "-").concat(this.props.illustration ? this.props.illustration : '1', ".svg"));
         return (React.createElement("div", { className: 'content-state--empty-container' },
             React.createElement("div", { className: 'content-state__empty-info' },
                 React.createElement("figure", { className: classes },