@dxc-technology/halstack-react 0.0.0-c6243ef → 0.0.0-c709eea

package/{dist/date → date}/Date.js

@@ -2,7 +2,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -41,17 +41,11 @@ var _variables = require("../common/variables.js");
 
 var _useTheme = _interopRequireDefault(require("../useTheme.js"));
 
-var _DxcDate$propTypes;
+var _templateObject, _DxcDate$propTypes;
 
-function _templateObject() {
-  var data = (0, _taggedTemplateLiteral2["default"])([""]);
+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); }
 
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+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; }
 
 var DxcDate = function DxcDate(_ref) {
   var value = _ref.value,
@@ -142,16 +136,16 @@ var DxcDate = function DxcDate(_ref) {
   };
 
   var calendarSVG = function calendarSVG() {
-    return _react["default"].createElement("svg", {
+    return /*#__PURE__*/_react["default"].createElement("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       height: "24",
       viewBox: "0 0 24 24",
       width: "24",
       fill: "currentColor"
-    }, _react["default"].createElement("path", {
+    }, /*#__PURE__*/_react["default"].createElement("path", {
       "data-testid": "calendarIcon",
       d: "M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
-    }), _react["default"].createElement("path", {
+    }), /*#__PURE__*/_react["default"].createElement("path", {
       d: "M0 0h24v24H0z",
       fill: "none"
     }));
@@ -295,15 +289,15 @@ var DxcDate = function DxcDate(_ref) {
       }
     }
   });
-  return _react["default"].createElement(_styledComponents.ThemeProvider, {
+  return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
     theme: colorsTheme
-  }, _react["default"].createElement(_core.MuiThemeProvider, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.MuiThemeProvider, {
     theme: dateTheme
-  }, _react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
+  }, /*#__PURE__*/_react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
     utils: _dateFns["default"]
-  }, _react["default"].createElement(StyledDPicker, {
+  }, /*#__PURE__*/_react["default"].createElement(StyledDPicker, {
     margin: margin
-  }, _react["default"].createElement(_InputText["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_InputText["default"], {
     label: label,
     name: name,
     suffixIcon: calendarSVG,
@@ -319,7 +313,7 @@ var DxcDate = function DxcDate(_ref) {
     onChange: onChangeInput,
     onBlur: onBlur && handlerInputBlur || null,
     tabIndex: tabIndex
-  }), _react["default"].createElement(_Popover["default"], {
+  }), /*#__PURE__*/_react["default"].createElement(_Popover["default"], {
     open: isOpen,
     anchorEl: anchorEl,
     anchorOrigin: {
@@ -335,9 +329,9 @@ var DxcDate = function DxcDate(_ref) {
         marginTop: "10px"
       }
     }
-  }, _react["default"].createElement(_ClickAwayListener["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_ClickAwayListener["default"], {
     onClickAway: handlerPickerClose
-  }, _react["default"].createElement(_core.Paper, null, _react["default"].createElement(_pickers.DatePicker, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.Paper, null, /*#__PURE__*/_react["default"].createElement(_pickers.DatePicker, {
     variant: "static",
     value: getValueForPicker(),
     onChange: function onChange(date) {
@@ -354,7 +348,7 @@ var sizes = {
   fillParent: "100%"
 };
 
-var StyledDPicker = _styledComponents["default"].div(_templateObject());
+var StyledDPicker = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])([""])));
 
 DxcDate.propTypes = (_DxcDate$propTypes = {
   value: _propTypes["default"].string,

package/date/index.d.ts

@@ -0,0 +1,27 @@
+type Size = "small" | "medium" | "large" | "fillParent";
+type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
+type Margin = {
+  top?: Space;
+  bottom?: Space;
+  left?: Space;
+  right?: Space;
+};
+
+type Props = {
+  value?: string;
+  format?: string;
+  label?: string;
+  name?: string,
+  disabled?: boolean;
+  required?: boolean;
+  assistiveText?: string;
+  invalid?: boolean;
+  onChange?: void;
+  placeholder?: string;
+  onBlur?: void;
+  margin?: Space | Margin;
+  size?: Size;
+  tabIndex?: number;
+};
+
+export default function DxcDate(props: Props): JSX.Element;

package/date-input/DateInput.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import DateInputPropsType from "./types";
+declare const DxcDateInput: React.ForwardRefExoticComponent<DateInputPropsType & React.RefAttributes<HTMLDivElement>>;
+export default DxcDateInput;

package/{dist/new-date/NewDate.js → date-input/DateInput.js}

@@ -1,16 +1,14 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -31,25 +29,17 @@ var _dateFns = _interopRequireDefault(require("@date-io/date-fns"));
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _variables = require("../common/variables.js");
-
 var _useTheme = _interopRequireDefault(require("../useTheme.js"));
 
 var _TextInput = _interopRequireDefault(require("../text-input/TextInput"));
 
-function _templateObject() {
-  var data = (0, _taggedTemplateLiteral2["default"])([""]);
+var _templateObject;
 
-  _templateObject = function _templateObject() {
-    return data;
-  };
+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); }
 
-  return data;
-}
+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; }
 
-var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
+var DxcDateInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
   var _ref$label = _ref.label,
       label = _ref$label === void 0 ? "" : _ref$label,
       _ref$name = _ref.name,
@@ -112,7 +102,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
     onChange === null || onChange === void 0 ? void 0 : onChange({
       value: newValue,
       error: null,
-      date: newDate && newDate.toJSON() ? newDate : null
+      date: newDate !== null && newDate !== void 0 && newDate.toJSON() ? newDate : null
     });
   };
 
@@ -125,7 +115,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
     onChange === null || onChange === void 0 ? void 0 : onChange({
       value: newValue,
       error: inputError || invalidDateMessage,
-      date: momentDate.isValid() ? momentDate._d : null
+      date: momentDate.isValid() ? momentDate.toDate() : null
     });
   };
 
@@ -137,7 +127,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
     onBlur === null || onBlur === void 0 ? void 0 : onBlur({
       value: value,
       error: inputError || invalidDateMessage,
-      date: momentDate.isValid() ? momentDate._d : null
+      date: momentDate.isValid() ? momentDate.toDate() : null
     });
   };
 
@@ -158,16 +148,16 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
 
   var calendarAction = {
     onClick: openCalendar,
-    icon: _react["default"].createElement("svg", {
+    icon: /*#__PURE__*/_react["default"].createElement("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       height: "24",
       viewBox: "0 0 24 24",
       width: "24",
       fill: "currentColor"
-    }, _react["default"].createElement("path", {
+    }, /*#__PURE__*/_react["default"].createElement("path", {
       d: "M0 0h24v24H0z",
       fill: "none"
-    }), _react["default"].createElement("path", {
+    }), /*#__PURE__*/_react["default"].createElement("path", {
       d: "M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"
     }))
   };
@@ -175,12 +165,12 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
     overrides: {
       MuiTypography: {
         root: {
-          fontFamily: "".concat(colorsTheme.newDate.pickerFontFamily, " !important")
+          fontFamily: "".concat(colorsTheme.dateInput.pickerFontFamily, " !important")
         }
       },
       MuiPickersYearSelection: {
         container: {
-          color: colorsTheme.newDate.pickerYearFontColor,
+          color: colorsTheme.dateInput.pickerYearFontColor,
           "&::-webkit-scrollbar": {
             width: "3px"
           },
@@ -196,8 +186,8 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
       },
       MuiPickersToolbar: {
         toolbar: {
-          backgroundColor: colorsTheme.newDate.pickerBackgroundColor,
-          color: colorsTheme.newDate.pickerDayFontColor
+          backgroundColor: colorsTheme.dateInput.pickerBackgroundColor,
+          color: colorsTheme.dateInput.pickerDayFontColor
         }
       },
       MuiIconButton: {
@@ -215,7 +205,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
       MuiButtonBase: {
         root: {
           "&:focus": {
-            outline: colorsTheme.newDate.pickerFocusColor + " solid 2px"
+            outline: colorsTheme.dateInput.pickerFocusColor + " solid 2px"
           }
         }
       },
@@ -225,38 +215,38 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
           maxWidth: "unset",
           minHeight: "unset",
           padding: "0px 10px",
-          height: colorsTheme.newDate.pickerHeight,
-          width: colorsTheme.newDate.pickerWidth,
-          backgroundColor: colorsTheme.newDate.pickerBackgroundColor,
-          fontFamily: colorsTheme.newDate.pickerFontFamily
+          height: colorsTheme.dateInput.pickerHeight,
+          width: colorsTheme.dateInput.pickerWidth,
+          backgroundColor: colorsTheme.dateInput.pickerBackgroundColor,
+          fontFamily: colorsTheme.dateInput.pickerFontFamily
         }
       },
       MuiPickersToolbarText: {
         toolbarTxt: {
-          color: colorsTheme.newDate.pickerActualDateFontColor,
-          fontFamily: colorsTheme.newDate.pickerFontFamily,
+          color: colorsTheme.dateInput.pickerActualDateFontColor,
+          fontFamily: colorsTheme.dateInput.pickerFontFamily,
           fontSize: "2rem"
         },
         toolbarBtnSelected: {
-          color: colorsTheme.newDate.pickerActualDateFontColor
+          color: colorsTheme.dateInput.pickerActualDateFontColor
         }
       },
       MuiPickersCalendarHeader: {
         transitionContainer: {
-          color: colorsTheme.newDate.pickerMonthFontColor
+          color: colorsTheme.dateInput.pickerMonthFontColor
         },
         dayLabel: {
-          color: colorsTheme.newDate.pickerWeekFontColor,
-          fontFamily: colorsTheme.newDate.pickerFontFamily
+          color: colorsTheme.dateInput.pickerWeekFontColor,
+          fontFamily: colorsTheme.dateInput.pickerFontFamily
         },
         switchHeader: {
           backgroundColor: "#ffffff",
-          color: colorsTheme.newDate.pickerDayFontColor
+          color: colorsTheme.dateInput.pickerDayFontColor
         },
         iconButton: {
-          backgroundColor: colorsTheme.newDate.pickerMonthArrowsBackgroundColor,
+          backgroundColor: colorsTheme.dateInput.pickerMonthArrowsBackgroundColor,
           "&:hover": {
-            backgroundColor: colorsTheme.newDate.pickerMonthArrowsBackgroundColor
+            backgroundColor: colorsTheme.dateInput.pickerMonthArrowsBackgroundColor
           }
         }
       },
@@ -267,37 +257,37 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
       },
       MuiPickersDay: {
         current: {
-          color: colorsTheme.newDate.pickerDayFontColor
+          color: colorsTheme.dateInput.pickerDayFontColor
         },
         day: {
-          fontFamily: colorsTheme.newDate.pickerFontFamily,
-          color: colorsTheme.newDate.pickerDayFontColor,
+          fontFamily: colorsTheme.dateInput.pickerFontFamily,
+          color: colorsTheme.dateInput.pickerDayFontColor,
           "&:hover": {
-            backgroundColor: colorsTheme.newDate.pickerHoverDateBackgroundColor,
-            color: colorsTheme.newDate.pickerHoverDateFontColor
+            backgroundColor: colorsTheme.dateInput.pickerHoverDateBackgroundColor,
+            color: colorsTheme.dateInput.pickerHoverDateFontColor
           }
         },
         daySelected: {
-          backgroundColor: colorsTheme.newDate.pickerSelectedDateBackgroundColor,
-          color: colorsTheme.newDate.pickerSelectedDateColor,
+          backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
+          color: colorsTheme.dateInput.pickerSelectedDateColor,
           "&:hover": {
-            backgroundColor: colorsTheme.newDate.pickerSelectedDateBackgroundColor,
-            color: colorsTheme.newDate.pickerSelectedDateColor,
+            backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
+            color: colorsTheme.dateInput.pickerSelectedDateColor,
             opacity: "1"
           }
         }
       },
       MuiPickersYear: {
         yearSelected: {
-          color: colorsTheme.newDate.pickerSelectedDateColor,
-          backgroundColor: colorsTheme.newDate.pickerSelectedDateBackgroundColor,
+          color: colorsTheme.dateInput.pickerSelectedDateColor,
+          backgroundColor: colorsTheme.dateInput.pickerSelectedDateBackgroundColor,
           margin: "0px 100px",
           borderRadius: "20px"
         },
         root: {
           "&:focus": {
-            color: colorsTheme.newDate.pickerHoverDateFontColor,
-            backgroundColor: colorsTheme.newDate.pickerHoverDateBackgroundColor
+            color: colorsTheme.dateInput.pickerHoverDateFontColor,
+            backgroundColor: colorsTheme.dateInput.pickerHoverDateBackgroundColor
           }
         }
       },
@@ -308,13 +298,13 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
       }
     }
   });
-  return _react["default"].createElement(_styledComponents.ThemeProvider, {
+  return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
     theme: colorsTheme
-  }, _react["default"].createElement(_core.MuiThemeProvider, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.MuiThemeProvider, {
     theme: dateTheme
-  }, _react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
+  }, /*#__PURE__*/_react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
     utils: _dateFns["default"]
-  }, _react["default"].createElement(StyledDPicker, null, _react["default"].createElement(_TextInput["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(StyledDPicker, null, /*#__PURE__*/_react["default"].createElement(_TextInput["default"], {
     label: label,
     name: name,
     value: value !== null && value !== void 0 ? value : innerValue,
@@ -332,7 +322,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
     size: size,
     tabIndex: tabIndex,
     ref: ref
-  }), _react["default"].createElement(_Popover["default"], {
+  }), /*#__PURE__*/_react["default"].createElement(_Popover["default"], {
     onKeyDown: handleCalendarOnKeyDown,
     open: isOpen,
     anchorEl: anchorEl,
@@ -349,12 +339,12 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
         marginTop: "10px"
       }
     }
-  }, _react["default"].createElement(_ClickAwayListener["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_ClickAwayListener["default"], {
     onClickAway: closeCalendar
-  }, _react["default"].createElement(_core.Paper, {
+  }, /*#__PURE__*/_react["default"].createElement(_core.Paper, {
     role: "dialog",
     "aria-modal": "true"
-  }, _react["default"].createElement(_pickers.DatePicker, {
+  }, /*#__PURE__*/_react["default"].createElement(_pickers.DatePicker, {
     variant: "static",
     value: getValueForPicker(),
     onChange: function onChange(date) {
@@ -365,36 +355,7 @@ var DxcNewDate = _react["default"].forwardRef(function (_ref, ref) {
   }))))))));
 });
 
-var sizes = {
-  medium: "360px",
-  large: "480px",
-  fillParent: "100%"
-};
-
-var StyledDPicker = _styledComponents["default"].div(_templateObject());
-
-DxcNewDate.propTypes = {
-  label: _propTypes["default"].string,
-  name: _propTypes["default"].string,
-  value: _propTypes["default"].string,
-  format: _propTypes["default"].string,
-  helperText: _propTypes["default"].string,
-  placeholder: _propTypes["default"].bool,
-  clearable: _propTypes["default"].bool,
-  disabled: _propTypes["default"].bool,
-  optional: _propTypes["default"].bool,
-  onChange: _propTypes["default"].func,
-  onBlur: _propTypes["default"].func,
-  error: _propTypes["default"].string,
-  autocomplete: _propTypes["default"].string,
-  size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
-  margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
-    top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
-    bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
-    left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
-    right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
-  }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
-  tabIndex: _propTypes["default"].number
-};
-var _default = DxcNewDate;
+var StyledDPicker = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])([""])));
+
+var _default = DxcDateInput;
 exports["default"] = _default;

package/date-input/types.d.ts

@@ -0,0 +1,100 @@
+declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
+declare type Margin = {
+    top?: Space;
+    bottom?: Space;
+    left?: Space;
+    right?: Space;
+};
+declare type Props = {
+    /**
+     * Text to be placed above the date.
+     */
+    label?: string;
+    /**
+     * Name attribute of the input element.
+     */
+    name?: string;
+    /**
+     * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
+     */
+    value?: string;
+    /**
+     * The format in which the date value will be displayed. User must use this format when editing the value or it will be considered as an invalid date.
+     */
+    format?: string;
+    /**
+     * Helper text to be placed above the date.
+     */
+    helperText?: string;
+    /**
+     * If true, the date format will appear as placeholder in the field.
+     */
+    placeholder?: boolean;
+    /**
+     * If true, the date input will have an action to clear the entered value.
+     */
+    clearable?: boolean;
+    /**
+     * If true, the component will be disabled.
+     */
+    disabled?: boolean;
+    /**
+     * If true, the date will be optional, showing '(Optional)'
+     * next to the label. Otherwise, the field will be considered required and an error will be
+     * passed as a parameter to the OnBlur and onChange functions when it has
+     * not been filled.
+     */
+    optional?: boolean;
+    /**
+     * This function will be called when the user types within the input
+     * element of the component. An object including the string value, the
+     * error and the date value will be passed to this function.
+     * If the string value is a valid date, error will
+     * be null. Also, if the string value is not a valid date, date will be null.
+     */
+    onChange?: (val: {
+        value: string;
+        error: string | null;
+        date: Date | null;
+    }) => void;
+    /**
+     * This function will be called when the input element loses the focus.
+     * An object including the string value, the error and the date value
+     * will be passed to this function. If the string value is a valid date, error will
+     * be null. Also, if the string value is not a valid date, date will be null.
+     */
+    onBlur?: (val: {
+        value: string;
+        error: string | null;
+        date: Date | null;
+    }) => void;
+    /**
+     * If it is defined, the component will change its appearance, showing
+     * the error below the date input component. If it is not defined, the error
+     * messages will be managed internally, but never displayed on its own.
+     */
+    error?: string;
+    /**
+     * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the input value.
+     * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
+     */
+    autocomplete?: string;
+    /**
+     * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
+     * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+     */
+    margin?: Space | Margin;
+    /**
+     * Size of the component.
+     */
+    size?: "medium" | "large" | "fillParent";
+    /**
+     * Value of the tabindex attribute.
+     */
+    tabIndex?: number;
+};
+/**
+ * Reference to the component.
+ */
+export declare type RefType = HTMLDivElement;
+export default Props;

package/date-input/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});