@ozen-ui/kit 0.38.0 → 0.40.0

package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDark.css

@@ -3,7 +3,7 @@
   --color-content-secondary: #aeb1c4;
   --color-content-primary: #fff;
   --color-content-tertiary: #7e8194;
-  --color-content-disabled: #7e8194;
+  --color-content-disabled: #636574;
   --color-content-ghost-disabled: rgb(255 255 255 / 40%);
   --color-content-action: #0b0;
   --color-content-action-hover: #039904;
@@ -145,28 +145,28 @@
   --color-accent-tertiary-pressed: #43475b;
   --color-accent-disabled: #2f3240;
   --color-accent-main-inverse: #c7c8ce;
-  --color-additional-a1: #0b6abe;
-  --color-additional-a2: #1899e9;
-  --color-additional-a3: #b3f1ff;
-  --color-additional-b1: #b5215f;
-  --color-additional-b2: #e62d73;
-  --color-additional-b3: #ffb5cd;
-  --color-additional-c1: #e64920;
-  --color-additional-c2: #f46c1b;
-  --color-additional-c3: #ffe2a8;
-  --color-additional-d1: #ff8e00;
-  --color-additional-d2: #ffc100;
-  --color-additional-d3: #fff9a2;
-  --color-additional-e1: #771db4;
-  --color-additional-e2: #a02be5;
-  --color-additional-e3: #e9b7fe;
-  --color-additional-f1: #107c60;
-  --color-additional-f2: #17ae87;
-  --color-additional-f3: #abeada;
-  --color-additional-g1: #b88f27;
-  --color-additional-g2: #e0b548;
-  --color-additional-g3: #f4d37d;
-  --color-additional-h1: #747e89;
-  --color-additional-h2: #bdc4cb;
-  --color-additional-h3: #e1e4e7;
+  --color-additional-a1: #866c47;
+  --color-additional-a2: #d4aa6b;
+  --color-additional-a3: #eeddc4;
+  --color-additional-b1: #763986;
+  --color-additional-b2: #ba55d3;
+  --color-additional-b3: #e3bbed;
+  --color-additional-c1: #638125;
+  --color-additional-c2: #9acd32;
+  --color-additional-c3: #d7ebad;
+  --color-additional-d1: #23867f;
+  --color-additional-d2: #30d5c8;
+  --color-additional-d3: #aceee9;
+  --color-additional-e1: #9f5237;
+  --color-additional-e2: #ff7f50;
+  --color-additional-e3: #ffccb9;
+  --color-additional-f1: #1966a0;
+  --color-additional-f2: #1fa1ff;
+  --color-additional-f3: #a5d9ff;
+  --color-additional-g1: #9a4270;
+  --color-additional-g2: #f664af;
+  --color-additional-g3: #fbc1df;
+  --color-additional-h1: #9f891a;
+  --color-additional-h2: #ffda1f;
+  --color-additional-h3: #fff0a5;
 }

package/__inner__/cjs/components/ThemeProvider/_color/Theme_color_ozenDefault.css

@@ -116,7 +116,7 @@
   --color-border-secondary: #d7d8e1;
   --color-border-secondary-hover: #c2c5d3;
   --color-border-secondary-pressed: #aeb1c4;
-  --color-border-disabled: #d7d8e1;
+  --color-border-disabled: #c2c5d3;
   --color-border-ghost-disabled: rgb(255 255 255 / 40%);
   --color-border-focused: #99e499;
   --color-border-action: #0b0;
@@ -145,28 +145,28 @@
   --color-accent-tertiary-pressed: #43475b;
   --color-accent-disabled: #2f3240;
   --color-accent-main-inverse: #c7c8ce;
-  --color-additional-a1: #0b6abe;
-  --color-additional-a2: #1899e9;
-  --color-additional-a3: #b3f1ff;
-  --color-additional-b1: #b5215f;
-  --color-additional-b2: #e62d73;
-  --color-additional-b3: #ffb5cd;
-  --color-additional-c1: #e64920;
-  --color-additional-c2: #f46c1b;
-  --color-additional-c3: #ffe2a8;
-  --color-additional-d1: #ff8e00;
-  --color-additional-d2: #ffc100;
-  --color-additional-d3: #fff9a2;
-  --color-additional-e1: #771db4;
-  --color-additional-e2: #a02be5;
-  --color-additional-e3: #e9b7fe;
-  --color-additional-f1: #107c60;
-  --color-additional-f2: #17ae87;
-  --color-additional-f3: #abeada;
-  --color-additional-g1: #b88f27;
-  --color-additional-g2: #e0b548;
-  --color-additional-g3: #f4d37d;
-  --color-additional-h1: #747e89;
-  --color-additional-h2: #bdc4cb;
-  --color-additional-h3: #e1e4e7;
+  --color-additional-a1: #866c47;
+  --color-additional-a2: #d4aa6b;
+  --color-additional-a3: #eeddc4;
+  --color-additional-b1: #763986;
+  --color-additional-b2: #ba55d3;
+  --color-additional-b3: #e3bbed;
+  --color-additional-c1: #638125;
+  --color-additional-c2: #9acd32;
+  --color-additional-c3: #d7ebad;
+  --color-additional-d1: #23867f;
+  --color-additional-d2: #30d5c8;
+  --color-additional-d3: #aceee9;
+  --color-additional-e1: #9f5237;
+  --color-additional-e2: #ff7f50;
+  --color-additional-e3: #ffccb9;
+  --color-additional-f1: #1966a0;
+  --color-additional-f2: #1fa1ff;
+  --color-additional-f3: #a5d9ff;
+  --color-additional-g1: #9a4270;
+  --color-additional-g2: #f664af;
+  --color-additional-g3: #fbc1df;
+  --color-additional-h1: #9f891a;
+  --color-additional-h2: #ffda1f;
+  --color-additional-h3: #fff0a5;
 }

package/__inner__/cjs/components/Tooltip/Tooltip.css

@@ -3,7 +3,7 @@
   max-inline-size: 300px;
 }
 .Tooltip_size_xs {
-      padding: var(--space-s) var(--space-m);
+      padding: var(--spacing-2xs) var(--spacing-xs);
 
       font: var(--typography-text-xs-font);
 
@@ -12,7 +12,7 @@
       text-transform: var(--typography-text-xs-text_transform, none);
     }
 .Tooltip_size_s {
-      padding: var(--space-m) var(--space-l);
+      padding: var(--spacing-xs) var(--spacing-s);
 
       font: var(--typography-text-s-font);
 

package/__inner__/cjs/components/Typography/Typography.css

@@ -125,7 +125,7 @@
       text-transform: var(--typography-heading-4xl-text_transform, none);
     }
 .Typography_variant_heading-4xl.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_heading-3xl {
       font: var(--typography-heading-3xl-font);
@@ -133,7 +133,7 @@
       text-transform: var(--typography-heading-3xl-text_transform, none);
     }
 .Typography_variant_heading-3xl.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_heading-2xl {
       font: var(--typography-heading-2xl-font);
@@ -141,7 +141,7 @@
       text-transform: var(--typography-heading-2xl-text_transform, none);
     }
 .Typography_variant_heading-2xl.Typography_defaultMargin {
-        margin-block-end: var(--space-3xl);
+        margin-block-end: var(--spacing-xl);
       }
 .Typography_variant_heading-xl {
       font: var(--typography-heading-xl-font);
@@ -149,7 +149,7 @@
       text-transform: var(--typography-heading-xl-text_transform, none);
     }
 .Typography_variant_heading-xl.Typography_defaultMargin {
-        margin-block-end: var(--space-2xl);
+        margin-block-end: var(--spacing-l);
       }
 .Typography_variant_text-4xl {
       font: var(--typography-text-4xl-font);
@@ -157,7 +157,7 @@
       text-transform: var(--typography-text-4xl-text_transform, none);
     }
 .Typography_variant_text-4xl.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_text-4xl_1 {
       font: var(--typography-text-4xl_1-font);
@@ -165,7 +165,7 @@
       text-transform: var(--typography-text-4xl_1-text_transform, none);
     }
 .Typography_variant_text-4xl_1.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_text-3xl {
       font: var(--typography-text-3xl-font);
@@ -173,7 +173,7 @@
       text-transform: var(--typography-text-3xl-text_transform, none);
     }
 .Typography_variant_text-3xl.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_text-3xl_1 {
       font: var(--typography-text-3xl_1-font);
@@ -181,7 +181,7 @@
       text-transform: var(--typography-text-3xl_1-text_transform, none);
     }
 .Typography_variant_text-3xl_1.Typography_defaultMargin {
-        margin-block-end: var(--space-4xl);
+        margin-block-end: var(--spacing-2xl);
       }
 .Typography_variant_text-2xl {
       font: var(--typography-text-2xl-font);
@@ -189,7 +189,7 @@
       text-transform: var(--typography-text-2xl-text_transform, none);
     }
 .Typography_variant_text-2xl.Typography_defaultMargin {
-        margin-block-end: var(--space-3xl);
+        margin-block-end: var(--spacing-xl);
       }
 .Typography_variant_text-2xl_1 {
       font: var(--typography-text-2xl_1-font);
@@ -197,7 +197,7 @@
       text-transform: var(--typography-text-2xl_1-text_transform, none);
     }
 .Typography_variant_text-2xl_1.Typography_defaultMargin {
-        margin-block-end: var(--space-3xl);
+        margin-block-end: var(--spacing-xl);
       }
 .Typography_variant_text-xl {
       font: var(--typography-text-xl-font);
@@ -205,7 +205,7 @@
       text-transform: var(--typography-text-xl-text_transform, none);
     }
 .Typography_variant_text-xl.Typography_defaultMargin {
-        margin-block-end: var(--space-2xl);
+        margin-block-end: var(--spacing-l);
       }
 .Typography_variant_text-xl_1 {
       font: var(--typography-text-xl_1-font);
@@ -213,7 +213,7 @@
       text-transform: var(--typography-text-xl_1-text_transform, none);
     }
 .Typography_variant_text-xl_1.Typography_defaultMargin {
-        margin-block-end: var(--space-2xl);
+        margin-block-end: var(--spacing-l);
       }
 .Typography_variant_text-l {
       font: var(--typography-text-l-font);
@@ -221,7 +221,7 @@
       text-transform: var(--typography-text-l-text_transform, none);
     }
 .Typography_variant_text-l.Typography_defaultMargin {
-        margin-block-end: var(--space-xl);
+        margin-block-end: var(--spacing-m);
       }
 .Typography_variant_text-l_1 {
       font: var(--typography-text-l_1-font);
@@ -229,7 +229,7 @@
       text-transform: var(--typography-text-l_1-text_transform, none);
     }
 .Typography_variant_text-l_1.Typography_defaultMargin {
-        margin-block-end: var(--space-xl);
+        margin-block-end: var(--spacing-m);
       }
 .Typography_variant_text-m {
       font: var(--typography-text-m-font);
@@ -237,7 +237,7 @@
       text-transform: var(--typography-text-m-text_transform, none);
     }
 .Typography_variant_text-m.Typography_defaultMargin {
-        margin-block-end: var(--space-xl);
+        margin-block-end: var(--spacing-m);
       }
 .Typography_variant_text-m_1 {
       font: var(--typography-text-m_1-font);
@@ -245,7 +245,7 @@
       text-transform: var(--typography-text-m_1-text_transform, none);
     }
 .Typography_variant_text-m_1.Typography_defaultMargin {
-        margin-block-end: var(--space-xl);
+        margin-block-end: var(--spacing-m);
       }
 .Typography_variant_text-s {
       font: var(--typography-text-s-font);
@@ -253,7 +253,7 @@
       text-transform: var(--typography-text-s-text_transform, none);
     }
 .Typography_variant_text-s.Typography_defaultMargin {
-        margin-block-end: var(--space-m);
+        margin-block-end: var(--spacing-xs);
       }
 .Typography_variant_text-s_1 {
       font: var(--typography-text-s_1-font);
@@ -261,7 +261,7 @@
       text-transform: var(--typography-text-s_1-text_transform, none);
     }
 .Typography_variant_text-s_1.Typography_defaultMargin {
-        margin-block-end: var(--space-m);
+        margin-block-end: var(--spacing-xs);
       }
 .Typography_variant_text-xs {
       font: var(--typography-text-xs-font);
@@ -269,7 +269,7 @@
       text-transform: var(--typography-text-xs-text_transform, none);
     }
 .Typography_variant_text-xs.Typography_defaultMargin {
-        margin-block-end: var(--space-s);
+        margin-block-end: var(--spacing-2xs);
       }
 .Typography_variant_text-xs_1 {
       font: var(--typography-text-xs_1-font);
@@ -277,7 +277,7 @@
       text-transform: var(--typography-text-xs_1-text_transform, none);
     }
 .Typography_variant_text-xs_1.Typography_defaultMargin {
-        margin-block-end: var(--space-s);
+        margin-block-end: var(--spacing-2xs);
       }
 .Typography_variant_text-2xs {
       font: var(--typography-text-2xs-font);
@@ -285,7 +285,7 @@
       text-transform: var(--typography-text-2xs-text_transform, none);
     }
 .Typography_variant_text-2xs.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_variant_text-2xs_1 {
       font: var(--typography-text-2xs_1-font);
@@ -293,7 +293,7 @@
       text-transform: var(--typography-text-2xs_1-text_transform, none);
     }
 .Typography_variant_text-2xs_1.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_variant_text-3xs {
       font: var(--typography-text-3xs-font);
@@ -301,7 +301,7 @@
       text-transform: var(--typography-text-3xs-text_transform, none);
     }
 .Typography_variant_text-3xs.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_variant_text-3xs_1 {
       font: var(--typography-text-3xs_1-font);
@@ -309,7 +309,7 @@
       text-transform: var(--typography-text-3xs_1-text_transform, none);
     }
 .Typography_variant_text-3xs_1.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_variant_caption-3xs {
       font: var(--typography-caption-3xs-font);
@@ -317,7 +317,7 @@
       text-transform: var(--typography-caption-3xs-text_transform, none);
     }
 .Typography_variant_caption-3xs.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_variant_caption-3xs_1 {
       font: var(--typography-caption-3xs_1-font);
@@ -325,7 +325,7 @@
       text-transform: var(--typography-caption-3xs_1-text_transform, none);
     }
 .Typography_variant_caption-3xs_1.Typography_defaultMargin {
-        margin-block-end: var(--space-xs);
+        margin-block-end: var(--spacing-3xs);
       }
 .Typography_link {
     color: var(--color-content-action);

package/__inner__/esm/components/Accordion/Accordion.css

@@ -10,9 +10,10 @@
   overflow: hidden;
 }
 .Accordion_size_s {
-      --accordion-summary-padding: var(--space-l);
-      --accordion-details-padding: var(--space-m) var(--space-l) var(--space-l);
-      --accordion-column-gap: var(--space-m);
+      --accordion-summary-padding: var(--spacing-s);
+      --accordion-details-padding: var(--spacing-xs) var(--spacing-s)
+        var(--spacing-s);
+      --accordion-column-gap: var(--spacing-xs);
     }
 .Accordion_size_s .AccordionSummary {
         font: var(--typography-text-s_1-font);
@@ -20,9 +21,9 @@
         text-transform: var(--typography-text-s_1-text_transform, none);
       }
 .Accordion_size_m {
-      --accordion-column-gap: var(--space-m);
-      --accordion-summary-padding: var(--space-l);
-      --accordion-details-padding: var(--space-l);
+      --accordion-column-gap: var(--spacing-xs);
+      --accordion-summary-padding: var(--spacing-s);
+      --accordion-details-padding: var(--spacing-s);
     }
 .Accordion_size_m .AccordionSummary {
         font: var(--typography-text-m_1-font);
@@ -30,10 +31,10 @@
         text-transform: var(--typography-text-m_1-text_transform, none);
       }
 .Accordion_size_l {
-      --accordion-column-gap: var(--space-l);
-      --accordion-summary-padding: var(--space-xl);
-      --accordion-details-padding: var(--space-l) var(--space-xl)
-        var(--space-xl);
+      --accordion-column-gap: var(--spacing-s);
+      --accordion-summary-padding: var(--spacing-m);
+      --accordion-details-padding: var(--spacing-s) var(--spacing-m)
+        var(--spacing-m);
     }
 .Accordion_size_l .AccordionSummary {
         font: var(--typography-text-l_1-font);
@@ -41,10 +42,10 @@
         text-transform: var(--typography-text-l_1-text_transform, none);
       }
 .Accordion_size_xl {
-      --accordion-column-gap: var(--space-xl);
-      --accordion-summary-padding: var(--space-2xl);
-      --accordion-details-padding: var(--space-l) var(--space-2xl)
-        var(--space-2xl);
+      --accordion-column-gap: var(--spacing-m);
+      --accordion-summary-padding: var(--spacing-l);
+      --accordion-details-padding: var(--spacing-s) var(--spacing-l)
+        var(--spacing-l);
     }
 .Accordion_size_xl .AccordionSummary {
         font: var(--typography-text-xl_1-font);
@@ -53,13 +54,13 @@
       }
 .Accordion_compressed.Accordion_size_s,
   .Accordion_compressed.Accordion_size_m {
-    --accordion-summary-padding: var(--space-s) var(--space-l);
+    --accordion-summary-padding: var(--spacing-2xs) var(--spacing-s);
   }
 .Accordion_compressed.Accordion_size_l {
-    --accordion-summary-padding: var(--space-m) var(--space-l);
+    --accordion-summary-padding: var(--spacing-xs) var(--spacing-s);
   }
 .Accordion_compressed.Accordion_size_xl {
-    --accordion-summary-padding: var(--space-l) var(--space-2xl);
+    --accordion-summary-padding: var(--spacing-s) var(--spacing-l);
   }
 .Accordion_variant_corner-primary {
       --accordion-background-color: var(--color-background-main);

package/__inner__/esm/components/Alert/Alert.css

@@ -2,8 +2,8 @@
 .Alert {
   position: relative;
   display: flex;
-  -moz-column-gap: var(--space-s);
-       column-gap: var(--space-s);
+  -moz-column-gap: var(--spacing-2xs);
+       column-gap: var(--spacing-2xs);
   align-items: flex-start;
   inline-size: 100%;
   overflow: auto;
@@ -65,11 +65,11 @@
     text-transform: var(--typography-text-s_1-text_transform, none);
   }
 .Alert-Body {
-    margin-block-start: var(--space-xs);
+    margin-block-start: var(--spacing-3xs);
     color: var(--alert-body-text-color);
   }
 .Alert-Action {
-    margin-block-start: var(--space-s);
+    margin-block-start: var(--spacing-2xs);
   }
 .IconButton.Alert-CloseButton {
   color: var(--alert-close-button-color);

package/__inner__/esm/components/Breadcrumbs/Breadcrumbs.css

@@ -12,7 +12,3 @@
   display: flex;
   align-items: center;
 }
-
-.Button.BreadcrumbItem {
-  color: var(--color-content-secondary);
-}

package/__inner__/esm/components/Breadcrumbs/components/BreadcrumbItem.js

@@ -2,13 +2,13 @@ import { __assign, __rest } from "tslib";
 import React from 'react';
 import { cn } from '../../../utils/classname';
 import { polymorphicComponentWithRef } from '../../../utils/polymorphicComponentWithRef';
-import { Button } from '../../Button';
+import { Button } from '../../ButtonNext';
 import { useBreadcrumbsContext } from '../BreadcrumbsContext';
 import { BREADCRUMB_ITEM_DEFAULT_TAG } from '../constants';
 export var cnBreadcrumbItem = cn('BreadcrumbItem');
 export var BreadcrumbItem = polymorphicComponentWithRef(function (_a, ref) {
     var _b = _a.as, as = _b === void 0 ? BREADCRUMB_ITEM_DEFAULT_TAG : _b, disabled = _a.disabled, IconLeftProp = _a.iconLeft, IconRightProp = _a.iconRight, children = _a.children, className = _a.className, other = __rest(_a, ["as", "disabled", "iconLeft", "iconRight", "children", "className"]);
     var size = useBreadcrumbsContext().size;
-    return (React.createElement(Button, __assign({}, other, { className: cnBreadcrumbItem({}, [className]), as: as, variant: "function", disabled: disabled, size: size, iconLeft: IconLeftProp, iconRight: IconRightProp, ref: ref }), children));
+    return (React.createElement(Button, __assign({}, other, { className: cnBreadcrumbItem({}, [className]), as: as, variant: "function", color: "tertiary", disabled: disabled, size: size, iconLeft: IconLeftProp, iconRight: IconRightProp, ref: ref }), children));
 });
 BreadcrumbItem.displayName = 'BreadcrumbItem';

package/__inner__/esm/components/Button/Button.js

@@ -32,7 +32,7 @@ export var Button = polymorphicComponentWithRef(function (inProps, ref) {
         name: 'Button',
     });
     if (process.env.NODE_ENV !== 'production') {
-        deprecate('Компонент «%s» устарел. Для замены используйте компонент «%s».', 'Button', 'ButtonNext');
+        deprecate('Компонент «Button» устарел. Для замены используйте компонент «ButtonNext».');
     }
     var _a = props.as, Tag = _a === void 0 ? BUTTON_DEFAULT_TAG : _a, _b = props.variant, variant = _b === void 0 ? BUTTON_DEFAULT_VARIANT : _b, _c = props.color, color = _c === void 0 ? BUTTON_DEFAULT_COLOR : _c, _d = props.size, size = _d === void 0 ? BUTTON_DEFAULT_SIZE : _d, iconLeft = props.iconLeft, iconRight = props.iconRight, loading = props.loading, children = props.children, disabled = props.disabled, className = props.className, fullWidth = props.fullWidth, labelProps = props.labelProps, onClick = props.onClick, other = __rest(props, ["as", "variant", "color", "size", "iconLeft", "iconRight", "loading", "children", "disabled", "className", "fullWidth", "labelProps", "onClick"]);
     var iconSize = getIconSizeToFormElement(size);