@alixpartners/ui-components 1.20.63 → 1.20.66

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+## 1.20.66 (March 24, 2022)
+
+- Update `ApDatePicker` year selection
+
+## 1.20.65 (March 24, 2022)
+
+- Export `ApDatePicker` component
+
+## 1.20.64 (March 23, 2022)
+
+- Added `ApDatePicker` component
+
 ## 1.20.63 (February 7, 2022)
 
 - Updated `ApIcon` component, added `backup_restore` icon

package/dist/esm/components/ApDatePicker/ApDatePicker.js

@@ -0,0 +1,94 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ApDatePicker = void 0;
+var React = require("react");
+var DayPicker = require("react-day-picker/DayPicker");
+var ApDatePicker_styles_1 = require("./ApDatePicker.styles");
+var NavBar_1 = require("./NavBar");
+var utils_1 = require("./utils");
+var YearMonthForm_1 = require("./YearMonthForm");
+var ApDatePicker = /** @class */ (function (_super) {
+    __extends(ApDatePicker, _super);
+    function ApDatePicker(props) {
+        var _this = _super.call(this, props) || this;
+        _this.handleDayChange = function (date) {
+            _this.props.onChange([date]);
+        };
+        _this.handleDayEnter = function (date) {
+            var range = _this.props.range;
+            _this.setState({
+                hoverRange: range ? utils_1.getWeekRange(date, range) : {
+                    from: date,
+                    to: date,
+                },
+            });
+        };
+        _this.handleDayLeave = function () {
+            _this.setState({
+                hoverRange: undefined,
+            });
+        };
+        _this.handleYearMonthChange = function (month) {
+            _this.setState({ month: month });
+        };
+        var isSelectedDays = Boolean(props.selectedDays.length);
+        _this.state = {
+            hoverRange: {
+                from: new Date(),
+                to: new Date(),
+            },
+            month: isSelectedDays ? props.selectedDays[0] : new Date(),
+        };
+        return _this;
+    }
+    ApDatePicker.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, selectedDays = _a.selectedDays, srcRange = _a.srcRange;
+        var _b = this.state, hoverRange = _b.hoverRange, month = _b.month;
+        var daysRangeSelected = selectedDays.length > 1;
+        var modifiers = {
+            hoverRange: hoverRange,
+            hoverRangeStart: hoverRange && hoverRange.from,
+            hoverRangeEnd: hoverRange && hoverRange.to,
+        };
+        if (daysRangeSelected) {
+            modifiers = __assign(__assign({}, modifiers), { selectedRange: {
+                    from: selectedDays[0],
+                    to: selectedDays[selectedDays.length - 1],
+                }, selectedRangeStart: selectedDays[0], selectedRangeEnd: selectedDays[selectedDays.length - 1] });
+        }
+        return (React.createElement(ApDatePicker_styles_1.Container, null,
+            React.createElement(DayPicker.default, __assign({ month: month, firstDayOfWeek: 1, showOutsideDays: true, pagedNavigation: true, modifiers: modifiers, onDayClick: this.handleDayChange, onDayMouseEnter: this.handleDayEnter, onDayMouseLeave: this.handleDayLeave, onMonthChange: function (m) { return _this.setState({ month: m }); }, captionElement: function (_a) {
+                    var date = _a.date, localeUtils = _a.localeUtils;
+                    return (React.createElement(YearMonthForm_1.YearMonthForm, { date: date, localeUtils: localeUtils, srcRange: srcRange, onChange: _this.handleYearMonthChange }));
+                }, navbarElement: function (props) { return (React.createElement(NavBar_1.Navbar, __assign({}, props, { srcRange: srcRange, date: month }))); } }, this.props))));
+    };
+    return ApDatePicker;
+}(React.Component));
+exports.ApDatePicker = ApDatePicker;
+;
+//# sourceMappingURL=ApDatePicker.js.map

package/dist/esm/components/ApDatePicker/ApDatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApDatePicker.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/ApDatePicker.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/ApDatePicker/ApDatePicker.styles.js

@@ -0,0 +1,36 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Container = exports.PickerPeriod = exports.PickerGrid = exports.PickerContent = exports.MenuContent = exports.CaretIcon = exports.PeriodButton = exports.Wrapper = exports.PrevNavButton = exports.NextNavButton = exports.NavButton = exports.NavContainer = exports.MonthYearContainer = exports.Dropdown = void 0;
+var styled_components_1 = require("styled-components");
+var ApButtons_1 = require("../../components/ApButtons");
+var ApSimpleDropdown_1 = require("../../components/ApSimpleDropdown");
+var theme_1 = require("../../utils/theme");
+var ApIcon_1 = require("../ApIcon");
+exports.Dropdown = styled_components_1.default(ApSimpleDropdown_1.ApSimpleDropdown)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\tdisplay: flex;\n\tmax-width: 80px;\n"], ["\n\tdisplay: flex;\n\tmax-width: 80px;\n"])));
+exports.MonthYearContainer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\tposition: relative;\n\tdisplay: flex;\n\theight: 40px;\n\twidth: calc(100% - 84px);\n"], ["\n\tposition: relative;\n\tdisplay: flex;\n\theight: 40px;\n\twidth: calc(100% - 84px);\n"])));
+exports.NavContainer = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n\tposition: relative;\n\tright: 0px;\n\ttop: 18px;\n"], ["\n\tposition: relative;\n\tright: 0px;\n\ttop: 18px;\n"])));
+exports.NavButton = styled_components_1.default(ApButtons_1.ApButtonIcon)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n\tposition: absolute;\n\ttop: 0px;\n"], ["\n\tposition: absolute;\n\ttop: 0px;\n"])));
+exports.NextNavButton = styled_components_1.default(exports.NavButton)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n\tright: 16px;\n"], ["\n\tright: 16px;\n"])));
+exports.PrevNavButton = styled_components_1.default(exports.NavButton)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n\tright: 48px;\n"], ["\n\tright: 48px;\n"])));
+exports.Wrapper = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n\tmax-width: calc(100% - 40px);\n\tdisplay: flex;\n"], ["\n\tmax-width: calc(100% - 40px);\n\tdisplay: flex;\n"])));
+exports.PeriodButton = styled_components_1.default(ApButtons_1.ApButtonSecondary)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n\ttext-transform: none;\n\tposition: relative;\n\tpadding-right: 24px;\n\tsvg.ap-icon {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t}\n"], ["\n\ttext-transform: none;\n\tposition: relative;\n\tpadding-right: 24px;\n\tsvg.ap-icon {\n\t\tposition: absolute;\n\t\tright: 0;\n\t\ttop: 0;\n\t}\n"])));
+exports.CaretIcon = styled_components_1.default(ApIcon_1.ApIcon)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n\t", "\n"], ["\n\t",
+    "\n"])), function (_a) {
+    var rotate = _a.rotate;
+    return rotate && styled_components_1.css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n\t\t\ttransform: rotate(180deg);\n    "], ["\n\t\t\ttransform: rotate(180deg);\n    "])));
+});
+exports.MenuContent = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n\tposition: absolute;\n    top: 44px;\n    left: -16px;\n\tpadding: 16px 24px 8px;\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 233px;\n\twidth: calc(100% + 100px);\n\tbox-sizing: border-box;\n\tfont-size: 13px;\n\tletter-spacing: 0.3px;\n\ttext-transform: uppercase;\n\tbackground-color: ", ";\n\tz-index: 1;\n"], ["\n\tposition: absolute;\n    top: 44px;\n    left: -16px;\n\tpadding: 16px 24px 8px;\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 233px;\n\twidth: calc(100% + 100px);\n\tbox-sizing: border-box;\n\tfont-size: 13px;\n\tletter-spacing: 0.3px;\n\ttext-transform: uppercase;\n\tbackground-color: ", ";\n\tz-index: 1;\n"])), theme_1.colors.white);
+exports.PickerContent = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: ", ";\n"], ["\n\tdisplay: flex;\n\talign-items: center;\n\tcolor: ", ";\n"])), theme_1.colors.grey7);
+exports.PickerGrid = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n\tdisplay: grid;\n    grid-template-columns: repeat(auto-fill,78px);\n    grid-auto-rows: 36px;\n    row-gap: 16px;\n    width: 100%;\n"], ["\n\tdisplay: grid;\n    grid-template-columns: repeat(auto-fill,78px);\n    grid-auto-rows: 36px;\n    row-gap: 16px;\n    width: 100%;\n"])));
+exports.PickerPeriod = styled_components_1.default.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n\tcursor: pointer;\n\tfont-weight: 500;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\t", "\n\n\t&:hover {\n\t\tborder: 1px solid ", ";\n\t}\n"], ["\n\tcursor: pointer;\n\tfont-weight: 500;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\t",
+    "\n\n\t&:hover {\n\t\tborder: 1px solid ", ";\n\t}\n"])), function (_a) {
+    var active = _a.active;
+    return active && styled_components_1.css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      background-color: ", ";\n      color: ", ";\n    "], ["\n      background-color: ", ";\n      color: ", ";\n    "])), theme_1.colors.green1, theme_1.colors.white);
+}, theme_1.colors.green1);
+exports.Container = styled_components_1.default.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n\tdisplay: inline-block;\n\tbox-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.2);\n\t/* DayPicker styles */\n\n\t.DayPicker {\n\t\tdisplay: inline-block;\n\t\tfont-size: 1rem;\n\t}\n\n\t.DayPicker-wrapper {\n\t\tposition: relative;\n\n\t\tflex-direction: row;\n\t\tpadding-bottom: 1em;\n\n\t\t-webkit-user-select: none;\n\n\t\t\t-moz-user-select: none;\n\n\t\t\t\t-ms-user-select: none;\n\n\t\t\t\t\t\tuser-select: none;\n\t}\n\n\t.DayPicker-Months {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tjustify-content: center;\n\t}\n\n\t.DayPicker-Month {\n\t\tdisplay: table;\n\t\tmargin: 0 1em;\n\t\tmargin-top: 1em;\n\t\tborder-spacing: 0;\n\t\tborder-collapse: collapse;\n\n\t\t-webkit-user-select: none;\n\n\t\t\t-moz-user-select: none;\n\n\t\t\t\t-ms-user-select: none;\n\n\t\t\t\t\t\tuser-select: none;\n\t}\n\n\t.DayPicker-NavBar {\n\t}\n\n\t.DayPicker-NavButton {\n\t\tposition: absolute;\n\t\ttop: 1em;\n\t\tright: 1.5em;\n\t\tleft: auto;\n\n\t\tdisplay: inline-block;\n\t\tmargin-top: 2px;\n\t\twidth: 1.25em;\n\t\theight: 1.25em;\n\t\tbackground-position: center;\n\t\tbackground-size: 50%;\n\t\tbackground-repeat: no-repeat;\n\t\tcolor: #8B9898;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker-NavButton:hover {\n\t\topacity: 0.8;\n\t}\n\n\t.DayPicker-NavButton--prev {\n\t\tmargin-right: 1.5em;\n\t\tbackground-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAVVJREFUWAnN2G0KgjAYwPHpGfRkaZeqvgQaK+hY3SUHrk1YzNLay/OiEFp92I+/Mp2F2Mh2lLISWnflFjzH263RQjzMZ19wgs73ez0o1WmtW+dgA01VxrE3p6l2GLsnBy1VYQOtVSEH/atCCgqpQgKKqYIOiq2CBkqtggLKqQIKgqgCBjpJ2Y5CdJ+zrT9A7HHSTA1dxUdHgzCqJIEwq0SDsKsEg6iqBIEoq/wEcVRZBXFV+QJxV5mBtlDFB5VjYTaGZ2sf4R9PM7U9ZU+lLuaetPP/5Die3ToO1+u+MKtHs06qODB2zBnI/jBd4MPQm1VkY79Tb18gB+C62FdBFsZR6yeIo1YQiLJWMIiqVjQIu1YSCLNWFgijVjYIuhYYCKoWKAiiFgoopxYaKLUWOii2FgkophYp6F3r42W5A9s9OcgNvva8xQaysKXlFytoqdYmQH6tF3toSUo0INq9AAAAAElFTkSuQmCC');\n\t}\n\n\t.DayPicker-NavButton--next {\n\t\tbackground-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAXRJREFUWAnN119ugjAcwPHWzJ1gnmxzB/BBE0n24m4xfNkTaOL7wOtsl3AXMMb+Vjaa1BG00N8fSEibPpAP3xAKKs2yjzTPH9RAjhEo9WzPr/Vm8zgE0+gXATAxxuxtqeJ9t5tIwv5AtQAApsfT6TPdbp+kUBcgVwvO51KqVhMkXKsVJFXrOkigVhCIs1Y4iKlWZxB1rX4gwlpRIIpa8SDkWmggrFq4IIRaJKCYWnSgnrXIQV1r8YD+1Vrn+bReagysIFfLABRt31v8oBu1xEBttfRbltmfjgEcWh9snUS2kNdBK6WN1vrOWxObWsz+fjxevsxmB1GQDfINWiev83nhaoiB/CoOU438oPrhXS0WpQ9xc1ZQWxWHqUYe0I0qrKCQKjygDlXIQV2r0IF6ViEBxVTBBSFUQQNhVYkHIVeJAtkNsbQ7c1LtzP6FsObhb2rCKv7NBIGoq4SDmKoEgTirXAcJVGkFSVVpgoSrXICGUMUH/QBZNSUy5XWUhwAAAABJRU5ErkJggg==');\n\t}\n\n\t.DayPicker-NavButton--interactionDisabled {\n\t\tdisplay: none;\n\t}\n\n\t.DayPicker-Caption {\n\t\tdisplay: table-caption;\n\t\tmargin-bottom: 0.5em;\n\t\tpadding: 0 0.5em;\n\t\ttext-align: left;\n\t}\n\n\t.DayPicker-Caption > div {\n\t\tfont-weight: 500;\n\t\tfont-size: 1.15em;\n\t}\n\n\t.DayPicker-Weekdays {\n\t\tdisplay: table-header-group;\n\t\tmargin-top: 1em;\n\t}\n\n\t.DayPicker-WeekdaysRow {\n\t\tdisplay: table-row;\n\t}\n\n\t.DayPicker-Weekday {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tcolor: #8B9898;\n\t\ttext-align: center;\n\t\tfont-size: 0.875em;\n\t}\n\n\t.DayPicker-Weekday abbr[title] {\n\t\tborder-bottom: none;\n\t\ttext-decoration: none;\n\t}\n\n\t.DayPicker-Body {\n\t\tdisplay: table-row-group;\n\t}\n\n\t.DayPicker-Week {\n\t\tdisplay: table-row;\n\t}\n\n\t.DayPicker-Day {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tborder-radius: 50%;\n\t\tvertical-align: middle;\n\t\ttext-align: center;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker-WeekNumber {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tmin-width: 1em;\n\t\tborder-right: 1px solid #EAECEC;\n\t\tcolor: #8B9898;\n\t\tvertical-align: middle;\n\t\ttext-align: right;\n\t\tfont-size: 0.75em;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker--interactionDisabled .DayPicker-Day {\n\t\tcursor: default;\n\t}\n\n\t.DayPicker-Footer {\n\t\tpadding-top: 0.5em;\n\t}\n\n\t.DayPicker-TodayButton {\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t\tbackground-image: none;\n\t\tbox-shadow: none;\n\t\tcolor: #4A90E2;\n\t\tfont-size: 0.875em;\n\t\tcursor: pointer;\n\t}\n\n\t/* Default modifiers */\n\n\t.DayPicker-Day--today {\n\t\tcolor: #D0021B;\n\t\tfont-weight: 700;\n\t}\n\n\t.DayPicker-Day--outside {\n\t\tcolor: #8B9898;\n\t\tcursor: default;\n\t}\n\n\t.DayPicker-Day--disabled {\n\t\tcolor: #DCE0E0;\n\t\tcursor: default;\n\t\t/* background-color: #eff1f1; */\n\t}\n\n\t/* Example modifiers */\n\n\t.DayPicker-Day--sunday {\n\t\tbackground-color: #F7F8F8;\n\t}\n\n\t.DayPicker-Day--sunday:not(.DayPicker-Day--today) {\n\t\tcolor: #DCE0E0;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {\n\t\tposition: relative;\n\n\t\tbackground-color: #4A90E2;\n\t\tcolor: #F0F8FF;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: #51A0FA;\n\t}\n\n\t.DayPicker:not(.DayPicker--interactionDisabled)\n\t\t.DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: #F0F8FF;\n\t}\n\n\t/* DayPickerInput */\n\n\t.DayPickerInput {\n\t\tdisplay: inline-block;\n\t}\n\n\t.DayPickerInput-OverlayWrapper {\n\t\tposition: relative;\n\t}\n\n\t.DayPickerInput-Overlay {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tz-index: 1;\n\n\t\tbackground: white;\n\t\tbox-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);\n\t}\n\n\t.DayPicker-Month {\n\t\tborder-collapse: separate;\n\t}\n\t.DayPicker-WeekNumber {\n\t\toutline: none;\n\t}\n\t.DayPicker-Day {\n\t\toutline: none;\n\t\tborder: 1px solid ", ";\n\t\tborder-radius: 0;\n\t}\n\t.DayPicker-Day--hoverRange {\n\t\tbackground-color: ", " !important;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside),\n\t.DayPicker-Day--selectedRange {\n\t\tbackground-color: ", " !important;\n\t\tcolor: ", ";\n\t\tborder-top-color: ", ";\n\t\tborder-bottom-color: ", ";\n\t\tborder-left-color: ", ";\n\t\tborder-right-color: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRangeStart {\n\t\tbackground-color: ", " !important;\n\t\tborder-left: 1px solid ", ";\n\t\tcolors: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRangeEnd {\n\t\tbackground-color: ", " !important;\n\t\tborder-right: 1px solid ", ";\n\t\tcolors: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRange:not(.DayPicker-Day--outside).DayPicker-Day--selected,\n\t.DayPicker-Day--hoverRange:not(.DayPicker-Day--outside).DayPicker-Day--selected {\n\t\tborder-radius: 0 !important;\n\t}\n\t.DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: ", ";\n\t}\n\t.DayPicker-Day--hoverRange:hover {\n\t\tborder-radius: 0 !important;\n\t}\n\n\t.DayPicker-Day--today {\n\t\tcolor: ", ";\n\t}\n\n\t.DayPicker-Weekday {\n\t\tcolor: ", ";\n\t\tfont-size: 13px;\n\t\tfont-weight: 500;\n\t}\n\n\t.DayPicker-NavButton {\n\t\ttop: 24px;\n\t}\n"], ["\n\tdisplay: inline-block;\n\tbox-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.2);\n\t/* DayPicker styles */\n\n\t.DayPicker {\n\t\tdisplay: inline-block;\n\t\tfont-size: 1rem;\n\t}\n\n\t.DayPicker-wrapper {\n\t\tposition: relative;\n\n\t\tflex-direction: row;\n\t\tpadding-bottom: 1em;\n\n\t\t-webkit-user-select: none;\n\n\t\t\t-moz-user-select: none;\n\n\t\t\t\t-ms-user-select: none;\n\n\t\t\t\t\t\tuser-select: none;\n\t}\n\n\t.DayPicker-Months {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tjustify-content: center;\n\t}\n\n\t.DayPicker-Month {\n\t\tdisplay: table;\n\t\tmargin: 0 1em;\n\t\tmargin-top: 1em;\n\t\tborder-spacing: 0;\n\t\tborder-collapse: collapse;\n\n\t\t-webkit-user-select: none;\n\n\t\t\t-moz-user-select: none;\n\n\t\t\t\t-ms-user-select: none;\n\n\t\t\t\t\t\tuser-select: none;\n\t}\n\n\t.DayPicker-NavBar {\n\t}\n\n\t.DayPicker-NavButton {\n\t\tposition: absolute;\n\t\ttop: 1em;\n\t\tright: 1.5em;\n\t\tleft: auto;\n\n\t\tdisplay: inline-block;\n\t\tmargin-top: 2px;\n\t\twidth: 1.25em;\n\t\theight: 1.25em;\n\t\tbackground-position: center;\n\t\tbackground-size: 50%;\n\t\tbackground-repeat: no-repeat;\n\t\tcolor: #8B9898;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker-NavButton:hover {\n\t\topacity: 0.8;\n\t}\n\n\t.DayPicker-NavButton--prev {\n\t\tmargin-right: 1.5em;\n\t\tbackground-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAVVJREFUWAnN2G0KgjAYwPHpGfRkaZeqvgQaK+hY3SUHrk1YzNLay/OiEFp92I+/Mp2F2Mh2lLISWnflFjzH263RQjzMZ19wgs73ez0o1WmtW+dgA01VxrE3p6l2GLsnBy1VYQOtVSEH/atCCgqpQgKKqYIOiq2CBkqtggLKqQIKgqgCBjpJ2Y5CdJ+zrT9A7HHSTA1dxUdHgzCqJIEwq0SDsKsEg6iqBIEoq/wEcVRZBXFV+QJxV5mBtlDFB5VjYTaGZ2sf4R9PM7U9ZU+lLuaetPP/5Die3ToO1+u+MKtHs06qODB2zBnI/jBd4MPQm1VkY79Tb18gB+C62FdBFsZR6yeIo1YQiLJWMIiqVjQIu1YSCLNWFgijVjYIuhYYCKoWKAiiFgoopxYaKLUWOii2FgkophYp6F3r42W5A9s9OcgNvva8xQaysKXlFytoqdYmQH6tF3toSUo0INq9AAAAAElFTkSuQmCC');\n\t}\n\n\t.DayPicker-NavButton--next {\n\t\tbackground-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAwCAYAAAB5R9gVAAAABGdBTUEAALGPC/xhBQAAAXRJREFUWAnN119ugjAcwPHWzJ1gnmxzB/BBE0n24m4xfNkTaOL7wOtsl3AXMMb+Vjaa1BG00N8fSEibPpAP3xAKKs2yjzTPH9RAjhEo9WzPr/Vm8zgE0+gXATAxxuxtqeJ9t5tIwv5AtQAApsfT6TPdbp+kUBcgVwvO51KqVhMkXKsVJFXrOkigVhCIs1Y4iKlWZxB1rX4gwlpRIIpa8SDkWmggrFq4IIRaJKCYWnSgnrXIQV1r8YD+1Vrn+bReagysIFfLABRt31v8oBu1xEBttfRbltmfjgEcWh9snUS2kNdBK6WN1vrOWxObWsz+fjxevsxmB1GQDfINWiev83nhaoiB/CoOU438oPrhXS0WpQ9xc1ZQWxWHqUYe0I0qrKCQKjygDlXIQV2r0IF6ViEBxVTBBSFUQQNhVYkHIVeJAtkNsbQ7c1LtzP6FsObhb2rCKv7NBIGoq4SDmKoEgTirXAcJVGkFSVVpgoSrXICGUMUH/QBZNSUy5XWUhwAAAABJRU5ErkJggg==');\n\t}\n\n\t.DayPicker-NavButton--interactionDisabled {\n\t\tdisplay: none;\n\t}\n\n\t.DayPicker-Caption {\n\t\tdisplay: table-caption;\n\t\tmargin-bottom: 0.5em;\n\t\tpadding: 0 0.5em;\n\t\ttext-align: left;\n\t}\n\n\t.DayPicker-Caption > div {\n\t\tfont-weight: 500;\n\t\tfont-size: 1.15em;\n\t}\n\n\t.DayPicker-Weekdays {\n\t\tdisplay: table-header-group;\n\t\tmargin-top: 1em;\n\t}\n\n\t.DayPicker-WeekdaysRow {\n\t\tdisplay: table-row;\n\t}\n\n\t.DayPicker-Weekday {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tcolor: #8B9898;\n\t\ttext-align: center;\n\t\tfont-size: 0.875em;\n\t}\n\n\t.DayPicker-Weekday abbr[title] {\n\t\tborder-bottom: none;\n\t\ttext-decoration: none;\n\t}\n\n\t.DayPicker-Body {\n\t\tdisplay: table-row-group;\n\t}\n\n\t.DayPicker-Week {\n\t\tdisplay: table-row;\n\t}\n\n\t.DayPicker-Day {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tborder-radius: 50%;\n\t\tvertical-align: middle;\n\t\ttext-align: center;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker-WeekNumber {\n\t\tdisplay: table-cell;\n\t\tpadding: 0.5em;\n\t\tmin-width: 1em;\n\t\tborder-right: 1px solid #EAECEC;\n\t\tcolor: #8B9898;\n\t\tvertical-align: middle;\n\t\ttext-align: right;\n\t\tfont-size: 0.75em;\n\t\tcursor: pointer;\n\t}\n\n\t.DayPicker--interactionDisabled .DayPicker-Day {\n\t\tcursor: default;\n\t}\n\n\t.DayPicker-Footer {\n\t\tpadding-top: 0.5em;\n\t}\n\n\t.DayPicker-TodayButton {\n\t\tborder: none;\n\t\tbackground-color: transparent;\n\t\tbackground-image: none;\n\t\tbox-shadow: none;\n\t\tcolor: #4A90E2;\n\t\tfont-size: 0.875em;\n\t\tcursor: pointer;\n\t}\n\n\t/* Default modifiers */\n\n\t.DayPicker-Day--today {\n\t\tcolor: #D0021B;\n\t\tfont-weight: 700;\n\t}\n\n\t.DayPicker-Day--outside {\n\t\tcolor: #8B9898;\n\t\tcursor: default;\n\t}\n\n\t.DayPicker-Day--disabled {\n\t\tcolor: #DCE0E0;\n\t\tcursor: default;\n\t\t/* background-color: #eff1f1; */\n\t}\n\n\t/* Example modifiers */\n\n\t.DayPicker-Day--sunday {\n\t\tbackground-color: #F7F8F8;\n\t}\n\n\t.DayPicker-Day--sunday:not(.DayPicker-Day--today) {\n\t\tcolor: #DCE0E0;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {\n\t\tposition: relative;\n\n\t\tbackground-color: #4A90E2;\n\t\tcolor: #F0F8FF;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: #51A0FA;\n\t}\n\n\t.DayPicker:not(.DayPicker--interactionDisabled)\n\t\t.DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: #F0F8FF;\n\t}\n\n\t/* DayPickerInput */\n\n\t.DayPickerInput {\n\t\tdisplay: inline-block;\n\t}\n\n\t.DayPickerInput-OverlayWrapper {\n\t\tposition: relative;\n\t}\n\n\t.DayPickerInput-Overlay {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tz-index: 1;\n\n\t\tbackground: white;\n\t\tbox-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);\n\t}\n\n\t.DayPicker-Month {\n\t\tborder-collapse: separate;\n\t}\n\t.DayPicker-WeekNumber {\n\t\toutline: none;\n\t}\n\t.DayPicker-Day {\n\t\toutline: none;\n\t\tborder: 1px solid ", ";\n\t\tborder-radius: 0;\n\t}\n\t.DayPicker-Day--hoverRange {\n\t\tbackground-color: ", " !important;\n\t}\n\n\t.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside),\n\t.DayPicker-Day--selectedRange {\n\t\tbackground-color: ", " !important;\n\t\tcolor: ", ";\n\t\tborder-top-color: ", ";\n\t\tborder-bottom-color: ", ";\n\t\tborder-left-color: ", ";\n\t\tborder-right-color: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRangeStart {\n\t\tbackground-color: ", " !important;\n\t\tborder-left: 1px solid ", ";\n\t\tcolors: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRangeEnd {\n\t\tbackground-color: ", " !important;\n\t\tborder-right: 1px solid ", ";\n\t\tcolors: ", ";\n\t}\n\n\t.DayPicker-Day--selectedRange:not(.DayPicker-Day--outside).DayPicker-Day--selected,\n\t.DayPicker-Day--hoverRange:not(.DayPicker-Day--outside).DayPicker-Day--selected {\n\t\tborder-radius: 0 !important;\n\t}\n\t.DayPicker:not(.DayPicker--interactionDisabled) .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {\n\t\tbackground-color: ", ";\n\t}\n\t.DayPicker-Day--hoverRange:hover {\n\t\tborder-radius: 0 !important;\n\t}\n\n\t.DayPicker-Day--today {\n\t\tcolor: ", ";\n\t}\n\n\t.DayPicker-Weekday {\n\t\tcolor: ", ";\n\t\tfont-size: 13px;\n\t\tfont-weight: 500;\n\t}\n\n\t.DayPicker-NavButton {\n\t\ttop: 24px;\n\t}\n"])), theme_1.colors.white, theme_1.colors.green0, theme_1.colors.green1, theme_1.colors.white, theme_1.colors.white, theme_1.colors.white, theme_1.colors.white, theme_1.colors.white, theme_1.colors.green1, theme_1.colors.green1, theme_1.colors.white, theme_1.colors.green1, theme_1.colors.green1, theme_1.colors.white, theme_1.colors.white, theme_1.colors.red1, theme_1.colors.green1);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
+//# sourceMappingURL=ApDatePicker.styles.js.map

package/dist/esm/components/ApDatePicker/ApDatePicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApDatePicker.styles.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/ApDatePicker.styles.ts"],"names":[],"mappings":";;;;;;;AAAA,uDAAgD;AAChD,wDAA6E;AAC7E,sEAAqE;AACrE,2CAA2C;AAC3C,oCAAmC;AAEtB,QAAA,QAAQ,GAAG,2BAAM,CAAC,mCAAgB,CAAC,6GAAA,0CAG/C,KAAC;AAEW,QAAA,kBAAkB,GAAG,2BAAM,CAAC,GAAG,8JAAA,2FAK3C,KAAC;AAEW,QAAA,YAAY,GAAG,2BAAM,CAAC,GAAG,2HAAA,wDAIrC,KAAC;AAEW,QAAA,SAAS,GAAG,2BAAM,CAAC,wBAAY,CAAC,2GAAA,wCAG5C,KAAC;AAEW,QAAA,aAAa,GAAG,2BAAM,CAAC,iBAAS,CAAC,uFAAA,oBAE7C,KAAC;AAEW,QAAA,aAAa,GAAG,2BAAM,CAAC,iBAAS,CAAC,uFAAA,oBAE7C,KAAC;AAEW,QAAA,OAAO,GAAG,2BAAM,CAAC,GAAG,0HAAA,uDAGhC,KAAC;AAEW,QAAA,YAAY,GAAG,2BAAM,CAAC,6BAAiB,CAAC,0NAAA,uJASpD,KAAC;AAEW,QAAA,SAAS,GAAG,2BAAM,CAAC,eAAM,CAAC,iFAAA,MACpC;IAIE,IACJ,KALE,UAAC,EAA6B;QAA3B,MAAM,YAAA;IACV,OAAA,MAAM,IACN,uBAAG,6GAAA,0CAEA,IAAA;AAHH,CAGG,EACH;AAEW,QAAA,WAAW,GAAG,2BAAM,CAAC,GAAG,2YAAA,gTAahB,EAAY,oBAEhC,KAFoB,cAAM,CAAC,KAAK,EAE/B;AAEW,QAAA,aAAa,GAAG,2BAAM,CAAC,GAAG,mIAAA,uDAG7B,EAAY,KACrB,KADS,cAAM,CAAC,KAAK,EACpB;AAEW,QAAA,UAAU,GAAG,2BAAM,CAAC,GAAG,gNAAA,2IAMnC,KAAC;AAEW,QAAA,YAAY,GAAG,2BAAM,CAAC,GAAG,mPAAA,uHAOnC;IAKE,yCAGiB,EAAa,UAElC,KAVE,UAAC,EAA+B;QAA7B,MAAM,YAAA;IACV,OAAA,MAAM,IACN,uBAAG,gIAAA,4BACqB,EAAa,kBACxB,EAAY,SACtB,KAFqB,cAAM,CAAC,MAAM,EACxB,cAAM,CAAC,KAAK,CACtB;AAJH,CAIG,EAGiB,cAAM,CAAC,MAAM,EAEjC;AAEW,QAAA,SAAS,GAAG,2BAAM,CAAC,GAAG,68NAAA,iiLA4Ob,EAAY,uFAIZ,EAAa,wKAKb,EAAa,2BACxB,EAAY,2BACD,EAAY,8BACT,EAAY,4BACd,EAAY,6BACX,EAAY,0EAId,EAAa,2CACR,EAAa,iBAC5B,EAAY,wEAIF,EAAa,4CACP,EAAa,iBAC7B,EAAY,wZAQF,EAAY,+HAOvB,EAAW,+CAIX,EAAa,wGAQvB,KArDqB,cAAM,CAAC,KAAK,EAIZ,cAAM,CAAC,MAAM,EAKb,cAAM,CAAC,MAAM,EACxB,cAAM,CAAC,KAAK,EACD,cAAM,CAAC,KAAK,EACT,cAAM,CAAC,KAAK,EACd,cAAM,CAAC,KAAK,EACX,cAAM,CAAC,KAAK,EAId,cAAM,CAAC,MAAM,EACR,cAAM,CAAC,MAAM,EAC5B,cAAM,CAAC,KAAK,EAIF,cAAM,CAAC,MAAM,EACP,cAAM,CAAC,MAAM,EAC7B,cAAM,CAAC,KAAK,EAQF,cAAM,CAAC,KAAK,EAOvB,cAAM,CAAC,IAAI,EAIX,cAAM,CAAC,MAAM,EAQtB"}

package/dist/esm/components/ApDatePicker/NavBar.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Navbar = void 0;
+var React = require("react");
+var theme_1 = require("../../utils/theme");
+var ApDatePicker_styles_1 = require("./ApDatePicker.styles");
+exports.Navbar = function (_a) {
+    var date = _a.date, onPreviousClick = _a.onPreviousClick, onNextClick = _a.onNextClick, srcRange = _a.srcRange, className = _a.className;
+    return (React.createElement(ApDatePicker_styles_1.NavContainer, { className: className },
+        React.createElement(ApDatePicker_styles_1.PrevNavButton, { onClick: function () {
+                if (!(date.getFullYear() === srcRange.from.getFullYear()
+                    && date.getMonth() === srcRange.from.getMonth())) {
+                    onPreviousClick();
+                }
+            }, iconName: "baseline_keyboard_arrow_left", iconProps: {
+                iconColor: theme_1.colors.green1
+            } }),
+        React.createElement(ApDatePicker_styles_1.NextNavButton, { onClick: function () {
+                if (!(date.getFullYear() === srcRange.to.getFullYear()
+                    && date.getMonth() === srcRange.to.getMonth())) {
+                    onNextClick();
+                }
+            }, iconName: "baseline_keyboard_arrow_right", iconProps: {
+                iconColor: theme_1.colors.green1
+            } })));
+};
+//# sourceMappingURL=NavBar.js.map

package/dist/esm/components/ApDatePicker/NavBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBar.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/NavBar.tsx"],"names":[],"mappings":";;;AAAA,6BAA+B;AAE/B,2CAA2C;AAC3C,6DAAmF;AAUtE,QAAA,MAAM,GAAG,UAAC,EAMR;QALd,IAAI,UAAA,EACJ,eAAe,qBAAA,EACf,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,SAAS,eAAA;IACU,OAAA,CACnB,oBAAC,kCAAY,IAAC,SAAS,EAAE,SAAS;QACjC,oBAAC,mCAAa,IACb,OAAO,EAAE;gBACR,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,KAAK,QAAQ,CAAC,IAAI,CAAC,WAAW,EAAE;uBACpD,IAAI,CAAC,QAAQ,EAAE,KAAK,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,EAAE;oBACjD,eAAe,EAAE,CAAC;iBAClB;YACH,CAAC,EACD,QAAQ,EAAC,8BAA8B,EACvC,SAAS,EAAE;gBACV,SAAS,EAAE,cAAM,CAAC,MAAM;aACxB,GACA;QACF,oBAAC,mCAAa,IACb,OAAO,EAAE;gBACR,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,KAAK,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE;uBAClD,IAAI,CAAC,QAAQ,EAAE,KAAK,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE;oBAChD,WAAW,EAAE,CAAC;iBACd;YACF,CAAC,EACD,QAAQ,EAAC,+BAA+B,EACxC,SAAS,EAAE;gBACV,SAAS,EAAE,cAAM,CAAC,MAAM;aACxB,GACA,CACY,CACf;AA3BmB,CA2BnB,CAAC"}

package/dist/esm/components/ApDatePicker/YearMonthForm.js

@@ -0,0 +1,44 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.YearMonthForm = void 0;
+var moment = require("moment");
+var React = require("react");
+var theme_1 = require("../../utils/theme");
+var ApDatePicker_styles_1 = require("./ApDatePicker.styles");
+exports.YearMonthForm = function (_a) {
+    var date = _a.date, localeUtils = _a.localeUtils, srcRange = _a.srcRange, onChange = _a.onChange;
+    var _b = __read(React.useState(false), 2), isMenuOpen = _b[0], setIsMenuOpen = _b[1];
+    var years = [];
+    for (var i = srcRange.from.getFullYear(); i <= srcRange.to.getFullYear(); i += 1) {
+        years.push(i);
+    }
+    var periodsStr = moment(date).startOf("month").format('MMMM') + " " + date.getFullYear();
+    return (React.createElement(ApDatePicker_styles_1.MonthYearContainer, { className: "DayPicker-Caption" },
+        React.createElement(ApDatePicker_styles_1.Wrapper, null,
+            React.createElement(ApDatePicker_styles_1.PeriodButton, { onClick: function () { setIsMenuOpen(!isMenuOpen); } },
+                periodsStr,
+                React.createElement(ApDatePicker_styles_1.CaretIcon, { rotate: isMenuOpen, iconName: "caret", iconColor: theme_1.colors.grey5 })),
+            isMenuOpen && (React.createElement(ApDatePicker_styles_1.MenuContent, null,
+                React.createElement(ApDatePicker_styles_1.PickerContent, null,
+                    React.createElement(ApDatePicker_styles_1.PickerGrid, null, years.map(function (year) { return (React.createElement(ApDatePicker_styles_1.PickerPeriod, { key: year, onClick: function () {
+                            onChange(new Date(Number(year), date.getMonth()));
+                            setIsMenuOpen(false);
+                        }, active: year === date.getFullYear() }, year)); }))))))));
+};
+//# sourceMappingURL=YearMonthForm.js.map

package/dist/esm/components/ApDatePicker/YearMonthForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"YearMonthForm.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/YearMonthForm.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,+BAAiC;AACjC,6BAA+B;AAC/B,2CAA2C;AAC3C,6DAS+B;AAGlB,QAAA,aAAa,GAAG,UAAC,EAQ7B;QAR+B,IAAI,UAAA,EAAE,WAAW,iBAAA,EAAE,QAAQ,cAAA,EAAE,QAAQ,cAAA;IAS9D,IAAA,KAAA,OAA8B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAA,EAAlD,UAAU,QAAA,EAAE,aAAa,QAAyB,CAAC;IAE1D,IAAM,KAAK,GAAG,EAAE,CAAC;IACjB,KAAK,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,IAAI,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE;QACjF,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;KACd;IAED,IAAM,UAAU,GAAM,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,SAAI,IAAI,CAAC,WAAW,EAAI,CAAA;IAC1F,OAAO,CACN,oBAAC,wCAAkB,IAAC,SAAS,EAAC,mBAAmB;QAChD,oBAAC,6BAAO;YACP,oBAAC,kCAAY,IACZ,OAAO,EAAE,cAAQ,aAAa,CAAC,CAAC,UAAU,CAAC,CAAA,CAAA,CAAC;gBAE3C,UAAU;gBACX,oBAAC,+BAAS,IAAC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAE,cAAM,CAAC,KAAK,GAAI,CAC7D;YACd,UAAU,IAAI,CACf,oBAAC,iCAAW;gBACV,oBAAC,mCAAa;oBACb,oBAAC,gCAAU,QACT,KAAK,CAAC,GAAG,CAAC,UAAA,IAAI,IAAI,OAAA,CAClB,oBAAC,kCAAY,IACZ,GAAG,EAAE,IAAI,EACT,OAAO,EAAE;4BACR,QAAQ,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;4BAClD,aAAa,CAAC,KAAK,CAAC,CAAA;wBACrB,CAAC,EACD,MAAM,EAAE,IAAI,KAAK,IAAI,CAAC,WAAW,EAAE,IAElC,IAAI,CACS,CACf,EAXkB,CAWlB,CAAC,CAEU,CACE,CACH,CACd,CACQ,CACU,CACrB,CAAC;AACH,CAAC,CAAC"}

package/dist/esm/components/ApDatePicker/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var ApDatePicker_1 = require("./ApDatePicker");
+Object.defineProperty(exports, "ApDatePicker", { enumerable: true, get: function () { return ApDatePicker_1.ApDatePicker; } });
+//# sourceMappingURL=index.js.map

package/dist/esm/components/ApDatePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/index.ts"],"names":[],"mappings":";;AAAA,+CAA6C;AAApC,4GAAA,YAAY,OAAA"}

package/dist/esm/components/ApDatePicker/utils.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getWeekRange = exports.getWeekDays = void 0;
+var moment = require("moment");
+exports.getWeekDays = function (weekStart, amount) {
+    var days = [weekStart];
+    for (var i = 1; i < amount; i += 1) {
+        days.push(moment(weekStart)
+            .add(i, 'days')
+            .toDate());
+    }
+    return days;
+};
+exports.getWeekRange = function (date, range) {
+    var startDate = moment(date).startOf('isoWeek');
+    return {
+        from: startDate.toDate(),
+        to: startDate
+            .add(range - 1, 'days')
+            .toDate(),
+    };
+};
+//# sourceMappingURL=utils.js.map

package/dist/esm/components/ApDatePicker/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/components/ApDatePicker/utils.ts"],"names":[],"mappings":";;;AAAA,+BAAiC;AAEpB,QAAA,WAAW,GAAG,UAAC,SAAe,EAAE,MAAc;IAC1D,IAAM,IAAI,GAAG,CAAC,SAAS,CAAC,CAAC;IACzB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;QACnC,IAAI,CAAC,IAAI,CACR,MAAM,CAAC,SAAS,CAAC;aACf,GAAG,CAAC,CAAC,EAAE,MAAM,CAAC;aACd,MAAM,EAAE,CACV,CAAC;KACF;IACD,OAAO,IAAI,CAAC;AACb,CAAC,CAAC;AAEW,QAAA,YAAY,GAAG,UAAC,IAAU,EAAE,KAAa;IACrD,IAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;IACjD,OAAO;QACN,IAAI,EAAE,SAAS,CAAC,MAAM,EAAE;QACxB,EAAE,EAAE,SAAS;aACX,GAAG,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC;aACtB,MAAM,EAAE;KACV,CAAC;AACH,CAAC,CAAC"}

package/dist/esm/index.js

@@ -15,6 +15,7 @@ __exportStar(require("./components/ApAppBar/ApAppBar"), exports);
 __exportStar(require("./components/ApButtons/ApButtons"), exports);
 __exportStar(require("./components/ApButtonGroup/ApButtonGroup"), exports);
 __exportStar(require("./components/ApIcon/ApIcon"), exports);
+__exportStar(require("./components/ApDatePicker/ApDatePicker"), exports);
 __exportStar(require("./components/ApLoaderDefault/ApLoaderDefault"), exports);
 __exportStar(require("./components/ApLoaderText/ApLoaderText"), exports);
 __exportStar(require("./components/ApModal/ApModal"), exports);

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,6DAA0C;AAC1C,iEAA8C;AAC9C,mEAAgD;AAChD,2EAAwD;AACxD,6DAA0C;AAC1C,+EAA4D;AAC5D,yEAAsD;AACtD,+DAA4C;AAC5C,6EAA0D;AAC1D,uFAAoE;AACpE,iEAA8C;AAC9C,qEAAkD;AAClD,2EAAwD;AACxD,yEAAsD;AACtD,uEAAoD;AACpD,2EAAwD;AACxD,kEAA+C;AAC/C,qEAAkD;AAClD,uEAAoD;AACpD,mEAAgD;AAChD,6DAA0C;AAC1C,6EAA0D;AAC1D,iEAA8C;AAC9C,+DAA4C;AAC5C,qEAAkD;AAClD,0EAAuD;AACvD,qEAAkD;AAClD,qFAAkE;AAClE,wEAAqD;AACrD,0EAAuD;AACvD,uFAAoE;AACpE,gFAA6D;AAC7D,uEAAoD;AACpD,sEAAmD;AACnD,sEAAmD;AACnD,0EAAuD;AACvD,gFAA6D;AAC7D,4EAAyD;AACzD,0EAAuD;AACvD,2EAAwD;AACxD,sEAAmD;AACnD,uEAAoD;AACpD,4EAAyD;AACzD,8EAA2D;AAC3D,sEAAmD;AACnD,4EAAyD;AACzD,uEAAoD;AACpD,+DAA4C;AAC5C,iFAA8D;AAC9D,+EAA4D;AAC5D,iFAA8D;AAC9D,mFAAgE;AAChE,6EAA0D;AAC1D,mEAAgD;AAChD,6DAA0C;AAC1C,iEAA8C;AAC9C,uEAAoD;AACpD,oEAAiD;AACjD,8DAA2C;AAC3C,iEAA8C;AAC9C,+DAA4C;AAC5C,uEAAoD;AACpD,wEAAqD;AACrD,gEAA6C;AAC7C,6EAA0D;AAC1D,mEAAgD;AAChD,6EAA0D;AAC1D,0EAAuD;AACvD,gDAA6B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,6DAA0C;AAC1C,iEAA8C;AAC9C,mEAAgD;AAChD,2EAAwD;AACxD,6DAA0C;AAC1C,yEAAsD;AACtD,+EAA4D;AAC5D,yEAAsD;AACtD,+DAA4C;AAC5C,6EAA0D;AAC1D,uFAAoE;AACpE,iEAA8C;AAC9C,qEAAkD;AAClD,2EAAwD;AACxD,yEAAsD;AACtD,uEAAoD;AACpD,2EAAwD;AACxD,kEAA+C;AAC/C,qEAAkD;AAClD,uEAAoD;AACpD,mEAAgD;AAChD,6DAA0C;AAC1C,6EAA0D;AAC1D,iEAA8C;AAC9C,+DAA4C;AAC5C,qEAAkD;AAClD,0EAAuD;AACvD,qEAAkD;AAClD,qFAAkE;AAClE,wEAAqD;AACrD,0EAAuD;AACvD,uFAAoE;AACpE,gFAA6D;AAC7D,uEAAoD;AACpD,sEAAmD;AACnD,sEAAmD;AACnD,0EAAuD;AACvD,gFAA6D;AAC7D,4EAAyD;AACzD,0EAAuD;AACvD,2EAAwD;AACxD,sEAAmD;AACnD,uEAAoD;AACpD,4EAAyD;AACzD,8EAA2D;AAC3D,sEAAmD;AACnD,4EAAyD;AACzD,uEAAoD;AACpD,+DAA4C;AAC5C,iFAA8D;AAC9D,+EAA4D;AAC5D,iFAA8D;AAC9D,mFAAgE;AAChE,6EAA0D;AAC1D,mEAAgD;AAChD,6DAA0C;AAC1C,iEAA8C;AAC9C,uEAAoD;AACpD,oEAAiD;AACjD,8DAA2C;AAC3C,iEAA8C;AAC9C,+DAA4C;AAC5C,uEAAoD;AACpD,wEAAqD;AACrD,gEAA6C;AAC7C,6EAA0D;AAC1D,mEAAgD;AAChD,6EAA0D;AAC1D,0EAAuD;AACvD,gDAA6B"}

package/dist/types/components/ApDatePicker/ApDatePicker.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+interface IApDatePickerProps {
+    range?: number;
+    selectedDays: Date[];
+    srcRange: {
+        from: Date;
+        to: Date;
+    };
+    onChange: (days: Date[]) => void;
+}
+interface IApDatePickerState {
+    hoverRange?: {
+        from: Date;
+        to: Date;
+    };
+    month: Date;
+}
+export declare class ApDatePicker extends React.Component<IApDatePickerProps, IApDatePickerState> {
+    constructor(props: IApDatePickerProps);
+    handleDayChange: (date: Date) => void;
+    handleDayEnter: (date: Date) => void;
+    handleDayLeave: () => void;
+    handleYearMonthChange: (month: Date) => void;
+    render(): JSX.Element;
+}
+export {};

package/dist/types/components/ApDatePicker/ApDatePicker.styles.d.ts

@@ -0,0 +1,18 @@
+export declare const Dropdown: import("styled-components").StyledComponent<({ options, selected, iconName, iconProps, disabled, onChange, label, multiple, message, maxItems, }: import("../ApSimpleDropdown").IApSimpleDropdownProps) => JSX.Element, any, {}, never>;
+export declare const MonthYearContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const NavContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const NavButton: import("styled-components").StyledComponent<import("react").SFC<import("../ApButtons").IButtonIconProps>, any, {}, never>;
+export declare const NextNavButton: import("styled-components").StyledComponent<import("react").SFC<import("../ApButtons").IButtonIconProps>, any, {}, never>;
+export declare const PrevNavButton: import("styled-components").StyledComponent<import("react").SFC<import("../ApButtons").IButtonIconProps>, any, {}, never>;
+export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const PeriodButton: import("styled-components").StyledComponent<import("react").SFC<import("../ApButtons").IButtonCompositionProps>, any, {}, never>;
+export declare const CaretIcon: import("styled-components").StyledComponent<import("react").SFC<import("../ApIcon").IIconProps>, any, {
+    rotate: boolean;
+}, never>;
+export declare const MenuContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const PickerContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const PickerGrid: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const PickerPeriod: import("styled-components").StyledComponent<"div", any, {
+    active: boolean;
+}, never>;
+export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/types/components/ApDatePicker/NavBar.d.ts

@@ -0,0 +1,10 @@
+import { NavbarElementProps } from 'react-day-picker';
+interface INavBarProps extends NavbarElementProps {
+    date: Date;
+    srcRange: {
+        from: Date;
+        to: Date;
+    };
+}
+export declare const Navbar: ({ date, onPreviousClick, onNextClick, srcRange, className, }: INavBarProps) => JSX.Element;
+export {};

package/dist/types/components/ApDatePicker/YearMonthForm.d.ts

@@ -0,0 +1,9 @@
+export declare const YearMonthForm: ({ date, localeUtils, srcRange, onChange }: {
+    date: Date;
+    localeUtils: any;
+    srcRange: {
+        from: Date;
+        to: Date;
+    };
+    onChange: (o: Date) => void;
+}) => JSX.Element;

package/dist/types/components/ApDatePicker/index.d.ts

@@ -0,0 +1 @@
+export { ApDatePicker } from './ApDatePicker';

package/dist/types/components/ApDatePicker/utils.d.ts

@@ -0,0 +1,5 @@
+export declare const getWeekDays: (weekStart: Date, amount: number) => Date[];
+export declare const getWeekRange: (date: Date, range: number) => {
+    from: Date;
+    to: Date;
+};

package/dist/types/index.d.ts

@@ -3,6 +3,7 @@ export * from './components/ApAppBar/ApAppBar';
 export * from './components/ApButtons/ApButtons';
 export * from './components/ApButtonGroup/ApButtonGroup';
 export * from './components/ApIcon/ApIcon';
+export * from './components/ApDatePicker/ApDatePicker';
 export * from './components/ApLoaderDefault/ApLoaderDefault';
 export * from './components/ApLoaderText/ApLoaderText';
 export * from './components/ApModal/ApModal';