@hh.ru/magritte-ui-tree-selector 3.1.1 → 4.0.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.
- package/Item.d.ts +1 -1
- package/Item.js +33 -42
- package/Item.js.map +1 -1
- package/ItemContent.js +33 -9
- package/ItemContent.js.map +1 -1
- package/ItemsList.d.ts +3 -5
- package/ItemsList.js +74 -10
- package/ItemsList.js.map +1 -1
- package/MobileDelimiter.js +1 -1
- package/MobileDelimiter.js.map +1 -1
- package/MobileItem.js +1 -1
- package/MobileItem.js.map +1 -1
- package/MobileItemsList.d.ts +2 -2
- package/MobileItemsList.js +97 -43
- package/MobileItemsList.js.map +1 -1
- package/MobileParentItem.js +1 -1
- package/MobileParentItem.js.map +1 -1
- package/TreeSelector.js +10 -5
- package/TreeSelector.js.map +1 -1
- package/TreeSelectorDummy.d.ts +1 -1
- package/TreeSelectorDummy.js +14 -10
- package/TreeSelectorDummy.js.map +1 -1
- package/TreeSelectorWrapper.d.ts +4 -0
- package/TreeSelectorWrapper.js +44 -0
- package/TreeSelectorWrapper.js.map +1 -0
- package/index.css +55 -50
- package/index.d.ts +1 -1
- package/index.js +11 -5
- package/index.js.map +1 -1
- package/index.mock.d.ts +12 -0
- package/index.mock.js +20 -0
- package/index.mock.js.map +1 -0
- package/package.json +13 -8
- package/tree-selector-item-B5TWpXFy.js +5 -0
- package/tree-selector-item-B5TWpXFy.js.map +1 -0
- package/types.d.ts +2 -0
- package/useAnimationTimeout.js +1 -1
- package/ItemContent-MYEEpcbN.js +0 -36
- package/ItemContent-MYEEpcbN.js.map +0 -1
package/index.css
CHANGED
|
@@ -4,25 +4,32 @@
|
|
|
4
4
|
--magritte-semantic-animation-ease-in-out-200-timing-function-v18-3-0:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
5
5
|
--magritte-semantic-animation-ease-in-out-200-duration-v18-3-0:200ms;
|
|
6
6
|
}
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
@keyframes magritte-fade-in___yS4Ja_4-0-0{
|
|
8
|
+
0%{
|
|
9
|
+
opacity:0;
|
|
10
|
+
}
|
|
11
|
+
100%{
|
|
12
|
+
opacity:1;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
.magritte-item-animation-timeout___pbOyZ_4-0-0{
|
|
16
|
+
animation-name:magritte-fade-in___yS4Ja_4-0-0;
|
|
17
|
+
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v18-3-0);
|
|
11
18
|
--animation-duration:0ms;
|
|
12
|
-
|
|
19
|
+
animation-duration:var(--animation-duration);
|
|
13
20
|
}
|
|
14
21
|
@media (prefers-reduced-motion: no-preference){
|
|
15
|
-
.magritte-item-animation-
|
|
22
|
+
.magritte-item-animation-timeout___pbOyZ_4-0-0{
|
|
16
23
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v18-3-0);
|
|
17
24
|
}
|
|
18
25
|
}
|
|
19
|
-
.magritte-
|
|
26
|
+
.magritte-wrapper___GHKV6_4-0-0{
|
|
20
27
|
display:flex;
|
|
21
28
|
padding:12px 0;
|
|
22
29
|
gap:12px;
|
|
23
30
|
align-items:flex-start;
|
|
24
31
|
}
|
|
25
|
-
.magritte-
|
|
32
|
+
.magritte-letter___yZOCU_4-0-0{
|
|
26
33
|
width:24px;
|
|
27
34
|
height:24px;
|
|
28
35
|
display:flex;
|
|
@@ -30,84 +37,82 @@
|
|
|
30
37
|
justify-content:center;
|
|
31
38
|
flex-shrink:0;
|
|
32
39
|
}
|
|
33
|
-
.magritte-
|
|
34
|
-
.magritte-
|
|
40
|
+
.magritte-icon___kO3Fj_4-0-0,
|
|
41
|
+
.magritte-space___xTO79_4-0-0{
|
|
35
42
|
flex-shrink:0;
|
|
36
43
|
line-height:0;
|
|
37
44
|
width:24px;
|
|
38
45
|
}
|
|
39
|
-
.magritte-
|
|
46
|
+
.magritte-icon___kO3Fj_4-0-0{
|
|
40
47
|
transform:rotate(0);
|
|
41
48
|
}
|
|
42
|
-
.magritte-
|
|
49
|
+
.magritte-iconActive___4yrG5_4-0-0{
|
|
43
50
|
cursor:pointer;
|
|
44
51
|
}
|
|
45
|
-
.magritte-
|
|
52
|
+
.magritte-iconUp___mpXV6_4-0-0{
|
|
46
53
|
transform:rotate(90deg);
|
|
47
54
|
}
|
|
48
55
|
@media (prefers-reduced-motion: no-preference){
|
|
49
|
-
.magritte-
|
|
56
|
+
.magritte-icon___kO3Fj_4-0-0{
|
|
50
57
|
transition-property:transform;
|
|
51
58
|
transition-duration:var(--magritte-semantic-animation-ease-in-out-100-duration-v18-3-0);
|
|
52
59
|
transition-timing-function:var(--magritte-semantic-animation-ease-in-out-100-timing-function-v18-3-0);
|
|
53
60
|
}
|
|
54
61
|
}
|
|
55
|
-
.magritte-
|
|
62
|
+
.magritte-content___ZRc6R_4-0-0{
|
|
56
63
|
flex-grow:1;
|
|
57
64
|
}
|
|
58
|
-
.magritte-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
margin-left:36px;
|
|
65
|
+
.magritte-mobile-item___ynALC_4-0-0{
|
|
66
|
+
display:flex;
|
|
67
|
+
gap:12px;
|
|
68
|
+
flex-wrap:wrap;
|
|
63
69
|
}
|
|
64
|
-
.magritte-
|
|
65
|
-
padding-
|
|
70
|
+
.magritte-with-gap___gbvGO_4-0-0{
|
|
71
|
+
padding-top:12px;
|
|
66
72
|
}
|
|
67
|
-
.magritte-
|
|
68
|
-
|
|
73
|
+
.magritte-virtualized-list___qt2E6_4-0-0{
|
|
74
|
+
width:100%;
|
|
75
|
+
position:relative;
|
|
76
|
+
will-change:transform;
|
|
69
77
|
}
|
|
70
|
-
.magritte-
|
|
71
|
-
|
|
78
|
+
.magritte-virtualized-item___qAYVN_4-0-0{
|
|
79
|
+
position:absolute;
|
|
80
|
+
top:0;
|
|
81
|
+
left:0;
|
|
82
|
+
width:100%;
|
|
72
83
|
}
|
|
73
|
-
.magritte-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
overflow:hidden;
|
|
84
|
+
.magritte-was-expanded___uCFbW_4-0-0{
|
|
85
|
+
animation-name:magritte-fade-in___yS4Ja_4-0-0;
|
|
86
|
+
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v18-3-0);
|
|
77
87
|
--animation-duration:0ms;
|
|
78
|
-
|
|
88
|
+
animation-duration:var(--animation-duration);
|
|
79
89
|
}
|
|
80
90
|
@media (prefers-reduced-motion: no-preference){
|
|
81
|
-
.magritte-
|
|
91
|
+
.magritte-was-expanded___uCFbW_4-0-0{
|
|
82
92
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v18-3-0);
|
|
83
93
|
}
|
|
84
94
|
}
|
|
85
|
-
.magritte-item-animation-enter___14KlM_3-1-1{
|
|
86
|
-
opacity:0;
|
|
87
|
-
}
|
|
88
|
-
.magritte-item-animation-enter-active___oEWbW_3-1-1{
|
|
89
|
-
opacity:1;
|
|
90
|
-
}
|
|
91
|
-
.magritte-item-animation-exit___a-Low_3-1-1{
|
|
92
|
-
opacity:1;
|
|
93
|
-
}
|
|
94
|
-
.magritte-item-animation-exit-active___MhBnn_3-1-1{
|
|
95
|
-
opacity:0;
|
|
96
|
-
}
|
|
97
95
|
|
|
98
96
|
:root{
|
|
99
97
|
--magritte-semantic-animation-ease-in-out-200-timing-function-v18-3-0:cubic-bezier(0.25, 0.1, 0.25, 1);
|
|
100
98
|
--magritte-semantic-animation-ease-in-out-200-duration-v18-3-0:200ms;
|
|
101
99
|
}
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
100
|
+
@keyframes magritte-fade-in___FDoho_4-0-0{
|
|
101
|
+
0%{
|
|
102
|
+
opacity:0;
|
|
103
|
+
}
|
|
104
|
+
100%{
|
|
105
|
+
opacity:1;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
.magritte-item-animation-timeout___Pdli9_4-0-0{
|
|
109
|
+
animation-name:magritte-fade-in___FDoho_4-0-0;
|
|
110
|
+
animation-timing-function:var(--magritte-semantic-animation-ease-in-out-200-timing-function-v18-3-0);
|
|
106
111
|
--animation-duration:0ms;
|
|
107
|
-
|
|
112
|
+
animation-duration:var(--animation-duration);
|
|
108
113
|
}
|
|
109
114
|
@media (prefers-reduced-motion: no-preference){
|
|
110
|
-
.magritte-item-animation-
|
|
115
|
+
.magritte-item-animation-timeout___Pdli9_4-0-0{
|
|
111
116
|
--animation-duration:var(--magritte-semantic-animation-ease-in-out-200-duration-v18-3-0);
|
|
112
117
|
}
|
|
113
118
|
}
|
package/index.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import TreeCollection from '@hh.ru/magritte-ui-tree-selector/collection/treeCollection';
|
|
2
2
|
import ImmutableSelectionStrategy from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';
|
|
3
|
+
export * from '@hh.ru/magritte-ui-theme-provider';
|
|
3
4
|
export * from '@hh.ru/magritte-ui-tree-selector/TreeSelector';
|
|
4
5
|
export * from '@hh.ru/magritte-ui-tree-selector/TreeSelectorDummy';
|
|
5
6
|
export * from '@hh.ru/magritte-ui-tree-selector/TreeSelectorItemBase';
|
|
6
7
|
export * from '@hh.ru/magritte-ui-tree-selector/types';
|
|
7
8
|
export * from '@hh.ru/magritte-ui-tree-selector/collection/types';
|
|
8
|
-
export * from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';
|
|
9
9
|
export * from '@hh.ru/magritte-ui-tree-selector/collection/treeCollectionHelper';
|
|
10
10
|
export { TreeCollection, ImmutableSelectionStrategy };
|
package/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
export { default as TreeCollection } from './collection/treeCollection.js';
|
|
3
3
|
export { default as ImmutableSelectionStrategy } from './strategy/immutableSelectionStrategy.js';
|
|
4
|
+
export * from '@hh.ru/magritte-ui-theme-provider';
|
|
4
5
|
export { TreeSelector } from './TreeSelector.js';
|
|
5
6
|
export { TreeSelectorDummy, TreeSelectorDummyComponent } from './TreeSelectorDummy.js';
|
|
6
7
|
export { TreeSelectorItemBase } from './TreeSelectorItemBase.js';
|
|
@@ -15,17 +16,17 @@ import './useDisabled.js';
|
|
|
15
16
|
import './useSelected.js';
|
|
16
17
|
import '@hh.ru/magritte-common-fuzzy-search';
|
|
17
18
|
import '@hh.ru/magritte-ui-breakpoint';
|
|
18
|
-
import '@hh.ru/magritte-ui-spacing';
|
|
19
19
|
import './ItemsList.js';
|
|
20
|
+
import '@tanstack/react-virtual';
|
|
20
21
|
import './Item.js';
|
|
21
|
-
import '
|
|
22
|
+
import './ItemContent.js';
|
|
22
23
|
import 'classnames';
|
|
23
|
-
import './ItemContent-MYEEpcbN.js';
|
|
24
24
|
import '@hh.ru/magritte-common-keyboard';
|
|
25
25
|
import '@hh.ru/magritte-ui-icon/icon';
|
|
26
26
|
import './Action.js';
|
|
27
27
|
import '@hh.ru/magritte-ui-checkbox-radio';
|
|
28
28
|
import '@hh.ru/magritte-ui-typography';
|
|
29
|
+
import './tree-selector-item-B5TWpXFy.js';
|
|
29
30
|
import './MobileItemsList.js';
|
|
30
31
|
import '@hh.ru/magritte-ui-cell';
|
|
31
32
|
import '@hh.ru/magritte-ui-checkable-card/CheckableCardElement';
|
|
@@ -33,11 +34,16 @@ import './MobileDelimiter.js';
|
|
|
33
34
|
import '@hh.ru/magritte-ui-card';
|
|
34
35
|
import './MobileItem.js';
|
|
35
36
|
import './MobileParentItem.js';
|
|
36
|
-
import './
|
|
37
|
+
import './TreeSelectorWrapper.js';
|
|
38
|
+
import '@hh.ru/magritte-common-resize';
|
|
39
|
+
import '@hh.ru/magritte-common-use-multiple-refs';
|
|
40
|
+
import '@hh.ru/magritte-internal-custom-scroll';
|
|
41
|
+
import '@hh.ru/magritte-ui-bottom-sheet';
|
|
42
|
+
import '@hh.ru/magritte-ui-modal';
|
|
37
43
|
import './useExpanded.js';
|
|
38
44
|
import './useIndeterminate.js';
|
|
39
45
|
import './useRenderInput.js';
|
|
40
46
|
import '@hh.ru/magritte-common-func-utils';
|
|
41
|
-
import '@hh.ru/magritte-common-use-multiple-refs';
|
|
42
47
|
import '@hh.ru/magritte-ui-input';
|
|
48
|
+
import './useAnimationTimeout.js';
|
|
43
49
|
//# sourceMappingURL=index.js.map
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/index.mock.d.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ForwardRefExoticComponent } from 'react';
|
|
2
|
+
import TreeCollection from '@hh.ru/magritte-ui-tree-selector/collection/treeCollection';
|
|
3
|
+
import ImmutableSelectionStrategy from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';
|
|
4
|
+
declare const ThemeProvider: any;
|
|
5
|
+
export { ThemeProvider };
|
|
6
|
+
export * from '@hh.ru/magritte-ui-tree-selector/types';
|
|
7
|
+
export * from '@hh.ru/magritte-ui-tree-selector/collection/types';
|
|
8
|
+
export * from '@hh.ru/magritte-ui-tree-selector/collection/treeCollectionHelper';
|
|
9
|
+
export { TreeCollection, ImmutableSelectionStrategy };
|
|
10
|
+
export declare const TreeSelector: ForwardRefExoticComponent<Record<string, unknown>>;
|
|
11
|
+
export declare const TreeSelectorDummy: ForwardRefExoticComponent<Record<string, unknown>>;
|
|
12
|
+
export declare const TreeSelectorItemBase: ForwardRefExoticComponent<Record<string, unknown>>;
|
package/index.mock.js
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import './index.css';
|
|
2
|
+
import { mockComponent } from '@hh.ru/magritte-ui-mock-component';
|
|
3
|
+
export { default as TreeCollection } from './collection/treeCollection.js';
|
|
4
|
+
export { default as ImmutableSelectionStrategy } from './strategy/immutableSelectionStrategy.js';
|
|
5
|
+
export { filterMissingIds, filterParents, filterUniqueLeavesOnly, filterWithParents, fromTree, getIdsWithNoParentsInSameList, walk } from './collection/treeCollectionHelper.js';
|
|
6
|
+
import './strategy/selectionStrategy.js';
|
|
7
|
+
import './strategy/createSingleValueToggler.js';
|
|
8
|
+
import './strategy/createTreeCollectionToggler.js';
|
|
9
|
+
import './strategy/dummyToggle.js';
|
|
10
|
+
|
|
11
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
12
|
+
const { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');
|
|
13
|
+
const TreeSelector = mockComponent('TreeSelector', undefined, { withChildren: true });
|
|
14
|
+
const TreeSelectorDummy = mockComponent('TreeSelectorDummy', undefined, {
|
|
15
|
+
withChildren: true,
|
|
16
|
+
});
|
|
17
|
+
const TreeSelectorItemBase = mockComponent('TreeSelectorItemBase');
|
|
18
|
+
|
|
19
|
+
export { ThemeProvider, TreeSelector, TreeSelectorDummy, TreeSelectorItemBase };
|
|
20
|
+
//# sourceMappingURL=index.mock.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mock.js","sources":["../src/index.mock.ts"],"sourcesContent":["import { ForwardRefExoticComponent } from 'react';\n\nimport { mockComponent } from '@hh.ru/magritte-ui-mock-component';\nimport TreeCollection from '@hh.ru/magritte-ui-tree-selector/collection/treeCollection';\nimport ImmutableSelectionStrategy from '@hh.ru/magritte-ui-tree-selector/strategy/immutableSelectionStrategy';\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst { ThemeProvider } = jest.requireActual('@hh.ru/magritte-ui-theme-provider/index');\n\nexport { ThemeProvider };\n\nexport * from '@hh.ru/magritte-ui-tree-selector/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/types';\nexport * from '@hh.ru/magritte-ui-tree-selector/collection/treeCollectionHelper';\nexport { TreeCollection, ImmutableSelectionStrategy };\n\nexport const TreeSelector: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelector',\n undefined,\n { withChildren: true }\n);\n\nexport const TreeSelectorDummy: ForwardRefExoticComponent<Record<string, unknown>> = mockComponent(\n 'TreeSelectorDummy',\n undefined,\n {\n withChildren: true,\n }\n);\n\nexport const TreeSelectorItemBase = mockComponent('TreeSelectorItemBase');\n"],"names":[],"mappings":";;;;;;;;;AAMA;AACM,MAAA,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,yCAAyC,EAAE;AAS3E,MAAA,YAAY,GAAuD,aAAa,CACzF,cAAc,EACd,SAAS,EACT,EAAE,YAAY,EAAE,IAAI,EAAE,EACxB;MAEW,iBAAiB,GAAuD,aAAa,CAC9F,mBAAmB,EACnB,SAAS,EACT;AACI,IAAA,YAAY,EAAE,IAAI;AACrB,CAAA,EACH;MAEW,oBAAoB,GAAG,aAAa,CAAC,sBAAsB;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-tree-selector",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -23,19 +23,24 @@
|
|
|
23
23
|
"@hh.ru/magritte-common-func-utils": "1.3.7",
|
|
24
24
|
"@hh.ru/magritte-common-fuzzy-search": "1.0.5",
|
|
25
25
|
"@hh.ru/magritte-common-keyboard": "4.0.1",
|
|
26
|
+
"@hh.ru/magritte-common-resize": "0.1.13",
|
|
26
27
|
"@hh.ru/magritte-common-use-multiple-refs": "1.1.4",
|
|
27
28
|
"@hh.ru/magritte-design-tokens": "18.3.0",
|
|
29
|
+
"@hh.ru/magritte-internal-custom-scroll": "1.2.0",
|
|
30
|
+
"@hh.ru/magritte-ui-bottom-sheet": "5.2.0",
|
|
28
31
|
"@hh.ru/magritte-ui-breakpoint": "4.0.3",
|
|
29
32
|
"@hh.ru/magritte-ui-card": "6.0.12",
|
|
30
|
-
"@hh.ru/magritte-ui-cell": "3.0.
|
|
31
|
-
"@hh.ru/magritte-ui-checkable-card": "3.0.
|
|
32
|
-
"@hh.ru/magritte-ui-checkbox-radio": "3.0.
|
|
33
|
-
"@hh.ru/magritte-ui-icon": "7.
|
|
34
|
-
"@hh.ru/magritte-ui-input": "5.1.
|
|
33
|
+
"@hh.ru/magritte-ui-cell": "3.0.12",
|
|
34
|
+
"@hh.ru/magritte-ui-checkable-card": "3.0.20",
|
|
35
|
+
"@hh.ru/magritte-ui-checkbox-radio": "3.0.9",
|
|
36
|
+
"@hh.ru/magritte-ui-icon": "7.3.0",
|
|
37
|
+
"@hh.ru/magritte-ui-input": "5.1.2",
|
|
35
38
|
"@hh.ru/magritte-ui-mock-component": "1.0.11",
|
|
39
|
+
"@hh.ru/magritte-ui-modal": "4.1.0",
|
|
36
40
|
"@hh.ru/magritte-ui-spacing": "2.0.26",
|
|
37
41
|
"@hh.ru/magritte-ui-theme-provider": "1.1.26",
|
|
38
|
-
"@hh.ru/magritte-ui-typography": "3.0.13"
|
|
42
|
+
"@hh.ru/magritte-ui-typography": "3.0.13",
|
|
43
|
+
"@tanstack/react-virtual": "3.8.3"
|
|
39
44
|
},
|
|
40
45
|
"peerDependencies": {
|
|
41
46
|
"classnames": ">=2.3.2",
|
|
@@ -45,5 +50,5 @@
|
|
|
45
50
|
"publishConfig": {
|
|
46
51
|
"access": "public"
|
|
47
52
|
},
|
|
48
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "1ff3160f13095fd3ed82ff14886f4c0b68a387a0"
|
|
49
54
|
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import './index.css';
|
|
2
|
+
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___pbOyZ_4-0-0","itemAnimationTimeout":"magritte-item-animation-timeout___pbOyZ_4-0-0","fade-in":"magritte-fade-in___yS4Ja_4-0-0","fadeIn":"magritte-fade-in___yS4Ja_4-0-0","wrapper":"magritte-wrapper___GHKV6_4-0-0","letter":"magritte-letter___yZOCU_4-0-0","icon":"magritte-icon___kO3Fj_4-0-0","space":"magritte-space___xTO79_4-0-0","iconActive":"magritte-iconActive___4yrG5_4-0-0","iconUp":"magritte-iconUp___mpXV6_4-0-0","content":"magritte-content___ZRc6R_4-0-0","mobile-item":"magritte-mobile-item___ynALC_4-0-0","mobileItem":"magritte-mobile-item___ynALC_4-0-0","with-gap":"magritte-with-gap___gbvGO_4-0-0","withGap":"magritte-with-gap___gbvGO_4-0-0","virtualized-list":"magritte-virtualized-list___qt2E6_4-0-0","virtualizedList":"magritte-virtualized-list___qt2E6_4-0-0","virtualized-item":"magritte-virtualized-item___qAYVN_4-0-0","virtualizedItem":"magritte-virtualized-item___qAYVN_4-0-0","was-expanded":"magritte-was-expanded___uCFbW_4-0-0","wasExpanded":"magritte-was-expanded___uCFbW_4-0-0"};
|
|
3
|
+
|
|
4
|
+
export { styles as s };
|
|
5
|
+
//# sourceMappingURL=tree-selector-item-B5TWpXFy.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tree-selector-item-B5TWpXFy.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
package/types.d.ts
CHANGED
|
@@ -80,6 +80,8 @@ export interface BaseTreeSelectorProps<Additional extends AdditionalDefault> {
|
|
|
80
80
|
/** Перевод для пункта выбирающего родителя в мобильном варианте
|
|
81
81
|
* В аргументах получает id модели для которой получаем перевод */
|
|
82
82
|
getSelectAllParentTrl: (id: string) => ReactNode;
|
|
83
|
+
/** Контент для отображения перед деревом */
|
|
84
|
+
renderContentBefore?: (isSearch: boolean) => ReactNode;
|
|
83
85
|
}
|
|
84
86
|
export interface DummyProps {
|
|
85
87
|
/** Обработчик изменения набора выбранных ID.
|
package/useAnimationTimeout.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { useState, useLayoutEffect } from 'react';
|
|
3
3
|
|
|
4
|
-
var styles = {"item-animation-timeout":"magritte-item-animation-
|
|
4
|
+
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___Pdli9_4-0-0","itemAnimationTimeout":"magritte-item-animation-timeout___Pdli9_4-0-0","fade-in":"magritte-fade-in___FDoho_4-0-0","fadeIn":"magritte-fade-in___FDoho_4-0-0"};
|
|
5
5
|
|
|
6
6
|
const useAnimationTimeout = () => {
|
|
7
7
|
const [animationTimeout, setAnimationTimeout] = useState(0);
|
package/ItemContent-MYEEpcbN.js
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import './index.css';
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import { memo, useCallback } from 'react';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { keyboardMatch, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
|
|
6
|
-
import { DotFilledSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
|
|
7
|
-
import { Action } from './Action.js';
|
|
8
|
-
import { TreeSelectorItemBase } from './TreeSelectorItemBase.js';
|
|
9
|
-
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
10
|
-
|
|
11
|
-
var styles = {"item-animation-timeout":"magritte-item-animation-timeout___pbOyZ_3-1-1","itemAnimationTimeout":"magritte-item-animation-timeout___pbOyZ_3-1-1","wrapper":"magritte-wrapper___GHKV6_3-1-1","letter":"magritte-letter___yZOCU_3-1-1","icon":"magritte-icon___kO3Fj_3-1-1","space":"magritte-space___xTO79_3-1-1","iconActive":"magritte-iconActive___4yrG5_3-1-1","iconUp":"magritte-iconUp___mpXV6_3-1-1","content":"magritte-content___ZRc6R_3-1-1","with-shift":"magritte-with-shift___ZErxZ_3-1-1","withShift":"magritte-with-shift___ZErxZ_3-1-1","with-indent":"magritte-with-indent___MH9Vy_3-1-1","withIndent":"magritte-with-indent___MH9Vy_3-1-1","item":"magritte-item___2LtOL_3-1-1","children":"magritte-children___kq-eq_3-1-1","with-two-boxes":"magritte-with-two-boxes___LWOy2_3-1-1","withTwoBoxes":"magritte-with-two-boxes___LWOy2_3-1-1","with-three-boxes":"magritte-with-three-boxes___cyVao_3-1-1","withThreeBoxes":"magritte-with-three-boxes___cyVao_3-1-1","item-animation-enter":"magritte-item-animation-enter___14KlM_3-1-1","itemAnimationEnter":"magritte-item-animation-enter___14KlM_3-1-1","item-animation-enter-active":"magritte-item-animation-enter-active___oEWbW_3-1-1","itemAnimationEnterActive":"magritte-item-animation-enter-active___oEWbW_3-1-1","item-animation-exit":"magritte-item-animation-exit___a-Low_3-1-1","itemAnimationExit":"magritte-item-animation-exit___a-Low_3-1-1","item-animation-exit-active":"magritte-item-animation-exit-active___MhBnn_3-1-1","itemAnimationExitActive":"magritte-item-animation-exit-active___MhBnn_3-1-1"};
|
|
12
|
-
|
|
13
|
-
const ItemContentComponent = ({ item, parentId, hasAction, hasChildren, letter, isExpanded, isDisabled, onExpansion, hasLetterOnLevel, isSelected, onChange, isIndeterminate, singleChoice, hasDot, maxControlsOnLevel, isSearch, renderItemForDesktop = TreeSelectorItemBase, }) => {
|
|
14
|
-
const handleExpandableClick = useCallback(() => onExpansion && onExpansion(item.id), [item.id, onExpansion]);
|
|
15
|
-
const currentActionCount = +hasDot + +hasAction + +hasChildren;
|
|
16
|
-
const neededSpacesCount = maxControlsOnLevel - currentActionCount;
|
|
17
|
-
const handleExpandableKeyDown = useCallback((event) => {
|
|
18
|
-
if (keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {
|
|
19
|
-
isExpanded && onExpansion(item.id);
|
|
20
|
-
event.preventDefault();
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
if (keyboardMatch(event.nativeEvent, keyboardKeys.ArrowRight)) {
|
|
24
|
-
!isExpanded && onExpansion(item.id);
|
|
25
|
-
event.preventDefault();
|
|
26
|
-
}
|
|
27
|
-
}, [isExpanded, onExpansion, item.id]);
|
|
28
|
-
const input = hasAction ? (jsx(Action, { selected: isSelected, onChange: onChange, id: item.id, onKeyDown: handleExpandableKeyDown, indeterminate: isIndeterminate, singleChoice: singleChoice, name: `tree-selector-item-${parentId || 'top'}-${item.id}` })) : undefined;
|
|
29
|
-
return (jsxs("div", { className: styles.wrapper, onClick: hasChildren && !hasAction ? handleExpandableClick : undefined, children: [(letter || hasLetterOnLevel) && (jsx("div", { className: styles.letter, children: letter && (jsx(Text, { typography: "subtitle-1-semibold", style: "secondary", Element: "span", children: letter })) })), hasDot && (jsx("div", { className: styles.icon, children: jsx(DotFilledSize24, { initial: "tertiary" }) })), [...Array(neededSpacesCount).keys()].map((_, i) => (jsx("div", { className: styles.space }, i))), hasChildren && (jsx("div", { className: classnames(styles.icon, styles.iconActive, {
|
|
30
|
-
[styles.iconUp]: isExpanded,
|
|
31
|
-
}), "data-qa": `tree-selector-chevron-${item.id}`, onClick: hasAction ? handleExpandableClick : undefined, children: jsx(ChevronRightOutlinedSize24, { initial: "tertiary" }) })), renderItemForDesktop({ disabled: isDisabled, input, item, isSearch, isParent: hasChildren })] }));
|
|
32
|
-
};
|
|
33
|
-
const ItemContent = memo(ItemContentComponent);
|
|
34
|
-
|
|
35
|
-
export { ItemContent as I, styles as s };
|
|
36
|
-
//# sourceMappingURL=ItemContent-MYEEpcbN.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ItemContent-MYEEpcbN.js","sources":["../src/ItemContent.tsx"],"sourcesContent":["import { ReactElement, useCallback, memo, KeyboardEventHandler } from 'react';\nimport classnames from 'classnames';\n\nimport { keyboardKeys, keyboardMatch } from '@hh.ru/magritte-common-keyboard';\nimport { DotFilledSize24, ChevronRightOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { Action } from '@hh.ru/magritte-ui-tree-selector/Action';\nimport { TreeSelectorItemBase } from '@hh.ru/magritte-ui-tree-selector/TreeSelectorItemBase';\nimport { AdditionalDefault, TreeModel } from '@hh.ru/magritte-ui-tree-selector/collection/types';\nimport { RenderItem } from '@hh.ru/magritte-ui-tree-selector/types';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './tree-selector-item.less';\n\ninterface ItemContent<Additional extends AdditionalDefault> {\n item: TreeModel<Additional>;\n parentId?: TreeModel<Additional>['id'];\n hasChildren: boolean;\n hasAction: boolean;\n letter?: string;\n onExpansion: (id: string) => void;\n isExpanded: boolean;\n isSelected: boolean;\n isDisabled: boolean;\n onChange: (id: string, isSelected: boolean) => void;\n isIndeterminate: boolean;\n singleChoice?: boolean;\n hasLetterOnLevel: boolean;\n hasDot: boolean;\n maxControlsOnLevel: number;\n renderItemForDesktop?: RenderItem<Additional>;\n isSearch: boolean;\n}\n\nconst ItemContentComponent = <Additional extends AdditionalDefault>({\n item,\n parentId,\n hasAction,\n hasChildren,\n letter,\n isExpanded,\n isDisabled,\n onExpansion,\n hasLetterOnLevel,\n isSelected,\n onChange,\n isIndeterminate,\n singleChoice,\n hasDot,\n maxControlsOnLevel,\n isSearch,\n renderItemForDesktop = TreeSelectorItemBase,\n}: ItemContent<Additional>): ReactElement => {\n const handleExpandableClick = useCallback(() => onExpansion && onExpansion(item.id), [item.id, onExpansion]);\n const currentActionCount = +hasDot + +hasAction + +hasChildren;\n const neededSpacesCount = maxControlsOnLevel - currentActionCount;\n\n const handleExpandableKeyDown = useCallback<KeyboardEventHandler>(\n (event) => {\n if (keyboardMatch(event.nativeEvent, keyboardKeys.ArrowLeft)) {\n isExpanded && onExpansion(item.id);\n event.preventDefault();\n return;\n }\n if (keyboardMatch(event.nativeEvent, keyboardKeys.ArrowRight)) {\n !isExpanded && onExpansion(item.id);\n event.preventDefault();\n }\n },\n [isExpanded, onExpansion, item.id]\n );\n\n const input = hasAction ? (\n <Action\n selected={isSelected}\n onChange={onChange}\n id={item.id}\n onKeyDown={handleExpandableKeyDown}\n indeterminate={isIndeterminate}\n singleChoice={singleChoice}\n name={`tree-selector-item-${parentId || 'top'}-${item.id}`}\n />\n ) : undefined;\n\n return (\n <div className={styles.wrapper} onClick={hasChildren && !hasAction ? handleExpandableClick : undefined}>\n {(letter || hasLetterOnLevel) && (\n <div className={styles.letter}>\n {letter && (\n <Text typography=\"subtitle-1-semibold\" style=\"secondary\" Element=\"span\">\n {letter}\n </Text>\n )}\n </div>\n )}\n {hasDot && (\n <div className={styles.icon}>\n <DotFilledSize24 initial=\"tertiary\" />\n </div>\n )}\n\n {[...Array(neededSpacesCount).keys()].map((_, i) => (\n <div key={i} className={styles.space} />\n ))}\n\n {hasChildren && (\n <div\n className={classnames(styles.icon, styles.iconActive, {\n [styles.iconUp]: isExpanded,\n })}\n data-qa={`tree-selector-chevron-${item.id}`}\n onClick={hasAction ? handleExpandableClick : undefined}\n >\n <ChevronRightOutlinedSize24 initial=\"tertiary\" />\n </div>\n )}\n {renderItemForDesktop({ disabled: isDisabled, input, item, isSearch, isParent: hasChildren })}\n </div>\n );\n};\n\nexport const ItemContent = memo(ItemContentComponent) as <Additional extends AdditionalDefault>(\n props: ItemContent<Additional>\n) => ReactElement;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|