@synerise/ds-time-picker 0.8.8 → 0.8.9

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.8.9](https://github.com/Synerise/synerise-design/compare/@synerise/ds-time-picker@0.8.8...@synerise/ds-time-picker@0.8.9) (2023-10-02)
+
+**Note:** Version bump only for package @synerise/ds-time-picker
+
+
+
+
+
 ## [0.8.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-time-picker@0.8.7...@synerise/ds-time-picker@0.8.8) (2023-09-26)
 
 **Note:** Version bump only for package @synerise/ds-time-picker

package/dist/TimePicker.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { TimePickerProps } from './types/TimePicker.types';
-declare const _default: React.ForwardRefExoticComponent<Pick<TimePickerProps, "className" | "onChange" | "placeholder" | "disabled" | "value" | "trigger" | "placement" | "overlayClassName" | "use12HourClock" | "units" | "defaultOpen" | "containerStyle" | "timeFormat" | "valueFormatOptions" | "alwaysOpen" | "dropdownProps" | "inputProps" | "disabledHours" | "disabledMinutes" | "disabledSeconds" | "clearTooltip" | "raw" | "onClockModeChange"> & {
-    forwardedRef?: ((instance: any) => void) | React.RefObject<any> | null | undefined;
+declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omit<TimePickerProps, "intl"> & {
+    forwardedRef?: React.Ref<any> | undefined;
 } & React.RefAttributes<any>> & {
     WrappedComponent: React.ComponentType<TimePickerProps>;
 };

package/dist/TimePicker.js

@@ -99,12 +99,10 @@ var TimePicker = function TimePicker(_ref) {
     disabled: disabledSeconds,
     insertSeperator: is12HourClock
   }];
-  var unitsToRender = React.useMemo(function () {
-    var availableUnits = units != null && units.length ? units : defaultUnits;
-    return unitConfig.filter(function (u) {
-      return availableUnits && availableUnits.includes(u.unit);
-    });
-  }, [units, unitConfig]);
+  var availableUnits = units != null && units.length ? units : defaultUnits;
+  var unitsToRender = unitConfig.filter(function (u) {
+    return availableUnits && availableUnits.includes(u.unit);
+  });
 
   var onVisibleChange = function onVisibleChange(visible) {
     setOpen(visible);

package/dist/TimePicker.styles.d.ts

@@ -8,21 +8,9 @@ export declare const Cell: import("styled-components").StyledComponent<"button",
     active?: boolean | undefined;
 }, never>;
 export declare const ClearIcon: import("styled-components").StyledComponent<import("react").FC<import("@synerise/ds-icon").IconProps>, any, {}, never>;
-export declare const TimePickerInput: import("styled-components").StyledComponent<(import("react").ComponentClass<(object & import("@synerise/ds-input").InputProps & import("antd/lib/input").InputProps) | (object & import("@synerise/ds-input").InputProps & import("antd/lib/input").InputProps & {
-    mask: string;
-    formatCharacters?: object | undefined;
-    placeholderChar?: string | undefined;
-    value?: string | undefined;
-}) | (object & import("@synerise/ds-input").InputProps & import("antd/lib/input").TextAreaProps), any> & {
+export declare const TimePickerInput: import("styled-components").StyledComponent<import("react").ComponentType<object & import("@synerise/ds-input").EnhancedProps> & {
     displayName: string;
-}) | (import("react").FunctionComponent<(object & import("@synerise/ds-input").InputProps & import("antd/lib/input").InputProps) | (object & import("@synerise/ds-input").InputProps & import("antd/lib/input").TextAreaProps) | (object & import("@synerise/ds-input").InputProps & import("antd/lib/input").InputProps & {
-    mask: string;
-    formatCharacters?: object | undefined;
-    placeholderChar?: string | undefined;
-    value?: string | undefined;
-})> & {
-    displayName: string;
-}), any, {}, never>;
+}, any, {}, never>;
 export declare const PlaceholderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Placeholder: import("styled-components").StyledComponent<"div", any, {
     height: number;

package/dist/Unit.d.ts

@@ -1,15 +1,14 @@
-import * as React from 'react';
 import dayjs from 'dayjs';
-export declare type UnitConfig = {
+export type UnitConfig = {
     unit: dayjs.UnitType;
     options: number[];
     disabled?: number[];
     insertSeperator?: boolean;
     use12HourClock?: boolean | undefined;
 };
-export declare type UnitProps = UnitConfig & {
+export type UnitProps = UnitConfig & {
     value?: Date;
     onSelect: (value: number) => void;
 };
-declare const Unit: React.FC<UnitProps>;
+declare const Unit: ({ options, disabled, value, unit, onSelect, use12HourClock }: UnitProps) => JSX.Element;
 export default Unit;

package/dist/Unit.js

@@ -41,26 +41,36 @@ var Unit = function Unit(_ref) {
       }
     }
   }, [isFirstRender, unitContainerRef]);
-  var scrollHandler = React.useCallback(function () {
+
+  var scrollHandler = function scrollHandler() {
     if (!!unitContainerRef && !!unitContainerRef.current) {
       var pixelsScrolled = unitContainerRef.current.scrollTop;
       var isScrollBetweenTwoCells = pixelsScrolled % CELL_HEIGHT !== 0;
-      pixelsScrolled !== 0 && isScrollBetweenTwoCells && unitContainerRef.current.scrollTo({
+      pixelsScrolled !== 0 && isScrollBetweenTwoCells && typeof unitContainerRef.current.scrollTo === 'function' && unitContainerRef.current.scrollTo({
         top: Math.round(pixelsScrolled / CELL_HEIGHT) * CELL_HEIGHT,
         behavior: 'smooth'
       });
     }
-  }, [unitContainerRef]);
+  };
+
+  var debouncedScrollHandler = debounce(scrollHandler, DEBOUNCE_DELAY);
+  React.useEffect(function () {
+    return function () {
+      debouncedScrollHandler.clear();
+    };
+  }, [debouncedScrollHandler]);
   React.useEffect(function () {
     if (selectedCellRef.current && unitContainerRef.current) {
-      var _unitContainerRef$cur, _unitContainerRef$cur2;
-
       var offsetToParent = selectedCellRef.current.offsetTop - unitContainerRef.current.offsetTop;
       var scrollBehaviour = isFirstRender || !containerHeight ? 'auto' : 'smooth';
-      (unitContainerRef == null ? void 0 : (_unitContainerRef$cur = unitContainerRef.current) == null ? void 0 : (_unitContainerRef$cur2 = _unitContainerRef$cur.scrollTo) == null ? void 0 : _unitContainerRef$cur2.call) && unitContainerRef.current.scrollTo({
-        top: offsetToParent,
-        behavior: scrollBehaviour
-      });
+
+      if (typeof unitContainerRef.current.scrollTo === 'function') {
+        unitContainerRef.current.scrollTo({
+          top: offsetToParent,
+          behavior: scrollBehaviour
+        });
+      }
+
       setContainerHeight(unitContainerRef.current.offsetHeight);
     }
   }, [selectedCellRef, unitContainerRef, isFirstRender, forceUpdate, containerHeight]);
@@ -68,7 +78,7 @@ var Unit = function Unit(_ref) {
     "data-testid": "ds-time-picker-unit-" + unit
   }, /*#__PURE__*/React.createElement(Scrollbar, {
     ref: unitContainerRef,
-    onScroll: debounce(scrollHandler, DEBOUNCE_DELAY),
+    onScroll: debouncedScrollHandler,
     maxHeight: 192
   }, options.map(function (option) {
     var normalizedStringValue = option < 10 ? "0" + option : option.toString();

package/dist/types/TimePicker.types.d.ts

@@ -5,13 +5,13 @@ import { InputProps } from 'antd/es/input/Input';
 import { DropdownProps } from '@synerise/ds-dropdown/dist/Dropdown';
 import { DateToFormatOptions } from '@synerise/ds-data-format';
 import { CLOCK_MODES } from '../constants/timePicker.constants';
-export declare type ClockModes = typeof CLOCK_MODES[number];
-export declare type TimePickerDisabledUnits = {
+export type ClockModes = typeof CLOCK_MODES[number];
+export type TimePickerDisabledUnits = {
     disabledSeconds?: number[];
     disabledMinutes?: number[];
     disabledHours?: number[];
 };
-export declare type TimePickerProps = TimePickerDisabledUnits & {
+export type TimePickerProps = TimePickerDisabledUnits & {
     alwaysOpen?: boolean;
     className?: string;
     clearTooltip?: string | React.ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-time-picker",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "TimePicker UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -32,14 +32,14 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-data-format": "^0.4.2",
-    "@synerise/ds-dropdown": "^0.17.80",
-    "@synerise/ds-icon": "^0.58.2",
-    "@synerise/ds-input": "^0.19.2",
-    "@synerise/ds-scrollbar": "^0.6.7",
-    "@synerise/ds-tooltip": "^0.14.4",
-    "@synerise/ds-typography": "^0.13.0",
-    "@synerise/ds-utils": "^0.24.16",
+    "@synerise/ds-data-format": "^0.4.3",
+    "@synerise/ds-dropdown": "^0.17.81",
+    "@synerise/ds-icon": "^0.58.3",
+    "@synerise/ds-input": "^0.19.3",
+    "@synerise/ds-scrollbar": "^0.6.8",
+    "@synerise/ds-tooltip": "^0.14.5",
+    "@synerise/ds-typography": "^0.13.1",
+    "@synerise/ds-utils": "^0.24.17",
     "dayjs": "^1.8.19",
     "debounce": "^1.2.0",
     "lodash": "^4.17.19",
@@ -52,7 +52,7 @@
   },
   "devDependencies": {
     "@testing-library/react": "10.0.1",
-    "@types/debounce": "^1.2.0"
+    "@types/debounce": "^1.2.1"
   },
-  "gitHead": "f1f520c4c5ef9f90bacb5d5e0b2e778ceb8fdf79"
+  "gitHead": "1c1adf344f447e404a1d6320ad1d3f8486f29f67"
 }