indicator-ui 0.0.341 → 0.0.343
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/dist/index.css +6 -0
- package/dist/index.css.map +1 -1
- package/dist/index.js +170 -92
- package/dist/index.js.map +1 -1
- package/dist/scss/ui/Tag/styles/properties/base.scss +4 -0
- package/dist/types/src/hooks/useSmartPlacementResolver.d.ts +62 -0
- package/dist/types/src/hooks/useSmartPosition.d.ts +11 -46
- package/package.json +1 -1
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
background-color: var(--base-white);
|
|
10
10
|
transition: background-color ease-out 300ms;
|
|
11
11
|
cursor: default;
|
|
12
|
+
flex-wrap: nowrap;
|
|
12
13
|
@include modify-flex($align-items: center);
|
|
13
14
|
|
|
14
15
|
.main {
|
|
@@ -17,6 +18,9 @@
|
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
.label {
|
|
21
|
+
text-wrap: nowrap;
|
|
22
|
+
overflow: hidden;
|
|
23
|
+
text-overflow: ellipsis;
|
|
20
24
|
@include fnt-flex($color: var(--gray-700));
|
|
21
25
|
}
|
|
22
26
|
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { RefObject } from "react";
|
|
2
|
+
type NewPlacementPosType = {
|
|
3
|
+
top: number;
|
|
4
|
+
left: number;
|
|
5
|
+
};
|
|
6
|
+
type WeightTableType = [
|
|
7
|
+
[
|
|
8
|
+
number,
|
|
9
|
+
number,
|
|
10
|
+
number
|
|
11
|
+
],
|
|
12
|
+
[
|
|
13
|
+
number,
|
|
14
|
+
0,
|
|
15
|
+
number
|
|
16
|
+
],
|
|
17
|
+
[
|
|
18
|
+
number,
|
|
19
|
+
number,
|
|
20
|
+
number
|
|
21
|
+
]
|
|
22
|
+
];
|
|
23
|
+
type PropsType = [
|
|
24
|
+
ref: RefObject<HTMLElement>,
|
|
25
|
+
options?: {
|
|
26
|
+
parentRef?: RefObject<HTMLElement>;
|
|
27
|
+
windowRef?: RefObject<HTMLElement>;
|
|
28
|
+
position?: 'absolute' | 'fixed' | 'relative';
|
|
29
|
+
offset?: number;
|
|
30
|
+
weights?: WeightTableType;
|
|
31
|
+
alignX?: 'left' | 'center' | 'right';
|
|
32
|
+
alignY?: 'top' | 'center' | 'bottom';
|
|
33
|
+
}
|
|
34
|
+
];
|
|
35
|
+
type FunReturnType = {
|
|
36
|
+
/**
|
|
37
|
+
* Просчет позиции с инициализацией (сетапит стили для объекта)
|
|
38
|
+
* */
|
|
39
|
+
init: () => NewPlacementPosType;
|
|
40
|
+
/**
|
|
41
|
+
* Просчитывает позицию для объекта
|
|
42
|
+
* */
|
|
43
|
+
calc: () => NewPlacementPosType;
|
|
44
|
+
};
|
|
45
|
+
/**
|
|
46
|
+
* Хук для умного позиционирования элемента.
|
|
47
|
+
*
|
|
48
|
+
* Позволяет определить оптимальное положение элемента,
|
|
49
|
+
* чтобы он не выходил за пределы видимой области.
|
|
50
|
+
*
|
|
51
|
+
* @param [options.parentRef=undfined] Ref на контейнер, относительно которого будет происходить позиционирование. Если не задан, то будет позиционировать относительно изначального положения.
|
|
52
|
+
* @param [options.windowRef=window] Ref на контейнер, в области видимости которого будет происходить позиционирование. По умолчанию позиционирует в главном окне (`window`).
|
|
53
|
+
* @param [options.position='fixed']
|
|
54
|
+
* @param [options.offset=4]
|
|
55
|
+
*
|
|
56
|
+
* @returns FunReturnType
|
|
57
|
+
*
|
|
58
|
+
* @example
|
|
59
|
+
* @param args
|
|
60
|
+
*/
|
|
61
|
+
export declare function useSmartPlacementResolver(...args: PropsType): FunReturnType;
|
|
62
|
+
export {};
|
|
@@ -1,54 +1,19 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
[
|
|
9
|
-
number,
|
|
10
|
-
0,
|
|
11
|
-
number
|
|
12
|
-
],
|
|
13
|
-
[
|
|
14
|
-
number,
|
|
15
|
-
number,
|
|
16
|
-
number
|
|
17
|
-
]
|
|
18
|
-
];
|
|
1
|
+
import { useSmartPlacementResolver } from "../hooks/useSmartPlacementResolver";
|
|
2
|
+
type NewPlacementPosType = {
|
|
3
|
+
top: number;
|
|
4
|
+
left: number;
|
|
5
|
+
};
|
|
6
|
+
type ChangePosCallbackType = (pos: NewPlacementPosType) => void;
|
|
7
|
+
type UseSmartPlacementResolverArgsType = Parameters<typeof useSmartPlacementResolver>;
|
|
19
8
|
type PropsType = [
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
position?: 'absolute' | 'fixed' | 'relative';
|
|
25
|
-
offset?: number;
|
|
26
|
-
weights?: WeightTableType;
|
|
27
|
-
alignX?: 'left' | 'center' | 'right';
|
|
28
|
-
alignY?: 'top' | 'center' | 'bottom';
|
|
9
|
+
...UseSmartPlacementResolverArgsType,
|
|
10
|
+
callbacks?: {
|
|
11
|
+
onInitPlacement?: ChangePosCallbackType;
|
|
12
|
+
onChangePlacement?: ChangePosCallbackType;
|
|
29
13
|
}
|
|
30
14
|
];
|
|
31
15
|
type FunReturnType = {
|
|
32
|
-
/**
|
|
33
|
-
* Вызывайте для пересчета позиции, пригодиться если поменяли рефки.
|
|
34
|
-
* */
|
|
35
16
|
recalc: () => void;
|
|
36
17
|
};
|
|
37
|
-
/**
|
|
38
|
-
* Хук для умного позиционирования элемента.
|
|
39
|
-
*
|
|
40
|
-
* Позволяет определить оптимальное положение элемента,
|
|
41
|
-
* чтобы он не выходил за пределы видимой области.
|
|
42
|
-
*
|
|
43
|
-
* @param [options.parentRef=undfined] Ref на контейнер, относительно которого будет происходить позиционирование. Если не задан, то будет позиционировать относительно изначального положения.
|
|
44
|
-
* @param [options.windowRef=window] Ref на контейнер, в области видимости которого будет происходить позиционирование. По умолчанию позиционирует в главном окне (`window`).
|
|
45
|
-
* @param [options.position='fixed']
|
|
46
|
-
* @param [options.offset=4]
|
|
47
|
-
*
|
|
48
|
-
* @returns FunReturnType
|
|
49
|
-
*
|
|
50
|
-
* @example
|
|
51
|
-
* @param args
|
|
52
|
-
*/
|
|
53
18
|
export declare function useSmartPosition(...args: PropsType): FunReturnType;
|
|
54
19
|
export {};
|