@hipay/hipay-material-ui 2.3.0-rcstyleguide-beta3 → 2.3.0-rcstyleguide-beta5

package/old_components/HiDatePicker/Overlays/TimePickerOverlay.js

@@ -0,0 +1,217 @@
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.styles = void 0;
+
+var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
+
+var _objectSpread2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectSpread2"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+
+var _Calendar = _interopRequireDefault(require("mdi-material-ui/Calendar"));
+
+var _CustomOverlayLayout = _interopRequireDefault(require("./CustomOverlayLayout"));
+
+var _ListPicker = _interopRequireDefault(require("../ListPicker"));
+
+var _styles = require("@material-ui/core/styles");
+
+var styles = function styles(theme) {
+  return {
+    paper: {
+      position: 'absolute',
+      width: '100%',
+      zIndex: 10
+    },
+    overlay: (0, _objectSpread2.default)({
+      padding: 0,
+      height: 325,
+      textAlign: 'center'
+    }, theme.typography.body2, {
+      fontWeight: theme.typography.fontWeightRegular
+    }),
+    header: (0, _objectSpread2.default)({
+      display: 'block',
+      height: 40,
+      textAlign: 'center',
+      padding: '10px 0'
+    }, theme.typography.body1, {
+      color: theme.palette.neutral.main,
+      borderBottom: '1px solid',
+      borderBottomColor: theme.palette.divider
+    }),
+    titles: {
+      width: 224,
+      margin: 'auto'
+    },
+    timeTitle: {
+      display: 'inline-block',
+      width: '50%'
+    },
+    body: {
+      height: 245,
+      width: 224,
+      margin: 'auto'
+    },
+    columnWrapper: {
+      height: '100%',
+      width: '100%'
+    },
+    column: {
+      display: 'inline-block',
+      height: '100%',
+      width: '50%'
+    },
+    listItem: {
+      height: 40,
+      textAlign: 'center'
+    },
+    itemRoot: {
+      '&:hover': {
+        backgroundColor: theme.palette.hover
+      }
+    },
+    itemSelected: {
+      fontWeight: theme.typography.fontWeightMedium,
+      backgroundColor: theme.palette.selected
+    },
+    itemCentered: {
+      margin: 'auto'
+    },
+    footer: {
+      height: 40,
+      padding: '10px 0',
+      borderTop: '1px solid',
+      borderTopColor: theme.palette.divider
+    },
+    clockIconButton: {
+      position: 'absolute',
+      left: 0,
+      bottom: 0,
+      height: 32,
+      width: 32,
+      margin: '4px 24px'
+    },
+    calendarButton: {
+      fontWeight: theme.typography.fontWeightMedium
+    }
+  };
+};
+
+exports.styles = styles;
+
+var _ref = _react.default.createElement(_Calendar.default, null);
+
+var TimePickerOverlay =
+/*#__PURE__*/
+function (_React$Component) {
+  (0, _inherits2.default)(TimePickerOverlay, _React$Component);
+
+  function TimePickerOverlay(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, TimePickerOverlay);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(TimePickerOverlay).call(this, props));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "hours", Array.from(Array(24).keys()));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "minutes", Array.from(Array(60).keys()));
+    _this.handleHourClick = _this.handleHourClick.bind((0, _assertThisInitialized2.default)(_this));
+    _this.handleMinuteClick = _this.handleMinuteClick.bind((0, _assertThisInitialized2.default)(_this));
+    return _this;
+  }
+
+  (0, _createClass2.default)(TimePickerOverlay, [{
+    key: "handleHourClick",
+    value: function handleHourClick(hour) {
+      if (this.props.onChange) {
+        var date = this.props.value ? new Date(this.props.value) : new Date();
+        date.setHours(hour);
+        this.props.onChange(date, 'hour');
+      }
+    }
+  }, {
+    key: "handleMinuteClick",
+    value: function handleMinuteClick(minute) {
+      if (this.props.onChange) {
+        var date = this.props.value ? new Date(this.props.value) : new Date();
+        date.setMinutes(minute);
+        this.props.onChange(date, 'minute');
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          onCalendarClick = _this$props.onCalendarClick,
+          translations = _this$props.translations,
+          value = _this$props.value,
+          props = (0, _objectWithoutProperties2.default)(_this$props, ["classes", "onCalendarClick", "translations", "value"]);
+      var hour = value ? value.getHours() : 0;
+      var minute = value ? value.getMinutes() : 0;
+      return _react.default.createElement(_CustomOverlayLayout.default, (0, _extends2.default)({
+        headerElement: _react.default.createElement("div", {
+          className: classes.titles
+        }, _react.default.createElement("div", {
+          className: classes.timeTitle
+        }, translations.hour), _react.default.createElement("div", {
+          className: classes.timeTitle
+        }, translations.minute)),
+        absoluteElement: _react.default.createElement(_IconButton.default, {
+          className: classes.clockIconButton,
+          onClick: function onClick() {
+            return onCalendarClick();
+          }
+        }, _ref)
+      }, props), _react.default.createElement("div", {
+        className: classes.column
+      }, _react.default.createElement(_ListPicker.default, {
+        itemList: this.hours,
+        onItemClick: this.handleHourClick,
+        selectedItem: hour
+      })), _react.default.createElement("div", {
+        className: classes.column
+      }, _react.default.createElement(_ListPicker.default, {
+        itemList: this.minutes,
+        onItemClick: this.handleMinuteClick,
+        selectedItem: minute
+      })));
+    }
+  }]);
+  return TimePickerOverlay;
+}(_react.default.Component);
+
+(0, _defineProperty2.default)(TimePickerOverlay, "defaultProps", {
+  translations: {
+    hour: 'Hour',
+    minute: 'Minute'
+  }
+});
+
+var _default = (0, _styles.withStyles)(styles, {
+  name: 'HmuiTimePickerOverlay'
+})(TimePickerOverlay);
+
+exports.default = _default;

package/old_components/HiDatePicker/Overlays/YearPickerOverlay.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _CustomOverlayLayoutWithoutFooter = _interopRequireDefault(require("./CustomOverlayLayoutWithoutFooter"));
+
+var _ListPicker = _interopRequireDefault(require("../ListPicker"));
+
+var YearPickerOverlay =
+/*#__PURE__*/
+function (_React$Component) {
+  (0, _inherits2.default)(YearPickerOverlay, _React$Component);
+
+  function YearPickerOverlay(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, YearPickerOverlay);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(YearPickerOverlay).call(this, props));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "years", []);
+    _this.handleYearClick = _this.handleYearClick.bind((0, _assertThisInitialized2.default)(_this));
+    var minDate = props.minimumDate;
+
+    if (!minDate) {
+      var today = new Date();
+      minDate = new Date(today.getFullYear() - 5, today.getMonth(), today.getDate()); // by default 5 years from now
+    }
+
+    var currentYear = new Date().getFullYear();
+    var minimumYear = minDate.getFullYear();
+    _this.years = [currentYear]; // get years from minimum date to now
+
+    if (!props.disablePastDays && currentYear > minimumYear) {
+      _this.years = _this.years.concat(Array.from(Array(currentYear - minimumYear).keys(), function (key) {
+        return key + minimumYear;
+      }));
+    } // get years from now to at least 10 years forward or as much as past years
+
+
+    if (!props.disableFutureDays) {
+      _this.years = _this.years.concat(Array.from(Array(Math.max(currentYear - minimumYear, 10)).keys(), function (key) {
+        return key + currentYear + 1;
+      }));
+    }
+
+    _this.years.sort();
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(YearPickerOverlay, [{
+    key: "handleYearClick",
+    value: function handleYearClick(year) {
+      if (this.props.onChange) {
+        var date = this.props.value ? new Date(this.props.value) : new Date();
+        date.setFullYear(year);
+        this.props.onChange(date);
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          value = _this$props.value,
+          translations = _this$props.translations,
+          props = (0, _objectWithoutProperties2.default)(_this$props, ["value", "translations"]);
+      return _react.default.createElement(_CustomOverlayLayoutWithoutFooter.default, (0, _extends2.default)({
+        headerElement: translations.year
+      }, props), _react.default.createElement(_ListPicker.default, {
+        itemList: this.years,
+        onItemClick: this.handleYearClick,
+        selectedItem: value ? value.getFullYear() : null,
+        type: "year"
+      }));
+    }
+  }]);
+  return YearPickerOverlay;
+}(_react.default.Component);
+
+(0, _defineProperty2.default)(YearPickerOverlay, "defaultProps", {
+  translations: {
+    year: 'Year'
+  }
+});
+var _default = YearPickerOverlay;
+exports.default = _default;

package/old_components/HiDatePicker/Overlays/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Overlay", {
+  enumerable: true,
+  get: function get() {
+    return _Overlay.default;
+  }
+});
+Object.defineProperty(exports, "CustomOverlayLayout", {
+  enumerable: true,
+  get: function get() {
+    return _CustomOverlayLayout.default;
+  }
+});
+Object.defineProperty(exports, "MonthPickerOverlay", {
+  enumerable: true,
+  get: function get() {
+    return _MonthPickerOverlay.default;
+  }
+});
+Object.defineProperty(exports, "TimePickerOverlay", {
+  enumerable: true,
+  get: function get() {
+    return _TimePickerOverlay.default;
+  }
+});
+Object.defineProperty(exports, "YearPickerOverlay", {
+  enumerable: true,
+  get: function get() {
+    return _YearPickerOverlay.default;
+  }
+});
+
+var _Overlay = _interopRequireDefault(require("./Overlay"));
+
+var _CustomOverlayLayout = _interopRequireDefault(require("./CustomOverlayLayout"));
+
+var _MonthPickerOverlay = _interopRequireDefault(require("./MonthPickerOverlay"));
+
+var _TimePickerOverlay = _interopRequireDefault(require("./TimePickerOverlay"));
+
+var _YearPickerOverlay = _interopRequireDefault(require("./YearPickerOverlay"));

package/old_components/HiDatePicker/Weekday.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var Weekday = function Weekday(_ref) {
+  var weekday = _ref.weekday,
+      className = _ref.className,
+      localeUtils = _ref.localeUtils,
+      locale = _ref.locale;
+  var weekdayName = localeUtils.formatWeekdayLong(weekday, locale);
+  return _react.default.createElement("div", {
+    className: className,
+    title: weekdayName
+  }, weekdayName.slice(0, 1));
+};
+
+var _default = Weekday;
+exports.default = _default;

package/old_components/HiDatePicker/hiLocaleUtils.js

@@ -0,0 +1,144 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var WEEKDAYS_LONG = {
+  en_US: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
+  fr_FR: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi']
+};
+var WEEKDAYS_SHORT = {
+  en_US: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+  fr_FR: ['Di', 'Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa']
+};
+var MONTHS = {
+  en_US: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+  fr_FR: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre']
+};
+var FIRST_DAY = {
+  en_US: 0,
+  fr_FR: 1 // Use Monday as first day of the week
+
+};
+/**
+ * Format Date as day
+ *
+ * @param Date d
+ * @param string locale
+ *
+ * @returns string
+ */
+
+function formatDay(d) {
+  var locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return "".concat(WEEKDAYS_LONG[loc][d.getDay()], ", ").concat(d.getDate(), " ").concat(MONTHS[loc][d.getMonth()], " ").concat(d.getFullYear());
+}
+/**
+ * Format Date as month title
+ *
+ * @param Date d
+ * @param string locale
+ *
+ * @returns string
+ */
+
+
+function formatMonthTitle(d) {
+  var locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return "".concat(MONTHS[loc][d.getMonth()], " ").concat(d.getFullYear());
+}
+/**
+ * Get the short version of a week day
+ *
+ * @param int i
+ * @param string locale
+ *
+ * @returns string
+ */
+
+
+function formatWeekdayShort(i) {
+  var locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return WEEKDAYS_SHORT[loc][i];
+}
+/**
+ * Get the long version of a week day
+ *
+ * @param int i
+ * @param string locale
+ *
+ * @returns string
+ */
+
+
+function formatWeekdayLong(i) {
+  var locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return WEEKDAYS_LONG[loc][i];
+}
+/**
+ * Get first day of the week
+ * @param string locale
+ *
+ * @returns integer
+ */
+
+
+function getFirstDayOfWeek() {
+  var locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return FIRST_DAY[loc];
+}
+/**
+ * Get List of Months
+ *
+ * @param string locale
+ *
+ * @returns array
+ */
+
+
+function getMonths() {
+  var locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'en_US';
+  var loc = this.formatLocale(locale);
+  return MONTHS[loc];
+}
+/**
+ * Format locale
+ *
+ * @param string locale
+ *
+ * @return string
+ */
+
+
+function formatLocale(locale) {
+  var loc = locale.split('-');
+
+  if (loc.length !== 2) {
+    loc = locale.split('_');
+
+    if (loc.length !== 2) {
+      return false;
+    }
+  }
+
+  loc[1] = loc[1].toUpperCase();
+  return loc.join('_');
+}
+
+var HiLocaleUtils = {
+  formatDay: formatDay,
+  formatMonthTitle: formatMonthTitle,
+  formatWeekdayShort: formatWeekdayShort,
+  formatWeekdayLong: formatWeekdayLong,
+  getFirstDayOfWeek: getFirstDayOfWeek,
+  getMonths: getMonths,
+  formatLocale: formatLocale
+};
+var _default = HiLocaleUtils;
+exports.default = _default;

package/old_components/HiDatePicker/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _HiDatePicker.default;
+  }
+});
+
+var _HiDatePicker = _interopRequireDefault(require("./HiDatePicker"));