@sima-land/ui-nucleons 44.2.10 → 45.0.0-alpha.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/_internal/custom-scrollbar/index.d.ts +13 -7
- package/_internal/custom-scrollbar/index.js +29 -15
- package/_internal/dropdown-loading/index.d.ts +3 -3
- package/_internal/dropdown-loading/index.js +4 -2
- package/_internal/page-scroll-lock/adapters/body-scroll-lock.d.ts +39 -0
- package/_internal/page-scroll-lock/adapters/body-scroll-lock.js +62 -0
- package/_internal/page-scroll-lock/adapters/ui-nucleons.d.ts +25 -0
- package/_internal/page-scroll-lock/adapters/ui-nucleons.js +103 -0
- package/_internal/page-scroll-lock/context.d.ts +13 -0
- package/_internal/page-scroll-lock/context.js +54 -0
- package/_internal/page-scroll-lock/hook.d.ts +12 -0
- package/_internal/page-scroll-lock/hook.js +26 -0
- package/_internal/page-scroll-lock/index.d.ts +4 -0
- package/_internal/page-scroll-lock/index.js +9 -0
- package/_internal/page-scroll-lock/types.d.ts +22 -0
- package/_internal/{checkbox/index.js → page-scroll-lock/types.js} +0 -0
- package/_internal/readme.md +2 -0
- package/_internal/utils/dropdown.d.ts +1 -0
- package/_internal/utils/dropdown.js +1 -0
- package/alert/alert.module.scss +1 -24
- package/alert/index.d.ts +11 -17
- package/alert/index.js +33 -16
- package/arrow-button/arrow-button.module.scss +2 -0
- package/arrow-button/index.d.ts +2 -2
- package/autocomplete/autocomplete.d.ts +8 -0
- package/autocomplete/autocomplete.js +190 -0
- package/autocomplete/autocomplete.module.scss +2 -15
- package/autocomplete/index.d.ts +2 -27
- package/autocomplete/index.js +2 -126
- package/autocomplete/types.d.ts +19 -0
- package/autocomplete/types.js +2 -0
- package/autocomplete-deprecated/autocomplete.module.scss +20 -0
- package/autocomplete-deprecated/index.d.ts +28 -0
- package/autocomplete-deprecated/index.js +130 -0
- package/avatar/index.d.ts +2 -2
- package/avatar/user.d.ts +1 -1
- package/base-input/base-input.d.ts +11 -0
- package/base-input/base-input.js +96 -0
- package/base-input/base-input.module.scss +3 -3
- package/base-input/index.d.ts +2 -23
- package/base-input/index.js +2 -76
- package/base-input/types.d.ts +31 -0
- package/base-input/types.js +2 -0
- package/base-input/utils.d.ts +6 -0
- package/base-input/utils.js +14 -0
- package/base-input-deprecated/base-input.module.scss +66 -0
- package/base-input-deprecated/index.d.ts +24 -0
- package/base-input-deprecated/index.js +80 -0
- package/bordered-layout/index.d.ts +1 -0
- package/bordered-layout/index.js +1 -0
- package/bottom-bar/bottom-bar-util.scss +20 -0
- package/bottom-bar/bottom-bar.d.ts +12 -0
- package/bottom-bar/bottom-bar.js +47 -0
- package/bottom-bar/bottom-bar.module.scss +14 -0
- package/bottom-bar/index.d.ts +2 -21
- package/bottom-bar/index.js +5 -44
- package/bottom-bar/types.d.ts +10 -0
- package/bottom-bar/types.js +2 -0
- package/box/index.d.ts +1 -1
- package/breakpoints.scss +1 -1
- package/button/button.module.scss +70 -53
- package/button/index.d.ts +26 -41
- package/button/index.js +22 -46
- package/card/index.d.ts +2 -1
- package/card/index.js +23 -6
- package/card/slots.d.ts +17 -3
- package/card/slots.js +15 -13
- package/carousel/draggable.d.ts +7 -3
- package/carousel/draggable.js +10 -3
- package/carousel/helpers/draggable-event.d.ts +5 -2
- package/carousel/helpers/draggable-event.js +5 -0
- package/carousel/index.d.ts +1 -1
- package/carousel/index.js +24 -24
- package/checkbox/checkbox.module.scss +1 -0
- package/checkbox/index.d.ts +3 -3
- package/checkbox-field/index.d.ts +3 -0
- package/checkbox-field/index.js +3 -0
- package/clean-buttons/clean-buttons-util.scss +15 -0
- package/clean-buttons/clean-buttons.module.scss +5 -3
- package/clean-buttons/index.d.ts +16 -7
- package/clean-buttons/index.js +17 -14
- package/clean-buttons/types.d.ts +1 -1
- package/clean-buttons/utils.d.ts +5 -1
- package/clean-buttons/utils.js +4 -0
- package/{colors.d.ts → colors/index.d.ts} +1 -1
- package/{colors.js → colors/index.js} +0 -0
- package/dot-nav/index.d.ts +1 -1
- package/dropdown/index.d.ts +1 -0
- package/dropdown/utils.d.ts +19 -0
- package/dropdown/utils.js +45 -0
- package/dropdown-item/dropdown-item.module.scss +80 -15
- package/dropdown-item/index.d.ts +20 -9
- package/dropdown-item/index.js +12 -9
- package/dropdown-item/types.d.ts +3 -0
- package/dropdown-item/types.js +2 -0
- package/dropdown-item/utils.d.ts +45 -0
- package/dropdown-item/utils.js +89 -0
- package/expandable/utils.js +3 -3
- package/field-block/field-block.module.scss +155 -0
- package/field-block/index.d.ts +63 -0
- package/field-block/index.js +43 -0
- package/field-grid/index.d.ts +5 -4
- package/field-grid/index.js +1 -0
- package/helpers/bounds-of.d.ts +5 -1
- package/helpers/bounds-of.js +5 -0
- package/helpers/center-of.d.ts +4 -1
- package/helpers/center-of.js +8 -1
- package/helpers/create-container.d.ts +5 -2
- package/helpers/create-container.js +7 -2
- package/helpers/define-slots.d.ts +3 -3
- package/helpers/define-slots.js +5 -3
- package/helpers/events.d.ts +16 -8
- package/helpers/events.js +41 -15
- package/helpers/find-child-element.d.ts +12 -9
- package/helpers/find-child-element.js +9 -5
- package/helpers/find-offset-parent.d.ts +1 -2
- package/helpers/find-offset-parent.js +2 -2
- package/helpers/find-sibling-index.d.ts +11 -8
- package/helpers/find-sibling-index.js +8 -3
- package/helpers/fit-element-height.d.ts +5 -5
- package/helpers/fit-element-height.js +9 -7
- package/helpers/format-date.d.ts +11 -11
- package/helpers/format-date.js +15 -13
- package/helpers/format-number.d.ts +1 -1
- package/helpers/format-number.js +2 -2
- package/helpers/get-date-interval-data.d.ts +4 -1
- package/helpers/get-date-interval-data.js +7 -2
- package/helpers/get-declination.d.ts +5 -1
- package/helpers/get-declination.js +5 -0
- package/helpers/get-fraction-depth.d.ts +1 -1
- package/helpers/get-fraction-depth.js +2 -2
- package/helpers/get-no-index.d.ts +2 -2
- package/helpers/get-no-index.js +4 -3
- package/helpers/get-relative-pos.d.ts +4 -1
- package/helpers/get-relative-pos.js +7 -2
- package/helpers/get-scroll-parent.d.ts +1 -2
- package/helpers/get-scroll-parent.js +5 -5
- package/helpers/is-browser.d.ts +4 -1
- package/helpers/is-browser.js +8 -1
- package/helpers/is-fully-scrolled.d.ts +3 -3
- package/helpers/is-fully-scrolled.js +2 -2
- package/helpers/is-touch-device.d.ts +1 -1
- package/helpers/is-touch-device.js +4 -5
- package/helpers/layer.d.ts +1 -1
- package/helpers/layer.js +2 -2
- package/helpers/max-index-of.d.ts +4 -1
- package/helpers/max-index-of.js +7 -2
- package/helpers/media-query-list.d.ts +1 -1
- package/helpers/media-query-list.js +2 -2
- package/helpers/on.d.ts +4 -1
- package/helpers/on.js +7 -2
- package/helpers/point.d.ts +4 -1
- package/helpers/point.js +8 -1
- package/helpers/rename.d.ts +3 -1
- package/helpers/rename.js +1 -0
- package/helpers/scroll-to-child.d.ts +1 -1
- package/helpers/scroll-to-child.js +3 -2
- package/helpers/styles.d.ts +8 -2
- package/helpers/styles.js +18 -4
- package/helpers/with-prevent.d.ts +9 -6
- package/helpers/with-prevent.js +16 -9
- package/hint/hint-view.d.ts +26 -0
- package/hint/hint-view.js +43 -0
- package/hint/hint-view.module.scss +31 -0
- package/hint/hint.d.ts +14 -0
- package/hint/hint.js +41 -0
- package/hint/index.d.ts +5 -8
- package/hint/index.js +13 -48
- package/hint/utils.d.ts +61 -0
- package/hint/utils.js +161 -0
- package/{hint → hint-deprecated}/hint.module.scss +0 -0
- package/hint-deprecated/index.d.ts +11 -0
- package/hint-deprecated/index.js +53 -0
- package/hooks/breakpoint/index.d.ts +7 -4
- package/hooks/breakpoint/index.js +21 -13
- package/hooks/breakpoint/types.d.ts +3 -4
- package/hooks/breakpoint/utils.d.ts +2 -1
- package/hooks/breakpoint/utils.js +2 -1
- package/hooks/index.d.ts +8 -8
- package/hooks/index.js +27 -19
- package/hooks/intersection/test-utils.d.ts +1 -1
- package/hooks/intersection/test-utils.js +2 -1
- package/hooks/styles.d.ts +6 -0
- package/hooks/styles.js +26 -0
- package/info-text/index.d.ts +23 -0
- package/info-text/index.js +60 -0
- package/info-text/info-text.module.scss +28 -0
- package/input/index.d.ts +32 -0
- package/input/index.js +96 -0
- package/input/input.module.scss +20 -0
- package/input/utils.d.ts +36 -0
- package/input/utils.js +71 -0
- package/layout/index.d.ts +6 -11
- package/layout/index.js +6 -60
- package/layout/layout.d.ts +10 -0
- package/layout/layout.js +32 -0
- package/layout/layout.module.scss +33 -26
- package/layout/legacy.d.ts +15 -0
- package/layout/legacy.js +68 -0
- package/layout/legacy.module.scss +49 -0
- package/layout/types.d.ts +6 -0
- package/layout/types.js +2 -0
- package/link/index.d.ts +4 -1
- package/link/index.js +2 -2
- package/link/link.module.scss +10 -0
- package/loading-overlay/index.d.ts +1 -0
- package/loading-overlay/index.js +1 -0
- package/masked-field/index.d.ts +1 -0
- package/masked-field/index.js +1 -0
- package/masked-input/hook.d.ts +8 -0
- package/masked-input/hook.js +72 -0
- package/masked-input/index.d.ts +5 -0
- package/masked-input/index.js +7 -0
- package/masked-input/masked-input.d.ts +8 -0
- package/masked-input/masked-input.js +73 -0
- package/masked-input/types.d.ts +51 -0
- package/masked-input/types.js +2 -0
- package/masked-input/utils.d.ts +15 -0
- package/masked-input/utils.js +49 -0
- package/modal/index.d.ts +10 -12
- package/modal/index.js +27 -64
- package/modal/modal.module.scss +98 -55
- package/modal/slots.d.ts +13 -10
- package/modal/slots.js +30 -28
- package/modal/utils.d.ts +8 -10
- package/modal/utils.js +2 -26
- package/modal-overlay/index.d.ts +13 -0
- package/modal-overlay/index.js +60 -0
- package/modal-overlay/modal-overlay-util.scss +1 -0
- package/modal-overlay/modal-overlay.module.scss +14 -0
- package/modal-overlay/utils.d.ts +14 -0
- package/modal-overlay/utils.js +32 -0
- package/package.json +49 -41
- package/pagination/utils.d.ts +2 -2
- package/panel/index.d.ts +27 -13
- package/panel/index.js +43 -9
- package/panel/panel.module.scss +49 -8
- package/phone-input/index.d.ts +4 -28
- package/phone-input/index.js +2 -121
- package/phone-input/phone-input.d.ts +8 -0
- package/phone-input/phone-input.js +133 -0
- package/phone-input/phone-input.module.scss +8 -32
- package/phone-input/presets.d.ts +21 -22
- package/phone-input/presets.js +1 -2
- package/phone-input/types.d.ts +6 -0
- package/phone-input/types.js +2 -0
- package/phone-input/utils.d.ts +30 -1
- package/phone-input/utils.js +52 -3
- package/phone-input-deprecated/index.d.ts +29 -0
- package/phone-input-deprecated/index.js +124 -0
- package/phone-input-deprecated/phone-input.module.scss +41 -0
- package/plate/index.d.ts +3 -3
- package/plate/index.js +2 -2
- package/plate/plate.module.scss +3 -0
- package/popup/index.d.ts +5 -0
- package/popup/index.js +12 -0
- package/popup/popup-view.d.ts +14 -0
- package/popup/popup-view.js +35 -0
- package/popup/popup-view.module.scss +40 -0
- package/popup/popup.d.ts +17 -0
- package/popup/popup.js +73 -0
- package/popup/utils.d.ts +38 -0
- package/popup/utils.js +83 -0
- package/price/index.d.ts +1 -1
- package/price/index.js +3 -3
- package/price/utils.d.ts +5 -5
- package/price/utils.js +33 -23
- package/radio-button/index.d.ts +10 -0
- package/radio-button/index.js +33 -0
- package/radio-button/radio-button.module.scss +46 -0
- package/rating/index.d.ts +2 -1
- package/rating/types.d.ts +1 -1
- package/readme.md +34 -41
- package/screen/index.d.ts +4 -2
- package/screen/index.js +34 -3
- package/screen/screen.module.scss +0 -2
- package/screen/slots.d.ts +2 -8
- package/screen/slots.js +8 -9
- package/screen/utils.d.ts +2 -1
- package/select/index.d.ts +2 -33
- package/select/index.js +3 -109
- package/select/parts/block.d.ts +8 -0
- package/select/parts/block.js +70 -0
- package/select/parts/block.module.scss +3 -0
- package/select/parts/button.d.ts +8 -0
- package/select/parts/button.js +69 -0
- package/select/parts/menu.d.ts +8 -0
- package/select/parts/menu.js +105 -0
- package/select/parts/menu.module.scss +4 -0
- package/select/select.d.ts +14 -0
- package/select/select.js +145 -0
- package/select/types.d.ts +55 -0
- package/select/types.js +2 -0
- package/select/utils.d.ts +3 -0
- package/select/utils.js +13 -0
- package/select-deprecated/index.d.ts +34 -0
- package/select-deprecated/index.js +112 -0
- package/{select → select-deprecated}/select.module.scss +0 -0
- package/shadows.scss +18 -0
- package/side-page/index.d.ts +11 -26
- package/side-page/index.js +21 -26
- package/side-page/side-page.module.scss +35 -29
- package/side-page/slots.d.ts +12 -20
- package/side-page/slots.js +16 -28
- package/spinner/index.d.ts +18 -6
- package/spinner/index.js +25 -12
- package/spinner/spinner.module.scss +8 -0
- package/stepper/index.d.ts +18 -10
- package/stepper/index.js +17 -8
- package/stepper/stepper.module.scss +14 -15
- package/styling/fonts.d.ts +3 -3
- package/switcher-row/index.d.ts +42 -0
- package/switcher-row/index.js +59 -0
- package/switcher-row/switcher-row.module.scss +55 -0
- package/text/index.d.ts +1 -1
- package/text-button/index.d.ts +42 -0
- package/text-button/index.js +46 -0
- package/text-button/text-button.module.scss +99 -0
- package/text-field/index.d.ts +7 -6
- package/text-field/index.js +3 -2
- package/textarea/index.d.ts +21 -0
- package/textarea/index.js +85 -0
- package/textarea/textarea.module.scss +15 -0
- package/toggle/index.d.ts +3 -3
- package/toggle/toggle.module.scss +17 -8
- package/tooltip/index.d.ts +1 -0
- package/tooltip/index.js +1 -0
- package/top-bar/index.d.ts +3 -40
- package/top-bar/index.js +4 -60
- package/top-bar/top-bar-util.scss +29 -0
- package/top-bar/top-bar.d.ts +9 -0
- package/top-bar/top-bar.js +101 -0
- package/top-bar/top-bar.module.scss +129 -67
- package/top-bar/types.d.ts +31 -0
- package/top-bar/types.js +2 -0
- package/top-bar/utils.d.ts +14 -0
- package/top-bar/utils.js +56 -0
- package/touch-slider/index.d.ts +1 -0
- package/touch-slider/index.js +3 -2
- package/types.d.ts +18 -0
- package/types.js +2 -0
- package/unknown-content/index.d.ts +3 -3
- package/unknown-content/index.js +3 -3
- package/unknown-content/unknown-content.module.scss +16 -12
- package/upload-area/index.d.ts +2 -0
- package/upload-area/index.js +5 -0
- package/upload-area/types.d.ts +32 -0
- package/upload-area/types.js +2 -0
- package/upload-area/upload-area-util.scss +17 -0
- package/upload-area/upload-area.d.ts +8 -0
- package/upload-area/upload-area.js +105 -0
- package/upload-area/upload-area.module.scss +78 -0
- package/{upload → upload-area}/upload.svg +0 -0
- package/upload-area/utils.d.ts +17 -0
- package/upload-area/utils.js +48 -0
- package/utils.scss +74 -1
- package/with-hint/index.d.ts +3 -2
- package/with-hint/index.js +1 -0
- package/with-hint/positioning-hint.d.ts +1 -1
- package/with-hint/positioning-hint.js +2 -2
- package/with-tooltip/index.d.ts +2 -1
- package/with-tooltip/index.js +1 -0
- package/with-tooltip/utils.d.ts +2 -2
- package/_internal/body-scroll.d.ts +0 -23
- package/_internal/body-scroll.js +0 -41
- package/_internal/checkbox/index.d.ts +0 -5
- package/constants.d.ts +0 -6
- package/constants.js +0 -9
- package/nav-bar/index.d.ts +0 -46
- package/nav-bar/index.js +0 -76
- package/nav-bar/nav-bar.module.scss +0 -95
- package/upload/area.d.ts +0 -25
- package/upload/area.js +0 -65
- package/upload/area.module.scss +0 -44
- package/upload/utils.d.ts +0 -29
- package/upload/utils.js +0 -45
package/card/slots.d.ts
CHANGED
|
@@ -7,21 +7,35 @@ export interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
7
7
|
/**
|
|
8
8
|
* Компонент слота "шапки" карточки.
|
|
9
9
|
* @param props Свойства.
|
|
10
|
+
* @deprecated Нужно использовать TopBar.
|
|
10
11
|
* @return Элемент.
|
|
11
12
|
*/
|
|
12
|
-
export declare
|
|
13
|
+
export declare function CardHeader({ children, divided }: CardHeaderProps): JSX.Element;
|
|
14
|
+
export declare namespace CardHeader {
|
|
15
|
+
var displayName: string;
|
|
16
|
+
}
|
|
17
|
+
export interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
18
|
+
scrollableRef?: React.Ref<HTMLDivElement>;
|
|
19
|
+
}
|
|
13
20
|
/**
|
|
14
21
|
* Компонент слота основного контента карточки.
|
|
15
22
|
* @param props Свойства.
|
|
16
23
|
* @return Элемент.
|
|
17
24
|
*/
|
|
18
|
-
export declare
|
|
25
|
+
export declare function CardContent({ children, className, scrollableRef, ...restProps }: CardContentProps): JSX.Element;
|
|
26
|
+
export declare namespace CardContent {
|
|
27
|
+
var displayName: string;
|
|
28
|
+
}
|
|
19
29
|
export interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
20
30
|
divided?: boolean;
|
|
21
31
|
}
|
|
22
32
|
/**
|
|
23
33
|
* Компонент слота "подвала" карточки.
|
|
24
34
|
* @param props Свойства.
|
|
35
|
+
* @deprecated Нужно использовать BottomBar.
|
|
25
36
|
* @return Элемент.
|
|
26
37
|
*/
|
|
27
|
-
export declare
|
|
38
|
+
export declare function CardFooter({ children, divided, className, ...restProps }: CardFooterProps): JSX.Element;
|
|
39
|
+
export declare namespace CardFooter {
|
|
40
|
+
var displayName: string;
|
|
41
|
+
}
|
package/card/slots.js
CHANGED
|
@@ -48,37 +48,39 @@ const utils_1 = require("./utils");
|
|
|
48
48
|
/**
|
|
49
49
|
* Компонент слота "шапки" карточки.
|
|
50
50
|
* @param props Свойства.
|
|
51
|
+
* @deprecated Нужно использовать TopBar.
|
|
51
52
|
* @return Элемент.
|
|
52
53
|
*/
|
|
53
|
-
|
|
54
|
+
function CardHeader({ children, divided }) {
|
|
54
55
|
const { rounds } = (0, react_1.useContext)(utils_1.CardContext);
|
|
55
56
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(divided && borders_1.InnerBorder.bottom) }, (0, react_1.isValidElement)(children) && children.type === top_bar_1.TopBar
|
|
56
57
|
? (0, react_1.cloneElement)(children, {
|
|
57
58
|
className: (0, classnames_1.default)(children.props.className, divided && borders_1.InnerBorder.bottom, rounds === 's' && shapes_1.SmallRounds.top, rounds === 'm' && shapes_1.MediumRounds.top),
|
|
58
59
|
})
|
|
59
60
|
: children));
|
|
60
|
-
}
|
|
61
|
+
}
|
|
61
62
|
exports.CardHeader = CardHeader;
|
|
62
|
-
|
|
63
|
+
CardHeader.displayName = 'Card.Header';
|
|
63
64
|
/**
|
|
64
65
|
* Компонент слота основного контента карточки.
|
|
65
66
|
* @param props Свойства.
|
|
66
67
|
* @return Элемент.
|
|
67
68
|
*/
|
|
68
|
-
|
|
69
|
-
var { className } = _a, restProps = __rest(_a, ["className"]);
|
|
70
|
-
return react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(card_module_scss_1.default.content, className) }));
|
|
71
|
-
}
|
|
69
|
+
function CardContent(_a) {
|
|
70
|
+
var { children, className, scrollableRef } = _a, restProps = __rest(_a, ["children", "className", "scrollableRef"]);
|
|
71
|
+
return (react_1.default.createElement("div", Object.assign({}, restProps, { ref: scrollableRef, className: (0, classnames_1.default)(card_module_scss_1.default.content, className) }), children));
|
|
72
|
+
}
|
|
72
73
|
exports.CardContent = CardContent;
|
|
73
|
-
|
|
74
|
+
CardContent.displayName = 'Card.Content';
|
|
74
75
|
/**
|
|
75
76
|
* Компонент слота "подвала" карточки.
|
|
76
77
|
* @param props Свойства.
|
|
78
|
+
* @deprecated Нужно использовать BottomBar.
|
|
77
79
|
* @return Элемент.
|
|
78
80
|
*/
|
|
79
|
-
|
|
80
|
-
var { divided, className } = _a, restProps = __rest(_a, ["divided", "className"]);
|
|
81
|
-
return (react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(className, divided && borders_1.InnerBorder.top) })));
|
|
82
|
-
}
|
|
81
|
+
function CardFooter(_a) {
|
|
82
|
+
var { children, divided, className } = _a, restProps = __rest(_a, ["children", "divided", "className"]);
|
|
83
|
+
return (react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(className, divided && borders_1.InnerBorder.top) }), children));
|
|
84
|
+
}
|
|
83
85
|
exports.CardFooter = CardFooter;
|
|
84
|
-
|
|
86
|
+
CardFooter.displayName = 'Card.Footer';
|
package/carousel/draggable.d.ts
CHANGED
|
@@ -8,11 +8,11 @@ export interface Control {
|
|
|
8
8
|
toggleTransition: typeof Draggable.prototype.toggleTransition;
|
|
9
9
|
isTransitionEnabled: () => boolean;
|
|
10
10
|
}
|
|
11
|
-
export
|
|
11
|
+
export type Delta2d = {
|
|
12
12
|
dx: number;
|
|
13
13
|
dy: number;
|
|
14
14
|
};
|
|
15
|
-
export
|
|
15
|
+
export type DraggableEventHandler = (e: DraggableEvent) => void;
|
|
16
16
|
export interface DraggableProps {
|
|
17
17
|
axis?: 'x' | 'y';
|
|
18
18
|
active?: boolean;
|
|
@@ -26,7 +26,7 @@ export interface DraggableProps {
|
|
|
26
26
|
/**
|
|
27
27
|
* Компонент области, которую можно прокручивать перетаскиванием.
|
|
28
28
|
*/
|
|
29
|
-
export
|
|
29
|
+
export declare class Draggable extends Component<DraggableProps> {
|
|
30
30
|
isGrabbed: boolean;
|
|
31
31
|
hasTransition: boolean;
|
|
32
32
|
needPreventClick: boolean;
|
|
@@ -121,3 +121,7 @@ export default class Draggable extends Component<DraggableProps> {
|
|
|
121
121
|
*/
|
|
122
122
|
render(): JSX.Element;
|
|
123
123
|
}
|
|
124
|
+
/**
|
|
125
|
+
* @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
|
|
126
|
+
*/
|
|
127
|
+
export default Draggable;
|
package/carousel/draggable.js
CHANGED
|
@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
26
26
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
27
|
};
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
+
exports.Draggable = void 0;
|
|
29
30
|
const react_1 = __importStar(require("react"));
|
|
30
31
|
const point_1 = __importDefault(require("../helpers/point"));
|
|
31
32
|
const draggable_event_1 = __importDefault(require("./helpers/draggable-event"));
|
|
@@ -126,6 +127,7 @@ class Draggable extends react_1.Component {
|
|
|
126
127
|
* @param event Событие передвижения.
|
|
127
128
|
*/
|
|
128
129
|
handleMove(event) {
|
|
130
|
+
var _a;
|
|
129
131
|
const { axis, onDragMove } = this.props;
|
|
130
132
|
if (this.isGrabbed) {
|
|
131
133
|
const { x, y } = this.currentOffset;
|
|
@@ -136,11 +138,12 @@ class Draggable extends react_1.Component {
|
|
|
136
138
|
offset: (0, point_1.default)(x, y),
|
|
137
139
|
client: (0, events_1.getEventClientPos)(event),
|
|
138
140
|
});
|
|
139
|
-
this.togglePreventClickNeed(true);
|
|
140
|
-
// prevent selection
|
|
141
141
|
if (!(0, events_1.isTouchEvent)(event)) {
|
|
142
|
+
// предотвращаем выделение текста на странице
|
|
142
143
|
event.preventDefault();
|
|
143
|
-
window.getSelection().removeAllRanges();
|
|
144
|
+
(_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
|
|
145
|
+
// предотвращаем клик только на НЕ touch-устройствах тк на них срабатывает клик при перетаскивании
|
|
146
|
+
this.togglePreventClickNeed(true);
|
|
144
147
|
}
|
|
145
148
|
onDragMove && onDragMove(customEvent);
|
|
146
149
|
if (!customEvent.prevented) {
|
|
@@ -259,4 +262,8 @@ class Draggable extends react_1.Component {
|
|
|
259
262
|
}, className: cx('draggable'), children: children })));
|
|
260
263
|
}
|
|
261
264
|
}
|
|
265
|
+
exports.Draggable = Draggable;
|
|
266
|
+
/**
|
|
267
|
+
* @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
|
|
268
|
+
*/
|
|
262
269
|
exports.default = Draggable;
|
|
@@ -6,7 +6,7 @@ interface Data {
|
|
|
6
6
|
/**
|
|
7
7
|
* Нестандартное событие перетаскивания.
|
|
8
8
|
*/
|
|
9
|
-
export
|
|
9
|
+
export declare class DraggableEvent implements Data {
|
|
10
10
|
prevented: boolean;
|
|
11
11
|
offset: IPoint;
|
|
12
12
|
client: IPoint;
|
|
@@ -22,4 +22,7 @@ export default class DraggableEvent implements Data {
|
|
|
22
22
|
*/
|
|
23
23
|
preventDefault(): void;
|
|
24
24
|
}
|
|
25
|
-
|
|
25
|
+
/**
|
|
26
|
+
* @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
|
|
27
|
+
*/
|
|
28
|
+
export default DraggableEvent;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.DraggableEvent = void 0;
|
|
3
4
|
/**
|
|
4
5
|
* Нестандартное событие перетаскивания.
|
|
5
6
|
*/
|
|
@@ -22,4 +23,8 @@ class DraggableEvent {
|
|
|
22
23
|
this.prevented = true;
|
|
23
24
|
}
|
|
24
25
|
}
|
|
26
|
+
exports.DraggableEvent = DraggableEvent;
|
|
27
|
+
/**
|
|
28
|
+
* @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
|
|
29
|
+
*/
|
|
25
30
|
exports.default = DraggableEvent;
|
package/carousel/index.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
|
|
|
2
2
|
import { Control } from './draggable';
|
|
3
3
|
import { IPoint } from '../helpers/point';
|
|
4
4
|
import { ArrowButtonProps } from '../arrow-button';
|
|
5
|
-
import DraggableEvent from './helpers/draggable-event';
|
|
5
|
+
import { DraggableEvent } from './helpers/draggable-event';
|
|
6
6
|
export interface CarouselProps {
|
|
7
7
|
/** Список элементов. */
|
|
8
8
|
items?: any[];
|
package/carousel/index.js
CHANGED
|
@@ -28,18 +28,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
exports.Carousel = void 0;
|
|
30
30
|
const react_1 = __importStar(require("react"));
|
|
31
|
-
const draggable_1 =
|
|
31
|
+
const draggable_1 = require("./draggable");
|
|
32
32
|
const lodash_1 = require("lodash");
|
|
33
33
|
const fp_1 = require("lodash/fp");
|
|
34
|
-
const bounds_of_1 =
|
|
35
|
-
const point_1 =
|
|
36
|
-
const max_index_of_1 =
|
|
37
|
-
const get_relative_pos_1 =
|
|
38
|
-
const find_child_element_1 =
|
|
34
|
+
const bounds_of_1 = require("../helpers/bounds-of");
|
|
35
|
+
const point_1 = require("../helpers/point");
|
|
36
|
+
const max_index_of_1 = require("../helpers/max-index-of");
|
|
37
|
+
const get_relative_pos_1 = require("../helpers/get-relative-pos");
|
|
38
|
+
const find_child_element_1 = require("../helpers/find-child-element");
|
|
39
39
|
const arrow_button_1 = require("../arrow-button");
|
|
40
|
+
const is_browser_1 = require("../helpers/is-browser");
|
|
40
41
|
const bind_1 = __importDefault(require("classnames/bind"));
|
|
41
42
|
const carousel_module_scss_1 = __importDefault(require("./carousel.module.scss"));
|
|
42
|
-
const is_browser_1 = __importDefault(require("../helpers/is-browser"));
|
|
43
43
|
const CLONE_FACTOR = 3;
|
|
44
44
|
const cx = bind_1.default.bind(carousel_module_scss_1.default);
|
|
45
45
|
const isAuto = (0, fp_1.eq)('auto');
|
|
@@ -57,8 +57,8 @@ class Carousel extends react_1.Component {
|
|
|
57
57
|
super(props);
|
|
58
58
|
// state & data
|
|
59
59
|
this.infinite = Boolean(infinite);
|
|
60
|
-
this.dragStartClient = (0, point_1.
|
|
61
|
-
this.dragStartOffset = (0, point_1.
|
|
60
|
+
this.dragStartClient = (0, point_1.Point)();
|
|
61
|
+
this.dragStartOffset = (0, point_1.Point)();
|
|
62
62
|
this.currentIndex = (0, lodash_1.inRange)(targetIndex, (0, lodash_1.size)(items)) ? targetIndex : 0;
|
|
63
63
|
this.state = {
|
|
64
64
|
currentOffset: 0,
|
|
@@ -116,8 +116,8 @@ class Carousel extends react_1.Component {
|
|
|
116
116
|
let checker = () => false;
|
|
117
117
|
if (viewport) {
|
|
118
118
|
checker = vertical
|
|
119
|
-
? (sibling) => (0, bounds_of_1.
|
|
120
|
-
: (sibling) => (0, bounds_of_1.
|
|
119
|
+
? (sibling) => (0, bounds_of_1.boundsOf)(sibling).top >= viewport.top
|
|
120
|
+
: (sibling) => (0, bounds_of_1.boundsOf)(sibling).left >= viewport.left;
|
|
121
121
|
}
|
|
122
122
|
return checker;
|
|
123
123
|
}
|
|
@@ -136,8 +136,8 @@ class Carousel extends react_1.Component {
|
|
|
136
136
|
let checker = () => false;
|
|
137
137
|
if (viewport) {
|
|
138
138
|
checker = vertical
|
|
139
|
-
? (sibling) => viewport.top < (0, bounds_of_1.
|
|
140
|
-
: (sibling) => viewport.left < (0, bounds_of_1.
|
|
139
|
+
? (sibling) => viewport.top < (0, bounds_of_1.boundsOf)(sibling)[verticalBoundKey]
|
|
140
|
+
: (sibling) => viewport.left < (0, bounds_of_1.boundsOf)(sibling)[horizontalBoundKey];
|
|
141
141
|
}
|
|
142
142
|
return checker;
|
|
143
143
|
}
|
|
@@ -278,7 +278,7 @@ class Carousel extends react_1.Component {
|
|
|
278
278
|
this.toggleDragTransition(true);
|
|
279
279
|
this.setCurrentIndex(newIndex < (0, lodash_1.size)((_a = this.listElement) === null || _a === void 0 ? void 0 : _a.children)
|
|
280
280
|
? newIndex
|
|
281
|
-
: (0, max_index_of_1.
|
|
281
|
+
: (0, max_index_of_1.maxIndexOf)((_b = this.listElement) === null || _b === void 0 ? void 0 : _b.children));
|
|
282
282
|
}
|
|
283
283
|
/**
|
|
284
284
|
* По возможности выполняет прокрутку карусели назад.
|
|
@@ -292,7 +292,7 @@ class Carousel extends react_1.Component {
|
|
|
292
292
|
* @param step На сколько элементов надо прокрутить карусель.
|
|
293
293
|
*/
|
|
294
294
|
moveBackwardFinite(step) {
|
|
295
|
-
const newIndex = (0, find_child_element_1.
|
|
295
|
+
const newIndex = (0, find_child_element_1.findChildIndex)({
|
|
296
296
|
target: this.listElement,
|
|
297
297
|
startIndex: this.currentIndex,
|
|
298
298
|
defaultResult: this.currentIndex,
|
|
@@ -369,7 +369,7 @@ class Carousel extends react_1.Component {
|
|
|
369
369
|
const lastItem = (_a = this.listElement) === null || _a === void 0 ? void 0 : _a.lastElementChild;
|
|
370
370
|
if (viewport && listEl && lastItem) {
|
|
371
371
|
const offsetValue = offset[vertical ? 'y' : 'x'];
|
|
372
|
-
const lastItemStartBound = (_b = (0, bounds_of_1.
|
|
372
|
+
const lastItemStartBound = (_b = (0, bounds_of_1.boundsOf)(lastItem)) === null || _b === void 0 ? void 0 : _b[vertical ? 'top' : 'left'];
|
|
373
373
|
const viewportStartBound = viewport[vertical ? 'top' : 'left'];
|
|
374
374
|
const viewportEndBound = viewport[vertical ? 'bottom' : 'right'];
|
|
375
375
|
const itemsSize = listEl[vertical ? 'scrollHeight' : 'scrollWidth'] / CLONE_FACTOR;
|
|
@@ -398,7 +398,7 @@ class Carousel extends react_1.Component {
|
|
|
398
398
|
const index = this.infinite ? (0, lodash_1.size)(items) : 0;
|
|
399
399
|
const firstNotCloneItem = this.listElement.children[index];
|
|
400
400
|
if (firstNotCloneItem) {
|
|
401
|
-
result = (0, bounds_of_1.
|
|
401
|
+
result = (0, bounds_of_1.boundsOf)(firstNotCloneItem)[vertical ? 'top' : 'left'];
|
|
402
402
|
}
|
|
403
403
|
}
|
|
404
404
|
return result;
|
|
@@ -411,10 +411,10 @@ class Carousel extends react_1.Component {
|
|
|
411
411
|
const { dragStartOffset: startOffset, dragStartClient: startClient } = this;
|
|
412
412
|
if (this.listElement && !(0, lodash_1.isEqual)(startOffset, endOffset)) {
|
|
413
413
|
const { backward } = this.defineDirection(startClient, endClient);
|
|
414
|
-
const lastIndex = (0, max_index_of_1.
|
|
414
|
+
const lastIndex = (0, max_index_of_1.maxIndexOf)(this.listElement.children);
|
|
415
415
|
const edgeIndex = backward ? 0 : lastIndex;
|
|
416
416
|
// ищем элемент, который находится ближе всего к начальной границе viewport'а
|
|
417
|
-
const newIndex = (0, find_child_element_1.
|
|
417
|
+
const newIndex = (0, find_child_element_1.findChildIndex)({
|
|
418
418
|
target: this.listElement,
|
|
419
419
|
startIndex: backward ? lastIndex : 0,
|
|
420
420
|
increment: backward ? -1 : +1,
|
|
@@ -475,7 +475,7 @@ class Carousel extends react_1.Component {
|
|
|
475
475
|
}
|
|
476
476
|
else {
|
|
477
477
|
const { vertical } = this.props;
|
|
478
|
-
const targetItemPos = (0, get_relative_pos_1.
|
|
478
|
+
const targetItemPos = (0, get_relative_pos_1.getRelativePos)(targetItemEl);
|
|
479
479
|
const viewportEndBound = vertical ? viewport.bottom : viewport.right;
|
|
480
480
|
const nextItemsEndBound = vertical
|
|
481
481
|
? viewport.top + listEl.scrollHeight - targetItemPos.y
|
|
@@ -532,8 +532,8 @@ class Carousel extends react_1.Component {
|
|
|
532
532
|
const firstChild = listEl.children[0];
|
|
533
533
|
const lastChild = listEl.children[(0, lodash_1.size)(items) - 1];
|
|
534
534
|
if (firstChild && lastChild) {
|
|
535
|
-
const startBound = (0, bounds_of_1.
|
|
536
|
-
const endBound = (0, bounds_of_1.
|
|
535
|
+
const startBound = (0, bounds_of_1.boundsOf)(firstChild)[vertical ? 'top' : 'left'];
|
|
536
|
+
const endBound = (0, bounds_of_1.boundsOf)(lastChild)[vertical ? 'bottom' : 'right'];
|
|
537
537
|
result = endBound - startBound;
|
|
538
538
|
}
|
|
539
539
|
}
|
|
@@ -553,7 +553,7 @@ class Carousel extends react_1.Component {
|
|
|
553
553
|
* @return Данные прямоугольной области видимости карусели.
|
|
554
554
|
*/
|
|
555
555
|
getViewport() {
|
|
556
|
-
return (0, is_browser_1.
|
|
556
|
+
return (0, is_browser_1.isBrowser)() ? (0, bounds_of_1.boundsOf)(this.wrapperRef.current) : null;
|
|
557
557
|
}
|
|
558
558
|
/**
|
|
559
559
|
* Сохраняет смещение карусели и позицию из события при старте захвата.
|
|
@@ -595,7 +595,7 @@ class Carousel extends react_1.Component {
|
|
|
595
595
|
}, onMouseLeave: () => {
|
|
596
596
|
autoplay && autoplayHoverPause && !this.isGrabbed() && this.toggleAutoMove(true);
|
|
597
597
|
} }),
|
|
598
|
-
react_1.default.createElement(draggable_1.
|
|
598
|
+
react_1.default.createElement(draggable_1.Draggable, { active: this.canDrag(), axis: vertical ? 'y' : 'x', transitionDuration: 320, containerProps: Object.assign(Object.assign({}, viewportElementProps), { ref: this.wrapperRef, className: cx('full-size', viewportElementProps.className) }), takeControl: this.takeDragControl, onDragStart: this.onDragStart, onDragMove: this.onDragMove, onDragEnd: this.onDragEnd, children: react_1.default.createElement("div", { className: cx(['carousel-items-container', vertical && 'vertical']), ref: this.containerRef, children: this.renderItems() }) }),
|
|
599
599
|
needShowControls && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
600
600
|
renderControl({
|
|
601
601
|
type: 'backward',
|
package/checkbox/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
export type
|
|
2
|
+
import { CheckboxInputProps } from '../types';
|
|
3
|
+
export type CheckboxProps = CheckboxInputProps;
|
|
4
4
|
/**
|
|
5
5
|
* Компонент стилизованного переключателя (input[type=checkbox]).
|
|
6
6
|
*/
|
|
7
|
-
export declare const Checkbox: React.ForwardRefExoticComponent<
|
|
7
|
+
export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -13,4 +13,7 @@ export interface CheckboxFieldProps extends React.InputHTMLAttributes<HTMLInputE
|
|
|
13
13
|
/** Идентификатор для систем автоматизированного тестирования. */
|
|
14
14
|
'data-testid'?: string;
|
|
15
15
|
}
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated Теперь можно использовать SwitcherRow.
|
|
18
|
+
*/
|
|
16
19
|
export declare const CheckboxField: React.ForwardRefExoticComponent<CheckboxFieldProps & React.RefAttributes<HTMLInputElement | null>>;
|
package/checkbox-field/index.js
CHANGED
|
@@ -44,6 +44,9 @@ const toggle_1 = require("../toggle");
|
|
|
44
44
|
const bind_1 = __importDefault(require("classnames/bind"));
|
|
45
45
|
const checkbox_field_module_scss_1 = __importDefault(require("./checkbox-field.module.scss"));
|
|
46
46
|
const cx = bind_1.default.bind(checkbox_field_module_scss_1.default);
|
|
47
|
+
/**
|
|
48
|
+
* @deprecated Теперь можно использовать SwitcherRow.
|
|
49
|
+
*/
|
|
47
50
|
exports.CheckboxField = (0, react_1.forwardRef)(function CheckboxField(_a, ref) {
|
|
48
51
|
var { smallText, fieldView = 'checkbox', label, info, failed, 'data-testid': testId = 'checkbox-field', style, className,
|
|
49
52
|
// input props
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
$size-s-height: 64px;
|
|
2
|
+
$size-m-height: 72px;
|
|
3
|
+
$size-l-height: 80px;
|
|
4
|
+
|
|
5
|
+
@mixin size-s {
|
|
6
|
+
--clean-group-height: #{$size-s-height};
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
@mixin size-m {
|
|
10
|
+
--clean-group-height: #{$size-m-height};
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@mixin size-l {
|
|
14
|
+
--clean-group-height: #{$size-l-height};
|
|
15
|
+
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
@use '../colors';
|
|
2
|
+
@use './clean-buttons-util';
|
|
2
3
|
|
|
3
4
|
.group {
|
|
4
5
|
display: flex;
|
|
@@ -27,16 +28,17 @@
|
|
|
27
28
|
font-size: 16px;
|
|
28
29
|
line-height: 24px;
|
|
29
30
|
overflow: hidden;
|
|
31
|
+
height: var(--clean-group-height);
|
|
30
32
|
}
|
|
31
33
|
|
|
32
34
|
.size-s {
|
|
33
|
-
|
|
35
|
+
@include clean-buttons-util.size-s;
|
|
34
36
|
}
|
|
35
37
|
|
|
36
38
|
.size-m {
|
|
37
|
-
|
|
39
|
+
@include clean-buttons-util.size-m;
|
|
38
40
|
}
|
|
39
41
|
|
|
40
42
|
.size-l {
|
|
41
|
-
|
|
43
|
+
@include clean-buttons-util.size-l;
|
|
42
44
|
}
|
package/clean-buttons/index.d.ts
CHANGED
|
@@ -1,24 +1,33 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
2
|
import { LinkProps } from '../link';
|
|
3
3
|
import { CleanButtonSize } from './types';
|
|
4
4
|
export interface CleanButtonProps extends LinkProps {
|
|
5
5
|
asLink?: boolean;
|
|
6
6
|
/** Размер (высота). */
|
|
7
|
-
size?: CleanButtonSize;
|
|
7
|
+
size?: CleanButtonSize | 'unset';
|
|
8
8
|
}
|
|
9
9
|
export interface CleanGroupProps {
|
|
10
10
|
/** Размер (высота). */
|
|
11
|
-
size?: CleanButtonSize;
|
|
11
|
+
size?: CleanButtonSize | 'unset';
|
|
12
12
|
/** Содержимое. */
|
|
13
|
-
children?:
|
|
13
|
+
children?: ReactNode;
|
|
14
14
|
}
|
|
15
15
|
/**
|
|
16
16
|
* Компонент группы прозрачных кнопок.
|
|
17
17
|
* @param props Свойства.
|
|
18
18
|
* @return Элемент.
|
|
19
19
|
*/
|
|
20
|
-
export declare
|
|
20
|
+
export declare function CleanGroup({ size: sizeFromProps, children }: CleanGroupProps): JSX.Element;
|
|
21
|
+
/**
|
|
22
|
+
* Компонент прозрачной кнопки.
|
|
23
|
+
* @param props Свойства.
|
|
24
|
+
* @return Элемент.
|
|
25
|
+
*/
|
|
26
|
+
export declare function CleanButton({ size, href, asLink, 'data-testid': testId, children, className, ...rest }: CleanButtonProps): JSX.Element;
|
|
27
|
+
/**
|
|
28
|
+
* @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
|
|
29
|
+
*/
|
|
21
30
|
export declare const Clean: {
|
|
22
|
-
Group:
|
|
23
|
-
Button:
|
|
31
|
+
Group: typeof CleanGroup;
|
|
32
|
+
Button: typeof CleanButton;
|
|
24
33
|
};
|
package/clean-buttons/index.js
CHANGED
|
@@ -37,35 +37,38 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
37
37
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
38
|
};
|
|
39
39
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
-
exports.Clean = exports.CleanGroup = void 0;
|
|
40
|
+
exports.Clean = exports.CleanButton = exports.CleanGroup = void 0;
|
|
41
41
|
const react_1 = __importStar(require("react"));
|
|
42
|
-
const bind_1 = __importDefault(require("classnames/bind"));
|
|
43
42
|
const link_1 = require("../link");
|
|
44
|
-
const clean_buttons_module_scss_1 = __importDefault(require("./clean-buttons.module.scss"));
|
|
45
43
|
const utils_1 = require("./utils");
|
|
44
|
+
const bind_1 = __importDefault(require("classnames/bind"));
|
|
45
|
+
const clean_buttons_module_scss_1 = __importDefault(require("./clean-buttons.module.scss"));
|
|
46
46
|
const cx = bind_1.default.bind(clean_buttons_module_scss_1.default);
|
|
47
47
|
/**
|
|
48
48
|
* Компонент группы прозрачных кнопок.
|
|
49
49
|
* @param props Свойства.
|
|
50
50
|
* @return Элемент.
|
|
51
51
|
*/
|
|
52
|
-
|
|
52
|
+
function CleanGroup({ size: sizeFromProps, children }) {
|
|
53
53
|
const sizeFromContext = (0, react_1.useContext)(utils_1.CleanGroupSizeContext);
|
|
54
54
|
// значение из пропсов имеет приоритет
|
|
55
55
|
const size = sizeFromProps || sizeFromContext;
|
|
56
|
-
return (react_1.default.createElement("div", { className: cx('group') }, react_1.Children.toArray(children).map(item => (0, react_1.isValidElement)(item) && item.type === CleanButton
|
|
57
|
-
}
|
|
56
|
+
return (react_1.default.createElement("div", { className: cx('group') }, react_1.Children.toArray(children).map(item => (0, react_1.isValidElement)(item) && item.type === CleanButton
|
|
57
|
+
? (0, react_1.cloneElement)(item, { size })
|
|
58
|
+
: null)));
|
|
59
|
+
}
|
|
58
60
|
exports.CleanGroup = CleanGroup;
|
|
59
61
|
/**
|
|
60
62
|
* Компонент прозрачной кнопки.
|
|
61
63
|
* @param props Свойства.
|
|
62
64
|
* @return Элемент.
|
|
63
65
|
*/
|
|
64
|
-
|
|
65
|
-
var { size = 's', href, asLink = Boolean(href) } = _a,
|
|
66
|
-
return (react_1.default.createElement(link_1.Link, Object.assign({
|
|
67
|
-
}
|
|
68
|
-
exports.
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
66
|
+
function CleanButton(_a) {
|
|
67
|
+
var { size = 's', href, asLink = Boolean(href), 'data-testid': testId = 'clean-button', children, className } = _a, rest = __rest(_a, ["size", "href", "asLink", 'data-testid', "children", "className"]);
|
|
68
|
+
return (react_1.default.createElement(link_1.Link, Object.assign({}, rest, { className: cx('button', `size-${size}`, className), pseudo: !asLink, href: href, "data-testid": testId }), children));
|
|
69
|
+
}
|
|
70
|
+
exports.CleanButton = CleanButton;
|
|
71
|
+
/**
|
|
72
|
+
* @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
|
|
73
|
+
*/
|
|
74
|
+
exports.Clean = { Group: CleanGroup, Button: CleanButton };
|
package/clean-buttons/types.d.ts
CHANGED
package/clean-buttons/utils.d.ts
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CleanButtonSize } from './types';
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Контекст установки размера группы прозрачных кнопок CleanGroup.
|
|
5
|
+
* Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
|
|
6
|
+
*/
|
|
7
|
+
export declare const CleanGroupSizeContext: import("react").Context<"unset" | CleanButtonSize | undefined>;
|
package/clean-buttons/utils.js
CHANGED
|
@@ -2,4 +2,8 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.CleanGroupSizeContext = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
+
/**
|
|
6
|
+
* Контекст установки размера группы прозрачных кнопок CleanGroup.
|
|
7
|
+
* Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
|
|
8
|
+
*/
|
|
5
9
|
exports.CleanGroupSizeContext = (0, react_1.createContext)(undefined);
|
|
@@ -36,6 +36,6 @@ declare const collection: {
|
|
|
36
36
|
readonly 'additional-deep-blue': "#00599d";
|
|
37
37
|
readonly 'additional-dark-blue': "#002b41";
|
|
38
38
|
};
|
|
39
|
-
export
|
|
39
|
+
export type Token = keyof typeof collection;
|
|
40
40
|
export declare const COLORS: Map<"basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue", string>;
|
|
41
41
|
export {};
|
|
File without changes
|
package/dot-nav/index.d.ts
CHANGED
package/dropdown/index.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ interface DropdownStyle extends React.CSSProperties {
|
|
|
4
4
|
'--dropdown-max-height'?: string;
|
|
5
5
|
}
|
|
6
6
|
export interface DropdownProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'style'> {
|
|
7
|
+
/** Стили. */
|
|
7
8
|
style?: DropdownStyle;
|
|
8
9
|
/** Идентификатор для систем автоматизированного тестирования. */
|
|
9
10
|
'data-testid'?: string;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { UseFloatingProps, UseFloatingReturn } from '@floating-ui/react';
|
|
2
|
+
/**
|
|
3
|
+
* Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
|
|
4
|
+
* @return Конфигурация для `useFloating` по дизайн-гайдам.
|
|
5
|
+
*/
|
|
6
|
+
export declare function dropdownFloatingConfig(): Partial<UseFloatingProps>;
|
|
7
|
+
/**
|
|
8
|
+
* Возвращает стили для элемента с учетом "слоя".
|
|
9
|
+
* @param floating Результат вызова useFloating.
|
|
10
|
+
* @return Стили для элемента с учетом "слоя".
|
|
11
|
+
*/
|
|
12
|
+
export declare function useDropdownFloatingStyle({ strategy, x, y, refs, }: Pick<UseFloatingReturn, 'strategy' | 'x' | 'y' | 'refs'>): {
|
|
13
|
+
position: import("@floating-ui/react").Strategy;
|
|
14
|
+
top: number;
|
|
15
|
+
left: number;
|
|
16
|
+
minWidth: string | undefined;
|
|
17
|
+
zIndex: number;
|
|
18
|
+
'--opener-width': string | undefined;
|
|
19
|
+
};
|