@sima-land/ui-nucleons 44.2.10 → 45.0.0-alpha.1
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/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 +34 -3
- 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} +2 -2
- package/{colors.js → colors/index.js} +2 -1
- package/colors.scss +2 -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 +47 -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 +32 -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-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-util.scss +37 -0
- package/link/link.module.scss +19 -12
- 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 +56 -65
- 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 +7 -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/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 +59 -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 +96 -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-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/_internal/{checkbox/index.js → page-scroll-lock/types.js} +0 -0
- /package/{hint → hint-deprecated}/hint.module.scss +0 -0
- /package/{select → select-deprecated}/select.module.scss +0 -0
- /package/{upload → upload-area}/upload.svg +0 -0
package/with-hint/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { HintProps } from '../hint';
|
|
3
|
-
|
|
2
|
+
import { HintProps } from '../hint-deprecated';
|
|
3
|
+
type ChildrenFn = (ref: React.RefObject<Element>, toggle: (opened: boolean) => void) => React.ReactNode;
|
|
4
4
|
export interface WithHintProps {
|
|
5
5
|
/** Содержимое хинта. */
|
|
6
6
|
hint: React.ReactNode;
|
|
@@ -15,6 +15,7 @@ export interface WithHintProps {
|
|
|
15
15
|
}
|
|
16
16
|
/**
|
|
17
17
|
* Компонент вывода "хинта" рядом с заданным элементом.
|
|
18
|
+
* @deprecated Следует использовать `hint`.
|
|
18
19
|
* @param props Свойства.
|
|
19
20
|
* @return Элемент.
|
|
20
21
|
*/
|
package/with-hint/index.js
CHANGED
|
@@ -30,6 +30,7 @@ const positioning_hint_1 = require("./positioning-hint");
|
|
|
30
30
|
const utils_1 = require("./utils");
|
|
31
31
|
/**
|
|
32
32
|
* Компонент вывода "хинта" рядом с заданным элементом.
|
|
33
|
+
* @deprecated Следует использовать `hint`.
|
|
33
34
|
* @param props Свойства.
|
|
34
35
|
* @return Элемент.
|
|
35
36
|
*/
|
|
@@ -28,7 +28,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
28
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
exports.PositioningHint = void 0;
|
|
30
30
|
const react_1 = __importStar(require("react"));
|
|
31
|
-
const
|
|
31
|
+
const hint_deprecated_1 = require("../hint-deprecated");
|
|
32
32
|
const utils_1 = require("./utils");
|
|
33
33
|
const bind_1 = __importDefault(require("classnames/bind"));
|
|
34
34
|
const positioning_hint_module_scss_1 = __importDefault(require("./positioning-hint.module.scss"));
|
|
@@ -48,6 +48,6 @@ const PositioningHint = ({ children, direction, openerRef }) => {
|
|
|
48
48
|
utils_1.PlaceAt[direction](ref.current, openerRef.current);
|
|
49
49
|
}
|
|
50
50
|
}, [direction, children]);
|
|
51
|
-
return (react_1.default.createElement(
|
|
51
|
+
return (react_1.default.createElement(hint_deprecated_1.Hint, { ref: ref, direction: direction, className: cx('hint', 'hidden'), style: { zIndex: layer + 1 }, children: children }));
|
|
52
52
|
};
|
|
53
53
|
exports.PositioningHint = PositioningHint;
|
package/with-tooltip/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
2
|
+
type ChildrenFn = (ref: React.RefObject<HTMLElement>, toggle: (opened: boolean) => void, shown: boolean) => React.ReactNode;
|
|
3
3
|
export interface WithTooltipProps {
|
|
4
4
|
/** Сработает при клике вне подсказки или на крестик в ней. */
|
|
5
5
|
onDismiss?: () => void;
|
|
@@ -10,6 +10,7 @@ export interface WithTooltipProps {
|
|
|
10
10
|
}
|
|
11
11
|
/**
|
|
12
12
|
* Компонент, добавляющий к содержимому подсказку.
|
|
13
|
+
* @deprecated Можно использовать `popup/utils`.
|
|
13
14
|
* @param props Свойства.
|
|
14
15
|
* @return Элемент.
|
|
15
16
|
*/
|
package/with-tooltip/index.js
CHANGED
|
@@ -30,6 +30,7 @@ const portal_1 = require("../portal");
|
|
|
30
30
|
const positioning_tooltip_1 = require("./positioning-tooltip");
|
|
31
31
|
/**
|
|
32
32
|
* Компонент, добавляющий к содержимому подсказку.
|
|
33
|
+
* @deprecated Можно использовать `popup/utils`.
|
|
33
34
|
* @param props Свойства.
|
|
34
35
|
* @return Элемент.
|
|
35
36
|
*/
|
package/with-tooltip/utils.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
type DOMRectLike = Record<(typeof rectKeys)[number], number>;
|
|
2
|
+
type CanPlaceFn = (holder: HTMLElement, tooltipEl: HTMLElement, area: DOMRectLike) => boolean;
|
|
3
3
|
declare const rectKeys: readonly ["top", "left", "bottom", "right", "width", "height"];
|
|
4
4
|
export declare const CanPlace: Record<'onRight' | 'onLeft' | 'onBottom' | 'onTop', CanPlaceFn>;
|
|
5
5
|
export declare const PlaceOffset: {
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { BodyScrollOptions } from 'body-scroll-lock';
|
|
2
|
-
export interface WithBodyScrollLock {
|
|
3
|
-
/** Нужно ли выключать прокрутку body. */
|
|
4
|
-
withScrollDisable?: boolean;
|
|
5
|
-
/** Опции отключения прокрутки. */
|
|
6
|
-
scrollDisableOptions?: BodyScrollOptions;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* Хук управления блокировкой прокрутки body.
|
|
10
|
-
* @param ref Реф элемента для которого нужно отключить прокрутку body.
|
|
11
|
-
* @param needDisable Нужно ли отключать.
|
|
12
|
-
* @param options Опции.
|
|
13
|
-
*/
|
|
14
|
-
export declare const useBodyScrollLock: (ref: React.RefObject<HTMLElement>, needDisable: boolean | undefined, options?: BodyScrollOptions | undefined) => void;
|
|
15
|
-
/**
|
|
16
|
-
* Проверяет необходимость блокировки дочерних элементов в прокручиваемом элементе.
|
|
17
|
-
* Необходима для того, чтобы в прокручиваемых контейнерах вложенные прокручиваемые элементы,
|
|
18
|
-
* имеющие специальный атрибут, прокручивались нормально.
|
|
19
|
-
* @see {@link https://github.com/willmcpo/body-scroll-lock#more-complex}
|
|
20
|
-
* @param startEl Начальный элемент.
|
|
21
|
-
* @return Нужно ли позволить перетаскивание элемента.
|
|
22
|
-
*/
|
|
23
|
-
export declare const allowTouchMove: Required<BodyScrollOptions>['allowTouchMove'];
|
package/_internal/body-scroll.js
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.allowTouchMove = exports.useBodyScrollLock = void 0;
|
|
4
|
-
const body_scroll_lock_1 = require("body-scroll-lock");
|
|
5
|
-
const constants_1 = require("../constants");
|
|
6
|
-
const hooks_1 = require("../hooks");
|
|
7
|
-
/**
|
|
8
|
-
* Хук управления блокировкой прокрутки body.
|
|
9
|
-
* @param ref Реф элемента для которого нужно отключить прокрутку body.
|
|
10
|
-
* @param needDisable Нужно ли отключать.
|
|
11
|
-
* @param options Опции.
|
|
12
|
-
*/
|
|
13
|
-
const useBodyScrollLock = (ref, needDisable, options) => {
|
|
14
|
-
(0, hooks_1.useIsomorphicLayoutEffect)(() => {
|
|
15
|
-
const element = ref.current;
|
|
16
|
-
if (element && needDisable) {
|
|
17
|
-
(0, body_scroll_lock_1.disableBodyScroll)(element, options);
|
|
18
|
-
return () => (0, body_scroll_lock_1.enableBodyScroll)(element);
|
|
19
|
-
}
|
|
20
|
-
}, [needDisable, options]);
|
|
21
|
-
};
|
|
22
|
-
exports.useBodyScrollLock = useBodyScrollLock;
|
|
23
|
-
/**
|
|
24
|
-
* Проверяет необходимость блокировки дочерних элементов в прокручиваемом элементе.
|
|
25
|
-
* Необходима для того, чтобы в прокручиваемых контейнерах вложенные прокручиваемые элементы,
|
|
26
|
-
* имеющие специальный атрибут, прокручивались нормально.
|
|
27
|
-
* @see {@link https://github.com/willmcpo/body-scroll-lock#more-complex}
|
|
28
|
-
* @param startEl Начальный элемент.
|
|
29
|
-
* @return Нужно ли позволить перетаскивание элемента.
|
|
30
|
-
*/
|
|
31
|
-
const allowTouchMove = (startEl) => {
|
|
32
|
-
let el = startEl;
|
|
33
|
-
while (el && el !== document.body) {
|
|
34
|
-
if (el.getAttribute(constants_1.BSL_IGNORE_ATTR) !== null) {
|
|
35
|
-
return true;
|
|
36
|
-
}
|
|
37
|
-
el = el.parentElement;
|
|
38
|
-
}
|
|
39
|
-
return false;
|
|
40
|
-
};
|
|
41
|
-
exports.allowTouchMove = allowTouchMove;
|
package/constants.d.ts
DELETED
package/constants.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.BSL_IGNORE_ATTR = void 0;
|
|
4
|
-
/**
|
|
5
|
-
* Имя атрибута, устанавливаемого на элемент, имеющий прокрутку.
|
|
6
|
-
* Атрибут устанавливается на элемент в случае, если
|
|
7
|
-
* прокручиваемый родитель элемента обрабатывается с помощью body-scroll-lock.
|
|
8
|
-
*/
|
|
9
|
-
exports.BSL_IGNORE_ATTR = 'data-bsl-ignore';
|
package/nav-bar/index.d.ts
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3
|
-
text?: string;
|
|
4
|
-
icon?: React.ComponentType<React.SVGAttributes<SVGSVGElement>>;
|
|
5
|
-
stub?: boolean;
|
|
6
|
-
shift?: 'left' | 'right';
|
|
7
|
-
'data-testid'?: string;
|
|
8
|
-
}
|
|
9
|
-
export interface NavBarProps {
|
|
10
|
-
/** Заголовок. */
|
|
11
|
-
title?: string;
|
|
12
|
-
/** Подзаголовок. */
|
|
13
|
-
subtitle?: string;
|
|
14
|
-
/** Класс. */
|
|
15
|
-
className?: string;
|
|
16
|
-
/** Нужно ли выводить полоску снизу. */
|
|
17
|
-
bottomBordered?: boolean;
|
|
18
|
-
/** Свойства кнопок. */
|
|
19
|
-
buttons?: {
|
|
20
|
-
start?: ButtonProps;
|
|
21
|
-
startSecondary?: ButtonProps;
|
|
22
|
-
end?: ButtonProps;
|
|
23
|
-
endSecondary?: ButtonProps;
|
|
24
|
-
};
|
|
25
|
-
}
|
|
26
|
-
/**
|
|
27
|
-
* Высота компонента в пикселях.
|
|
28
|
-
*/
|
|
29
|
-
export declare const NAV_BAR_HEIGHT = 56;
|
|
30
|
-
/**
|
|
31
|
-
* Компонент панели навигации.
|
|
32
|
-
* @param props Свойства.
|
|
33
|
-
* @return Элемент.
|
|
34
|
-
*/
|
|
35
|
-
export declare const NavBar: ({ title, subtitle, className, bottomBordered, buttons: { start, startSecondary, end, endSecondary }, }: NavBarProps) => JSX.Element;
|
|
36
|
-
/**
|
|
37
|
-
* Компонент кнопки (с текстом или иконки).
|
|
38
|
-
* @param props Свойства.
|
|
39
|
-
* @param props.text Текст.
|
|
40
|
-
* @param props.icon Функция возвращающая React-элемент svg-иконки (имеет приоритет над "text").
|
|
41
|
-
* @param props.stub Является ли кнопка заглушкой (будет скрыта через aria, не будет содержать иконки).
|
|
42
|
-
* @param props.shift Определяет как сместить иконку внутри кнопки.
|
|
43
|
-
* @return Элемент.
|
|
44
|
-
*/
|
|
45
|
-
export declare const NavButton: React.FC<ButtonProps>;
|
|
46
|
-
export {};
|
package/nav-bar/index.js
DELETED
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.NavButton = exports.NavBar = exports.NAV_BAR_HEIGHT = void 0;
|
|
18
|
-
const react_1 = __importDefault(require("react"));
|
|
19
|
-
const nav_bar_module_scss_1 = __importDefault(require("./nav-bar.module.scss"));
|
|
20
|
-
const bind_1 = __importDefault(require("classnames/bind"));
|
|
21
|
-
const fp_1 = require("lodash/fp");
|
|
22
|
-
const borders_1 = require("../styling/borders");
|
|
23
|
-
const colors_1 = require("../colors");
|
|
24
|
-
const cx = bind_1.default.bind(nav_bar_module_scss_1.default);
|
|
25
|
-
const getIcon = (0, fp_1.prop)('icon');
|
|
26
|
-
/**
|
|
27
|
-
* Высота компонента в пикселях.
|
|
28
|
-
*/
|
|
29
|
-
exports.NAV_BAR_HEIGHT = 56;
|
|
30
|
-
/**
|
|
31
|
-
* Компонент панели навигации.
|
|
32
|
-
* @param props Свойства.
|
|
33
|
-
* @return Элемент.
|
|
34
|
-
*/
|
|
35
|
-
const NavBar = ({ title, subtitle, className, bottomBordered = false, buttons: { start, startSecondary, end, endSecondary } = {}, }) => {
|
|
36
|
-
const startButtons = [start, startSecondary];
|
|
37
|
-
const endButtons = [end, endSecondary];
|
|
38
|
-
const hasStartButtons = startButtons.some(Boolean);
|
|
39
|
-
const hasEndButtons = endButtons.some(Boolean);
|
|
40
|
-
const hasButtons = hasStartButtons || hasEndButtons;
|
|
41
|
-
const isStartIconGroup = hasStartButtons && startButtons.every(getIcon);
|
|
42
|
-
const isEndIconGroup = hasEndButtons && endButtons.every(getIcon);
|
|
43
|
-
return (react_1.default.createElement("div", { className: cx('nav-bar', className, bottomBordered && borders_1.InnerBorder.bottom), style: { height: `${exports.NAV_BAR_HEIGHT}px` } },
|
|
44
|
-
hasButtons && (react_1.default.createElement("div", { className: cx('button-groups') },
|
|
45
|
-
hasStartButtons && (react_1.default.createElement("div", { className: cx('group') },
|
|
46
|
-
start && react_1.default.createElement(exports.NavButton, Object.assign({ shift: isStartIconGroup ? 'right' : undefined }, start)),
|
|
47
|
-
startSecondary && (react_1.default.createElement(exports.NavButton, Object.assign({ shift: isStartIconGroup ? 'left' : undefined }, startSecondary))))),
|
|
48
|
-
hasEndButtons && (react_1.default.createElement("div", { className: cx('group') },
|
|
49
|
-
endSecondary && (react_1.default.createElement(exports.NavButton, Object.assign({ stub: true, shift: isEndIconGroup ? 'right' : undefined }, endSecondary))),
|
|
50
|
-
end && react_1.default.createElement(exports.NavButton, Object.assign({ stub: true, shift: isEndIconGroup ? 'left' : undefined }, end)))))),
|
|
51
|
-
react_1.default.createElement("div", { className: cx('main') },
|
|
52
|
-
Boolean(title) && react_1.default.createElement("div", { className: cx('title', 'truncate') }, title),
|
|
53
|
-
Boolean(subtitle) && react_1.default.createElement("div", { className: cx('subtitle', 'truncate') }, subtitle)),
|
|
54
|
-
hasButtons && (react_1.default.createElement("div", { className: cx('button-groups', 'end') },
|
|
55
|
-
hasEndButtons && (react_1.default.createElement("div", { className: cx('group') },
|
|
56
|
-
endSecondary && (react_1.default.createElement(exports.NavButton, Object.assign({ shift: isEndIconGroup ? 'right' : undefined }, endSecondary))),
|
|
57
|
-
end && react_1.default.createElement(exports.NavButton, Object.assign({ shift: isEndIconGroup ? 'left' : undefined }, end)))),
|
|
58
|
-
hasStartButtons && (react_1.default.createElement("div", { className: cx('group') },
|
|
59
|
-
start && (react_1.default.createElement(exports.NavButton, Object.assign({ stub: true, shift: isStartIconGroup ? 'right' : undefined }, start))),
|
|
60
|
-
startSecondary && (react_1.default.createElement(exports.NavButton, Object.assign({ stub: true, shift: isStartIconGroup ? 'left' : undefined }, startSecondary)))))))));
|
|
61
|
-
};
|
|
62
|
-
exports.NavBar = NavBar;
|
|
63
|
-
/**
|
|
64
|
-
* Компонент кнопки (с текстом или иконки).
|
|
65
|
-
* @param props Свойства.
|
|
66
|
-
* @param props.text Текст.
|
|
67
|
-
* @param props.icon Функция возвращающая React-элемент svg-иконки (имеет приоритет над "text").
|
|
68
|
-
* @param props.stub Является ли кнопка заглушкой (будет скрыта через aria, не будет содержать иконки).
|
|
69
|
-
* @param props.shift Определяет как сместить иконку внутри кнопки.
|
|
70
|
-
* @return Элемент.
|
|
71
|
-
*/
|
|
72
|
-
const NavButton = (_a) => {
|
|
73
|
-
var { text, icon: Icon, stub = false, shift, className } = _a, buttonProps = __rest(_a, ["text", "icon", "stub", "shift", "className"]);
|
|
74
|
-
return (react_1.default.createElement("button", Object.assign({}, (!stub && buttonProps), { type: 'button', className: cx('button', Icon && 'icon', shift === 'left' && 'shift-left', shift === 'right' && 'shift-right', stub && 'stub', className), "aria-hidden": stub }), Icon && !stub ? (react_1.default.createElement(Icon, { fill: colors_1.COLORS.get('basic-gray87'), className: cx('svg'), "aria-hidden": 'true' })) : (text)));
|
|
75
|
-
};
|
|
76
|
-
exports.NavButton = NavButton;
|
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
@use '../colors';
|
|
2
|
-
|
|
3
|
-
.nav-bar {
|
|
4
|
-
background: #fff;
|
|
5
|
-
box-sizing: border-box;
|
|
6
|
-
display: flex;
|
|
7
|
-
justify-content: center;
|
|
8
|
-
width: 100%;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
.main {
|
|
12
|
-
display: flex;
|
|
13
|
-
flex-direction: column;
|
|
14
|
-
flex-grow: 1;
|
|
15
|
-
justify-content: center;
|
|
16
|
-
overflow: hidden;
|
|
17
|
-
text-align: center;
|
|
18
|
-
&:first-child {
|
|
19
|
-
padding: 0 16px;
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.title {
|
|
24
|
-
color: colors.$basic-gray87;
|
|
25
|
-
font-size: 16px;
|
|
26
|
-
font-weight: 600;
|
|
27
|
-
line-height: 24px;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.subtitle {
|
|
31
|
-
color: colors.$basic-gray38;
|
|
32
|
-
font-size: 12px;
|
|
33
|
-
line-height: 16px;
|
|
34
|
-
margin-top: -4px;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.truncate {
|
|
38
|
-
overflow: hidden;
|
|
39
|
-
text-overflow: ellipsis;
|
|
40
|
-
white-space: nowrap;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
.button-groups {
|
|
44
|
-
display: flex;
|
|
45
|
-
flex-direction: column;
|
|
46
|
-
&.end {
|
|
47
|
-
align-items: flex-end;
|
|
48
|
-
text-align: right;
|
|
49
|
-
.group {
|
|
50
|
-
justify-content: flex-end;
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
.group {
|
|
54
|
-
display: flex;
|
|
55
|
-
width: 100%;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
.button {
|
|
60
|
-
background: transparent;
|
|
61
|
-
border: 0;
|
|
62
|
-
box-sizing: border-box;
|
|
63
|
-
color: colors.$basic-blue;
|
|
64
|
-
font-family: inherit;
|
|
65
|
-
font-size: 14px;
|
|
66
|
-
font-weight: 600;
|
|
67
|
-
height: 56px;
|
|
68
|
-
line-height: 20px;
|
|
69
|
-
margin: 0;
|
|
70
|
-
outline: 0;
|
|
71
|
-
padding: 0 16px;
|
|
72
|
-
text-align: inherit;
|
|
73
|
-
width: 100%;
|
|
74
|
-
&.icon {
|
|
75
|
-
width: 56px;
|
|
76
|
-
&.shift-left {
|
|
77
|
-
padding-right: 16px;
|
|
78
|
-
padding-left: 12px;
|
|
79
|
-
width: 52px;
|
|
80
|
-
}
|
|
81
|
-
&.shift-right {
|
|
82
|
-
padding-right: 12px;
|
|
83
|
-
padding-left: 16px;
|
|
84
|
-
width: 52px;
|
|
85
|
-
}
|
|
86
|
-
.svg {
|
|
87
|
-
// чтобы выравнивались по центру по вертикали
|
|
88
|
-
display: block;
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
&.stub {
|
|
92
|
-
height: 0;
|
|
93
|
-
overflow: hidden;
|
|
94
|
-
}
|
|
95
|
-
}
|
package/upload/area.d.ts
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export interface UploadAreaProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'multiple'> {
|
|
3
|
-
/** Ограничение на количество файлов. */
|
|
4
|
-
countLimit?: number;
|
|
5
|
-
/** Есть ли ошибки валидации. */
|
|
6
|
-
failed?: boolean;
|
|
7
|
-
/** Роль файлов. */
|
|
8
|
-
fileRole?: string;
|
|
9
|
-
/** Форматы. */
|
|
10
|
-
formats?: string;
|
|
11
|
-
/** Ограничение на количество файлов. */
|
|
12
|
-
multiple?: boolean;
|
|
13
|
-
/** Сработает при выборе или перетаскивании файлов, получив список и событие. */
|
|
14
|
-
onSelect?: (list: File[], e: React.DragEvent<HTMLDivElement> | React.ChangeEvent<HTMLInputElement>) => void;
|
|
15
|
-
/** Ограничение на размер. */
|
|
16
|
-
sizeLimit?: string;
|
|
17
|
-
/** Идентификатор для систем автоматизированного тестирования. */
|
|
18
|
-
'data-testid'?: string;
|
|
19
|
-
}
|
|
20
|
-
/**
|
|
21
|
-
* Компонент поля выбора файла.
|
|
22
|
-
* @param props Свойства.
|
|
23
|
-
* @return Элемент.
|
|
24
|
-
*/
|
|
25
|
-
export declare const UploadArea: React.FC<UploadAreaProps>;
|
package/upload/area.js
DELETED
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
-
var t = {};
|
|
4
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.UploadArea = void 0;
|
|
18
|
-
const react_1 = __importDefault(require("react"));
|
|
19
|
-
const bind_1 = __importDefault(require("classnames/bind"));
|
|
20
|
-
const area_module_scss_1 = __importDefault(require("./area.module.scss"));
|
|
21
|
-
const upload_svg_1 = __importDefault(require("./upload.svg"));
|
|
22
|
-
const colors_1 = require("../colors");
|
|
23
|
-
const link_1 = require("../link");
|
|
24
|
-
const utils_1 = require("./utils");
|
|
25
|
-
const lodash_1 = require("lodash");
|
|
26
|
-
const get_declination_1 = __importDefault(require("../helpers/get-declination"));
|
|
27
|
-
const cx = bind_1.default.bind(area_module_scss_1.default);
|
|
28
|
-
/**
|
|
29
|
-
* Компонент поля выбора файла.
|
|
30
|
-
* @param props Свойства.
|
|
31
|
-
* @return Элемент.
|
|
32
|
-
*/
|
|
33
|
-
const UploadArea = (_a) => {
|
|
34
|
-
var { onSelect, className, fileRole = 'файл', formats, sizeLimit = '2 Mb', multiple, countLimit = multiple ? undefined : 1, failed, 'data-testid': testId = 'upload-area' } = _a, restProps = __rest(_a, ["onSelect", "className", "fileRole", "formats", "sizeLimit", "multiple", "countLimit", "failed", 'data-testid']);
|
|
35
|
-
const secondaryInfo = (0, lodash_1.upperFirst)([
|
|
36
|
-
countLimit &&
|
|
37
|
-
countLimit > 0 &&
|
|
38
|
-
`${countLimit} ${(0, get_declination_1.default)(countLimit, ['файл', 'файла', 'файлов'])}`,
|
|
39
|
-
formats && `формат ${formats}`,
|
|
40
|
-
`до ${sizeLimit}`,
|
|
41
|
-
]
|
|
42
|
-
.filter(Boolean)
|
|
43
|
-
.join(', '));
|
|
44
|
-
const prepareFiles = (0, utils_1.getFilesPreparer)({ multiple, countLimit });
|
|
45
|
-
const { active, bind } = (0, utils_1.useDragAndDrop)({
|
|
46
|
-
onDrop: e => onSelect === null || onSelect === void 0 ? void 0 : onSelect(prepareFiles(e.dataTransfer.files), e),
|
|
47
|
-
});
|
|
48
|
-
return (react_1.default.createElement("div", Object.assign({}, restProps, bind, { className: cx('root', { active }, className), "data-testid": testId }),
|
|
49
|
-
react_1.default.createElement(upload_svg_1.default, { fill: colors_1.COLORS.get('basic-gray24') }),
|
|
50
|
-
react_1.default.createElement("div", { className: cx('info-column') },
|
|
51
|
-
react_1.default.createElement("div", { className: cx('info', 'primary') },
|
|
52
|
-
"\u041F\u0435\u0440\u0435\u0442\u0430\u0449\u0438\u0442\u0435 \u0438\u043B\u0438",
|
|
53
|
-
' ',
|
|
54
|
-
react_1.default.createElement("label", null,
|
|
55
|
-
react_1.default.createElement("input", { type: 'file', multiple: multiple, className: cx('input'), onChange: e => {
|
|
56
|
-
onSelect === null || onSelect === void 0 ? void 0 : onSelect(prepareFiles(e.target.files), e);
|
|
57
|
-
// очищаем поле чтобы можно было выбрать тот же файл повторно
|
|
58
|
-
e.target.value = '';
|
|
59
|
-
}, "data-testid": 'upload-area:input' }),
|
|
60
|
-
react_1.default.createElement(link_1.Link, { pseudo: true, "data-testid": 'upload-area:anchor' },
|
|
61
|
-
"\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 ",
|
|
62
|
-
fileRole))),
|
|
63
|
-
react_1.default.createElement("div", { className: cx('info', 'secondary', { failed }) }, secondaryInfo))));
|
|
64
|
-
};
|
|
65
|
-
exports.UploadArea = UploadArea;
|
package/upload/area.module.scss
DELETED
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
@use '../colors';
|
|
2
|
-
|
|
3
|
-
.root {
|
|
4
|
-
display: flex;
|
|
5
|
-
align-items: center;
|
|
6
|
-
border-radius: 8px;
|
|
7
|
-
border: 1px dashed colors.$basic-gray24;
|
|
8
|
-
height: 104px;
|
|
9
|
-
max-width: 100%;
|
|
10
|
-
overflow: hidden;
|
|
11
|
-
padding: 0 40px;
|
|
12
|
-
&.active {
|
|
13
|
-
border: 2px solid colors.$basic-blue;
|
|
14
|
-
padding: 0 39px;
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.input {
|
|
19
|
-
display: none;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.info-column {
|
|
23
|
-
margin-left: 24px;
|
|
24
|
-
overflow: hidden;
|
|
25
|
-
.info {
|
|
26
|
-
white-space: nowrap;
|
|
27
|
-
overflow: hidden;
|
|
28
|
-
text-overflow: ellipsis;
|
|
29
|
-
&.primary {
|
|
30
|
-
font-size: 16px;
|
|
31
|
-
line-height: 24px;
|
|
32
|
-
color: colors.$basic-gray87;
|
|
33
|
-
}
|
|
34
|
-
&.secondary {
|
|
35
|
-
margin-top: 4px;
|
|
36
|
-
font-size: 14px;
|
|
37
|
-
line-height: 20px;
|
|
38
|
-
color: colors.$basic-gray38;
|
|
39
|
-
&.failed {
|
|
40
|
-
color: colors.$additional-deep-red;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
}
|
package/upload/utils.d.ts
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
declare type DnDProps<T> = {
|
|
3
|
-
onDrop: React.DragEventHandler<T>;
|
|
4
|
-
};
|
|
5
|
-
declare type DnDResult<T> = {
|
|
6
|
-
active: boolean;
|
|
7
|
-
bind: {
|
|
8
|
-
onDragEnter: React.DragEventHandler<T>;
|
|
9
|
-
onDragOver: React.DragEventHandler<T>;
|
|
10
|
-
onDragLeave: React.DragEventHandler<T>;
|
|
11
|
-
onDrop: React.DragEventHandler<T>;
|
|
12
|
-
};
|
|
13
|
-
};
|
|
14
|
-
/**
|
|
15
|
-
* Хук обработки drag-n-drop событий.
|
|
16
|
-
* @param options Опции.
|
|
17
|
-
* @return Данные.
|
|
18
|
-
*/
|
|
19
|
-
export declare const useDragAndDrop: <T extends HTMLElement = HTMLElement>({ onDrop, }: DnDProps<T>) => DnDResult<T>;
|
|
20
|
-
/**
|
|
21
|
-
* Возвращает функцию обработки FileList по заданным ограничениям.
|
|
22
|
-
* @param props Свойства.
|
|
23
|
-
* @return Функция.
|
|
24
|
-
*/
|
|
25
|
-
export declare const getFilesPreparer: ({ multiple, countLimit }: {
|
|
26
|
-
multiple?: boolean | undefined;
|
|
27
|
-
countLimit?: number | undefined;
|
|
28
|
-
}) => (list: File[] | FileList) => File[];
|
|
29
|
-
export {};
|
package/upload/utils.js
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.getFilesPreparer = exports.useDragAndDrop = void 0;
|
|
7
|
-
const react_1 = require("react");
|
|
8
|
-
const with_prevent_1 = __importDefault(require("../helpers/with-prevent"));
|
|
9
|
-
/**
|
|
10
|
-
* Хук обработки drag-n-drop событий.
|
|
11
|
-
* @param options Опции.
|
|
12
|
-
* @return Данные.
|
|
13
|
-
*/
|
|
14
|
-
const useDragAndDrop = ({ onDrop, }) => {
|
|
15
|
-
const [active, setActive] = (0, react_1.useState)(false);
|
|
16
|
-
return {
|
|
17
|
-
active,
|
|
18
|
-
bind: {
|
|
19
|
-
onDragEnter: (0, with_prevent_1.default)(() => setActive(true)),
|
|
20
|
-
onDragOver: (0, with_prevent_1.default)(() => setActive(true)),
|
|
21
|
-
onDragLeave: (0, with_prevent_1.default)(e => {
|
|
22
|
-
// игнорируем переход по дочерним элементам
|
|
23
|
-
!e.currentTarget.contains(e.relatedTarget) && setActive(false);
|
|
24
|
-
}),
|
|
25
|
-
onDrop: (0, with_prevent_1.default)(e => {
|
|
26
|
-
setActive(false);
|
|
27
|
-
onDrop(e);
|
|
28
|
-
}),
|
|
29
|
-
},
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
exports.useDragAndDrop = useDragAndDrop;
|
|
33
|
-
/**
|
|
34
|
-
* Возвращает функцию обработки FileList по заданным ограничениям.
|
|
35
|
-
* @param props Свойства.
|
|
36
|
-
* @return Функция.
|
|
37
|
-
*/
|
|
38
|
-
const getFilesPreparer = ({ multiple, countLimit }) => (list) => {
|
|
39
|
-
const files = [...list];
|
|
40
|
-
multiple
|
|
41
|
-
? countLimit && Number.isFinite(countLimit) && files.splice(countLimit)
|
|
42
|
-
: files.splice(1);
|
|
43
|
-
return files;
|
|
44
|
-
};
|
|
45
|
-
exports.getFilesPreparer = getFilesPreparer;
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|