@stenajs-webui/calendar 17.5.0 → 17.6.0

package/dist/index.js

@@ -8,21 +8,14 @@ var core = require('@stenajs-webui/core');
 var dateFns = require('date-fns');
 var lodash = require('lodash');
 var styled = require('@emotion/styled');
-var faAngleLeft = require('@fortawesome/free-solid-svg-icons/faAngleLeft');
-var faAngleRight = require('@fortawesome/free-solid-svg-icons/faAngleRight');
 var faAngleDoubleLeft = require('@fortawesome/free-solid-svg-icons/faAngleDoubleLeft');
 var faAngleDoubleRight = require('@fortawesome/free-solid-svg-icons/faAngleDoubleRight');
 var faCaretLeft = require('@fortawesome/free-solid-svg-icons/faCaretLeft');
 var faCaretRight = require('@fortawesome/free-solid-svg-icons/faCaretRight');
-var faCalendarAlt = require('@fortawesome/free-regular-svg-icons/faCalendarAlt');
 var forms = require('@stenajs-webui/forms');
 var tooltip = require('@stenajs-webui/tooltip');
-var faCalendarAlt$1 = require('@fortawesome/free-solid-svg-icons/faCalendarAlt');
 var theme = require('@stenajs-webui/theme');
 var faLongArrowAltRight = require('@fortawesome/free-solid-svg-icons/faLongArrowAltRight');
-var faClock = require('@fortawesome/free-solid-svg-icons/faClock');
-var faClock$1 = require('@fortawesome/free-regular-svg-icons/faClock');
-var faAngleDown = require('@fortawesome/free-solid-svg-icons/faAngleDown');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -636,9 +629,9 @@ var WithMonthSwitcherBelow = function (_a) {
             React__namespace.createElement(core.Row, null,
                 React__namespace.createElement(elements.FlatButton, { onClick: prevYear, leftIcon: faAngleDoubleLeft.faAngleDoubleLeft }),
                 React__namespace.createElement(core.Space, null),
-                React__namespace.createElement(elements.FlatButton, { onClick: prevMonth, leftIcon: faAngleLeft.faAngleLeft }),
+                React__namespace.createElement(elements.FlatButton, { onClick: prevMonth, leftIcon: elements.stenaAngleLeft }),
                 React__namespace.createElement(core.Indent, { num: 2 }),
-                React__namespace.createElement(elements.FlatButton, { onClick: nextMonth, leftIcon: faAngleRight.faAngleRight }),
+                React__namespace.createElement(elements.FlatButton, { onClick: nextMonth, leftIcon: elements.stenaAngleRight }),
                 React__namespace.createElement(core.Space, null),
                 React__namespace.createElement(elements.FlatButton, { onClick: nextYear, leftIcon: faAngleDoubleRight.faAngleDoubleRight }))),
         React__namespace.createElement(core.Space, null)));
@@ -693,9 +686,9 @@ var PresetPicker = function (_a) {
     var currentPage = (_b = pages[pageIndex]) !== null && _b !== void 0 ? _b : pages[0];
     return (React__namespace.createElement(core.Column, null,
         React__namespace.createElement(core.Row, { justifyContent: "space-between", alignItems: "center", width: "200px" },
-            React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: faAngleLeft.faAngleLeft, disabled: pageIndex === 0, onClick: function () { return setPageIndex(pageIndex - 1); } }),
+            React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: elements.stenaAngleLeft, disabled: pageIndex === 0, onClick: function () { return setPageIndex(pageIndex - 1); } }),
             React__namespace.createElement(core.Text, null, currentPage.label),
-            React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: faAngleRight.faAngleRight, disabled: pageIndex === pages.length - 1, onClick: function () { return setPageIndex(pageIndex + 1); } })),
+            React__namespace.createElement(elements.FlatButton, { size: "small", leftIcon: elements.stenaAngleRight, disabled: pageIndex === pages.length - 1, onClick: function () { return setPageIndex(pageIndex + 1); } })),
         React__namespace.createElement(core.Space, null),
         React__namespace.createElement(core.Column, { alignItems: "center" }, currentPage.presets.map(function (preset) { return (React__namespace.createElement(React__namespace.Fragment, { key: preset.label },
             React__namespace.createElement(elements.PrimaryButton, { label: preset.label, onClick: function () { return onClickPreset(preset); } }),
@@ -805,8 +798,8 @@ function CalendarWithMonthSwitcher(_a) {
                 React__namespace.createElement(CalendarWithMonthYearPickers, __assign({}, calendarProps, { theme: theme, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, onSelectPreset: onSelectPreset, headerLeftContent: React__namespace.createElement(core.Row, { alignItems: "center" },
                         !hideYearPagination && (React__namespace.createElement(elements.FlatButton, { size: "small", onClick: prevYear, leftIcon: faAngleDoubleLeft.faAngleDoubleLeft })),
                         React__namespace.createElement(core.Space, null),
-                        React__namespace.createElement(elements.FlatButton, { size: "small", onClick: prevMonth, leftIcon: faAngleLeft.faAngleLeft })), headerRightContent: React__namespace.createElement(core.Row, { alignItems: "center" },
-                        React__namespace.createElement(elements.FlatButton, { size: "small", onClick: nextMonth, leftIcon: faAngleRight.faAngleRight }),
+                        React__namespace.createElement(elements.FlatButton, { size: "small", onClick: prevMonth, leftIcon: elements.stenaAngleLeft })), headerRightContent: React__namespace.createElement(core.Row, { alignItems: "center" },
+                        React__namespace.createElement(elements.FlatButton, { size: "small", onClick: nextMonth, leftIcon: elements.stenaAngleRight }),
                         React__namespace.createElement(core.Space, null),
                         !hideYearPagination && (React__namespace.createElement(elements.FlatButton, { size: "small", onClick: nextYear, leftIcon: faAngleDoubleRight.faAngleDoubleRight }))) }))));
         }
@@ -1185,7 +1178,7 @@ var DateInput = function (_a) {
     return (React__namespace.createElement(core.Box, { width: width },
         React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: showingCalendar, onClickOutside: hideCalendar, placement: defaultPopoverPlacement, zIndex: zIndex, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", tippyRef: tippyRef, disabled: disabled, content: React__namespace.createElement(SingleDateCalendar, __assign({}, calendarProps, { onChange: onSelectDate, value: value, theme: calendarTheme, onChangePanel: onChangePanel, minDate: minDate, maxDate: maxDate })) },
             React__namespace.createElement(forms.TextInput, { type: "date", contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
-                    React__namespace.createElement(elements.FlatButton, { size: "small", disabled: disabled, leftIcon: faCalendarAlt.faCalendarAlt, onClick: showCalendar })), onFocus: showCalendar, onClickRight: showCalendar, value: value ? dateFns.format(value, displayFormat) : "", placeholder: placeholder, size: 9, disabled: disabled, autoFocus: openOnMount, variant: variant, min: minDate, max: maxDate }))));
+                    React__namespace.createElement(elements.FlatButton, { size: "small", disabled: disabled, leftIcon: elements.stenaCalendar, onClick: showCalendar })), onFocus: showCalendar, onClickRight: showCalendar, value: value ? dateFns.format(value, displayFormat) : "", placeholder: placeholder, size: 9, disabled: disabled, autoFocus: openOnMount, variant: variant, min: minDate, max: maxDate }))));
 };
 
 var useDateRangeInput = function (value, onValueChange) {
@@ -1266,11 +1259,11 @@ var DateRangeInput = function (_a) {
     }, [value]);
     return (React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, visible: showingCalendar, zIndex: zIndex, placement: defaultPopoverPlacement, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", onClickOutside: hideCalendar, content: React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, calendarProps, { dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, statePerMonth: statePerMonth, theme: calendarTheme, onClickDay: onClickDay, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) },
         React__namespace.createElement(core.Row, { alignItems: "center" },
-            React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarStartDate, value: (value === null || value === void 0 ? void 0 : value.startDate) ? dateFns.format(value.startDate, displayFormat) : "", placeholder: placeholderStartDate, width: width, disabled: disabled, inputRef: startDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }),
+            React__namespace.createElement(forms.TextInput, { iconLeft: elements.stenaCalendar, onFocus: showCalendarStartDate, value: (value === null || value === void 0 ? void 0 : value.startDate) ? dateFns.format(value.startDate, displayFormat) : "", placeholder: placeholderStartDate, width: width, disabled: disabled, inputRef: startDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }),
             React__namespace.createElement(core.Space, null),
             React__namespace.createElement(elements.Icon, { icon: faLongArrowAltRight.faLongArrowAltRight, color: theme.cssColor("--lhds-color-ui-500"), size: 14 }),
             React__namespace.createElement(core.Space, null),
-            React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarEndDate, value: (value === null || value === void 0 ? void 0 : value.endDate) ? dateFns.format(value.endDate, displayFormat) : "", placeholder: placeholderEndDate, width: width, disabled: disabled, inputRef: endDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }))));
+            React__namespace.createElement(forms.TextInput, { iconLeft: elements.stenaCalendar, onFocus: showCalendarEndDate, value: (value === null || value === void 0 ? void 0 : value.endDate) ? dateFns.format(value.endDate, displayFormat) : "", placeholder: placeholderEndDate, width: width, disabled: disabled, inputRef: endDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }))));
 };
 
 var DateTextInput = function (_a) {
@@ -1305,7 +1298,7 @@ var DateTextInput = function (_a) {
                     ? dateFns.parse(value, dateFormat, new Date())
                     : undefined, minDate: minDate, maxDate: maxDate, theme: calendarTheme })) },
             React__namespace.createElement(forms.TextInput, __assign({}, props, { variant: invalid ? "error" : variant, disableContentPaddingRight: true, contentRight: !hideCalenderIcon ? (React__namespace.createElement(core.Row, { alignItems: "center", indent: 0.5 },
-                    React__namespace.createElement(elements.FlatButton, { size: "small", disabled: props.disabled, leftIcon: faCalendarAlt$1.faCalendarAlt, onClick: toggleCalendar }))) : undefined, onValueChange: onValueChangeHandler, placeholder: placeholder, value: value || "", min: minDate, max: maxDate, size: 10 })))));
+                    React__namespace.createElement(elements.FlatButton, { size: "small", disabled: props.disabled, leftIcon: elements.stenaCalendar, onClick: toggleCalendar }))) : undefined, onValueChange: onValueChangeHandler, placeholder: placeholder, value: value || "", min: minDate, max: maxDate, size: 10 })))));
 };
 
 var formatHours = function (hours) {
@@ -1439,7 +1432,7 @@ var TimeTextInput = function (_a) {
             onValueChange(time);
         }
     }, [onValueChange, setValid]);
-    return (React__namespace.createElement(forms.TextInput, __assign({}, props, { type: "time", variant: !valid ? "error" : variant, iconLeft: useIcon ? faClock.faClock : undefined, value: value, placeholder: showPlaceholder ? timeFormat : undefined, onChange: onChangeHandler, onBlur: onBlur, width: width })));
+    return (React__namespace.createElement(forms.TextInput, __assign({}, props, { type: "time", variant: !valid ? "error" : variant, iconLeft: useIcon ? elements.stenaClock : undefined, value: value, placeholder: showPlaceholder ? timeFormat : undefined, onChange: onChangeHandler, onBlur: onBlur, width: width })));
 };
 
 var DualTextInput = function (_a) {
@@ -1483,12 +1476,12 @@ var DualTextInput = function (_a) {
     return (React__namespace.createElement(core.Box, null,
         React__namespace.createElement(forms.TextInputBox, { disableContentPaddingRight: true, disabled: disabled, variant: variant, contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
                 React__namespace.createElement(core.Indent, { num: 0.5 },
-                    React__namespace.createElement(elements.FlatButton, { leftIcon: faCalendarAlt.faCalendarAlt, onClick: onClickCalendar, disabled: disabled, size: "small" })),
+                    React__namespace.createElement(elements.FlatButton, { leftIcon: elements.stenaCalendar, onClick: onClickCalendar, disabled: disabled, size: "small" })),
                 showPresets ? (React__namespace.createElement(React__namespace.Fragment, null,
                     React__namespace.createElement(core.Row, { height: "22px" },
                         React__namespace.createElement(core.SeparatorLine, { vertical: true })),
                     React__namespace.createElement(core.Indent, { num: 0.5 },
-                        React__namespace.createElement(elements.FlatButton, { leftIcon: faAngleDown.faAngleDown, onClick: onClickArrowDown, disabled: disabled, size: "small" })))) : null) },
+                        React__namespace.createElement(elements.FlatButton, { leftIcon: elements.stenaAngleDown, onClick: onClickArrowDown, disabled: disabled, size: "small" })))) : null) },
             React__namespace.createElement(core.Box, { width: widthLeft },
                 React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickLeft, disabled: disabled, hideBorder: true, placeholder: placeholderLeft, value: valueLeft, onValueChange: onValueChangeLeft, onChange: onChangeLeft, onBlur: blurLeftHandler, onFocus: focusLeftHandler, inputRef: inputRefLeft, variant: variantLeft, type: typeLeft, autoFocus: autoFocusLeft, min: minLeft, max: maxLeft })),
             React__namespace.createElement(core.Row, { indent: 0.5, alignItems: "center", justifyContent: "center" },
@@ -1831,7 +1824,7 @@ var DateTimeInput = function (_a) {
                 React__namespace.createElement(core.Space, null),
                 React__namespace.createElement(core.Row, { justifyContent: "flex-end" },
                     React__namespace.createElement(elements.PrimaryButton, { label: "Done", onClick: hideTimePicker })))) : null)) },
-            React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: faClock$1.faClock, typeLeft: "date", typeRight: "time", placeholderLeft: "yyyy-mm-dd", placeholderRight: "hh:mm", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: dateInputRef, inputRefRight: timeInputRef, valueRight: timeValue !== null && timeValue !== void 0 ? timeValue : "", widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, variant: variant }))));
+            React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: elements.stenaClock, typeLeft: "date", typeRight: "time", placeholderLeft: "yyyy-mm-dd", placeholderRight: "hh:mm", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: dateInputRef, inputRefRight: timeInputRef, valueRight: timeValue !== null && timeValue !== void 0 ? timeValue : "", widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, variant: variant }))));
 };
 
 var useDateRangeEffects = function (startDate, endDate, setDateInFocus, startDateInputRef, endDateInputRef) {