dibk-design 0.4.52 → 1.0.0

package/dist/components/Button.js

@@ -94,10 +94,10 @@ var Button = /*#__PURE__*/function (_React$Component) {
       return (_this$props$href = this.props.href) !== null && _this$props$href !== void 0 && _this$props$href.length ? /*#__PURE__*/_react.default.createElement("a", _extends({}, buttonProps, {
         className: className,
         style: themeStyle
-      }), this.props.content) : /*#__PURE__*/_react.default.createElement("button", _extends({}, buttonProps, {
+      }), this.props.content || this.props.children) : /*#__PURE__*/_react.default.createElement("button", _extends({}, buttonProps, {
         className: className,
         style: themeStyle
-      }), this.props.content);
+      }), this.props.content || this.props.children);
     }
   }]);
 
@@ -117,7 +117,6 @@ Button.propTypes = {
   href: _propTypes.default.string
 };
 Button.defaultProps = {
-  content: 'button',
   color: 'default',
   size: 'regular',
   disabled: false,

package/dist/components/Button.md

@@ -6,6 +6,7 @@ Regular buttons example:
 <Button content="Click me" color="default" disabled />
 <Button content="Click me" color="primary" disabled />
 <Button content="Link button" color="primary" href="#" />
+<Button color="default"><span>Button with <b>HTML</b> content</span></Button>
 ```
 
 Rounded buttons example:
@@ -15,6 +16,7 @@ Rounded buttons example:
 <Button rounded content="Click me" color="primary" />
 <Button rounded content="Click me" color="default" disabled />
 <Button rounded content="Click me" color="primary" disabled />
+<Button rounded color="default"><span>Button with <b>HTML</b> content</span></Button>
 ```
 
 Regular buttons with arrow example:

package/dist/components/ContentBox.module.scss

@@ -96,7 +96,7 @@
 
     :local(.title) {
         &:local(.regular) {
-            font-family: "Open Sans";
+            font-family: $default-font;
             font-weight: bold;
             font-size: 21px;
             font-style: normal;
@@ -105,7 +105,7 @@
             border-bottom: 1px solid #e5e3e1;
         }
         &:local(.large) {
-            font-family: "Open Sans";
+            font-family: $default-font;
             font-weight: normal;
             font-size: 24px;
             margin: 0;

package/dist/components/DragAndDropFileInput.module.scss

@@ -5,7 +5,7 @@
     cursor: pointer;
     font-size: 18px;
     margin: 0 0 4px;
-    font-family: "Open Sans", arial, sans-serif;
+    font-family: $default-font;
     line-height: 1.3;
     font-weight: bold;
     font-style: normal;

package/dist/components/ErrorBox.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _theme = require("../functions/theme");
+
+var _ErrorBoxModule = _interopRequireDefault(require("./ErrorBox.module.scss"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Dependencies
+// Functions
+// Stylesheets
+var ErrorBox = function ErrorBox(_ref) {
+  var theme = _ref.theme,
+      children = _ref.children;
+
+  var getThemeErrorBoxStyle = function getThemeErrorBoxStyle() {
+    return {
+      borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, 'warning')
+    };
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _ErrorBoxModule.default.errorBox,
+    style: getThemeErrorBoxStyle()
+  }, children);
+};
+
+ErrorBox.propTypes = {
+  theme: _propTypes.default.object
+};
+ErrorBox.defaultProps = {
+  children: ''
+};
+var _default = ErrorBox;
+exports.default = _default;

package/dist/components/ErrorBox.md

@@ -0,0 +1,27 @@
+Error box example:
+
+```js
+<ErrorBox>
+<h3>Du kan ikke signere erklæringen før alle opplysningene er fylt ut:</h3>
+<ul>
+    <li>Du må krysse av for at foretaket erklærer ansvar i henhold til plan- og bygningsloven.</li>
+    <li>Du må fylle ut mobil- eller telefonnummeret til kontaktpersonen.</li>
+</ul>
+</ErrorBox>
+```
+
+
+Themed error box example:
+
+```js
+import customTheme from 'data/customTheme';
+<React.Fragment>
+    <ErrorBox theme={customTheme}>
+    <h3>Du kan ikke signere erklæringen før alle opplysningene er fylt ut:</h3>
+    <ul>
+        <li>Du må krysse av for at foretaket erklærer ansvar i henhold til plan- og bygningsloven.</li>
+        <li>Du må fylle ut mobil- eller telefonnummeret til kontaktpersonen.</li>
+    </ul>
+</ErrorBox>
+</React.Fragment>
+```

package/dist/components/ErrorBox.module.scss

@@ -0,0 +1,25 @@
+@import "../style/global.scss";
+
+:local(.errorBox) {
+    @include box-shadow(0 2px 3px rgb(0 0 0 / 18%));
+    border-left: 12px solid $color-error;
+    background: white;
+    padding: 30px 33px 46px 21px;
+    font-family: $default-font;
+    margin: 0;
+    h1,
+    h2,
+    h3,
+    h4 {
+        font-size: 20px;
+        font-weight: 500;
+        line-height: 1.3;
+        margin: 0;
+        @media only screen and (min-width: $screen-sm) {
+            font-size: 24px;
+        }
+    }
+    ul {
+        padding-left: 20px;
+    }
+}

package/dist/components/ErrorMessage.module.scss

@@ -7,7 +7,7 @@
     font-weight: 400;
     line-height: 1.2;
     margin: 4px 0;
-    font-family: "Open Sans", sans-serif;
+    font-family: $default-font;
     font-style: italic;
     overflow-wrap: break-word;
     @media only screen and (min-width: $screen-sm) {

package/dist/components/Header.module.scss

@@ -41,7 +41,7 @@
 			}
 		}
 		&:local(.size-3) {
-			font-family: "Open Sans", arial, sans-serif;
+			font-family: $default-font;
 			font-size: 19px;
 			font-style: normal;
 			font-weight: bold;
@@ -51,7 +51,7 @@
 			}
 		}
 		&:local(.size-4) {
-			font-family: "Open Sans", arial, sans-serif;
+			font-family: $default-font;
 			font-size: 17px;
 			font-style: italic;
 			font-weight: normal;

package/dist/components/InputField.js

@@ -11,12 +11,6 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _reactDatepicker = _interopRequireWildcard(require("react-datepicker"));
-
-var _dateFns = require("date-fns");
-
-var _nb = _interopRequireDefault(require("date-fns/locale/nb"));
-
 var _Button = _interopRequireDefault(require("./Button"));
 
 var _Label = _interopRequireDefault(require("./Label"));
@@ -27,22 +21,14 @@ var _theme = require("../functions/theme");
 
 var _generators = require("../functions/generators");
 
-require("react-datepicker/dist/react-datepicker.css");
-
 var _InputFieldModule = _interopRequireDefault(require("./InputField.module.scss"));
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -63,7 +49,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-(0, _reactDatepicker.registerLocale)('nb', _nb.default);
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var InputField = /*#__PURE__*/function (_React$Component) {
   _inherits(InputField, _React$Component);
@@ -71,30 +57,43 @@ var InputField = /*#__PURE__*/function (_React$Component) {
   var _super = _createSuper(InputField);
 
   function InputField() {
+    var _this;
+
     _classCallCheck(this, InputField);
 
-    return _super.apply(this, arguments);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+
+    _defineProperty(_assertThisInitialized(_this), "formatDate", function (inputDate) {
+      if (!inputDate) {
+        return null;
+      }
+
+      var date = new Date(inputDate);
+      var year = date.getFullYear();
+      var month = date.getMonth() + 1 < 10 ? "0".concat(date.getMonth() + 1) : date.getMonth() + 1;
+      var day = date.getDate() < 10 ? "0".concat(date.getDate()) : date.getDate();
+      return "".concat(day, ".").concat(month, ".").concat(year);
+    });
+
+    return _this;
   }
 
   _createClass(InputField, [{
     key: "getThemeErrorInputStyle",
     value: function getThemeErrorInputStyle(theme) {
       return {
-        boxShadow: "0 0 3px ".concat((0, _theme.getThemePaletteBackgroundColor)(theme, 'warning')),
-        borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, 'warning')
+        boxShadow: "0 0 3px ".concat((0, _theme.getThemePaletteBackgroundColor)(theme, "warning")),
+        borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, "warning")
       };
     }
-  }, {
-    key: "convertDateToString",
-    value: function convertDateToString(date) {
-      return date ? (0, _dateFns.format)(new Date(date), this.props.dateFormat, {
-        locale: _nb.default
-      }) : '';
-    }
   }, {
     key: "renderValueAsText",
     value: function renderValueAsText(value, defaultContent) {
-      return this.props.type === 'date' ? value ? this.convertDateToString(value) : defaultContent : value ? value : defaultContent;
+      return this.props.type === "date" ? value ? this.formatDate(value) : defaultContent : value ? value : defaultContent;
     }
   }, {
     key: "getInputElementProps",
@@ -108,39 +107,11 @@ var InputField = /*#__PURE__*/function (_React$Component) {
         type: this.props.type,
         id: this.props.id,
         key: defaultKey || "".concat(this.props.id, "-").concat((0, _generators.generateRandomString)(6)),
+        min: this.props.min || null,
+        max: this.props.max || null,
         onChange: this.props.onChange,
         onBlur: this.props.onBlur
-      }, _defineProperty(_ref, defaultValue ? 'defaultValue' : 'value', defaultValue || this.props.value), _defineProperty(_ref, "placeholder", this.props.placeholder), _defineProperty(_ref, "className", this.props.hasErrors ? _InputFieldModule.default.hasErrors : ''), _defineProperty(_ref, 'aria-required', this.props.mandatory), _defineProperty(_ref, "style", styleRules), _ref;
-    }
-  }, {
-    key: "getDatePickerElementProps",
-    value: function getDatePickerElementProps(defaultValue, defaultKey) {
-      var _this = this;
-
-      return {
-        name: this.props.name,
-        readOnly: this.props.readOnly,
-        disabled: this.props.disabled,
-        id: this.props.id,
-        key: defaultKey || "".concat(this.props.id, "-").concat((0, _generators.generateRandomString)(6)),
-        dateFormat: this.props.dateFormat,
-        locale: 'nb',
-        selectsStart: this.props.selectsStart,
-        selectsEnd: this.props.selectsEnd,
-        startDate: this.props.startDate ? new Date(this.props.startDate) : null,
-        endDate: this.props.endDate ? new Date(this.props.endDate) : null,
-        minDate: this.props.minDate || null,
-        maxDate: this.props.maxDate || null,
-        onChange: this.props.onChange ? function (date) {
-          return _this.props.onChange(date);
-        } : console.log("Missing onChange handler for date picker with id: ".concat(this.props.id)),
-        onBlur: this.props.onBlur ? function (date) {
-          return _this.props.onBlur(date);
-        } : null,
-        selected: defaultValue ? new Date(defaultValue) : null,
-        placeholderText: this.props.placeholder,
-        className: this.props.hasErrors ? _InputFieldModule.default.hasErrors : ''
-      };
+      }, _defineProperty(_ref, defaultValue ? "defaultValue" : "value", defaultValue || this.props.value), _defineProperty(_ref, "placeholder", this.props.placeholder || null), _defineProperty(_ref, "className", this.props.hasErrors ? _InputFieldModule.default.hasErrors : ""), _defineProperty(_ref, "aria-required", this.props.mandatory), _defineProperty(_ref, "style", styleRules), _ref;
     }
   }, {
     key: "render",
@@ -159,7 +130,7 @@ var InputField = /*#__PURE__*/function (_React$Component) {
         className: "".concat(_InputFieldModule.default.inputField, " ").concat(_InputFieldModule.default[this.props.type])
       }, /*#__PURE__*/_react.default.createElement(_Label.default, {
         htmlFor: this.props.id
-      }, this.props.label, this.props.type === 'file' ? /*#__PURE__*/_react.default.createElement("div", {
+      }, this.props.label, this.props.type === "file" ? /*#__PURE__*/_react.default.createElement("div", {
         className: _InputFieldModule.default.fileInputContainer
       }, /*#__PURE__*/_react.default.createElement("span", {
         className: _InputFieldModule.default.input
@@ -170,9 +141,7 @@ var InputField = /*#__PURE__*/function (_React$Component) {
         },
         content: this.props.buttonContent,
         theme: this.props.theme
-      }) : '') : ''), !this.props.contentOnly ? this.props.type === 'date' ? /*#__PURE__*/_react.default.createElement("div", {
-        style: styleRules
-      }, /*#__PURE__*/_react.default.createElement(_reactDatepicker.default, this.getDatePickerElementProps(defaultValue, defaultKey))) : /*#__PURE__*/_react.default.createElement("input", this.getInputElementProps(defaultValue, defaultKey, styleRules)) : /*#__PURE__*/_react.default.createElement("span", null, this.renderValueAsText(this.props.value || this.props.defaultValue, this.props.defaultContent)), /*#__PURE__*/_react.default.createElement(_ErrorMessage.default, {
+      }) : null) : null), !this.props.contentOnly ? /*#__PURE__*/_react.default.createElement("input", this.getInputElementProps(defaultValue, defaultKey, styleRules)) : /*#__PURE__*/_react.default.createElement("span", null, this.renderValueAsText(this.props.value || this.props.defaultValue, this.props.defaultContent)), /*#__PURE__*/_react.default.createElement(_ErrorMessage.default, {
         content: this.props.errorMessage,
         theme: this.props.theme
       }));
@@ -198,7 +167,6 @@ InputField.propTypes = {
   buttonColor: _propTypes.default.string,
   buttonContent: _propTypes.default.string,
   selectedFileName: _propTypes.default.string,
-  dateFormat: _propTypes.default.string,
   placeholder: _propTypes.default.string,
   defaultContent: _propTypes.default.string,
   hasErrors: _propTypes.default.bool,
@@ -207,16 +175,16 @@ InputField.propTypes = {
   theme: _propTypes.default.object
 };
 InputField.defaultProps = {
-  name: '',
-  type: 'text',
-  label: '',
+  name: "",
+  type: "text",
+  label: "",
   contentOnly: false,
-  buttonColor: 'default',
-  dateFormat: 'd. MMMM, yyyy',
-  placeholder: '',
-  defaultContent: '',
+  buttonColor: "default",
+  dateFormat: "d. MMMM, yyyy",
+  placeholder: "",
+  defaultContent: "",
   hasErrors: false,
-  errorMessage: '',
+  errorMessage: "",
   mandatory: false,
   onChange: function onChange() {
     return false;

package/dist/components/InputField.md

@@ -15,13 +15,12 @@ Input field example:
 <InputField id="textInput10" onChange={() => {console.log('onChange')}} label="InputField without value, contentOnly set to true and defaultContent" contentOnly={true} defaultContent="Please insert a value" />
 <InputField id="fileInput1" onChange={()=>{console.log('onchange')}} type="file" label="InputField with label, value and type set to file" />
 <InputField id="fileInput1" onChange={()=>{console.log('onchange')}} type="file" label="InputField with label, value, fileName, buttonContent and type set to file" selectedFileName="file.txt" buttonContent="Legg til fil" />
-<InputField id="dateInput1" onChange={(date) => console.log("date", date)} type="date" label="Datepicker without value" value="" />
-<InputField id="dateInput2" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value" value="2020-05-10T13:12:04" />
-<InputField id="dateInput3" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value, errors and error message" value="2020-05-10T13:12:04" hasErrors={true} errorMessage="Wrong date value" />
-<InputField id="dateInput4" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value and contentOnly set to true" value="2020-05-10T13:12:04" contentOnly={true} />
-<InputField id="dateInput5" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value for start date" value="2020-05-10T13:12:04" selectsStart startDate="2020-05-10T13:12:04" endDate="2020-05-19T13:12:04" />
-<InputField id="dateInput6" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value for end date" value="2020-05-19T13:12:04" selectsEnd startDate="2020-05-10T13:12:04" endDate="2020-05-19T13:12:04" />
-<InputField id="dateInput7" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with defaultContent and contentOnly set to true" contentOnly={true} defaultContent="Please insert a value" />
+<InputField id="dateInput1" onChange={(date) => console.log("date", date)} type="date" label="Date input without value" value="" />
+<InputField id="dateInput2" onChange={(date) => console.log("date", date)} type="date" label="Date input with value" value="2020-05-10" />
+<InputField id="dateInput3" onChange={(date) => console.log("date", date)} type="date" label="Date input with value, errors and error message" value="2020-05-10" hasErrors={true} errorMessage="Wrong date value" />
+<InputField id="dateInput4" onChange={(date) => console.log("date", date)} type="date" label="Date input with value and contentOnly set to true" value="2020-05-10" contentOnly={true} />
+<InputField id="dateInput5" onChange={(date) => console.log("date", date)} type="date" label="Date input with min and max date" value="2020-05-10" selectsStart min="2020-05-04" max="2020-05-19" />
+<InputField id="dateInput6" onChange={(date) => console.log("date", date)} type="date" label="Date input with defaultContent and contentOnly set to true" contentOnly={true} defaultContent="Please insert a value" />
 <InputField id="textInput9" value="InputField with value and custom width" width="400px" />
 <InputField id="textInput10" value="InputField with a not auto generated key" elementKey="inputKeyHere" />
 ```
@@ -34,7 +33,7 @@ import customTheme from 'data/customTheme';
     <InputField id="themedTextInput4" onChange={()=>{console.log('onchange')}} value="InputField with link in label" label={['InputField with ', <a key="labelLink" href="#">link</a>, ' in label']} theme={customTheme} />
     <InputField id="themedTextInput5" onChange={()=>{console.log('onchange')}} value="InputField with label, value, errors and error message" label="InputField with label, value, errors and error message" hasErrors={true} errorMessage="Wrong value" theme={customTheme} />
     <InputField id="themedFileInput1" onChange={()=>{console.log('onchange')}} type="file" label="InputField with label, value, fileName, buttonContent and type set to file" selectedFileName="file.txt" buttonContent="Legg til fil" theme={customTheme} />
-    <InputField id="themedDateInput3" onChange={(date) => console.log("date", date)} type="date" label="Datepicker with value, errors and error message" value="2020-05-10T13:12:04" hasErrors={true} errorMessage="Wrong date value" theme={customTheme} />
+    <InputField id="themedDateInput3" onChange={(date) => console.log("date", date)} type="date" label="Date input with value, errors and error message" value="2020-05-10" hasErrors={true} errorMessage="Wrong date value" theme={customTheme} />
     <InputField id="themedDateInput4" value="InputField with value, error and custom width" width="420px" hasErrors={true} theme={customTheme} errorMessage="Wrong value" />
 
 </React.Fragment>

package/dist/components/Label.module.scss

@@ -1,3 +1,5 @@
+@import "../style/global.scss";
+
 :local(.label) {
     color: #000;
     display: block;
@@ -5,7 +7,7 @@
     font-weight: bold;
     line-height: 1.2;
     margin-bottom: 2px;
-    font-family: "Open Sans", sans-serif;
+    font-family: $default-font;
     overflow-wrap: break-word;
     &:local(.inline) {
         display: inline-block;

package/dist/components/NavigationBar.module.scss

@@ -107,7 +107,7 @@
 					color: #fff;
 					text-transform: uppercase;
 					text-decoration: none;
-					font-family: "Open Sans";
+					font-family: $default-font;
 					padding: 10px 0;
 					display: block;
 					border-bottom: 1px solid $color-primary;
@@ -123,7 +123,7 @@
 							color: #fff;
 							text-transform: none;
 							text-decoration: none;
-							font-family: "Open Sans";
+							font-family: $default-font;
 							padding: 10px 0;
 							margin-left: 20px;
 							display: block;

package/dist/index.js

@@ -57,6 +57,12 @@ Object.defineProperty(exports, "DragAndDropFileInput", {
     return _DragAndDropFileInput.default;
   }
 });
+Object.defineProperty(exports, "ErrorBox", {
+  enumerable: true,
+  get: function get() {
+    return _ErrorBox.default;
+  }
+});
 Object.defineProperty(exports, "ErrorMessage", {
   enumerable: true,
   get: function get() {
@@ -184,6 +190,8 @@ var _Dialog = _interopRequireDefault(require("./components/Dialog"));
 
 var _DragAndDropFileInput = _interopRequireDefault(require("./components/DragAndDropFileInput"));
 
+var _ErrorBox = _interopRequireDefault(require("./components/ErrorBox"));
+
 var _ErrorMessage = _interopRequireDefault(require("./components/ErrorMessage"));
 
 var _Footer = _interopRequireDefault(require("./components/Footer"));

package/dist/style/abstracts/variables/_typography.scss

@@ -1,2 +1,2 @@
-$default-font: "Open Sans";
+$default-font: "Open Sans", arial, sans-serif;
 $heading-font: "Altis"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dibk-design",
-  "version": "0.4.52",
+  "version": "1.0.0",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -11,7 +11,6 @@
   "dependencies": {
     "prop-types": "^15.6.2",
     "react": "^17.0.1",
-    "react-datepicker": "^4.1.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^6.2.2",
     "react-scripts": "^4.0.0"