@ozen-ui/kit 0.27.0 → 0.29.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.
@@ -56,6 +56,9 @@ export type ModalProps = {
56
56
  container?: PortalProps['container'];
57
57
  /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
58
58
  ignoreClickOutsideRefs?: Array<RefObject<HTMLElement>>;
59
+ /** Если {true} отключает портал для компонента.
60
+ * Подробнее – https://react.dev/reference/react-dom/createPortal. */
61
+ disablePortal?: boolean;
59
62
  } & PortalProps;
60
63
  export type ModalRef = PortalRef;
61
64
  export declare const Modal: React.ForwardRefExoticComponent<{
@@ -116,6 +119,9 @@ export declare const Modal: React.ForwardRefExoticComponent<{
116
119
  container?: PortalProps['container'];
117
120
  /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
118
121
  ignoreClickOutsideRefs?: React.RefObject<HTMLElement>[] | undefined;
122
+ /** Если {true} отключает портал для компонента.
123
+ * Подробнее – https://react.dev/reference/react-dom/createPortal. */
124
+ disablePortal?: boolean | undefined;
119
125
  } & import("../Portal").PortalBaseProps & {
120
126
  as?: "div" | undefined;
121
127
  } & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "container"> & React.RefAttributes<HTMLDivElement>>;
@@ -18,13 +18,14 @@ var components_1 = require("./components");
18
18
  var index_1 = require("./index");
19
19
  exports.cnModal = (0, classname_1.cn)('Modal');
20
20
  exports.Modal = (0, react_1.forwardRef)(function (_a, ref) {
21
- var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = tslib_1.__rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
21
+ var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, _h = _a.disablePortal, disablePortal = _h === void 0 ? false : _h, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = tslib_1.__rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "disablePortal", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
22
22
  var hasBackdrop = !hideBackdrop;
23
23
  var modalInnerRef = (0, react_1.useRef)(null);
24
24
  var focusedElement = (0, react_1.useRef)(null);
25
- var _h = tslib_1.__read((0, react_1.useState)(false), 2), openState = _h[0], setOpenState = _h[1];
26
- var _j = tslib_1.__read((0, react_1.useState)(false), 2), opened = _j[0], setOpened = _j[1];
27
- var _k = (0, index_1.useModalManager)(modalInnerRef, 1000, openState), isTop = _k.isTop, refsClickOutside = _k.refsClickOutside;
25
+ var _j = tslib_1.__read((0, react_1.useState)(false), 2), openState = _j[0], setOpenState = _j[1];
26
+ var _k = tslib_1.__read((0, react_1.useState)(false), 2), opened = _k[0], setOpened = _k[1];
27
+ var _l = (0, index_1.useModalManager)(modalInnerRef, 1000, openState), isTop = _l.isTop, refsClickOutside = _l.refsClickOutside;
28
+ var RootComponent = disablePortal ? 'div' : Portal_1.Portal;
28
29
  (0, useClickOutside_1.useClickOutside)({
29
30
  refs: tslib_1.__spreadArray(tslib_1.__spreadArray([
30
31
  modalInnerRef
@@ -73,7 +74,7 @@ exports.Modal = (0, react_1.forwardRef)(function (_a, ref) {
73
74
  active: isTop && !disableEscapeKeyDown,
74
75
  });
75
76
  return (react_1.default.createElement(react_transition_group_1.CSSTransition, tslib_1.__assign({ classNames: (0, exports.cnModal)({ animation: true }), timeout: 300 }, transitionProps, { in: openState, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: !keepMounted, appear: true }),
76
- react_1.default.createElement(Portal_1.Portal, tslib_1.__assign({}, other, { className: (0, exports.cnModal)({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
77
+ react_1.default.createElement(RootComponent, tslib_1.__assign({}, other, { className: (0, exports.cnModal)({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
77
78
  !hideBackdrop && (react_1.default.createElement(Backdrop_1.Backdrop, tslib_1.__assign({ zIndex: -1 }, backdropProps, { open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
78
79
  react_1.default.createElement(components_1.ModalConsumer, tslib_1.__assign({}, windowProps, { ref: (0, useMultiRef_1.useMultiRef)([modalInnerRef, trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
79
80
  });
@@ -7,6 +7,7 @@
7
7
  gap: var(--space-xs);
8
8
  outline: none;
9
9
  border: none;
10
+ text-decoration: none;
10
11
  }
11
12
  .Tag_size_2xs {
12
13
  font: var(--typography-text-3xs-font);
@@ -5,30 +5,30 @@
5
5
  --color-content-tertiary: #7e8194;
6
6
  --color-content-disabled: #7e8194;
7
7
  --color-content-ghost-disabled: rgb(255 255 255 / 40%);
8
- --color-content-action: #0534d0;
9
- --color-content-action-hover: #082ba0;
10
- --color-content-action-pressed: #0a2171;
8
+ --color-content-action: #023dff;
9
+ --color-content-action-hover: #0534d0;
10
+ --color-content-action-pressed: #082ba0;
11
11
  --color-content-action-dark: #9ab1ff;
12
- --color-content-action-secondary: #d7d8e1;
13
- --color-content-action-secondary-hover: #c2c5d3;
14
- --color-content-action-secondary-pressed: #aeb1c4;
15
- --color-content-action-secondary-dark: #9a9eb5;
12
+ --color-content-action-secondary: #9a9eb5;
13
+ --color-content-action-secondary-hover: #7e8194;
14
+ --color-content-action-secondary-pressed: #636574;
15
+ --color-content-action-secondary-dark: #d7d8e1;
16
16
  --color-background-main: #1e1d22;
17
- --color-content-error: #cf4a4b;
18
- --color-content-error-hover: #9f3b3d;
19
- --color-content-error-pressed: #702d2e;
17
+ --color-content-error: #ff5959;
18
+ --color-content-error-hover: #cf4a4b;
19
+ --color-content-error-pressed: #9f3b3d;
20
20
  --color-content-error-dark: #ffbdbd;
21
- --color-content-warning: #cf7d04;
22
- --color-content-warning-hover: #9f6207;
23
- --color-content-warning-pressed: #70460b;
21
+ --color-content-warning: #f90;
22
+ --color-content-warning-hover: #cf7d04;
23
+ --color-content-warning-pressed: #9f6207;
24
24
  --color-content-warning-dark: #ffd699;
25
- --color-content-success: #039904;
26
- --color-content-success-hover: #067607;
27
- --color-content-success-pressed: #0a540b;
25
+ --color-content-success: #0b0;
26
+ --color-content-success-hover: #039904;
27
+ --color-content-success-pressed: #067607;
28
28
  --color-content-success-dark: #99e499;
29
- --color-content-info: #6a05d0;
30
- --color-content-info-hover: #5307a0;
31
- --color-content-info-pressed: #3d0a71;
29
+ --color-content-info: #8002ff;
30
+ --color-content-info-hover: #6a05d0;
31
+ --color-content-info-pressed: #5307a0;
32
32
  --color-content-info-dark: #cd9aff;
33
33
  --color-content-primary-inverse: #17161a;
34
34
  --color-background-main-inverse: #d9dade;
@@ -50,61 +50,61 @@
50
50
  --color-background-tertiary-pressed: #7e8194;
51
51
  --color-background-disabled: #2c2c33;
52
52
  --color-background-action: #0534d0;
53
- --color-background-action-hover: #082ba0;
54
- --color-background-action-pressed: #0a2171;
55
- --color-background-action-active-disabled: #0f111e;
53
+ --color-background-action-hover: #023dff;
54
+ --color-background-action-pressed: #3564ff;
55
+ --color-background-action-active-disabled: #082ba0;
56
56
  --color-background-action-light: #0d1841;
57
- --color-background-action-light-hover: #0f142a;
58
- --color-background-action-light-pressed: #0f111e;
57
+ --color-background-action-light-hover: #0a2171;
58
+ --color-background-action-light-pressed: #082ba0;
59
59
  --color-background-accent-action-light: #082ba0;
60
- --color-background-accent-action-light-hover: #0a2171;
61
- --color-background-accent-action-light-pressed: #0d1841;
62
- --color-background-action-secondary: #aeb1c4;
60
+ --color-background-accent-action-light-hover: #0534d0;
61
+ --color-background-accent-action-light-pressed: #023dff;
62
+ --color-background-action-secondary: #7e8194;
63
63
  --color-background-action-secondary-hover: #9a9eb5;
64
- --color-background-action-secondary-pressed: #7e8194;
65
- --color-background-action-secondary-disabled: #474853;
64
+ --color-background-action-secondary-pressed: #aeb1c4;
65
+ --color-background-action-secondary-disabled: #636574;
66
66
  --color-background-action-secondary-light: #2c2c33;
67
- --color-background-action-secondary-light-hover: #636574;
68
- --color-background-action-secondary-light-pressed: #474853;
67
+ --color-background-action-secondary-light-hover: #474853;
68
+ --color-background-action-secondary-light-pressed: #636574;
69
69
  --color-background-accent-action-secondary-light: #2c2c33;
70
- --color-background-accent-action-secondary-light-hover: #0a540b;
71
- --color-background-accent-action-secondary-light-pressed: #0d310e;
70
+ --color-background-accent-action-secondary-light-hover: #474853;
71
+ --color-background-accent-action-secondary-light-pressed: #636574;
72
72
  --color-background-error: #cf4a4b;
73
- --color-background-error-hover: #9f3b3d;
74
- --color-background-error-pressed: #702d2e;
73
+ --color-background-error-hover: #ff5959;
74
+ --color-background-error-pressed: #ff7a7a;
75
75
  --color-background-error-light: #401e20;
76
- --color-background-error-light-hover: #281619;
77
- --color-background-error-light-pressed: #1c1316;
76
+ --color-background-error-light-hover: #702d2e;
77
+ --color-background-error-light-pressed: #9f3b3d;
78
78
  --color-background-accent-error-light: #9f3b3d;
79
- --color-background-accent-error-light-hover: #702d2e;
80
- --color-background-accent-error-light-pressed: #401e20;
79
+ --color-background-accent-error-light-hover: #cf4a4b;
80
+ --color-background-accent-error-light-pressed: #ff5959;
81
81
  --color-background-warning: #cf7d04;
82
- --color-background-warning-hover: #9f6207;
83
- --color-background-warning-pressed: #70460b;
82
+ --color-background-warning-hover: #f90;
83
+ --color-background-warning-pressed: #ffad33;
84
84
  --color-background-warning-light: #402b0e;
85
- --color-background-warning-light-hover: #281d10;
86
- --color-background-warning-light-pressed: #1c1611;
85
+ --color-background-warning-light-hover: #70460b;
86
+ --color-background-warning-light-pressed: #9f6207;
87
87
  --color-background-accent-warning-light: #9f6207;
88
- --color-background-accent-warning-light-hover: #70460b;
89
- --color-background-accent-warning-light-pressed: #402b0e;
88
+ --color-background-accent-warning-light-hover: #cf7d04;
89
+ --color-background-accent-warning-light-pressed: #f90;
90
90
  --color-background-success: #039904;
91
- --color-background-success-hover: #067607;
92
- --color-background-success-pressed: #0a540b;
91
+ --color-background-success-hover: #0b0;
92
+ --color-background-success-pressed: #33c933;
93
93
  --color-background-success-light: #0d310e;
94
- --color-background-success-light-hover: #0e2010;
95
- --color-background-success-light-pressed: #0f1811;
94
+ --color-background-success-light-hover: #0a540b;
95
+ --color-background-success-light-pressed: #067607;
96
96
  --color-background-accent-success-light: #067607;
97
- --color-background-accent-success-light-hover: #0a540b;
98
- --color-background-accent-success-light-pressed: #0d310e;
97
+ --color-background-accent-success-light-hover: #039904;
98
+ --color-background-accent-success-light-pressed: #0b0;
99
99
  --color-background-info: #6a05d0;
100
- --color-background-info-hover: #5307a0;
101
- --color-background-info-pressed: #3d0a71;
100
+ --color-background-info-hover: #8002ff;
101
+ --color-background-info-pressed: #9a35ff;
102
102
  --color-background-info-light: #270d41;
103
- --color-background-info-light-hover: #1b0e2a;
104
- --color-background-info-light-pressed: #160e1e;
103
+ --color-background-info-light-hover: #3d0a71;
104
+ --color-background-info-light-pressed: #5307a0;
105
105
  --color-background-accent-info-light: #5307a0;
106
- --color-background-accent-info-light-hover: #3d0a71;
107
- --color-background-accent-info-light-pressed: #270d41;
106
+ --color-background-accent-info-light-hover: #6a05d0;
107
+ --color-background-accent-info-light-pressed: #8002ff;
108
108
  --color-background-overlay: rgb(0 0 0 / 60%);
109
109
  --color-background-ghost: rgb(255 255 255 / 10%);
110
110
  --color-background-ghost-hover: rgb(255 255 255 / 20%);
@@ -1,5 +1,5 @@
1
1
  .Theme_color_bBusinessDefault {
2
- --color-content-primary: #0d0e12;
2
+ --color-content-primary: #17161a;
3
3
  --color-content-secondary: #636574;
4
4
  --color-content-tertiary: #7e8194;
5
5
  --color-content-disabled: #7e8194;
@@ -51,56 +51,56 @@
51
51
  --color-background-action: #023dff;
52
52
  --color-background-action-hover: #0534d0;
53
53
  --color-background-action-pressed: #082ba0;
54
- --color-background-action-active-disabled: #9ab1ff;
55
- --color-background-action-light: #e6ecff;
56
- --color-background-action-light-hover: #ccd8ff;
57
- --color-background-action-light-pressed: #9ab1ff;
54
+ --color-background-action-active-disabled: #678bff;
55
+ --color-background-action-light: #ccd8ff;
56
+ --color-background-action-light-hover: #9ab1ff;
57
+ --color-background-action-light-pressed: #678bff;
58
58
  --color-background-accent-action-light: #0534d0;
59
59
  --color-background-accent-action-light-hover: #082ba0;
60
60
  --color-background-accent-action-light-pressed: #0a2171;
61
61
  --color-background-action-secondary: #2c2c33;
62
62
  --color-background-action-secondary-hover: #1e1d22;
63
63
  --color-background-action-secondary-pressed: #17161a;
64
- --color-background-action-secondary-active-disabled: #d7d8e1;
65
- --color-background-action-secondary-light: #f5f5f8;
66
- --color-background-action-secondary-light-hover: #ebecf0;
67
- --color-background-action-secondary-light-pressed: #d7d8e1;
64
+ --color-background-action-secondary-active-disabled: #c2c5d3;
65
+ --color-background-action-secondary-light: #ebecf0;
66
+ --color-background-action-secondary-light-hover: #d7d8e1;
67
+ --color-background-action-secondary-light-pressed: #c2c5d3;
68
68
  --color-background-accent-action-secondary-light: #636574;
69
69
  --color-background-accent-action-secondary-light-hover: #474853;
70
70
  --color-background-accent-action-secondary-light-pressed: #2c2c33;
71
71
  --color-background-error: #ff5959;
72
72
  --color-background-error-hover: #cf4a4b;
73
73
  --color-background-error-pressed: #9f3b3d;
74
- --color-background-error-light: #fee;
75
- --color-background-error-light-hover: #ffdede;
76
- --color-background-error-light-pressed: #ffbdbd;
74
+ --color-background-error-light: #ffdede;
75
+ --color-background-error-light-hover: #ffbdbd;
76
+ --color-background-error-light-pressed: #ff9b9b;
77
77
  --color-background-accent-error-light: #9f3b3d;
78
78
  --color-background-accent-error-light-hover: #702d2e;
79
79
  --color-background-accent-error-light-pressed: #401e20;
80
80
  --color-background-warning: #f90;
81
81
  --color-background-warning-hover: #cf7d04;
82
82
  --color-background-warning-pressed: #9f6207;
83
- --color-background-warning-light: #fff5e5;
84
- --color-background-warning-light-hover: #ffebcc;
85
- --color-background-warning-light-pressed: #ffd699;
83
+ --color-background-warning-light: #ffebcc;
84
+ --color-background-warning-light-hover: #ffd699;
85
+ --color-background-warning-light-pressed: #ffc266;
86
86
  --color-background-accent-warning-light: #9f6207;
87
87
  --color-background-accent-warning-light-hover: #70460b;
88
88
  --color-background-accent-warning-light-pressed: #402b0e;
89
89
  --color-background-success: #0b0;
90
90
  --color-background-success-hover: #039904;
91
91
  --color-background-success-pressed: #067607;
92
- --color-background-success-light: #e5f8e5;
93
- --color-background-success-light-hover: #ccf1cc;
94
- --color-background-success-light-pressed: #99e499;
92
+ --color-background-success-light: #ccf1cc;
93
+ --color-background-success-light-hover: #99e499;
94
+ --color-background-success-light-pressed: #66d666;
95
95
  --color-background-accent-success-light: #067607;
96
96
  --color-background-accent-success-light-hover: #0a540b;
97
97
  --color-background-accent-success-light-pressed: #0d310e;
98
98
  --color-background-info: #8002ff;
99
99
  --color-background-info-hover: #6a05d0;
100
100
  --color-background-info-pressed: #5307a0;
101
- --color-background-info-light: #f4e8ff;
102
- --color-background-info-light-hover: #e6ccff;
103
- --color-background-info-light-pressed: #cd9aff;
101
+ --color-background-info-light: #e6ccff;
102
+ --color-background-info-light-hover: #cd9aff;
103
+ --color-background-info-light-pressed: #b367ff;
104
104
  --color-background-accent-info-light: #5307a0;
105
105
  --color-background-accent-info-light-hover: #3d0a71;
106
106
  --color-background-accent-info-light-pressed: #270d41;
@@ -5,30 +5,30 @@
5
5
  --color-content-tertiary: #7e8194;
6
6
  --color-content-disabled: #7e8194;
7
7
  --color-content-ghost-disabled: rgb(255 255 255 / 40%);
8
- --color-content-action: #039904;
9
- --color-content-action-hover: #067607;
10
- --color-content-action-pressed: #0a540b;
8
+ --color-content-action: #0b0;
9
+ --color-content-action-hover: #039904;
10
+ --color-content-action-pressed: #067607;
11
11
  --color-content-action-dark: #99e499;
12
- --color-content-action-secondary: #0534d0;
13
- --color-content-action-secondary-hover: #082ba0;
14
- --color-content-action-secondary-pressed: #0a2171;
12
+ --color-content-action-secondary: #023dff;
13
+ --color-content-action-secondary-hover: #0534d0;
14
+ --color-content-action-secondary-pressed: #082ba0;
15
15
  --color-content-action-secondary-dark: #9ab1ff;
16
16
  --color-background-main: #1e1d22;
17
- --color-content-error: #cf4a4b;
18
- --color-content-error-hover: #9f3b3d;
19
- --color-content-error-pressed: #702d2e;
17
+ --color-content-error: #ff5959;
18
+ --color-content-error-hover: #cf4a4b;
19
+ --color-content-error-pressed: #9f3b3d;
20
20
  --color-content-error-dark: #ffbdbd;
21
- --color-content-warning: #cf7d04;
22
- --color-content-warning-hover: #9f6207;
23
- --color-content-warning-pressed: #70460b;
21
+ --color-content-warning: #f90;
22
+ --color-content-warning-hover: #cf7d04;
23
+ --color-content-warning-pressed: #9f6207;
24
24
  --color-content-warning-dark: #ffd699;
25
- --color-content-success: #039904;
26
- --color-content-success-hover: #067607;
27
- --color-content-success-pressed: #0a540b;
25
+ --color-content-success: #0b0;
26
+ --color-content-success-hover: #039904;
27
+ --color-content-success-pressed: #067607;
28
28
  --color-content-success-dark: #99e499;
29
- --color-content-info: #6a05d0;
30
- --color-content-info-hover: #5307a0;
31
- --color-content-info-pressed: #3d0a71;
29
+ --color-content-info: #8002ff;
30
+ --color-content-info-hover: #6a05d0;
31
+ --color-content-info-pressed: #5307a0;
32
32
  --color-content-info-dark: #cd9aff;
33
33
  --color-content-primary-inverse: #1e1d22;
34
34
  --color-background-main-inverse: #d9dade;
@@ -50,61 +50,61 @@
50
50
  --color-background-tertiary-pressed: #7e8194;
51
51
  --color-background-disabled: #2c2c33;
52
52
  --color-background-action: #039904;
53
- --color-background-action-hover: #067607;
54
- --color-background-action-pressed: #0a540b;
55
- --color-background-action-active-disabled: #0f1811;
53
+ --color-background-action-hover: #0b0;
54
+ --color-background-action-pressed: #33c933;
55
+ --color-background-action-active-disabled: #067607;
56
56
  --color-background-action-light: #0d310e;
57
- --color-background-action-light-hover: #0e2010;
58
- --color-background-action-light-pressed: #0f1811;
57
+ --color-background-action-light-hover: #0a540b;
58
+ --color-background-action-light-pressed: #067607;
59
59
  --color-background-accent-action-light: #067607;
60
- --color-background-accent-action-light-hover: #0a540b;
61
- --color-background-accent-action-light-pressed: #0d310e;
60
+ --color-background-accent-action-light-hover: #039904;
61
+ --color-background-accent-action-light-pressed: #0b0;
62
62
  --color-background-action-secondary: #0534d0;
63
- --color-background-action-secondary-hover: #082ba0;
64
- --color-background-action-secondary-pressed: #0a2171;
65
- --color-background-action-secondary-active-disabled: #0f111e;
63
+ --color-background-action-secondary-hover: #023dff;
64
+ --color-background-action-secondary-pressed: #3564ff;
65
+ --color-background-action-secondary-active-disabled: #082ba0;
66
66
  --color-background-action-secondary-light: #0d1841;
67
- --color-background-action-secondary-light-hover: #0f142a;
68
- --color-background-action-secondary-light-pressed: #0f111e;
67
+ --color-background-action-secondary-light-hover: #0a2171;
68
+ --color-background-action-secondary-light-pressed: #082ba0;
69
69
  --color-background-accent-action-secondary-light: #082ba0;
70
- --color-background-accent-action-secondary-light-hover: #0a2171;
71
- --color-background-accent-action-secondary-light-pressed: #0d1841;
70
+ --color-background-accent-action-secondary-light-hover: #0534d0;
71
+ --color-background-accent-action-secondary-light-pressed: #023dff;
72
72
  --color-background-error: #cf4a4b;
73
- --color-background-error-hover: #9f3b3d;
74
- --color-background-error-pressed: #702d2e;
73
+ --color-background-error-hover: #ff5959;
74
+ --color-background-error-pressed: #ff7a7a;
75
75
  --color-background-error-light: #401e20;
76
- --color-background-error-light-hover: #281619;
77
- --color-background-error-light-pressed: #1c1316;
76
+ --color-background-error-light-hover: #702d2e;
77
+ --color-background-error-light-pressed: #9f3b3d;
78
78
  --color-background-accent-error-light: #9f3b3d;
79
- --color-background-accent-error-light-hover: #702d2e;
80
- --color-background-accent-error-light-pressed: #401e20;
79
+ --color-background-accent-error-light-hover: #cf4a4b;
80
+ --color-background-accent-error-light-pressed: #ff5959;
81
81
  --color-background-warning: #cf7d04;
82
- --color-background-warning-hover: #9f6207;
83
- --color-background-warning-pressed: #70460b;
82
+ --color-background-warning-hover: #f90;
83
+ --color-background-warning-pressed: #ffad33;
84
84
  --color-background-warning-light: #402b0e;
85
- --color-background-warning-light-hover: #281d10;
86
- --color-background-warning-light-pressed: #1c1611;
85
+ --color-background-warning-light-hover: #70460b;
86
+ --color-background-warning-light-pressed: #9f6207;
87
87
  --color-background-accent-warning-light: #9f6207;
88
- --color-background-accent-warning-light-hover: #70460b;
89
- --color-background-accent-warning-light-pressed: #402b0e;
88
+ --color-background-accent-warning-light-hover: #cf7d04;
89
+ --color-background-accent-warning-light-pressed: #f90;
90
90
  --color-background-success: #039904;
91
- --color-background-success-hover: #067607;
92
- --color-background-success-pressed: #0a540b;
91
+ --color-background-success-hover: #0b0;
92
+ --color-background-success-pressed: #33c933;
93
93
  --color-background-success-light: #0d310e;
94
- --color-background-success-light-hover: #0e2010;
95
- --color-background-success-light-pressed: #0f1811;
94
+ --color-background-success-light-hover: #0a540b;
95
+ --color-background-success-light-pressed: #067607;
96
96
  --color-background-accent-success-light: #067607;
97
- --color-background-accent-success-light-hover: #0a540b;
98
- --color-background-accent-success-light-pressed: #0d310e;
97
+ --color-background-accent-success-light-hover: #039904;
98
+ --color-background-accent-success-light-pressed: #0b0;
99
99
  --color-background-info: #6a05d0;
100
- --color-background-info-hover: #5307a0;
101
- --color-background-info-pressed: #3d0a71;
100
+ --color-background-info-hover: #8002ff;
101
+ --color-background-info-pressed: #9a35ff;
102
102
  --color-background-info-light: #270d41;
103
- --color-background-info-light-hover: #1b0e2a;
104
- --color-background-info-light-pressed: #160e1e;
103
+ --color-background-info-light-hover: #3d0a71;
104
+ --color-background-info-light-pressed: #5307a0;
105
105
  --color-background-accent-info-light: #5307a0;
106
- --color-background-accent-info-light-hover: #3d0a71;
107
- --color-background-accent-info-light-pressed: #270d41;
106
+ --color-background-accent-info-light-hover: #6a05d0;
107
+ --color-background-accent-info-light-pressed: #8002ff;
108
108
  --color-background-overlay: rgb(0 0 0 / 60%);
109
109
  --color-background-ghost: rgb(255 255 255 / 10%);
110
110
  --color-background-ghost-hover: rgb(255 255 255 / 20%);
@@ -1,5 +1,5 @@
1
1
  .Theme_color_ozenDefault {
2
- --color-content-primary: #0d0e12;
2
+ --color-content-primary: #17161a;
3
3
  --color-content-secondary: #636574;
4
4
  --color-content-tertiary: #7e8194;
5
5
  --color-content-disabled: #7e8194;
@@ -51,56 +51,56 @@
51
51
  --color-background-action: #0b0;
52
52
  --color-background-action-hover: #039904;
53
53
  --color-background-action-pressed: #067607;
54
- --color-background-action-active-disabled: #99e499;
55
- --color-background-action-light: #e5f8e5;
56
- --color-background-action-light-hover: #ccf1cc;
57
- --color-background-action-light-pressed: #99e499;
54
+ --color-background-action-active-disabled: #66d666;
55
+ --color-background-action-light: #ccf1cc;
56
+ --color-background-action-light-hover: #99e499;
57
+ --color-background-action-light-pressed: #66d666;
58
58
  --color-background-accent-action-light: #067607;
59
59
  --color-background-accent-action-light-hover: #0a540b;
60
60
  --color-background-accent-action-light-pressed: #0d310e;
61
61
  --color-background-action-secondary: #023dff;
62
62
  --color-background-action-secondary-hover: #0534d0;
63
63
  --color-background-action-secondary-pressed: #082ba0;
64
- --color-background-action-secondary-active-disabled: #9ab1ff;
65
- --color-background-action-secondary-light: #e6ecff;
66
- --color-background-action-secondary-light-hover: #ccd8ff;
67
- --color-background-action-secondary-light-pressed: #9ab1ff;
64
+ --color-background-action-secondary-active-disabled: #678bff;
65
+ --color-background-action-secondary-light: #ccd8ff;
66
+ --color-background-action-secondary-light-hover: #9ab1ff;
67
+ --color-background-action-secondary-light-pressed: #678bff;
68
68
  --color-background-accent-action-secondary-light: #082ba0;
69
69
  --color-background-accent-action-secondary-light-hover: #0a2171;
70
70
  --color-background-accent-action-secondary-light-pressed: #0d1841;
71
71
  --color-background-error: #ff5959;
72
72
  --color-background-error-hover: #cf4a4b;
73
73
  --color-background-error-pressed: #9f3b3d;
74
- --color-background-error-light: #fee;
75
- --color-background-error-light-hover: #ffdede;
76
- --color-background-error-light-pressed: #ffbdbd;
74
+ --color-background-error-light: #ffdede;
75
+ --color-background-error-light-hover: #ffbdbd;
76
+ --color-background-error-light-pressed: #ff9b9b;
77
77
  --color-background-accent-error-light: #9f3b3d;
78
78
  --color-background-accent-error-light-hover: #702d2e;
79
79
  --color-background-accent-error-light-pressed: #401e20;
80
80
  --color-background-warning: #f90;
81
81
  --color-background-warning-hover: #cf7d04;
82
82
  --color-background-warning-pressed: #9f6207;
83
- --color-background-warning-light: #fff5e5;
84
- --color-background-warning-light-hover: #ffebcc;
85
- --color-background-warning-light-pressed: #ffd699;
83
+ --color-background-warning-light: #ffebcc;
84
+ --color-background-warning-light-hover: #ffd699;
85
+ --color-background-warning-light-pressed: #ffc266;
86
86
  --color-background-accent-warning-light: #9f6207;
87
87
  --color-background-accent-warning-light-hover: #70460b;
88
88
  --color-background-accent-warning-light-pressed: #402b0e;
89
89
  --color-background-success: #0b0;
90
90
  --color-background-success-hover: #039904;
91
91
  --color-background-success-pressed: #067607;
92
- --color-background-success-light: #e5f8e5;
93
- --color-background-success-light-hover: #ccf1cc;
94
- --color-background-success-light-pressed: #99e499;
92
+ --color-background-success-light: #ccf1cc;
93
+ --color-background-success-light-hover: #99e499;
94
+ --color-background-success-light-pressed: #66d666;
95
95
  --color-background-accent-success-light: #067607;
96
96
  --color-background-accent-success-light-hover: #0a540b;
97
97
  --color-background-accent-success-light-pressed: #0d310e;
98
98
  --color-background-info: #8002ff;
99
99
  --color-background-info-hover: #6a05d0;
100
100
  --color-background-info-pressed: #5307a0;
101
- --color-background-info-light: #f4e8ff;
102
- --color-background-info-light-hover: #e6ccff;
103
- --color-background-info-light-pressed: #cd9aff;
101
+ --color-background-info-light: #e6ccff;
102
+ --color-background-info-light-hover: #cd9aff;
103
+ --color-background-info-light-pressed: #b367ff;
104
104
  --color-background-accent-info-light: #5307a0;
105
105
  --color-background-accent-info-light-hover: #3d0a71;
106
106
  --color-background-accent-info-light-pressed: #270d41;
@@ -56,6 +56,9 @@ export type ModalProps = {
56
56
  container?: PortalProps['container'];
57
57
  /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
58
58
  ignoreClickOutsideRefs?: Array<RefObject<HTMLElement>>;
59
+ /** Если {true} отключает портал для компонента.
60
+ * Подробнее – https://react.dev/reference/react-dom/createPortal. */
61
+ disablePortal?: boolean;
59
62
  } & PortalProps;
60
63
  export type ModalRef = PortalRef;
61
64
  export declare const Modal: React.ForwardRefExoticComponent<{
@@ -116,6 +119,9 @@ export declare const Modal: React.ForwardRefExoticComponent<{
116
119
  container?: PortalProps['container'];
117
120
  /** Список ссылок на элементы при клике на которые Modal не будет закрываться (см. хук useClickOutside) */
118
121
  ignoreClickOutsideRefs?: React.RefObject<HTMLElement>[] | undefined;
122
+ /** Если {true} отключает портал для компонента.
123
+ * Подробнее – https://react.dev/reference/react-dom/createPortal. */
124
+ disablePortal?: boolean | undefined;
119
125
  } & import("../Portal").PortalBaseProps & {
120
126
  as?: "div" | undefined;
121
127
  } & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "container"> & React.RefAttributes<HTMLDivElement>>;
@@ -15,13 +15,14 @@ import { ModalConsumer } from './components';
15
15
  import { useModalManager } from './index';
16
16
  export var cnModal = cn('Modal');
17
17
  export var Modal = forwardRef(function (_a, ref) {
18
- var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = __rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
18
+ var _b = _a.open, open = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, _d = _a.hideBackdrop, hideBackdrop = _d === void 0 ? false : _d, _e = _a.disableScrollLock, disableScrollLock = _e === void 0 ? false : _e, _f = _a.disableClickOutside, disableClickOutside = _f === void 0 ? false : _f, _g = _a.disableEscapeKeyDown, disableEscapeKeyDown = _g === void 0 ? false : _g, _h = _a.disablePortal, disablePortal = _h === void 0 ? false : _h, children = _a.children, onEnter = _a.onEnter, onEntered = _a.onEntered, onExit = _a.onExit, onExitedProp = _a.onExited, onClose = _a.onClose, backdropProps = _a.backdropProps, windowProps = _a.windowProps, transitionProps = _a.transitionProps, className = _a.className, ignoreClickOutsideRefs = _a.ignoreClickOutsideRefs, other = __rest(_a, ["open", "keepMounted", "hideBackdrop", "disableScrollLock", "disableClickOutside", "disableEscapeKeyDown", "disablePortal", "children", "onEnter", "onEntered", "onExit", "onExited", "onClose", "backdropProps", "windowProps", "transitionProps", "className", "ignoreClickOutsideRefs"]);
19
19
  var hasBackdrop = !hideBackdrop;
20
20
  var modalInnerRef = useRef(null);
21
21
  var focusedElement = useRef(null);
22
- var _h = __read(useState(false), 2), openState = _h[0], setOpenState = _h[1];
23
- var _j = __read(useState(false), 2), opened = _j[0], setOpened = _j[1];
24
- var _k = useModalManager(modalInnerRef, 1000, openState), isTop = _k.isTop, refsClickOutside = _k.refsClickOutside;
22
+ var _j = __read(useState(false), 2), openState = _j[0], setOpenState = _j[1];
23
+ var _k = __read(useState(false), 2), opened = _k[0], setOpened = _k[1];
24
+ var _l = useModalManager(modalInnerRef, 1000, openState), isTop = _l.isTop, refsClickOutside = _l.refsClickOutside;
25
+ var RootComponent = disablePortal ? 'div' : Portal;
25
26
  useClickOutside({
26
27
  refs: __spreadArray(__spreadArray([
27
28
  modalInnerRef
@@ -70,7 +71,7 @@ export var Modal = forwardRef(function (_a, ref) {
70
71
  active: isTop && !disableEscapeKeyDown,
71
72
  });
72
73
  return (React.createElement(CSSTransition, __assign({ classNames: cnModal({ animation: true }), timeout: 300 }, transitionProps, { in: openState, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExited: onExited, unmountOnExit: !keepMounted, appear: true }),
73
- React.createElement(Portal, __assign({}, other, { className: cnModal({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
74
+ React.createElement(RootComponent, __assign({}, other, { className: cnModal({ hidden: keepMounted && !openState, hasBackdrop: hasBackdrop }, [className]), ref: ref }),
74
75
  !hideBackdrop && (React.createElement(Backdrop, __assign({ zIndex: -1 }, backdropProps, { open: openState, className: backdropProps === null || backdropProps === void 0 ? void 0 : backdropProps.className }))),
75
76
  React.createElement(ModalConsumer, __assign({}, windowProps, { ref: useMultiRef([modalInnerRef, trapRef, windowProps === null || windowProps === void 0 ? void 0 : windowProps.ref]) }), children))));
76
77
  });
@@ -7,6 +7,7 @@
7
7
  gap: var(--space-xs);
8
8
  outline: none;
9
9
  border: none;
10
+ text-decoration: none;
10
11
  }
11
12
  .Tag_size_2xs {
12
13
  font: var(--typography-text-3xs-font);
@@ -5,30 +5,30 @@
5
5
  --color-content-tertiary: #7e8194;
6
6
  --color-content-disabled: #7e8194;
7
7
  --color-content-ghost-disabled: rgb(255 255 255 / 40%);
8
- --color-content-action: #0534d0;
9
- --color-content-action-hover: #082ba0;
10
- --color-content-action-pressed: #0a2171;
8
+ --color-content-action: #023dff;
9
+ --color-content-action-hover: #0534d0;
10
+ --color-content-action-pressed: #082ba0;
11
11
  --color-content-action-dark: #9ab1ff;
12
- --color-content-action-secondary: #d7d8e1;
13
- --color-content-action-secondary-hover: #c2c5d3;
14
- --color-content-action-secondary-pressed: #aeb1c4;
15
- --color-content-action-secondary-dark: #9a9eb5;
12
+ --color-content-action-secondary: #9a9eb5;
13
+ --color-content-action-secondary-hover: #7e8194;
14
+ --color-content-action-secondary-pressed: #636574;
15
+ --color-content-action-secondary-dark: #d7d8e1;
16
16
  --color-background-main: #1e1d22;
17
- --color-content-error: #cf4a4b;
18
- --color-content-error-hover: #9f3b3d;
19
- --color-content-error-pressed: #702d2e;
17
+ --color-content-error: #ff5959;
18
+ --color-content-error-hover: #cf4a4b;
19
+ --color-content-error-pressed: #9f3b3d;
20
20
  --color-content-error-dark: #ffbdbd;
21
- --color-content-warning: #cf7d04;
22
- --color-content-warning-hover: #9f6207;
23
- --color-content-warning-pressed: #70460b;
21
+ --color-content-warning: #f90;
22
+ --color-content-warning-hover: #cf7d04;
23
+ --color-content-warning-pressed: #9f6207;
24
24
  --color-content-warning-dark: #ffd699;
25
- --color-content-success: #039904;
26
- --color-content-success-hover: #067607;
27
- --color-content-success-pressed: #0a540b;
25
+ --color-content-success: #0b0;
26
+ --color-content-success-hover: #039904;
27
+ --color-content-success-pressed: #067607;
28
28
  --color-content-success-dark: #99e499;
29
- --color-content-info: #6a05d0;
30
- --color-content-info-hover: #5307a0;
31
- --color-content-info-pressed: #3d0a71;
29
+ --color-content-info: #8002ff;
30
+ --color-content-info-hover: #6a05d0;
31
+ --color-content-info-pressed: #5307a0;
32
32
  --color-content-info-dark: #cd9aff;
33
33
  --color-content-primary-inverse: #17161a;
34
34
  --color-background-main-inverse: #d9dade;
@@ -50,61 +50,61 @@
50
50
  --color-background-tertiary-pressed: #7e8194;
51
51
  --color-background-disabled: #2c2c33;
52
52
  --color-background-action: #0534d0;
53
- --color-background-action-hover: #082ba0;
54
- --color-background-action-pressed: #0a2171;
55
- --color-background-action-active-disabled: #0f111e;
53
+ --color-background-action-hover: #023dff;
54
+ --color-background-action-pressed: #3564ff;
55
+ --color-background-action-active-disabled: #082ba0;
56
56
  --color-background-action-light: #0d1841;
57
- --color-background-action-light-hover: #0f142a;
58
- --color-background-action-light-pressed: #0f111e;
57
+ --color-background-action-light-hover: #0a2171;
58
+ --color-background-action-light-pressed: #082ba0;
59
59
  --color-background-accent-action-light: #082ba0;
60
- --color-background-accent-action-light-hover: #0a2171;
61
- --color-background-accent-action-light-pressed: #0d1841;
62
- --color-background-action-secondary: #aeb1c4;
60
+ --color-background-accent-action-light-hover: #0534d0;
61
+ --color-background-accent-action-light-pressed: #023dff;
62
+ --color-background-action-secondary: #7e8194;
63
63
  --color-background-action-secondary-hover: #9a9eb5;
64
- --color-background-action-secondary-pressed: #7e8194;
65
- --color-background-action-secondary-disabled: #474853;
64
+ --color-background-action-secondary-pressed: #aeb1c4;
65
+ --color-background-action-secondary-disabled: #636574;
66
66
  --color-background-action-secondary-light: #2c2c33;
67
- --color-background-action-secondary-light-hover: #636574;
68
- --color-background-action-secondary-light-pressed: #474853;
67
+ --color-background-action-secondary-light-hover: #474853;
68
+ --color-background-action-secondary-light-pressed: #636574;
69
69
  --color-background-accent-action-secondary-light: #2c2c33;
70
- --color-background-accent-action-secondary-light-hover: #0a540b;
71
- --color-background-accent-action-secondary-light-pressed: #0d310e;
70
+ --color-background-accent-action-secondary-light-hover: #474853;
71
+ --color-background-accent-action-secondary-light-pressed: #636574;
72
72
  --color-background-error: #cf4a4b;
73
- --color-background-error-hover: #9f3b3d;
74
- --color-background-error-pressed: #702d2e;
73
+ --color-background-error-hover: #ff5959;
74
+ --color-background-error-pressed: #ff7a7a;
75
75
  --color-background-error-light: #401e20;
76
- --color-background-error-light-hover: #281619;
77
- --color-background-error-light-pressed: #1c1316;
76
+ --color-background-error-light-hover: #702d2e;
77
+ --color-background-error-light-pressed: #9f3b3d;
78
78
  --color-background-accent-error-light: #9f3b3d;
79
- --color-background-accent-error-light-hover: #702d2e;
80
- --color-background-accent-error-light-pressed: #401e20;
79
+ --color-background-accent-error-light-hover: #cf4a4b;
80
+ --color-background-accent-error-light-pressed: #ff5959;
81
81
  --color-background-warning: #cf7d04;
82
- --color-background-warning-hover: #9f6207;
83
- --color-background-warning-pressed: #70460b;
82
+ --color-background-warning-hover: #f90;
83
+ --color-background-warning-pressed: #ffad33;
84
84
  --color-background-warning-light: #402b0e;
85
- --color-background-warning-light-hover: #281d10;
86
- --color-background-warning-light-pressed: #1c1611;
85
+ --color-background-warning-light-hover: #70460b;
86
+ --color-background-warning-light-pressed: #9f6207;
87
87
  --color-background-accent-warning-light: #9f6207;
88
- --color-background-accent-warning-light-hover: #70460b;
89
- --color-background-accent-warning-light-pressed: #402b0e;
88
+ --color-background-accent-warning-light-hover: #cf7d04;
89
+ --color-background-accent-warning-light-pressed: #f90;
90
90
  --color-background-success: #039904;
91
- --color-background-success-hover: #067607;
92
- --color-background-success-pressed: #0a540b;
91
+ --color-background-success-hover: #0b0;
92
+ --color-background-success-pressed: #33c933;
93
93
  --color-background-success-light: #0d310e;
94
- --color-background-success-light-hover: #0e2010;
95
- --color-background-success-light-pressed: #0f1811;
94
+ --color-background-success-light-hover: #0a540b;
95
+ --color-background-success-light-pressed: #067607;
96
96
  --color-background-accent-success-light: #067607;
97
- --color-background-accent-success-light-hover: #0a540b;
98
- --color-background-accent-success-light-pressed: #0d310e;
97
+ --color-background-accent-success-light-hover: #039904;
98
+ --color-background-accent-success-light-pressed: #0b0;
99
99
  --color-background-info: #6a05d0;
100
- --color-background-info-hover: #5307a0;
101
- --color-background-info-pressed: #3d0a71;
100
+ --color-background-info-hover: #8002ff;
101
+ --color-background-info-pressed: #9a35ff;
102
102
  --color-background-info-light: #270d41;
103
- --color-background-info-light-hover: #1b0e2a;
104
- --color-background-info-light-pressed: #160e1e;
103
+ --color-background-info-light-hover: #3d0a71;
104
+ --color-background-info-light-pressed: #5307a0;
105
105
  --color-background-accent-info-light: #5307a0;
106
- --color-background-accent-info-light-hover: #3d0a71;
107
- --color-background-accent-info-light-pressed: #270d41;
106
+ --color-background-accent-info-light-hover: #6a05d0;
107
+ --color-background-accent-info-light-pressed: #8002ff;
108
108
  --color-background-overlay: rgb(0 0 0 / 60%);
109
109
  --color-background-ghost: rgb(255 255 255 / 10%);
110
110
  --color-background-ghost-hover: rgb(255 255 255 / 20%);
@@ -1,5 +1,5 @@
1
1
  .Theme_color_bBusinessDefault {
2
- --color-content-primary: #0d0e12;
2
+ --color-content-primary: #17161a;
3
3
  --color-content-secondary: #636574;
4
4
  --color-content-tertiary: #7e8194;
5
5
  --color-content-disabled: #7e8194;
@@ -51,56 +51,56 @@
51
51
  --color-background-action: #023dff;
52
52
  --color-background-action-hover: #0534d0;
53
53
  --color-background-action-pressed: #082ba0;
54
- --color-background-action-active-disabled: #9ab1ff;
55
- --color-background-action-light: #e6ecff;
56
- --color-background-action-light-hover: #ccd8ff;
57
- --color-background-action-light-pressed: #9ab1ff;
54
+ --color-background-action-active-disabled: #678bff;
55
+ --color-background-action-light: #ccd8ff;
56
+ --color-background-action-light-hover: #9ab1ff;
57
+ --color-background-action-light-pressed: #678bff;
58
58
  --color-background-accent-action-light: #0534d0;
59
59
  --color-background-accent-action-light-hover: #082ba0;
60
60
  --color-background-accent-action-light-pressed: #0a2171;
61
61
  --color-background-action-secondary: #2c2c33;
62
62
  --color-background-action-secondary-hover: #1e1d22;
63
63
  --color-background-action-secondary-pressed: #17161a;
64
- --color-background-action-secondary-active-disabled: #d7d8e1;
65
- --color-background-action-secondary-light: #f5f5f8;
66
- --color-background-action-secondary-light-hover: #ebecf0;
67
- --color-background-action-secondary-light-pressed: #d7d8e1;
64
+ --color-background-action-secondary-active-disabled: #c2c5d3;
65
+ --color-background-action-secondary-light: #ebecf0;
66
+ --color-background-action-secondary-light-hover: #d7d8e1;
67
+ --color-background-action-secondary-light-pressed: #c2c5d3;
68
68
  --color-background-accent-action-secondary-light: #636574;
69
69
  --color-background-accent-action-secondary-light-hover: #474853;
70
70
  --color-background-accent-action-secondary-light-pressed: #2c2c33;
71
71
  --color-background-error: #ff5959;
72
72
  --color-background-error-hover: #cf4a4b;
73
73
  --color-background-error-pressed: #9f3b3d;
74
- --color-background-error-light: #fee;
75
- --color-background-error-light-hover: #ffdede;
76
- --color-background-error-light-pressed: #ffbdbd;
74
+ --color-background-error-light: #ffdede;
75
+ --color-background-error-light-hover: #ffbdbd;
76
+ --color-background-error-light-pressed: #ff9b9b;
77
77
  --color-background-accent-error-light: #9f3b3d;
78
78
  --color-background-accent-error-light-hover: #702d2e;
79
79
  --color-background-accent-error-light-pressed: #401e20;
80
80
  --color-background-warning: #f90;
81
81
  --color-background-warning-hover: #cf7d04;
82
82
  --color-background-warning-pressed: #9f6207;
83
- --color-background-warning-light: #fff5e5;
84
- --color-background-warning-light-hover: #ffebcc;
85
- --color-background-warning-light-pressed: #ffd699;
83
+ --color-background-warning-light: #ffebcc;
84
+ --color-background-warning-light-hover: #ffd699;
85
+ --color-background-warning-light-pressed: #ffc266;
86
86
  --color-background-accent-warning-light: #9f6207;
87
87
  --color-background-accent-warning-light-hover: #70460b;
88
88
  --color-background-accent-warning-light-pressed: #402b0e;
89
89
  --color-background-success: #0b0;
90
90
  --color-background-success-hover: #039904;
91
91
  --color-background-success-pressed: #067607;
92
- --color-background-success-light: #e5f8e5;
93
- --color-background-success-light-hover: #ccf1cc;
94
- --color-background-success-light-pressed: #99e499;
92
+ --color-background-success-light: #ccf1cc;
93
+ --color-background-success-light-hover: #99e499;
94
+ --color-background-success-light-pressed: #66d666;
95
95
  --color-background-accent-success-light: #067607;
96
96
  --color-background-accent-success-light-hover: #0a540b;
97
97
  --color-background-accent-success-light-pressed: #0d310e;
98
98
  --color-background-info: #8002ff;
99
99
  --color-background-info-hover: #6a05d0;
100
100
  --color-background-info-pressed: #5307a0;
101
- --color-background-info-light: #f4e8ff;
102
- --color-background-info-light-hover: #e6ccff;
103
- --color-background-info-light-pressed: #cd9aff;
101
+ --color-background-info-light: #e6ccff;
102
+ --color-background-info-light-hover: #cd9aff;
103
+ --color-background-info-light-pressed: #b367ff;
104
104
  --color-background-accent-info-light: #5307a0;
105
105
  --color-background-accent-info-light-hover: #3d0a71;
106
106
  --color-background-accent-info-light-pressed: #270d41;
@@ -5,30 +5,30 @@
5
5
  --color-content-tertiary: #7e8194;
6
6
  --color-content-disabled: #7e8194;
7
7
  --color-content-ghost-disabled: rgb(255 255 255 / 40%);
8
- --color-content-action: #039904;
9
- --color-content-action-hover: #067607;
10
- --color-content-action-pressed: #0a540b;
8
+ --color-content-action: #0b0;
9
+ --color-content-action-hover: #039904;
10
+ --color-content-action-pressed: #067607;
11
11
  --color-content-action-dark: #99e499;
12
- --color-content-action-secondary: #0534d0;
13
- --color-content-action-secondary-hover: #082ba0;
14
- --color-content-action-secondary-pressed: #0a2171;
12
+ --color-content-action-secondary: #023dff;
13
+ --color-content-action-secondary-hover: #0534d0;
14
+ --color-content-action-secondary-pressed: #082ba0;
15
15
  --color-content-action-secondary-dark: #9ab1ff;
16
16
  --color-background-main: #1e1d22;
17
- --color-content-error: #cf4a4b;
18
- --color-content-error-hover: #9f3b3d;
19
- --color-content-error-pressed: #702d2e;
17
+ --color-content-error: #ff5959;
18
+ --color-content-error-hover: #cf4a4b;
19
+ --color-content-error-pressed: #9f3b3d;
20
20
  --color-content-error-dark: #ffbdbd;
21
- --color-content-warning: #cf7d04;
22
- --color-content-warning-hover: #9f6207;
23
- --color-content-warning-pressed: #70460b;
21
+ --color-content-warning: #f90;
22
+ --color-content-warning-hover: #cf7d04;
23
+ --color-content-warning-pressed: #9f6207;
24
24
  --color-content-warning-dark: #ffd699;
25
- --color-content-success: #039904;
26
- --color-content-success-hover: #067607;
27
- --color-content-success-pressed: #0a540b;
25
+ --color-content-success: #0b0;
26
+ --color-content-success-hover: #039904;
27
+ --color-content-success-pressed: #067607;
28
28
  --color-content-success-dark: #99e499;
29
- --color-content-info: #6a05d0;
30
- --color-content-info-hover: #5307a0;
31
- --color-content-info-pressed: #3d0a71;
29
+ --color-content-info: #8002ff;
30
+ --color-content-info-hover: #6a05d0;
31
+ --color-content-info-pressed: #5307a0;
32
32
  --color-content-info-dark: #cd9aff;
33
33
  --color-content-primary-inverse: #1e1d22;
34
34
  --color-background-main-inverse: #d9dade;
@@ -50,61 +50,61 @@
50
50
  --color-background-tertiary-pressed: #7e8194;
51
51
  --color-background-disabled: #2c2c33;
52
52
  --color-background-action: #039904;
53
- --color-background-action-hover: #067607;
54
- --color-background-action-pressed: #0a540b;
55
- --color-background-action-active-disabled: #0f1811;
53
+ --color-background-action-hover: #0b0;
54
+ --color-background-action-pressed: #33c933;
55
+ --color-background-action-active-disabled: #067607;
56
56
  --color-background-action-light: #0d310e;
57
- --color-background-action-light-hover: #0e2010;
58
- --color-background-action-light-pressed: #0f1811;
57
+ --color-background-action-light-hover: #0a540b;
58
+ --color-background-action-light-pressed: #067607;
59
59
  --color-background-accent-action-light: #067607;
60
- --color-background-accent-action-light-hover: #0a540b;
61
- --color-background-accent-action-light-pressed: #0d310e;
60
+ --color-background-accent-action-light-hover: #039904;
61
+ --color-background-accent-action-light-pressed: #0b0;
62
62
  --color-background-action-secondary: #0534d0;
63
- --color-background-action-secondary-hover: #082ba0;
64
- --color-background-action-secondary-pressed: #0a2171;
65
- --color-background-action-secondary-active-disabled: #0f111e;
63
+ --color-background-action-secondary-hover: #023dff;
64
+ --color-background-action-secondary-pressed: #3564ff;
65
+ --color-background-action-secondary-active-disabled: #082ba0;
66
66
  --color-background-action-secondary-light: #0d1841;
67
- --color-background-action-secondary-light-hover: #0f142a;
68
- --color-background-action-secondary-light-pressed: #0f111e;
67
+ --color-background-action-secondary-light-hover: #0a2171;
68
+ --color-background-action-secondary-light-pressed: #082ba0;
69
69
  --color-background-accent-action-secondary-light: #082ba0;
70
- --color-background-accent-action-secondary-light-hover: #0a2171;
71
- --color-background-accent-action-secondary-light-pressed: #0d1841;
70
+ --color-background-accent-action-secondary-light-hover: #0534d0;
71
+ --color-background-accent-action-secondary-light-pressed: #023dff;
72
72
  --color-background-error: #cf4a4b;
73
- --color-background-error-hover: #9f3b3d;
74
- --color-background-error-pressed: #702d2e;
73
+ --color-background-error-hover: #ff5959;
74
+ --color-background-error-pressed: #ff7a7a;
75
75
  --color-background-error-light: #401e20;
76
- --color-background-error-light-hover: #281619;
77
- --color-background-error-light-pressed: #1c1316;
76
+ --color-background-error-light-hover: #702d2e;
77
+ --color-background-error-light-pressed: #9f3b3d;
78
78
  --color-background-accent-error-light: #9f3b3d;
79
- --color-background-accent-error-light-hover: #702d2e;
80
- --color-background-accent-error-light-pressed: #401e20;
79
+ --color-background-accent-error-light-hover: #cf4a4b;
80
+ --color-background-accent-error-light-pressed: #ff5959;
81
81
  --color-background-warning: #cf7d04;
82
- --color-background-warning-hover: #9f6207;
83
- --color-background-warning-pressed: #70460b;
82
+ --color-background-warning-hover: #f90;
83
+ --color-background-warning-pressed: #ffad33;
84
84
  --color-background-warning-light: #402b0e;
85
- --color-background-warning-light-hover: #281d10;
86
- --color-background-warning-light-pressed: #1c1611;
85
+ --color-background-warning-light-hover: #70460b;
86
+ --color-background-warning-light-pressed: #9f6207;
87
87
  --color-background-accent-warning-light: #9f6207;
88
- --color-background-accent-warning-light-hover: #70460b;
89
- --color-background-accent-warning-light-pressed: #402b0e;
88
+ --color-background-accent-warning-light-hover: #cf7d04;
89
+ --color-background-accent-warning-light-pressed: #f90;
90
90
  --color-background-success: #039904;
91
- --color-background-success-hover: #067607;
92
- --color-background-success-pressed: #0a540b;
91
+ --color-background-success-hover: #0b0;
92
+ --color-background-success-pressed: #33c933;
93
93
  --color-background-success-light: #0d310e;
94
- --color-background-success-light-hover: #0e2010;
95
- --color-background-success-light-pressed: #0f1811;
94
+ --color-background-success-light-hover: #0a540b;
95
+ --color-background-success-light-pressed: #067607;
96
96
  --color-background-accent-success-light: #067607;
97
- --color-background-accent-success-light-hover: #0a540b;
98
- --color-background-accent-success-light-pressed: #0d310e;
97
+ --color-background-accent-success-light-hover: #039904;
98
+ --color-background-accent-success-light-pressed: #0b0;
99
99
  --color-background-info: #6a05d0;
100
- --color-background-info-hover: #5307a0;
101
- --color-background-info-pressed: #3d0a71;
100
+ --color-background-info-hover: #8002ff;
101
+ --color-background-info-pressed: #9a35ff;
102
102
  --color-background-info-light: #270d41;
103
- --color-background-info-light-hover: #1b0e2a;
104
- --color-background-info-light-pressed: #160e1e;
103
+ --color-background-info-light-hover: #3d0a71;
104
+ --color-background-info-light-pressed: #5307a0;
105
105
  --color-background-accent-info-light: #5307a0;
106
- --color-background-accent-info-light-hover: #3d0a71;
107
- --color-background-accent-info-light-pressed: #270d41;
106
+ --color-background-accent-info-light-hover: #6a05d0;
107
+ --color-background-accent-info-light-pressed: #8002ff;
108
108
  --color-background-overlay: rgb(0 0 0 / 60%);
109
109
  --color-background-ghost: rgb(255 255 255 / 10%);
110
110
  --color-background-ghost-hover: rgb(255 255 255 / 20%);
@@ -1,5 +1,5 @@
1
1
  .Theme_color_ozenDefault {
2
- --color-content-primary: #0d0e12;
2
+ --color-content-primary: #17161a;
3
3
  --color-content-secondary: #636574;
4
4
  --color-content-tertiary: #7e8194;
5
5
  --color-content-disabled: #7e8194;
@@ -51,56 +51,56 @@
51
51
  --color-background-action: #0b0;
52
52
  --color-background-action-hover: #039904;
53
53
  --color-background-action-pressed: #067607;
54
- --color-background-action-active-disabled: #99e499;
55
- --color-background-action-light: #e5f8e5;
56
- --color-background-action-light-hover: #ccf1cc;
57
- --color-background-action-light-pressed: #99e499;
54
+ --color-background-action-active-disabled: #66d666;
55
+ --color-background-action-light: #ccf1cc;
56
+ --color-background-action-light-hover: #99e499;
57
+ --color-background-action-light-pressed: #66d666;
58
58
  --color-background-accent-action-light: #067607;
59
59
  --color-background-accent-action-light-hover: #0a540b;
60
60
  --color-background-accent-action-light-pressed: #0d310e;
61
61
  --color-background-action-secondary: #023dff;
62
62
  --color-background-action-secondary-hover: #0534d0;
63
63
  --color-background-action-secondary-pressed: #082ba0;
64
- --color-background-action-secondary-active-disabled: #9ab1ff;
65
- --color-background-action-secondary-light: #e6ecff;
66
- --color-background-action-secondary-light-hover: #ccd8ff;
67
- --color-background-action-secondary-light-pressed: #9ab1ff;
64
+ --color-background-action-secondary-active-disabled: #678bff;
65
+ --color-background-action-secondary-light: #ccd8ff;
66
+ --color-background-action-secondary-light-hover: #9ab1ff;
67
+ --color-background-action-secondary-light-pressed: #678bff;
68
68
  --color-background-accent-action-secondary-light: #082ba0;
69
69
  --color-background-accent-action-secondary-light-hover: #0a2171;
70
70
  --color-background-accent-action-secondary-light-pressed: #0d1841;
71
71
  --color-background-error: #ff5959;
72
72
  --color-background-error-hover: #cf4a4b;
73
73
  --color-background-error-pressed: #9f3b3d;
74
- --color-background-error-light: #fee;
75
- --color-background-error-light-hover: #ffdede;
76
- --color-background-error-light-pressed: #ffbdbd;
74
+ --color-background-error-light: #ffdede;
75
+ --color-background-error-light-hover: #ffbdbd;
76
+ --color-background-error-light-pressed: #ff9b9b;
77
77
  --color-background-accent-error-light: #9f3b3d;
78
78
  --color-background-accent-error-light-hover: #702d2e;
79
79
  --color-background-accent-error-light-pressed: #401e20;
80
80
  --color-background-warning: #f90;
81
81
  --color-background-warning-hover: #cf7d04;
82
82
  --color-background-warning-pressed: #9f6207;
83
- --color-background-warning-light: #fff5e5;
84
- --color-background-warning-light-hover: #ffebcc;
85
- --color-background-warning-light-pressed: #ffd699;
83
+ --color-background-warning-light: #ffebcc;
84
+ --color-background-warning-light-hover: #ffd699;
85
+ --color-background-warning-light-pressed: #ffc266;
86
86
  --color-background-accent-warning-light: #9f6207;
87
87
  --color-background-accent-warning-light-hover: #70460b;
88
88
  --color-background-accent-warning-light-pressed: #402b0e;
89
89
  --color-background-success: #0b0;
90
90
  --color-background-success-hover: #039904;
91
91
  --color-background-success-pressed: #067607;
92
- --color-background-success-light: #e5f8e5;
93
- --color-background-success-light-hover: #ccf1cc;
94
- --color-background-success-light-pressed: #99e499;
92
+ --color-background-success-light: #ccf1cc;
93
+ --color-background-success-light-hover: #99e499;
94
+ --color-background-success-light-pressed: #66d666;
95
95
  --color-background-accent-success-light: #067607;
96
96
  --color-background-accent-success-light-hover: #0a540b;
97
97
  --color-background-accent-success-light-pressed: #0d310e;
98
98
  --color-background-info: #8002ff;
99
99
  --color-background-info-hover: #6a05d0;
100
100
  --color-background-info-pressed: #5307a0;
101
- --color-background-info-light: #f4e8ff;
102
- --color-background-info-light-hover: #e6ccff;
103
- --color-background-info-light-pressed: #cd9aff;
101
+ --color-background-info-light: #e6ccff;
102
+ --color-background-info-light-hover: #cd9aff;
103
+ --color-background-info-light-pressed: #b367ff;
104
104
  --color-background-accent-info-light: #5307a0;
105
105
  --color-background-accent-info-light-hover: #3d0a71;
106
106
  --color-background-accent-info-light-pressed: #270d41;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ozen-ui/kit",
3
- "version": "0.27.0",
3
+ "version": "0.29.0",
4
4
  "description": "React component library",
5
5
  "files": [
6
6
  "*"
@@ -1,5 +0,0 @@
1
- {
2
- "main": "../__inner__/cjs/components/Calendar/index.js",
3
- "module": "../__inner__/esm/components/Calendar/index.js",
4
- "types": "../__inner__/esm/components/Calendar/index.d.ts"
5
- }
@@ -1,5 +0,0 @@
1
- {
2
- "main": "../__inner__/cjs/components/DatePicker/index.js",
3
- "module": "../__inner__/esm/components/DatePicker/index.js",
4
- "types": "../__inner__/esm/components/DatePicker/index.d.ts"
5
- }
@@ -1,15 +0,0 @@
1
- import { type RefObject } from 'react';
2
- export declare const PortalContext: import("react").Context<{
3
- top?: boolean | undefined;
4
- setTop?: ((top: boolean | undefined) => void) | undefined;
5
- refs?: RefObject<HTMLElement>[] | undefined;
6
- setRefs?: ((refs: RefObject<HTMLElement>[]) => void) | undefined;
7
- clearRefs?: (() => void) | undefined;
8
- }>;
9
- export declare function usePortalContext(): {
10
- top?: boolean | undefined;
11
- setTop?: ((top: boolean | undefined) => void) | undefined;
12
- refs?: RefObject<HTMLElement>[] | undefined;
13
- setRefs?: ((refs: RefObject<HTMLElement>[]) => void) | undefined;
14
- clearRefs?: (() => void) | undefined;
15
- };
@@ -1,9 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.usePortalContext = exports.PortalContext = void 0;
4
- var react_1 = require("react");
5
- exports.PortalContext = (0, react_1.createContext)({});
6
- function usePortalContext() {
7
- return (0, react_1.useContext)(exports.PortalContext);
8
- }
9
- exports.usePortalContext = usePortalContext;
@@ -1,15 +0,0 @@
1
- import { type RefObject } from 'react';
2
- export declare const PortalContext: import("react").Context<{
3
- top?: boolean | undefined;
4
- setTop?: ((top: boolean | undefined) => void) | undefined;
5
- refs?: RefObject<HTMLElement>[] | undefined;
6
- setRefs?: ((refs: RefObject<HTMLElement>[]) => void) | undefined;
7
- clearRefs?: (() => void) | undefined;
8
- }>;
9
- export declare function usePortalContext(): {
10
- top?: boolean | undefined;
11
- setTop?: ((top: boolean | undefined) => void) | undefined;
12
- refs?: RefObject<HTMLElement>[] | undefined;
13
- setRefs?: ((refs: RefObject<HTMLElement>[]) => void) | undefined;
14
- clearRefs?: (() => void) | undefined;
15
- };
@@ -1,5 +0,0 @@
1
- import { createContext, useContext } from 'react';
2
- export var PortalContext = createContext({});
3
- export function usePortalContext() {
4
- return useContext(PortalContext);
5
- }