dibk-design 0.4.53 → 1.0.1

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/CheckBoxIcon.js

@@ -71,13 +71,10 @@ var CheckBoxIcon = /*#__PURE__*/function (_React$Component) {
         });
       }
 
-      var ariaExpandedIndex = "aria-expanded";
-
-      var props = _defineProperty({
+      var props = {
         className: "".concat(_CheckBoxIconModule.default.checkBoxIcon, " ").concat(this.props.checked ? _CheckBoxIconModule.default.checked : '', " ").concat(this.props.disabled ? _CheckBoxIconModule.default.disabled : '', " ").concat(this.props.showBox ? _CheckBoxIconModule.default.showBox : '', " ").concat(this.props.hasErrors ? _CheckBoxIconModule.default.hasErrors : ''),
         style: inlineStyle
-      }, ariaExpandedIndex, this.props.expandable ? this.props.checked.toString() : null);
-
+      };
       return /*#__PURE__*/_react.default.createElement("span", props, /*#__PURE__*/_react.default.createElement("span", {
         className: _CheckBoxIconModule.default.checkmark
       }, this.props.checked ? this.props.checkmarkCharacter : ''));
@@ -94,8 +91,7 @@ CheckBoxIcon.propTypes = {
   showBox: _propTypes.default.bool,
   theme: _propTypes.default.object,
   hasErrors: _propTypes.default.bool,
-  checkmarkCharacter: _propTypes.default.string,
-  expandable: _propTypes.default.bool
+  checkmarkCharacter: _propTypes.default.string
 };
 CheckBoxIcon.defaultProps = {
   size: '20px',
@@ -103,8 +99,7 @@ CheckBoxIcon.defaultProps = {
   disabled: false,
   showBox: true,
   hasErrors: false,
-  checkmarkCharacter: '✔',
-  expandable: false
+  checkmarkCharacter: '✔'
 };
 var _default = CheckBoxIcon;
 exports.default = _default;

package/dist/components/CheckBoxInput.js

@@ -51,29 +51,29 @@ var CheckBoxInput = /*#__PURE__*/function (_React$Component) {
   _createClass(CheckBoxInput, [{
     key: "render",
     value: function render() {
-      return /*#__PURE__*/_react.default.createElement("label", {
-        className: "".concat(_CheckBoxInputModule.default.checkBoxInput, " ").concat(this.props.contentOnly ? _CheckBoxInputModule.default.contentOnly : '', " ").concat(this.props.disabled ? _CheckBoxInputModule.default.disabled : '', " ").concat(this.props.hasErrors ? _CheckBoxInputModule.default.hasErrors : ''),
+      var labelProps = {
+        className: "".concat(_CheckBoxInputModule.default.checkBoxInput, " ").concat(this.props.contentOnly ? _CheckBoxInputModule.default.contentOnly : "", " ").concat(this.props.disabled ? _CheckBoxInputModule.default.disabled : "", " ").concat(this.props.hasErrors ? _CheckBoxInputModule.default.hasErrors : ""),
         htmlFor: this.props.id
-      }, !this.props.contentOnly ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_CheckBoxIcon.default, {
+      };
+      var iconProps = {
         checked: this.props.checked,
         disabled: this.props.disabled,
         theme: this.props.theme,
-        hasErrors: this.props.hasErrors,
-        checkmarkCharacter: this.props.checkmarkCharacter,
-        expandable: this.props.expandable
-      }), /*#__PURE__*/_react.default.createElement("input", {
-        onChange: this.props.onChange,
-        type: "checkbox",
-        name: this.props.name,
+        showBox: !this.props.contentOnly,
+        hasErrors: this.props.contentOnly && this.props.hasErrors,
+        checkmarkCharacter: this.props.checkmarkCharacter
+      };
+      var inputProps = {
         id: this.props.id,
-        checked: this.props.checked,
-        disabled: this.props.disabled
-      })) : /*#__PURE__*/_react.default.createElement(_CheckBoxIcon.default, {
+        name: this.props.name || null,
+        type: "checkbox",
         checked: this.props.checked,
         disabled: this.props.disabled,
-        showBox: false,
-        theme: this.props.theme
-      }), /*#__PURE__*/_react.default.createElement("span", null, this.props.children));
+        onChange: this.props.onChange,
+        "aria-expanded": this.props["aria-expanded"],
+        "aria-controls": this.props["aria-controls"]
+      };
+      return /*#__PURE__*/_react.default.createElement("label", labelProps, !this.props.contentOnly ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_CheckBoxIcon.default, iconProps), /*#__PURE__*/_react.default.createElement("input", inputProps)) : /*#__PURE__*/_react.default.createElement(_CheckBoxIcon.default, iconProps), /*#__PURE__*/_react.default.createElement("span", null, this.props.children));
     }
   }]);
 
@@ -90,15 +90,16 @@ CheckBoxInput.propTypes = {
   hasErrors: _propTypes.default.bool,
   theme: _propTypes.default.object,
   checkmarkCharacter: _propTypes.default.string,
-  expandable: _propTypes.default.bool
+  "aria-expanded": _propTypes.default.string,
+  "aria-controls": _propTypes.default.string
 };
 CheckBoxInput.defaultProps = {
   checked: false,
   disabled: false,
-  name: '',
+  name: "",
   contentOnly: false,
   hasErrors: false,
-  checkmarkCharacter: '✔',
+  checkmarkCharacter: "✔",
   expandable: false
 };
 var _default = CheckBoxInput;

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/RadioButtonIcon.js

@@ -69,13 +69,10 @@ var RadioButtonIcon = /*#__PURE__*/function (_React$Component) {
         });
       }
 
-      var ariaExpandedIndex = "aria-expanded";
-
-      var props = _defineProperty({
+      var props = {
         className: "".concat(_RadioButtonIconModule.default.radioButtonIcon, " ").concat(this.props.checked ? _RadioButtonIconModule.default.checked : '', " ").concat(this.props.disabled ? _RadioButtonIconModule.default.disabled : '', " ").concat(this.props.hasErrors ? _RadioButtonIconModule.default.hasErrors : ''),
         style: inlineStyle
-      }, ariaExpandedIndex, this.props.expandable ? this.props.checked.toString() : null);
-
+      };
       return /*#__PURE__*/_react.default.createElement("span", props);
     }
   }]);
@@ -88,15 +85,13 @@ RadioButtonIcon.propTypes = {
   checked: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
   theme: _propTypes.default.object,
-  hasErrors: _propTypes.default.bool,
-  expandable: _propTypes.default.bool
+  hasErrors: _propTypes.default.bool
 };
 RadioButtonIcon.defaultProps = {
   size: '10px',
   checked: false,
   disabled: false,
-  hasErrors: false,
-  expandable: false
+  hasErrors: false
 };
 var _default = RadioButtonIcon;
 exports.default = _default;

package/dist/components/RadioButtonInput.js

@@ -51,23 +51,28 @@ var RadioButtonInput = /*#__PURE__*/function (_React$Component) {
   _createClass(RadioButtonInput, [{
     key: "render",
     value: function render() {
-      return /*#__PURE__*/_react.default.createElement("label", {
-        htmlFor: this.props.id,
-        className: "".concat(_RadioButtonInputModule.default.radioButtonInput, " ").concat(this.props.checked ? _RadioButtonInputModule.default.checked : '', " ").concat(this.props.disabled ? _RadioButtonInputModule.default.disabled : '', " ").concat(this.props.hasErrors ? _RadioButtonInputModule.default.hasErrors : '')
-      }, !this.props.contentOnly ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_RadioButtonIcon.default, {
+      var labelProps = {
+        className: "".concat(_RadioButtonInputModule.default.radioButtonInput, " ").concat(this.props.checked ? _RadioButtonInputModule.default.checked : "", " ").concat(this.props.disabled ? _RadioButtonInputModule.default.disabled : "", " ").concat(this.props.hasErrors ? _RadioButtonInputModule.default.hasErrors : ""),
+        htmlFor: this.props.id
+      };
+      var iconProps = {
         checked: this.props.checked,
         disabled: this.props.disabled,
         theme: this.props.theme,
-        hasErrors: this.props.hasErrors,
-        expandable: this.props.expandable
-      }), /*#__PURE__*/_react.default.createElement("input", {
-        type: "radio",
-        onChange: this.props.onChange,
+        hasErrors: this.props.contentOnly && this.props.hasErrors
+      };
+      var inputProps = {
         id: this.props.id,
-        name: this.props.name,
+        name: this.props.name || null,
+        type: "radio",
         value: this.props.inputValue,
-        checked: this.props.checked
-      })) : '', /*#__PURE__*/_react.default.createElement("span", null, this.props.children));
+        checked: this.props.checked,
+        disabled: this.props.disabled,
+        onChange: this.props.onChange,
+        "aria-expanded": this.props["aria-expanded"],
+        "aria-controls": this.props["aria-controls"]
+      };
+      return /*#__PURE__*/_react.default.createElement("label", labelProps, !this.props.contentOnly ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_RadioButtonIcon.default, iconProps), /*#__PURE__*/_react.default.createElement("input", inputProps)) : null, /*#__PURE__*/_react.default.createElement("span", null, this.props.children));
     }
   }]);
 
@@ -77,22 +82,22 @@ var RadioButtonInput = /*#__PURE__*/function (_React$Component) {
 RadioButtonInput.propTypes = {
   checked: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
-  inputValue: _propTypes.default.string.isRequired,
-  name: _propTypes.default.string,
   id: _propTypes.default.string.isRequired,
+  name: _propTypes.default.string,
   onChange: _propTypes.default.func,
   contentOnly: _propTypes.default.bool,
-  theme: _propTypes.default.object,
   hasErrors: _propTypes.default.bool,
-  expandable: _propTypes.default.bool
+  theme: _propTypes.default.object,
+  inputValue: _propTypes.default.string.isRequired,
+  "aria-expanded": _propTypes.default.string,
+  "aria-controls": _propTypes.default.string
 };
 RadioButtonInput.defaultProps = {
-  name: '',
+  name: "",
   checked: false,
   disabled: false,
   contentOnly: false,
-  hasErrors: false,
-  expandable: false
+  hasErrors: false
 };
 var _default = RadioButtonInput;
 exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dibk-design",
-  "version": "0.4.53",
+  "version": "1.0.1",
   "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"