@cloud-ru/ds-drawer 1.0.0 → 1.0.1-preview-fb311860.0

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 (10) hide show
  1. package/dist/cjs/components/DrawerCustom/hooks/useDrawerResize.js +2 -2
  2. package/dist/cjs/style.css +0 -93
  3. package/dist/esm/components/DrawerCustom/hooks/useDrawerResize.js +2 -2
  4. package/dist/esm/style.css +0 -93
  5. package/dist/tsconfig.cjs.tsbuildinfo +1 -1
  6. package/dist/tsconfig.esm.tsbuildinfo +1 -1
  7. package/package.json +9 -9
  8. package/src/components/DrawerCustom/hooks/useDrawerResize.tsx +9 -2
  9. package/dist/cjs/components/DrawerCustom/motion.css +0 -93
  10. package/dist/esm/components/DrawerCustom/motion.css +0 -93
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloud-ru/ds-drawer",
3
- "version": "1.0.0",
3
+ "version": "1.0.1-preview-fb311860.0",
4
4
  "description": "Пакет выезжающих панелей — компоненты Drawer и DrawerCustom с едиными токенами позиции и ширины.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -39,13 +39,13 @@
39
39
  "@rc-component/drawer": "^1.4.2",
40
40
  "classnames": "^2.5.1",
41
41
  "tabbable": "^6.5.0",
42
- "@cloud-ru/ds-materials": "^1.0.0",
43
- "@cloud-ru/ds-adaptive": "^1.0.0",
44
- "@cloud-ru/ds-bottom-sheet": "^1.0.0",
45
- "@cloud-ru/ds-scroll": "^1.0.0",
46
- "@cloud-ru/ds-tooltip": "^1.0.0",
47
- "@cloud-ru/ds-utils": "^1.0.0",
48
- "@cloud-ru/ds-popup-private": "^1.0.0",
49
- "@cloud-ru/ds-portal-context": "^1.0.0"
42
+ "@cloud-ru/ds-adaptive": "1.0.1-preview-fb311860.0",
43
+ "@cloud-ru/ds-materials": "1.0.1-preview-fb311860.0",
44
+ "@cloud-ru/ds-bottom-sheet": "1.0.1-preview-fb311860.0",
45
+ "@cloud-ru/ds-popup-private": "1.0.1-preview-fb311860.0",
46
+ "@cloud-ru/ds-portal-context": "1.0.1-preview-fb311860.0",
47
+ "@cloud-ru/ds-scroll": "1.0.1-preview-fb311860.0",
48
+ "@cloud-ru/ds-tooltip": "1.0.1-preview-fb311860.0",
49
+ "@cloud-ru/ds-utils": "1.0.1-preview-fb311860.0"
50
50
  }
51
51
  }
package/src/components/DrawerCustom/hooks/useDrawerResize.tsx CHANGED
@@ -5,7 +5,7 @@ import { useCallback, useMemo, useRef, useState } from 'react';
5
5
 
6
6
  import { DrawerCustomProps } from '../types';
7
7
 
8
- const DRAGGER_SELECTOR = '.rc-drawer-resizable-dragger';
8
+ const DRAGGER_SELECTOR = '.snack-rc-drawer-resizable-dragger';
9
9
 
10
10
  type UseDrawerResizeParams = Pick<DrawerCustomProps, 'position' | 'resizable'>;
11
11
 
@@ -39,7 +39,14 @@ export function useDrawerResize({ position, resizable: resizableProp }: UseDrawe
39
39
  }, [draggerTooltip]);
40
40
 
41
41
  const tooltip = draggerTooltip ? (
42
- <Tooltip placement={position} offset={4} tip={draggerTooltip} open={open && !muted} onOpenChange={setOpen}>
42
+ <Tooltip
43
+ placement={position}
44
+ offset={4}
45
+ hoverDelayOpen={500}
46
+ tip={draggerTooltip}
47
+ open={open && !muted}
48
+ onOpenChange={setOpen}
49
+ >
43
50
  {({ ref: targetRefCallback }) => {
44
51
  if (!targetRefCallback) return null;
45
52
 
package/dist/cjs/components/DrawerCustom/motion.css DELETED
@@ -1,93 +0,0 @@
1
- .rc-drawer.rc-drawer-open .rc-drawer-mask{
2
- opacity:unset;
3
- transition:none;
4
- }
5
-
6
- .rc-drawer .rc-drawer-mask.maskMotion{
7
- opacity:unset;
8
- }
9
- .rc-drawer .rc-drawer-mask.maskMotion-enter, .rc-drawer .rc-drawer-mask.maskMotion-appear{
10
- opacity:0;
11
- }
12
- .rc-drawer .rc-drawer-mask.maskMotion-enter-active, .rc-drawer .rc-drawer-mask.maskMotion-appear-active{
13
- opacity:1;
14
- transition:opacity 0.2s;
15
- }
16
- .rc-drawer .rc-drawer-mask.maskMotion-leave{
17
- opacity:1;
18
- }
19
- .rc-drawer .rc-drawer-mask.maskMotion-leave-active{
20
- opacity:0;
21
- transition:opacity 0.1s;
22
- }
23
- .rc-drawer .rc-drawer-content-wrapper.panelMotion{
24
- transform:unset;
25
- }
26
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave-start{
27
- transition:none !important;
28
- }
29
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear{
30
- transform:translateX(-100%);
31
- }
32
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear-active{
33
- transform:translateX(0);
34
- transition:transform 0.2s ease-in-out;
35
- }
36
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave{
37
- transform:translateX(0);
38
- }
39
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave-active{
40
- transform:translateX(-100%) !important;
41
- transition:transform 0.1s ease-out;
42
- }
43
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave-start{
44
- transition:none !important;
45
- }
46
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear{
47
- transform:translateX(100%);
48
- }
49
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear-active{
50
- transform:translateX(0);
51
- transition:transform 0.2s ease-in-out;
52
- }
53
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave{
54
- transform:translateX(0);
55
- }
56
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave-active{
57
- transform:translateX(100%) !important;
58
- transition:transform 0.1s ease-out;
59
- }
60
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave-start{
61
- transition:none !important;
62
- }
63
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear{
64
- transform:translateY(-100%);
65
- }
66
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear-active{
67
- transform:translateY(0);
68
- transition:transform 0.2s ease-in-out;
69
- }
70
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave{
71
- transform:translateY(0);
72
- }
73
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave-active{
74
- transform:translateY(-100%) !important;
75
- transition:transform 0.1s ease-out;
76
- }
77
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave-start{
78
- transition:none !important;
79
- }
80
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear{
81
- transform:translateY(100%);
82
- }
83
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear-active{
84
- transform:translateY(0);
85
- transition:transform 0.2s ease-in-out;
86
- }
87
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave{
88
- transform:translateY(0);
89
- }
90
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave-active{
91
- transform:translateY(100%) !important;
92
- transition:transform 0.1s ease-out;
93
- }
package/dist/esm/components/DrawerCustom/motion.css DELETED
@@ -1,93 +0,0 @@
1
- .rc-drawer.rc-drawer-open .rc-drawer-mask{
2
- opacity:unset;
3
- transition:none;
4
- }
5
-
6
- .rc-drawer .rc-drawer-mask.maskMotion{
7
- opacity:unset;
8
- }
9
- .rc-drawer .rc-drawer-mask.maskMotion-enter, .rc-drawer .rc-drawer-mask.maskMotion-appear{
10
- opacity:0;
11
- }
12
- .rc-drawer .rc-drawer-mask.maskMotion-enter-active, .rc-drawer .rc-drawer-mask.maskMotion-appear-active{
13
- opacity:1;
14
- transition:opacity 0.2s;
15
- }
16
- .rc-drawer .rc-drawer-mask.maskMotion-leave{
17
- opacity:1;
18
- }
19
- .rc-drawer .rc-drawer-mask.maskMotion-leave-active{
20
- opacity:0;
21
- transition:opacity 0.1s;
22
- }
23
- .rc-drawer .rc-drawer-content-wrapper.panelMotion{
24
- transform:unset;
25
- }
26
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave-start{
27
- transition:none !important;
28
- }
29
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear{
30
- transform:translateX(-100%);
31
- }
32
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-appear-active{
33
- transform:translateX(0);
34
- transition:transform 0.2s ease-in-out;
35
- }
36
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave{
37
- transform:translateX(0);
38
- }
39
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-left-leave-active{
40
- transform:translateX(-100%) !important;
41
- transition:transform 0.1s ease-out;
42
- }
43
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave-start{
44
- transition:none !important;
45
- }
46
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear{
47
- transform:translateX(100%);
48
- }
49
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-appear-active{
50
- transform:translateX(0);
51
- transition:transform 0.2s ease-in-out;
52
- }
53
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave{
54
- transform:translateX(0);
55
- }
56
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-right-leave-active{
57
- transform:translateX(100%) !important;
58
- transition:transform 0.1s ease-out;
59
- }
60
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave-start{
61
- transition:none !important;
62
- }
63
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear{
64
- transform:translateY(-100%);
65
- }
66
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-appear-active{
67
- transform:translateY(0);
68
- transition:transform 0.2s ease-in-out;
69
- }
70
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave{
71
- transform:translateY(0);
72
- }
73
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-top-leave-active{
74
- transform:translateY(-100%) !important;
75
- transition:transform 0.1s ease-out;
76
- }
77
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear-start, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave-start{
78
- transition:none !important;
79
- }
80
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear{
81
- transform:translateY(100%);
82
- }
83
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-enter-active, .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-appear-active{
84
- transform:translateY(0);
85
- transition:transform 0.2s ease-in-out;
86
- }
87
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave{
88
- transform:translateY(0);
89
- }
90
- .rc-drawer .rc-drawer-content-wrapper.panelMotion-bottom-leave-active{
91
- transform:translateY(100%) !important;
92
- transition:transform 0.1s ease-out;
93
- }