@orfium/ictinus 4.70.0 → 4.71.1

package/dist/components/DatePicker/DatePickInput/DatePickInput.js

@@ -96,7 +96,7 @@ var DatePickInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, re
         value: selectedDay.from ? formattedFrom + " - " + formattedTo : '',
         rightIcon: (0, _react2.jsx)(_Icon["default"], {
           name: 'calendarEmpty',
-          color: '#676767'
+          color: '#757BB2'
         })
       }));
     }
@@ -112,7 +112,7 @@ var DatePickInput = /*#__PURE__*/_react["default"].forwardRef(function (_ref, re
       value: selectedDay.to ? formattedFrom : '',
       rightIcon: (0, _react2.jsx)(_Icon["default"], {
         name: 'calendarEmpty',
-        color: '#676767'
+        color: '#757BB2'
       })
     }));
   };

package/dist/components/DatePicker/DatePicker.d.ts

@@ -3,25 +3,25 @@ import React from 'react';
 import { TestProps } from '../../utils/types';
 import { FilterType, StyleType } from '../Filter/types';
 import { Props as TextFieldProps } from '../TextField/TextField';
-import { Range } from './OverlayComponent/OverlayComponent';
 export declare type DisabledDates = {
     daysOfWeek?: number[];
     days?: Date[];
     after?: Date;
     before?: Date;
 };
+export declare type DateRange = {
+    from: Date | undefined;
+    to: Date | undefined;
+};
 export declare type Props = {
     /** This property is to define if this is a day picker or a day range picker */
     isRangePicker?: boolean;
     /** A callback to return user selection */
-    onChange?: (range: Range) => void;
+    onChange?: (range: DateRange) => void;
     /** Option to disable some dates */
     disableDates?: DisabledDates;
     /** Value to define if needed an initial state or to handle it externally */
-    value?: {
-        from?: Date;
-        to?: Date;
-    };
+    value: DateRange;
     /** Props of the TextField input */
     inputProps?: TextFieldProps;
     /** The format of the date displayed in the input field */
@@ -29,6 +29,7 @@ export declare type Props = {
     /** if the datepicker can be clear with backspace */
     isClearable?: boolean;
     /** if the datepicker's default date is today instead of placeholder text */
+    /** @deprecated This prop is being deprecated and is not used as you can manipulate date from value, will be removed in the future **/
     isDefaultNow?: boolean;
     /** Style properties for the DatePicker with a filter base */
     filterConfig?: {
@@ -47,5 +48,5 @@ export declare type ExtraOption = {
 };
 export declare type DateFormatType = 'MM/DD/YYYY' | 'DD/MM/YYYY' | 'MMMM D, YYYY' | 'dddd, MMMM D, YYYY' | 'M/D/YYYY' | 'MMM D, YYYY' | 'ddd, MMM D, YYYY' | 'DD MMM YYYY';
 export declare const extraOptions: ExtraOption[];
-declare const DatePicker: React.FC<Props & TestProps>;
-export default DatePicker;
+declare const _default: React.NamedExoticComponent<Props & TestProps>;
+export default _default;

package/dist/components/DatePicker/DatePicker.js

@@ -5,6 +5,8 @@ exports["default"] = exports.extraOptions = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _reactFastCompare = _interopRequireDefault(require("react-fast-compare"));
+
 var _ClickAwayListener = _interopRequireDefault(require("../utils/ClickAwayListener"));
 
 var _PositionInScreen = _interopRequireDefault(require("../utils/PositionInScreen"));
@@ -45,7 +47,8 @@ exports.extraOptions = extraOptions;
 var DatePicker = function DatePicker(_ref) {
   var _ref$isRangePicker = _ref.isRangePicker,
       isRangePicker = _ref$isRangePicker === void 0 ? false : _ref$isRangePicker,
-      onChange = _ref.onChange,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
       disableDates = _ref.disableDates,
       initialValue = _ref.value,
       inputProps = _ref.inputProps,
@@ -54,11 +57,9 @@ var DatePicker = function DatePicker(_ref) {
       _ref$isClearable = _ref.isClearable,
       isClearable = _ref$isClearable === void 0 ? false : _ref$isClearable,
       filterConfig = _ref.filterConfig,
-      _ref$isDefaultNow = _ref.isDefaultNow,
-      isDefaultNow = _ref$isDefaultNow === void 0 ? true : _ref$isDefaultNow,
       dataTestId = _ref.dataTestId;
   var value = (0, _react.useMemo)(function () {
-    return (0, _utils.initDates)(initialValue || {}, isDefaultNow);
+    return (0, _utils.initDates)(initialValue || {});
   }, [initialValue]);
 
   var _useState = (0, _react.useState)(false),
@@ -69,22 +70,10 @@ var DatePicker = function DatePicker(_ref) {
       selectedOption = _useState2[0],
       setSelectedOption = _useState2[1];
 
-  var _useState3 = (0, _react.useState)(function () {
-    return value;
-  }),
+  var _useState3 = (0, _react.useState)(value),
       range = _useState3[0],
       setRange = _useState3[1];
 
-  var _useState4 = (0, _react.useState)(function () {
-    return value;
-  }),
-      selectedRange = _useState4[0],
-      setSelectedRange = _useState4[1];
-
-  (0, _react.useEffect)(function () {
-    setRange(value);
-    setSelectedRange(value);
-  }, [value, isDefaultNow]);
   var handleSelectedOptions = (0, _react.useCallback)(function (option) {
     var foundOption = extraOptions.find(function (optionItem) {
       return optionItem.value === option;
@@ -103,7 +92,7 @@ var DatePicker = function DatePicker(_ref) {
     setSelectedOption(option);
   }, []);
   var applyRangeAndClose = (0, _react.useCallback)(function (oldState) {
-    var _oldState$from, _oldState$from2;
+    var _oldState$from, _oldState$from2, _newRange$from, _newRange$to;
 
     var startDate = oldState.to && (_oldState$from = oldState.from) != null && _oldState$from.isAfter(oldState.to) ? oldState.to : oldState.from;
     var endDate = oldState.to && (_oldState$from2 = oldState.from) != null && _oldState$from2.isAfter(oldState.to) ? oldState.from : oldState.to;
@@ -116,17 +105,11 @@ var DatePicker = function DatePicker(_ref) {
       setIsOpen(false);
     }
 
-    setSelectedRange(newRange);
-
-    if (onChange) {
-      onChange(newRange);
-    }
+    onChange({
+      from: (_newRange$from = newRange.from) == null ? void 0 : _newRange$from.toDate(),
+      to: (_newRange$to = newRange.to) == null ? void 0 : _newRange$to.toDate()
+    });
   }, [onChange]);
-  (0, _react.useEffect)(function () {
-    if (isRangePicker) {
-      applyRangeAndClose(range);
-    }
-  }, [applyRangeAndClose, isRangePicker, range]);
   var setRangePick = (0, _react.useCallback)(function (day) {
     var startOfDay = day.startOf('day');
     var endOfDay = day.endOf('day'); // in case is a day picker
@@ -180,7 +163,7 @@ var DatePicker = function DatePicker(_ref) {
 
     if (filterConfig != null && filterConfig.filterType) {
       setIsOpen(false);
-      return setSelectedRange({
+      return onChange({
         to: undefined,
         from: undefined
       });
@@ -193,20 +176,29 @@ var DatePicker = function DatePicker(_ref) {
 
     if (e.keyCode === 8) {
       //backspace
-      return setSelectedRange(function (oldState) {
-        if (oldState.from && oldState.to) {
-          return _extends({}, oldState, {
+      if (isRangePicker) {
+        if (value.from && value.to) {
+          setRange({
+            from: value.from,
+            to: undefined
+          });
+          return onChange({
+            from: value.from.toDate(),
             to: undefined
           });
         }
+      }
 
-        return {
-          to: undefined,
-          from: undefined
-        };
+      setRange({
+        from: undefined,
+        to: undefined
+      });
+      onChange({
+        to: undefined,
+        from: undefined
       });
     }
-  }, [isClearable, filterConfig == null ? void 0 : filterConfig.filterType]);
+  }, [isClearable, filterConfig == null ? void 0 : filterConfig.filterType, onChange, value, isRangePicker]);
   var onApply = (0, _react.useCallback)(function () {
     applyRangeAndClose(range);
   }, [applyRangeAndClose, range]);
@@ -217,7 +209,7 @@ var DatePicker = function DatePicker(_ref) {
     parent: (0, _react2.jsx)(_DatePickInput["default"], {
       filterConfig: filterConfig,
       isRangePicker: isRangePicker,
-      selectedDay: selectedRange,
+      selectedDay: value,
       inputProps: inputProps,
       dateFormatOverride: dateFormatOverride,
       handleFocus: handleFocus,
@@ -240,5 +232,6 @@ var DatePicker = function DatePicker(_ref) {
   }))));
 };
 
-var _default = DatePicker;
+var _default = /*#__PURE__*/(0, _react.memo)(DatePicker, _reactFastCompare["default"]);
+
 exports["default"] = _default;

package/dist/components/DatePicker/OverlayComponent/OverlayComponent.js

@@ -97,17 +97,19 @@ var OverlayComponent = function OverlayComponent(_ref) {
     showedArrows: isRangePicker ? 'right' : 'both',
     disabledDates: disabledDates,
     isRangePicker: isRangePicker
-  })), !isRangePicker && (0, _react2.jsx)("div", {
+  })), (0, _react2.jsx)("div", {
     css: (0, _OverlayComponent.buttonsWrapperStyle)()
   }, (0, _react2.jsx)(_Button["default"], {
     filled: false,
     size: 'sm',
     onClick: onCancel,
-    type: 'primary'
+    type: 'primary',
+    dataTestId: 'cancel'
   }, "Cancel"), (0, _react2.jsx)(_Button["default"], {
     size: 'sm',
     onClick: onApply,
     type: 'primary',
+    dataTestId: 'apply',
     disabled: Boolean(!selectedDays.from || !selectedDays.to)
   }, "Apply"))));
 };

package/dist/components/DatePicker/index.d.ts

@@ -1 +1,2 @@
 export { default } from './DatePicker';
+export * from './DatePicker';

package/dist/components/DatePicker/index.js

@@ -1,10 +1,19 @@
 "use strict";
 
 exports.__esModule = true;
+var _exportNames = {};
 exports["default"] = void 0;
 
-var _DatePicker = _interopRequireDefault(require("./DatePicker"));
+var _DatePicker = _interopRequireWildcard(require("./DatePicker"));
 
 exports["default"] = _DatePicker["default"];
+Object.keys(_DatePicker).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _DatePicker[key]) return;
+  exports[key] = _DatePicker[key];
+});
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/dist/components/DatePicker/utils.d.ts

@@ -1,8 +1,7 @@
 import dayjs from 'dayjs';
 import { Range } from './OverlayComponent/OverlayComponent';
 export declare const currentDay: dayjs.Dayjs;
-export declare const datepickerPropValue: dayjs.Dayjs | undefined;
 export declare const initDates: (value: {
     from?: Date;
     to?: Date;
-}, isDefaultNow: boolean) => Range;
+}) => Range;

package/dist/components/DatePicker/utils.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports.initDates = exports.datepickerPropValue = exports.currentDay = void 0;
+exports.initDates = exports.currentDay = void 0;
 
 var _dayjs = _interopRequireDefault(require("dayjs"));
 
@@ -15,16 +15,11 @@ var getDefaultDate = function getDefaultDate(date) {
 
 var currentDay = process.env.STORYBOOK_ENV === 'true' ? fakeDate : getDefaultDate((0, _dayjs["default"])());
 exports.currentDay = currentDay;
-var datepickerPropValue = getDefaultDate();
-exports.datepickerPropValue = datepickerPropValue;
 
-var initDates = function initDates(value, isDefaultNow) {
-  var hasDefaultDate = isDefaultNow || Object.values(value).some(function (v) {
-    return v;
-  });
+var initDates = function initDates(value) {
   return {
-    from: hasDefaultDate ? (0, _dayjs["default"])(value.from || currentDay) : undefined,
-    to: hasDefaultDate ? (0, _dayjs["default"])(value.to || currentDay) : undefined
+    from: value.from ? (0, _dayjs["default"])(value.from) : undefined,
+    to: value.to ? (0, _dayjs["default"])(value.to) : undefined
   };
 };
 

package/dist/utils/common.d.ts

@@ -1,5 +1,9 @@
 import * as React from 'react';
 import { ButtonHTMLAttributes } from 'react';
+declare type FunctionProps = {
+    children: () => React.ReactNode;
+};
+export declare const Function: ({ children }: FunctionProps) => React.ReactNode;
 /** A type to turn any type optional properties to required */
 export declare type RequiredProperties<T> = {
     [K in keyof T]-?: T[K];
@@ -15,3 +19,4 @@ export declare type FlexDirectionProperty = 'row' | 'column' | 'row-reverse' | '
 export declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
 /** URL currently used for figma version 4.5 frozen */
 export declare const FIGMA_URL = "https://www.figma.com/file/3deO7jGtkly8ij4TiIUpzY/Design-System-V4.5-(%E2%9D%84%EF%B8%8FDO-NOT-EDIT)";
+export {};

package/dist/utils/common.js

@@ -1,13 +1,16 @@
 "use strict";
 
 exports.__esModule = true;
-exports.FIGMA_URL = void 0;
+exports.FIGMA_URL = exports.Function = void 0;
 
+var Function = function Function(_ref) {
+  var children = _ref.children;
+  return children();
+};
 /** A type to turn any type optional properties to required */
 
-/** A generic type for native events */
-//@TODO fix props to not overwrite button props from base
-//@TODO fix props to not overwrite div props from base
+
+exports.Function = Function;
 
 /** URL currently used for figma version 4.5 frozen */
 var FIGMA_URL = 'https://www.figma.com/file/3deO7jGtkly8ij4TiIUpzY/Design-System-V4.5-(%E2%9D%84%EF%B8%8FDO-NOT-EDIT)';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orfium/ictinus",
-  "version": "4.70.0",
+  "version": "4.71.1",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",