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

package/react/components/Badge.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,18 +47,18 @@ var Badge = /** @class */ (function (_super) {
     }
     Badge.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('badge', (_a = {},
-            _a["badge--" + this.props.type] = this.props.type && !this.props.color,
-            _a["" + this.props.color] = this.props.color && !this.props.type,
+        var classes = (0, classnames_1.default)('badge', (_a = {},
+            _a["badge--".concat(this.props.type)] = this.props.type && !this.props.color,
+            _a["".concat(this.props.color)] = this.props.color && !this.props.type,
             _a['badge--square'] = this.props.shape === 'square',
             _a));
         if (this.props.children) {
             return (React.createElement("div", { className: 'element-with-badge', "data-test-id": this.props['data-test-id'] },
                 this.props.children,
-                React.createElement("span", { className: classes, "data-test-id": "badge-content" }, this.props.text)));
+                React.createElement("span", { className: classes, style: { backgroundColor: this.props.hexColor }, "data-test-id": "badge-content" }, this.props.text)));
         }
         else {
-            return React.createElement("span", { className: classes, "data-test-id": this.props['data-test-id'] }, this.props.text);
+            return React.createElement("span", { className: classes, style: { backgroundColor: this.props.hexColor }, "data-test-id": this.props['data-test-id'] }, this.props.text);
         }
     };
     return Badge;

package/react/components/Button.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;
 };
@@ -48,12 +50,12 @@ var Button = /** @class */ (function (_super) {
     Button.prototype.render = function () {
         var _a;
         var _this = this;
-        var classes = classnames_1.default('btn', (_a = {
+        var classes = (0, classnames_1.default)('btn', (_a = {
                 'btn--expanded': this.props.expand
             },
-            _a["btn--" + this.props.size] = this.props.size !== 'normal' && this.props.size !== undefined,
-            _a["btn--" + this.props.type] = this.props.type !== 'default' && this.props.type !== undefined,
-            _a["btn--" + this.props.style] = this.props.style !== 'filled' && this.props.style !== undefined,
+            _a["btn--".concat(this.props.size)] = this.props.size !== 'normal' && this.props.size !== undefined,
+            _a["btn--".concat(this.props.type)] = this.props.type !== 'default' && this.props.type !== undefined,
+            _a["btn--".concat(this.props.style)] = this.props.style !== 'filled' && this.props.style !== undefined,
             _a['btn--disabled'] = this.props.disabled,
             _a['btn--icon-only'] = this.props.iconOnly,
             _a['btn--ui-dark'] = this.props.theme === 'dark',

package/react/components/ButtonGroup.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 ButtonGroup = /** @class */ (function (_super) {
     }
     ButtonGroup.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('button-group', (_a = {},
+        var classes = (0, classnames_1.default)('button-group', (_a = {},
             _a["button-group--start"] = this.props.align === undefined && !this.props.orientation && !this.props.subgroup,
-            _a["button-group--" + this.props.align] = this.props.align && !this.props.orientation,
+            _a["button-group--".concat(this.props.align)] = this.props.align && !this.props.orientation,
             _a["button-group--vertical"] = this.props.orientation === 'vertical',
             _a["button-group--comfort"] = this.props.spaces === undefined,
-            _a["button-group--" + this.props.spaces] = this.props.spaces,
+            _a["button-group--".concat(this.props.spaces)] = this.props.spaces,
             _a["button-group--padded"] = this.props.padded === true,
             _a["button-group--sub-group"] = this.props.subgroup === true,
             _a), this.props.className);

package/react/components/Carousel.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;
 };

package/react/components/CheckButtonGroup.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;
 };
@@ -46,8 +48,8 @@ var CheckButtonGroup = /** @class */ (function (_super) {
     }
     CheckButtonGroup.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('sd-check-button__group', (_a = {},
-            _a["sd-check-button__group--" + this.props.align] = this.props.align,
+        var classes = (0, classnames_1.default)('sd-check-button__group', (_a = {},
+            _a["sd-check-button__group--".concat(this.props.align)] = this.props.align,
             _a["sd-check-button__group--start"] = !this.props.grid && this.props.align === undefined,
             _a["button-group--vertical"] = this.props.orientation === 'vertical',
             _a["sd-check-button__group--grid"] = this.props.grid,

package/react/components/CheckGroup.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,7 +47,7 @@ var CheckGroup = /** @class */ (function (_super) {
     }
     CheckGroup.prototype.render = function () {
         var _a;
-        var classes = classnames_1.default('sd-check__group-new', (_a = {},
+        var classes = (0, classnames_1.default)('sd-check__group-new', (_a = {},
             _a["sd-check__group-new--vertical"] = this.props.orientation === 'vertical',
             _a));
         return (React.createElement("div", { className: classes, "aria-labelledby": this.props.groupLabelledBy }, this.props.children));

package/react/components/Checkbox.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 Checkbox = /** @class */ (function (_super) {
     __extends(Checkbox, _super);
     function Checkbox(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;
     }

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.d.ts

@@ -4,6 +4,7 @@ interface IProps {
     orientation?: 'horizontal' | 'vertical';
     align?: 'center' | 'left' | 'right';
     border?: boolean;
+    margin?: 'x-small' | 'small' | 'medium' | 'large' | 'none';
     children?: React.ReactNode;
 }
 export declare class ContentDivider extends React.PureComponent<IProps> {

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,15 @@ 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['sd-content-divider--margin-medium'] = this.props.margin === undefined,
+            _a["sd-content-divider--margin-".concat(this.props.margin)] = this.props.margin || this.props.margin !== 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,10 +26,12 @@ interface IDatePicker extends IDatePickerBase {
 interface IState {
     value: CalendarProps['value'];
     valid: boolean;
+    invalid: boolean;
 }
 export declare class DatePicker extends React.PureComponent<IDatePicker, IState> {
     private instance;
     hidePopupOnScroll: () => void;
+    private htmlId;
     constructor(props: IDatePicker);
     componentDidMount(): void;
     componentWillUnmount(): void;

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,9 @@ 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");
+// import classNames from 'classnames';
+var react_id_generator_1 = __importDefault(require("react-id-generator"));
+var Form_1 = require("./Form");
 var internalPrimereactClassnames = {
     overlayVisible: 'p-input-overlay-visible',
 };
@@ -77,12 +82,15 @@ function parseToPrimeReactCalendarFormat(value) {
 var DatePicker = /** @class */ (function (_super) {
     __extends(DatePicker, _super);
     function DatePicker(props) {
+        var _a;
         var _this = _super.call(this, props) || this;
+        _this.htmlId = (0, react_id_generator_1.default)();
         _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 +126,38 @@ 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)) {
+        return (React.createElement(Form_1.InputWrapper, { label: this.props.label, error: this.props.error, required: this.props.required, disabled: this.props.disabled, invalid: this.state.invalid, info: this.props.info, inlineLabel: this.props.inlineLabel, labelHidden: this.props.labelHidden, fullWidth: this.props.fullWidth, htmlId: this.htmlId, tabindex: this.props.tabindex },
+            React.createElement(calendar_1.Calendar, { inputId: this.htmlId, ariaLabelledBy: this.htmlId + 'label', 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) });
+                    }
+                } })));
     };
     return DatePicker;
 }(React.PureComponent));
@@ -165,9 +174,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;