@synerise/ds-date-range-picker 1.6.11 → 1.6.12

package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.js

@@ -1,155 +1,138 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { Header } from '../Header/Header';
-import RangeActions from '../RangeActions/RangeActions';
-import RangeSummary from '../RangeSummary/RangeSummary';
-import { DEFAULT_LIMIT_MODE } from '../TimeWindow';
-import { getDateFromDayValue, getDefaultFilterForLimitMode } from '../utils';
-import RangeForm from './RangeForm/RangeForm';
-import { RANGE_DISPLAY_MODES } from './RangeForm/RangeForm.constants';
-import * as S from './RangeFormContainer.styles';
-var RangeFormContainer = function RangeFormContainer(_ref) {
-  var errorTexts = _ref.errorTexts,
-    activeDays = _ref.activeDays,
-    disabled = _ref.disabled,
-    days = _ref.days,
-    dayKeys = _ref.dayKeys,
-    getDayValue = _ref.getDayValue,
-    getDayLabel = _ref.getDayLabel,
-    onDayTimeChange = _ref.onDayTimeChange,
-    onMultipleDayTimeChange = _ref.onMultipleDayTimeChange,
-    hideHeader = _ref.hideHeader,
-    _ref$headerOptions = _ref.headerOptions,
-    headerOptions = _ref$headerOptions === void 0 ? {} : _ref$headerOptions,
-    monthlyFilter = _ref.monthlyFilter,
-    monthlyFilterPeriod = _ref.monthlyFilterPeriod,
-    onRangeClear = _ref.onRangeClear,
-    onRangePaste = _ref.onRangePaste,
-    onRangeCopy = _ref.onRangeCopy,
-    onRangeDelete = _ref.onRangeDelete,
-    texts = _ref.texts,
-    onChange = _ref.onChange,
-    _ref$valueSelectionMo = _ref.valueSelectionModes,
-    valueSelectionModes = _ref$valueSelectionMo === void 0 ? ['Range', 'Hour'] : _ref$valueSelectionMo,
-    rangeDisplayMode = _ref.rangeDisplayMode,
-    onModeChange = _ref.onModeChange,
-    timePickerProps = _ref.timePickerProps,
-    renderSuffix = _ref.renderSuffix,
-    timeFormat = _ref.timeFormat,
-    valueFormatOptions = _ref.valueFormatOptions;
-  var dayValue = getDayValue(activeDays[0]);
-  var _React$useState = React.useState((dayValue == null ? void 0 : dayValue.mode) || valueSelectionModes[0] || DEFAULT_LIMIT_MODE),
-    mode = _React$useState[0],
-    setMode = _React$useState[1];
-  var handleModeChange = React.useCallback(function (selectedMode) {
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React from "react";
+import { Header } from "../Header/Header.js";
+import RangeActions from "../RangeActions/RangeActions.js";
+import RangeSummary from "../RangeSummary/RangeSummary.js";
+import { DEFAULT_LIMIT_MODE } from "../TimeWindow.js";
+import { getDefaultFilterForLimitMode, getDateFromDayValue } from "../utils.js";
+import RangeForm from "./RangeForm/RangeForm.js";
+import { RANGE_DISPLAY_MODES } from "./RangeForm/RangeForm.constants.js";
+import { InvertAction } from "./RangeFormContainer.styles.js";
+const RangeFormContainer = ({
+  errorTexts,
+  activeDays,
+  disabled,
+  days,
+  dayKeys,
+  getDayValue,
+  getDayLabel,
+  onDayTimeChange,
+  onMultipleDayTimeChange,
+  hideHeader,
+  headerOptions = {},
+  monthlyFilter,
+  monthlyFilterPeriod,
+  onRangeClear,
+  onRangePaste,
+  onRangeCopy,
+  onRangeDelete,
+  texts,
+  onChange,
+  valueSelectionModes = ["Range", "Hour"],
+  rangeDisplayMode,
+  onModeChange,
+  timePickerProps,
+  renderSuffix,
+  timeFormat,
+  valueFormatOptions
+}) => {
+  const dayValue = getDayValue(activeDays[0]);
+  const [mode, setMode] = React.useState(dayValue?.mode || valueSelectionModes[0] || DEFAULT_LIMIT_MODE);
+  const handleModeChange = React.useCallback((selectedMode) => {
     if (onModeChange) {
       onModeChange(selectedMode);
       return;
     }
-    var updatedDays = {};
-    activeDays.forEach(function (i) {
-      updatedDays[i] = _extends({}, days[i], getDefaultFilterForLimitMode(selectedMode), {
+    const updatedDays = {};
+    activeDays.forEach((i) => {
+      updatedDays[i] = {
+        ...days[i],
+        ...getDefaultFilterForLimitMode(selectedMode),
         mode: selectedMode
-      });
+      };
+    });
+    onChange({
+      ...days,
+      ...updatedDays
     });
-    onChange(_extends({}, days, updatedDays));
   }, [onChange, days, activeDays, onModeChange]);
-  React.useEffect(function () {
-    setMode((dayValue == null ? void 0 : dayValue.mode) || valueSelectionModes[0] || DEFAULT_LIMIT_MODE);
+  React.useEffect(() => {
+    setMode(dayValue?.mode || valueSelectionModes[0] || DEFAULT_LIMIT_MODE);
   }, [dayValue, valueSelectionModes]);
-  var onStartChange = React.useCallback(function (start) {
-    var dayVal = getDayValue(activeDays[0]);
-    var inverted = dayVal.inverted,
-      end = dayVal.stop;
-    var value = [start, end ? getDateFromDayValue(end, timeFormat) : undefined, Boolean(inverted)];
+  const onStartChange = React.useCallback((start) => {
+    const dayVal = getDayValue(activeDays[0]);
+    const {
+      inverted,
+      stop: end
+    } = dayVal;
+    const value = [start, end ? getDateFromDayValue(end, timeFormat) : void 0, Boolean(inverted)];
     if (activeDays.length > 1) {
       onMultipleDayTimeChange(value);
     } else {
       onDayTimeChange(value, dayKeys);
     }
   }, [activeDays, onMultipleDayTimeChange, onDayTimeChange, timeFormat, getDayValue, dayKeys]);
-  var onEndChange = React.useCallback(function (end) {
-    var dayVal = getDayValue(activeDays[0]);
-    var start = dayVal.start,
-      inverted = dayVal.inverted;
-    var value = [start ? getDateFromDayValue(start, timeFormat) : undefined, end, Boolean(inverted)];
+  const onEndChange = React.useCallback((end) => {
+    const dayVal = getDayValue(activeDays[0]);
+    const {
+      start,
+      inverted
+    } = dayVal;
+    const value = [start ? getDateFromDayValue(start, timeFormat) : void 0, end, Boolean(inverted)];
     if (activeDays.length > 1) {
       onMultipleDayTimeChange(value);
     } else {
       onDayTimeChange(value, dayKeys);
     }
   }, [activeDays, onMultipleDayTimeChange, onDayTimeChange, timeFormat, getDayValue, dayKeys]);
-  var toggleInverted = React.useCallback(function () {
-    var dayVal = getDayValue(activeDays[0]);
-    var start = dayVal.start,
-      inverted = dayVal.inverted,
-      end = dayVal.stop;
-    var value = [start ? getDateFromDayValue(start, timeFormat) : undefined, end ? getDateFromDayValue(end, timeFormat) : undefined, Boolean(!inverted)];
+  const toggleInverted = React.useCallback(() => {
+    const dayVal = getDayValue(activeDays[0]);
+    const {
+      start,
+      inverted,
+      stop: end
+    } = dayVal;
+    const value = [start ? getDateFromDayValue(start, timeFormat) : void 0, end ? getDateFromDayValue(end, timeFormat) : void 0, Boolean(!inverted)];
     if (activeDays.length > 1) {
       onMultipleDayTimeChange(value);
     } else {
       onDayTimeChange(value, dayKeys);
     }
   }, [activeDays, onMultipleDayTimeChange, onDayTimeChange, timeFormat, getDayValue, dayKeys]);
-  var onExactHourSelect = React.useCallback(function (value) {
+  const onExactHourSelect = React.useCallback((value) => {
     if (activeDays.length > 1) {
       onMultipleDayTimeChange([value, value, false]);
     } else {
       onDayTimeChange([value, value, false], dayKeys);
     }
   }, [activeDays, onMultipleDayTimeChange, onDayTimeChange, dayKeys]);
-  var rangeForm = React.useMemo(function () {
-    return /*#__PURE__*/React.createElement(RangeForm, {
-      disabled: disabled,
-      texts: texts,
-      errorTexts: errorTexts,
-      onModeChange: function onModeChange(selected) {
-        setMode(selected);
-        handleModeChange(selected);
-      },
-      mode: mode,
-      startDate: dayValue != null && dayValue.start ? getDateFromDayValue(dayValue.start, timeFormat) : undefined,
-      endDate: dayValue != null && dayValue.stop ? getDateFromDayValue(dayValue.stop, timeFormat) : undefined,
-      onStartChange: onStartChange,
-      onEndChange: onEndChange,
-      onExactHourSelect: onExactHourSelect,
-      onRangeDelete: onRangeDelete,
-      valueSelectionModes: valueSelectionModes,
-      valueFormatOptions: valueFormatOptions,
-      timePickerProps: timePickerProps,
-      rangeDisplayMode: rangeDisplayMode,
-      isInvertedRange: Boolean(dayValue == null ? void 0 : dayValue.inverted)
-    });
-  }, [disabled, texts, errorTexts, mode, dayValue.start, dayValue.stop, dayValue == null ? void 0 : dayValue.inverted, timeFormat, onStartChange, onEndChange, onExactHourSelect, onRangeDelete, valueSelectionModes, valueFormatOptions, timePickerProps, rangeDisplayMode, handleModeChange]);
-  var invertedToggleLink = React.useMemo(function () {
-    return /*#__PURE__*/React.createElement(S.InvertAction, {
-      onClick: toggleInverted
-    }, texts.inverseSelection);
+  const rangeForm = React.useMemo(() => /* @__PURE__ */ jsx(RangeForm, { disabled, texts, errorTexts, onModeChange: (selected) => {
+    setMode(selected);
+    handleModeChange(selected);
+  }, mode, startDate: dayValue?.start ? getDateFromDayValue(dayValue.start, timeFormat) : void 0, endDate: dayValue?.stop ? getDateFromDayValue(dayValue.stop, timeFormat) : void 0, onStartChange, onEndChange, onExactHourSelect, onRangeDelete, valueSelectionModes, valueFormatOptions, timePickerProps, rangeDisplayMode, isInvertedRange: Boolean(dayValue?.inverted) }), [disabled, texts, errorTexts, mode, dayValue.start, dayValue.stop, dayValue?.inverted, timeFormat, onStartChange, onEndChange, onExactHourSelect, onRangeDelete, valueSelectionModes, valueFormatOptions, timePickerProps, rangeDisplayMode, handleModeChange]);
+  const invertedToggleLink = React.useMemo(() => {
+    return /* @__PURE__ */ jsx(InvertAction, { onClick: toggleInverted, children: texts.inverseSelection });
   }, [texts.inverseSelection, toggleInverted]);
-  var suffix = React.useMemo(function () {
-    var _headerOptions$includ = headerOptions.includeActions,
-      includeActions = _headerOptions$includ === void 0 ? true : _headerOptions$includ;
-    return renderSuffix ? renderSuffix() : /*#__PURE__*/React.createElement(React.Fragment, null, rangeDisplayMode === RANGE_DISPLAY_MODES.SLIDER && invertedToggleLink, includeActions && /*#__PURE__*/React.createElement(RangeActions, {
-      onRangeClear: onRangeClear,
-      onRangeCopy: onRangeCopy,
-      onRangePaste: onRangePaste,
-      texts: texts
-    }));
+  const suffix = React.useMemo(() => {
+    const {
+      includeActions = true
+    } = headerOptions;
+    return renderSuffix ? renderSuffix() : /* @__PURE__ */ jsxs(Fragment, { children: [
+      rangeDisplayMode === RANGE_DISPLAY_MODES.SLIDER && invertedToggleLink,
+      includeActions && /* @__PURE__ */ jsx(RangeActions, { onRangeClear, onRangeCopy, onRangePaste, texts })
+    ] });
   }, [onRangePaste, onRangeClear, onRangeCopy, texts, renderSuffix, rangeDisplayMode, invertedToggleLink, headerOptions]);
   if (hideHeader) {
     return rangeForm;
   }
-  var _headerOptions$includ2 = headerOptions.includeSummary,
-    includeSummary = _headerOptions$includ2 === void 0 ? true : _headerOptions$includ2;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
-    title: includeSummary && /*#__PURE__*/React.createElement(RangeSummary, {
-      dayKeys: dayKeys,
-      getDayLabel: getDayLabel,
-      texts: texts,
-      monthlyFilter: monthlyFilter,
-      monthlyFilterPeriod: monthlyFilterPeriod
-    }),
-    suffix: suffix
-  }), rangeForm);
+  const {
+    includeSummary = true
+  } = headerOptions;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Header, { title: includeSummary && /* @__PURE__ */ jsx(RangeSummary, { dayKeys, getDayLabel, texts, monthlyFilter, monthlyFilterPeriod }), suffix }),
+    rangeForm
+  ] });
+};
+export {
+  RangeFormContainer as default
 };
-export default RangeFormContainer;

package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.styles.d.ts

@@ -1 +1 @@
-export declare const InvertAction: import("styled-components").StyledComponent<"a", any, {}, never>;
+export declare const InvertAction: import('styled-components').StyledComponent<"a", any, {}, never>;

package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.styles.js

@@ -1,5 +1,8 @@
-import styled from 'styled-components';
-export var InvertAction = styled.a.withConfig({
+import styled from "styled-components";
+const InvertAction = /* @__PURE__ */ styled.a.withConfig({
   displayName: "RangeFormContainerstyles__InvertAction",
   componentId: "sc-vxg8mc-0"
-})(["align-self:center;margin-right:6px;"]);
+})(["align-self:center;margin-right:6px;"]);
+export {
+  InvertAction
+};

package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.types.d.ts

@@ -1,9 +1,9 @@
-import { type ReactNode } from 'react';
-import type { DateToFormatOptions } from '@synerise/ds-core';
-import type { TimePickerProps } from '@synerise/ds-time-picker';
-import { type FilterDefinition, type WithDisabledProp } from '../../../RangeFilter.types';
-import { type DayKey, type RangeActions, type TimeWindowProps, type TimeWindowTexts } from '../TimeWindow.types';
-import { type DateLimitMode, type RangeDisplayMode } from './RangeForm/RangeForm.types';
+import { ReactNode } from 'react';
+import { DateToFormatOptions } from '@synerise/ds-core';
+import { TimePickerProps } from '@synerise/ds-time-picker';
+import { FilterDefinition, WithDisabledProp } from '../../../RangeFilter.types';
+import { DayKey, RangeActions, TimeWindowProps, TimeWindowTexts } from '../TimeWindow.types';
+import { DateLimitMode, RangeDisplayMode } from './RangeForm/RangeForm.types';
 export type DateValue = [
     Date | undefined,
     Date | undefined,

package/dist/RangeFilter/Shared/TimeWindow/RangeFormContainer/RangeFormContainer.types.js

@@ -1 +1 @@
-export {};
+

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import { type RangeSummaryProps } from './RangeSummary.types';
+import { default as React } from 'react';
+import { RangeSummaryProps } from './RangeSummary.types';
 declare const RangeSummary: React.FC<RangeSummaryProps>;
 export default RangeSummary;

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.js

@@ -1,22 +1,30 @@
-import React from 'react';
-import { SPACE_UNICODE } from '../../../constants';
-import * as S from './RangeSummary.styles';
-var RangeSummary = function RangeSummary(_ref) {
-  var dayKeys = _ref.dayKeys,
-    getDayLabel = _ref.getDayLabel,
-    monthlyFilterPeriod = _ref.monthlyFilterPeriod,
-    monthlyFilter = _ref.monthlyFilter,
-    texts = _ref.texts;
-  var daysToDisplay = React.useMemo(function () {
+import { jsx, jsxs } from "react/jsx-runtime";
+import React from "react";
+import { SPACE_UNICODE } from "../../../constants.js";
+import { DayShortname, TitleWrapper } from "./RangeSummary.styles.js";
+const RangeSummary = ({
+  dayKeys,
+  getDayLabel,
+  monthlyFilterPeriod,
+  monthlyFilter,
+  texts
+}) => {
+  const daysToDisplay = React.useMemo(() => {
     if (monthlyFilter && dayKeys.length > 1) {
-      return /*#__PURE__*/React.createElement(S.DayShortname, null, "Days");
+      return /* @__PURE__ */ jsx(DayShortname, { children: "Days" });
     }
-    return dayKeys.map(function (k, index) {
-      return /*#__PURE__*/React.createElement(S.DayShortname, {
-        key: k
-      }, !monthlyFilter || monthlyFilterPeriod !== 'WEEK' ? getDayLabel(k, false) : null, monthlyFilter && getDayLabel(k, true), index + 1 !== dayKeys.length && "," + SPACE_UNICODE);
-    });
+    return dayKeys.map((k, index) => /* @__PURE__ */ jsxs(DayShortname, { children: [
+      !monthlyFilter || monthlyFilterPeriod !== "WEEK" ? getDayLabel(k, false) : null,
+      monthlyFilter && getDayLabel(k, true),
+      index + 1 !== dayKeys.length && `,${SPACE_UNICODE}`
+    ] }, k));
   }, [dayKeys, getDayLabel, monthlyFilter, monthlyFilterPeriod]);
-  return /*#__PURE__*/React.createElement(S.TitleWrapper, null, texts.setTimeFor, SPACE_UNICODE, daysToDisplay);
+  return /* @__PURE__ */ jsxs(TitleWrapper, { children: [
+    texts.setTimeFor,
+    SPACE_UNICODE,
+    daysToDisplay
+  ] });
+};
+export {
+  RangeSummary as default
 };
-export default RangeSummary;

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const DayShortname: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const TitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DayShortname: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const TitleWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.styles.js

@@ -1,13 +1,13 @@
-import styled from 'styled-components';
-export var DayShortname = styled.span.withConfig({
+import styled from "styled-components";
+const DayShortname = /* @__PURE__ */ styled.span.withConfig({
   displayName: "RangeSummarystyles__DayShortname",
   componentId: "sc-9rwr7-0"
-})(["font-weight:500;color:", ";"], function (props) {
-  return props.theme.palette['grey-800'];
-});
-export var TitleWrapper = styled.div.withConfig({
+})(["font-weight:500;color:", ";"], (props) => props.theme.palette["grey-800"]);
+const TitleWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "RangeSummarystyles__TitleWrapper",
   componentId: "sc-9rwr7-1"
-})(["color:", ";display:flex;flex-wrap:wrap;"], function (props) {
-  return props.theme.palette['grey-700'];
-});
+})(["color:", ";display:flex;flex-wrap:wrap;"], (props) => props.theme.palette["grey-700"]);
+export {
+  DayShortname,
+  TitleWrapper
+};

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.types.d.ts

@@ -1,6 +1,6 @@
-import type { ReactNode } from 'react';
-import { type Texts } from '../../../../DateRangePicker.types';
-import { type DayKey } from '../TimeWindow.types';
+import { ReactNode } from 'react';
+import { Texts } from '../../../../DateRangePicker.types';
+import { DayKey } from '../TimeWindow.types';
 export type RangeSummaryProps = {
     texts: Pick<Texts, 'setTimeFor'>;
     dayKeys: DayKey[];

package/dist/RangeFilter/Shared/TimeWindow/RangeSummary/RangeSummary.types.js

@@ -1 +1 @@
-export {};
+

package/dist/RangeFilter/Shared/TimeWindow/TimeWindow.d.ts

@@ -1,6 +1,6 @@
-import { type FC } from 'react';
-import { type DateLimitMode } from './RangeFormContainer/RangeForm/RangeForm.types';
-import { type TimeWindowProps } from './TimeWindow.types';
+import { FC } from 'react';
+import { DateLimitMode } from './RangeFormContainer/RangeForm/RangeForm.types';
+import { TimeWindowProps } from './TimeWindow.types';
 export declare const DEFAULT_LIMIT_MODE: DateLimitMode;
 declare const _default: FC<TimeWindowProps>;
 export default _default;