@synerise/ds-date-range-picker 0.28.7 → 0.29.0

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.29.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.28.8...@synerise/ds-date-range-picker@0.29.0) (2024-07-02)
+
+
+### Features
+
+* **date-range-picker:** swapped Menu.Item and ListItem ([38c5996](https://github.com/Synerise/synerise-design/commit/38c5996b4f0a4539a96e467b1133905dd325a160))
+
+
+
+
+
+## [0.28.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.28.7...@synerise/ds-date-range-picker@0.28.8) (2024-06-27)
+
+
+### Bug Fixes
+
+* **button-group:** remove margin from button-group ([cfb42ac](https://github.com/Synerise/synerise-design/commit/cfb42ac433aa99ef7ac4c133a74f7ed0e913b901))
+
+
+
+
+
 ## [0.28.7](https://github.com/Synerise/synerise-design/compare/@synerise/ds-date-range-picker@0.28.6...@synerise/ds-date-range-picker@0.28.7) (2024-06-21)
 
 **Note:** Version bump only for package @synerise/ds-date-range-picker

package/dist/Footer/Footer.d.ts

@@ -2,13 +2,13 @@ import React from 'react';
 declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omit<{
     mode: string;
     dateOnly?: boolean | undefined;
-    value?: import("../date.types").DateRange | undefined;
+    value?: import("..").DateRange | undefined;
     canApply?: boolean | undefined;
     canSwitchMode?: boolean | undefined;
-    onApply?: ((date?: Date | import("../date.types").DateRange | undefined) => void) | undefined;
+    onApply?: ((date?: Date | import("..").DateRange | undefined) => void) | undefined;
     onSwitchMode?: (() => void) | undefined;
     message?: React.ReactNode;
-    texts: import("../DateRangePicker.types").Texts;
+    texts: import("..").DateRangePickerTexts;
     format?: string | undefined;
     valueFormatOptions?: import("@synerise/ds-data-format").DateToFormatOptions | undefined;
     showTime?: boolean | undefined;
@@ -19,13 +19,13 @@ declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omi
     WrappedComponent: React.ComponentType<{
         mode: string;
         dateOnly?: boolean | undefined;
-        value?: import("../date.types").DateRange | undefined;
+        value?: import("..").DateRange | undefined;
         canApply?: boolean | undefined;
         canSwitchMode?: boolean | undefined;
-        onApply?: ((date?: Date | import("../date.types").DateRange | undefined) => void) | undefined;
+        onApply?: ((date?: Date | import("..").DateRange | undefined) => void) | undefined;
         onSwitchMode?: (() => void) | undefined;
         message?: React.ReactNode;
-        texts: import("../DateRangePicker.types").Texts;
+        texts: import("..").DateRangePickerTexts;
         format?: string | undefined;
         valueFormatOptions?: import("@synerise/ds-data-format").DateToFormatOptions | undefined;
         showTime?: boolean | undefined;

package/dist/RangeFilter/RangeFilter.styles.js

@@ -14,7 +14,7 @@ export var Header = styled.div.withConfig({
 export var Body = styled.div.withConfig({
   displayName: "RangeFilterstyles__Body",
   componentId: "sc-1tcjwxp-3"
-})(["padding:12px 24px;min-height:500px;.ds-button-group{& > .ant-btn-group{margin:0;}position:relative;z-index:2;}"]);
+})(["padding:12px 24px;min-height:500px;.ds-button-group{position:relative;z-index:2;}"]);
 export var MainComponentWrapper = styled.div.withConfig({
   displayName: "RangeFilterstyles__MainComponentWrapper",
   componentId: "sc-1tcjwxp-4"

package/dist/RangeFilter/Shared/FilterDropdown/FilterDropdown.styles.d.ts

@@ -1,7 +1,4 @@
 /// <reference types="react" />
-import Menu from '@synerise/ds-menu';
-import { AntdMenuProps } from '@synerise/ds-menu/dist/Menu.types';
-import { MenuItemProps } from '@synerise/ds-menu/dist/Elements/Item/MenuItem.types';
-export declare const DropdownMenu: import("styled-components").StyledComponent<typeof Menu, any, AntdMenuProps, never>;
-export declare const DropdownMenuItem: import("styled-components").StyledComponent<import("react").FC<import("@synerise/ds-menu/dist/Elements/SubMenu/SubMenu.types").SubMenuProps & MenuItemProps>, any, MenuItemProps, never>;
+export declare const DropdownMenu: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DropdownMenuItem: import("styled-components").StyledComponent<(props: import("@synerise/ds-list-item").ListItemProps) => import("react").JSX.Element, any, {}, never>;
 export declare const RemoveIconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/RangeFilter/Shared/FilterDropdown/FilterDropdown.styles.js

@@ -1,10 +1,10 @@
-import Menu from '@synerise/ds-menu';
 import styled from 'styled-components';
-export var DropdownMenu = styled(Menu).withConfig({
+import ListItem from '@synerise/ds-list-item';
+export var DropdownMenu = styled.div.withConfig({
   displayName: "FilterDropdownstyles__DropdownMenu",
   componentId: "lh8m5i-0"
 })(["padding:8px;"]);
-export var DropdownMenuItem = styled(Menu.Item).withConfig({
+export var DropdownMenuItem = styled(ListItem).withConfig({
   displayName: "FilterDropdownstyles__DropdownMenuItem",
   componentId: "lh8m5i-1"
 })(["max-height:32px;min-width:200px;"]);

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

@@ -1,6 +1,3 @@
 /// <reference types="react" />
-import { AntdMenuProps } from '@synerise/ds-menu/dist/Menu.types';
-import Menu from '@synerise/ds-menu';
-import { MenuItemProps } from '@synerise/ds-menu/dist/Elements/Item/MenuItem.types';
-export declare const ActionsMenu: import("styled-components").StyledComponent<typeof Menu, any, AntdMenuProps, never>;
-export declare const ActionItem: import("styled-components").StyledComponent<import("react").FC<import("@synerise/ds-menu/dist/Elements/SubMenu/SubMenu.types").SubMenuProps & MenuItemProps>, any, MenuItemProps, never>;
+export declare const ActionsMenu: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ActionItem: import("styled-components").StyledComponent<(props: import("@synerise/ds-list-item").ListItemProps) => import("react").JSX.Element, any, {}, never>;

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

@@ -1,10 +1,10 @@
-import Menu from '@synerise/ds-menu';
+import ListItem from '@synerise/ds-list-item';
 import styled from 'styled-components';
-export var ActionsMenu = styled(Menu).withConfig({
+export var ActionsMenu = styled.div.withConfig({
   displayName: "RangeActionsstyles__ActionsMenu",
   componentId: "sc-59f159-0"
 })(["padding:8px;"]);
-export var ActionItem = styled(Menu.Item).withConfig({
+export var ActionItem = styled(ListItem).withConfig({
   displayName: "RangeActionsstyles__ActionItem",
   componentId: "sc-59f159-1"
 })(["max-height:32px;"]);

package/dist/RelativeRangePicker/Elements/ModeDropdown/ModeDropdown.js

@@ -11,8 +11,7 @@ var MODE_TRANSLATION_KEYS = {
 };
 
 var ModeDrop = function ModeDrop(_ref) {
-  var currentRange = _ref.currentRange,
-      currentGroup = _ref.currentGroup,
+  var currentGroup = _ref.currentGroup,
       onModeChange = _ref.onModeChange,
       modes = _ref.modes,
       texts = _ref.texts;
@@ -33,9 +32,7 @@ var ModeDrop = function ModeDrop(_ref) {
     visible: dropVisible,
     ref: overlayRef,
     width: 180
-  }, /*#__PURE__*/React.createElement(S.DropMenu, {
-    selectedKeys: currentRange ? [currentRange.key] : []
-  }, modes.map(function (mode) {
+  }, /*#__PURE__*/React.createElement(S.DropMenu, null, modes.map(function (mode) {
     return /*#__PURE__*/React.createElement(S.DropMenuItem, {
       key: mode,
       onClick: function onClick() {

package/dist/RelativeRangePicker/Elements/RangeDropdown/RangeDropdown.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { RangeDropdownProps } from './RangeDropdown.types';
 import { DateRange } from '../../../date.types';
 /**

package/dist/RelativeRangePicker/Elements/RangeDropdown/RangeDropdown.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import find from 'ramda/src/find';
 import { isEqual } from 'lodash';
 import Icon, { AngleDownS, CheckS } from '@synerise/ds-icon';
@@ -7,6 +7,7 @@ import Scrollbar from '@synerise/ds-scrollbar';
 import { theme } from '@synerise/ds-core';
 import * as S from '../../RelativeRangePicker.styles';
 import { ALL_TIME } from '../../../constants';
+import { findRangeByKey } from '../../utils';
 var MAX_ITEMS_COUNT = 7;
 var ITEMS_HEIGHT = 32;
 var DROPDOWN_WIDTH = 160;
@@ -53,11 +54,9 @@ var RangeDropdown = function RangeDropdown(_ref) {
   useOnClickOutside(dropdownRef, function () {
     setDropVisible(false);
   });
-  var onMenuItemClick = React.useCallback(function (_ref2) {
-    var key = _ref2.key;
-    onChange(find(function (range) {
-      return range.key === key;
-    }, ranges));
+  var onMenuItemClick = React.useCallback(function (itemData) {
+    var range = findRangeByKey(ranges, itemData.key);
+    onChange(range);
     setDropVisible(false);
   }, [onChange, ranges]);
   if (!ranges || ranges.length === 0) return null;
@@ -79,13 +78,12 @@ var RangeDropdown = function RangeDropdown(_ref) {
       width: DROPDOWN_WIDTH - DROPDOWN_PADDING
     },
     absolute: true
-  }, /*#__PURE__*/React.createElement(S.DropMenu, {
-    onClick: onMenuItemClick,
-    selectedKeys: []
-  }, ranges.map(function (range) {
+  }, /*#__PURE__*/React.createElement(S.DropMenu, null, ranges.map(function (range) {
     var selected = (currentRange == null ? void 0 : currentRange.key) === range.key || isLifetime(currentRange) && range.key === ALL_TIME;
     return /*#__PURE__*/React.createElement(S.DropMenuItem, {
+      onClick: onMenuItemClick,
       key: range.key || range.id,
+      itemKey: range.key || range.id,
       suffixel: selected && /*#__PURE__*/React.createElement(Icon, {
         component: /*#__PURE__*/React.createElement(CheckS, null),
         color: theme.palette['green-600']

package/dist/RelativeRangePicker/RelativeRangePicker.styles.d.ts

@@ -1,5 +1,4 @@
-import * as React from 'react';
-import Menu from '@synerise/ds-menu';
+import React from 'react';
 import { Props as InputGroupProps } from '@synerise/ds-input/dist/InputGroup.types';
 export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Header: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -14,8 +13,8 @@ export declare const RangeFormColumn: import("styled-components").StyledComponen
 export declare const DatePickerWrapper: import("styled-components").StyledComponent<"div", any, {
     error: boolean;
 }, never>;
-export declare const DropMenu: import("styled-components").StyledComponent<typeof Menu, any, {}, never>;
-export declare const DropMenuItem: import("styled-components").StyledComponent<React.FC<import("@synerise/ds-menu/dist/Elements/SubMenu/SubMenu.types").SubMenuProps & import("@synerise/ds-menu").MenuItemProps>, any, {}, never>;
+export declare const DropMenu: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DropMenuItem: import("styled-components").StyledComponent<(props: import("@synerise/ds-list-item").ListItemProps) => React.JSX.Element, any, {}, never>;
 export declare const OverlayWrapper: import("styled-components").StyledComponent<"div", any, {
     visible?: boolean | undefined;
     width?: number | undefined;

package/dist/RelativeRangePicker/RelativeRangePicker.styles.js

@@ -5,10 +5,10 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+import React from 'react';
 import styled from 'styled-components';
 import Button from '@synerise/ds-button';
-import * as React from 'react';
-import Menu from '@synerise/ds-menu';
+import ListItem from '@synerise/ds-list-item';
 import { InputGroup } from '@synerise/ds-input';
 import { InputGroupItem } from '@synerise/ds-input/dist/InputGroup.styles';
 // import 'antd/lib/input/style/index.css' // this style might be in imported scopes as we use input; not needed here, but worth to mention this
@@ -80,11 +80,11 @@ export var DatePickerWrapper = styled.div.withConfig({
   displayName: "RelativeRangePickerstyles__DatePickerWrapper",
   componentId: "sc-17ul7sp-10"
 })(["width:224px;"]);
-export var DropMenu = styled(Menu).withConfig({
+export var DropMenu = styled.div.withConfig({
   displayName: "RelativeRangePickerstyles__DropMenu",
   componentId: "sc-17ul7sp-11"
 })(["padding:0 8px 0 0;"]);
-export var DropMenuItem = styled(Menu.Item).withConfig({
+export var DropMenuItem = styled(ListItem).withConfig({
   displayName: "RelativeRangePickerstyles__DropMenuItem",
   componentId: "sc-17ul7sp-12"
 })(["max-height:32px;.ds-icon{margin-right:-6px;}"]);
@@ -94,7 +94,7 @@ export var OverlayWrapper = styled.div.withConfig({
 })(["position:absolute;bottom:40px;padding:8px 0 8px 8px;background-color:", ";display:", ";z-index:15;box-shadow:0 4px 12px 0 rgba(35,41,54,0.09);", " &,& > ul{border-radius:3px;}.scrollbar-container > .ps__rail-y > .ps__thumb-y{transform:translateX(1px) !important;}"], function (props) {
   return props.theme.palette.white;
 }, function (props) {
-  return props.visible ? 'flex' : 'none';
+  return props.visible ? 'block' : 'none';
 }, function (props) {
   return !!props.width && "width:" + props.width + "px;";
 });

package/dist/RelativeRangePicker/utils/findRangeByKey.utils.d.ts

@@ -0,0 +1,2 @@
+import { DateRange } from '../../date.types';
+export declare const findRangeByKey: (ranges: DateRange[], key: string) => DateRange | undefined;

package/dist/RelativeRangePicker/utils/findRangeByKey.utils.js

@@ -0,0 +1,5 @@
+export var findRangeByKey = function findRangeByKey(ranges, key) {
+  return ranges.find(function (range) {
+    return range.key === key;
+  });
+};

package/dist/RelativeRangePicker/utils/index.d.ts

@@ -6,3 +6,4 @@ export { setOffsetValue } from './setOffsetValue.utils';
 export { getDefaultCustomRange } from './getDefaultCustomRange.utils';
 export { getCurrentGroupFromProps } from './getCurrentGroupFromProps.utils';
 export { isAbsolute } from './isAbsolute.utils';
+export { findRangeByKey } from './findRangeByKey.utils';

package/dist/RelativeRangePicker/utils/index.js

@@ -5,4 +5,5 @@ export { setDurationValue } from './setDurationValue.utils';
 export { setOffsetValue } from './setOffsetValue.utils';
 export { getDefaultCustomRange } from './getDefaultCustomRange.utils';
 export { getCurrentGroupFromProps } from './getCurrentGroupFromProps.utils';
-export { isAbsolute } from './isAbsolute.utils';
+export { isAbsolute } from './isAbsolute.utils';
+export { findRangeByKey } from './findRangeByKey.utils';

package/dist/index.d.ts

@@ -8,3 +8,6 @@ export { default } from './DateRangePicker';
 export { fnsFormat } from './fns';
 export type { WeeklyProps, WeeklyScheduleDayValue, WeeklySchedule, DayOfWeekIndex, } from './RangeFilter/Filters/new/Weekly/Weekly.types';
 export { getDisabledTimeOptions } from './RangePicker/utils';
+export type { AbsoluteDateRange, RelativeDateRange, DateRange, DateRangePreset, RelativeDateRangePreset, AbsoluteDateRangePreset, } from './date.types';
+export type { DateRangePickerProps, Texts as DateRangePickerTexts } from './DateRangePicker.types';
+export { DEFAULT_RANGE_END, DEFAULT_RANGE_START } from './RangeFilter/constants';

package/dist/index.js

@@ -8,4 +8,5 @@ import * as _CONST from './constants';
 export { _CONST as CONST };
 export { default } from './DateRangePicker';
 export { fnsFormat } from './fns';
-export { getDisabledTimeOptions } from './RangePicker/utils';
+export { getDisabledTimeOptions } from './RangePicker/utils';
+export { DEFAULT_RANGE_END, DEFAULT_RANGE_START } from './RangeFilter/constants';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-date-range-picker",
-  "version": "0.28.7",
+  "version": "0.29.0",
   "description": "Date-Range-Picker UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -35,23 +35,23 @@
   "dependencies": {
     "@date-fns/upgrade": "^1.0.3",
     "@synerise/ds-badge": "^0.7.1",
-    "@synerise/ds-button": "^0.21.0",
-    "@synerise/ds-button-group": "^0.7.2",
+    "@synerise/ds-button": "^0.21.1",
+    "@synerise/ds-button-group": "^0.7.3",
     "@synerise/ds-data-format": "^0.5.0",
-    "@synerise/ds-date-picker": "^0.11.3",
-    "@synerise/ds-dropdown": "^0.18.1",
-    "@synerise/ds-icon": "^0.62.1",
-    "@synerise/ds-inline-edit": "^0.7.11",
-    "@synerise/ds-input": "^0.22.0",
-    "@synerise/ds-input-number": "^0.9.20",
-    "@synerise/ds-manageable-list": "^0.26.56",
-    "@synerise/ds-menu": "^0.19.2",
-    "@synerise/ds-scrollbar": "^0.11.1",
-    "@synerise/ds-select": "^0.16.3",
-    "@synerise/ds-slider": "^0.13.28",
-    "@synerise/ds-tags": "^0.9.1",
-    "@synerise/ds-time-picker": "^0.10.11",
-    "@synerise/ds-tooltip": "^0.14.30",
+    "@synerise/ds-date-picker": "^0.11.5",
+    "@synerise/ds-dropdown": "^0.18.3",
+    "@synerise/ds-icon": "^0.63.0",
+    "@synerise/ds-inline-edit": "^0.7.13",
+    "@synerise/ds-input": "^0.23.0",
+    "@synerise/ds-input-number": "^0.9.22",
+    "@synerise/ds-list-item": "^0.3.0",
+    "@synerise/ds-manageable-list": "^0.26.58",
+    "@synerise/ds-scrollbar": "^0.11.2",
+    "@synerise/ds-select": "^0.16.5",
+    "@synerise/ds-slider": "^0.13.29",
+    "@synerise/ds-tags": "^0.9.3",
+    "@synerise/ds-time-picker": "^0.10.13",
+    "@synerise/ds-tooltip": "^0.14.31",
     "@synerise/ds-utils": "^0.27.0",
     "date-fns": "^2.16.1",
     "date-fns-tz": "1.1.4",
@@ -74,5 +74,5 @@
     "@testing-library/user-event": "^10.3.1",
     "@types/ramda": "^0.28.23"
   },
-  "gitHead": "ef835e848d4f02cca258130baa6c9f44dfa15dd0"
+  "gitHead": "0692552b018dc9c8042f18c773f88890c9ad3270"
 }