@cloud-ru/ds-calendar 1.0.12 → 1.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.d.ts +1 -1
  3. package/dist/cjs/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.js +8 -3
  4. package/dist/cjs/helperComponents/DesktopCalendarDropdown/utils.d.ts +8 -0
  5. package/dist/cjs/helperComponents/DesktopCalendarDropdown/utils.js +24 -0
  6. package/dist/esm/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.d.ts +1 -1
  7. package/dist/esm/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.js +7 -2
  8. package/dist/esm/helperComponents/DesktopCalendarDropdown/utils.d.ts +8 -0
  9. package/dist/esm/helperComponents/DesktopCalendarDropdown/utils.js +21 -0
  10. package/dist/tsconfig.cjs.tsbuildinfo +1 -1
  11. package/dist/tsconfig.esm.tsbuildinfo +1 -1
  12. package/package.json +7 -7
  13. package/src/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.tsx +10 -4
  14. package/src/helperComponents/DesktopCalendarDropdown/utils.ts +26 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloud-ru/ds-calendar",
3
- "version": "1.0.12",
3
+ "version": "1.0.13",
4
4
  "description": "Пакет календаря и выбора времени — Calendar с режимами даты, диапазона и месяца/года, TimePicker и TimePickerDropdown для времени в составе полей ввода.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -48,16 +48,16 @@
48
48
  "@tanstack/react-virtual": "^3.14.8",
49
49
  "classnames": "^2.5.1",
50
50
  "weekstart": "^2.0.0",
51
- "@cloud-ru/ds-bottom-sheet": "^1.1.1",
52
51
  "@cloud-ru/ds-adaptive": "^1.0.1",
53
- "@cloud-ru/ds-button": "^1.0.2",
52
+ "@cloud-ru/ds-bottom-sheet": "^1.1.1",
54
53
  "@cloud-ru/ds-divider": "^1.0.1",
55
- "@cloud-ru/ds-dropdown": "^1.0.8",
54
+ "@cloud-ru/ds-button": "^1.0.2",
56
55
  "@cloud-ru/ds-icons": "^1.1.0",
57
- "@cloud-ru/ds-materials": "^1.0.1",
56
+ "@cloud-ru/ds-dropdown": "^1.0.8",
57
+ "@cloud-ru/ds-list": "^2.1.2",
58
58
  "@cloud-ru/ds-locale": "^1.0.0",
59
- "@cloud-ru/ds-utils": "^1.1.0",
60
59
  "@cloud-ru/ds-scroll": "^1.0.2",
61
- "@cloud-ru/ds-list": "^2.1.1"
60
+ "@cloud-ru/ds-utils": "^1.1.0",
61
+ "@cloud-ru/ds-materials": "^1.0.1"
62
62
  }
63
63
  }
package/src/helperComponents/DesktopCalendarDropdown/DesktopCalendarDropdown.tsx CHANGED
@@ -3,11 +3,11 @@ import { useUncontrolledProp } from '@cloud-ru/ds-utils';
3
3
  import cn from 'classnames';
4
4
  import { useCallback, useMemo } from 'react';
5
5
 
6
- import { Calendar } from '../../components/Calendar';
7
- import { CalendarDropdownProps } from '../../components/CalendarDropdown/CalendarDropdown';
6
+ import { Calendar, CalendarDropdownProps } from '../../components';
8
7
  import styles from '../../components/CalendarDropdown/styles.module.scss';
9
8
  import { getTestIdBuilder } from '../../utils';
10
9
  import { Footer } from '../Footer';
10
+ import { getAlignedFallbackPlacements } from './utils';
11
11
 
12
12
  export function DesktopCalendarDropdown({
13
13
  children,
@@ -35,6 +35,10 @@ export function DesktopCalendarDropdown({
35
35
  const [open, setOpen] = useUncontrolledProp(openProp, false, onOpenChange);
36
36
 
37
37
  const getTestId = useMemo(() => getTestIdBuilder(testId), [testId]);
38
+ const resolvedFallbackPlacements = useMemo(
39
+ () => fallbackPlacements ?? getAlignedFallbackPlacements(placement),
40
+ [fallbackPlacements, placement],
41
+ );
38
42
 
39
43
  const handleFooterApply = useCallback(() => {
40
44
  onApply?.();
@@ -66,13 +70,15 @@ export function DesktopCalendarDropdown({
66
70
  triggerClickByKeys={triggerClickByKeys}
67
71
  triggerRef={triggerRef}
68
72
  outsideClick={outsideClick}
69
- fallbackPlacements={fallbackPlacements}
73
+ fallbackPlacements={resolvedFallbackPlacements}
70
74
  disableSpanWrapper={disableSpanWrapper}
71
75
  closeOnPopstate={closeOnPopstate}
72
76
  open={open}
73
77
  onOpenChange={setOpen}
74
78
  content={content}
75
- widthStrategy='gte'
79
+ // Ширина floating-узла совпадает с видимым календарём. Растягивание до ширины триггера
80
+ // создаёт прозрачную область, которая ошибочно считается внутренней для outside-click.
81
+ widthStrategy='auto'
76
82
  >
77
83
  {children}
78
84
  </Dropdown>
package/src/helperComponents/DesktopCalendarDropdown/utils.ts ADDED
@@ -0,0 +1,26 @@
1
+ import { CalendarDropdownProps } from '../../components';
2
+
3
+ type CalendarPlacement = NonNullable<CalendarDropdownProps['placement']>;
4
+
5
+ const ALIGNED_FALLBACK_PLACEMENTS = {
6
+ top: ['right', 'bottom', 'left'],
7
+ 'top-start': ['right-start', 'bottom-start', 'left-start'],
8
+ 'top-end': ['right-end', 'bottom-end', 'left-end'],
9
+ right: ['top', 'bottom', 'left'],
10
+ 'right-start': ['top-start', 'bottom-start', 'left-start'],
11
+ 'right-end': ['top-end', 'bottom-end', 'left-end'],
12
+ bottom: ['top', 'right', 'left'],
13
+ 'bottom-start': ['top-start', 'right-start', 'left-start'],
14
+ 'bottom-end': ['top-end', 'right-end', 'left-end'],
15
+ left: ['top', 'right', 'bottom'],
16
+ 'left-start': ['top-start', 'right-start', 'bottom-start'],
17
+ 'left-end': ['top-end', 'right-end', 'bottom-end'],
18
+ } satisfies Record<CalendarPlacement, CalendarPlacement[]>;
19
+
20
+ /**
21
+ * Сохраняет выравнивание `start` / `end` при смене стороны календаря, чтобы после flip он
22
+ * оставался привязан к тому же краю trigger и не смещался к центру широкого поля.
23
+ */
24
+ export function getAlignedFallbackPlacements(placement: CalendarPlacement): CalendarPlacement[] {
25
+ return ALIGNED_FALLBACK_PLACEMENTS[placement];
26
+ }