@ozen-ui/kit 0.23.2 → 0.24.0

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

@@ -1,130 +1,150 @@
 .Theme_color_ozenDefault {
-  --color-content-primary: #080808;
-  --color-content-secondary: #707070;
-  --color-additional-h3: #e1e4e7;
-  --color-content-tertiary: #949494;
-  --color-content-disabled: #949494;
-  --color-content-ghost-disabled: rgb(255 255 255 / 47%);
-  --color-content-action: #379535;
-  --color-content-action-hover: #2a7329;
-  --color-content-action-pressed: #1e521d;
-  --color-content-action-dark: #184117;
+  --color-content-primary: #1e1d22;
+  --color-content-secondary: #636574;
+  --color-content-tertiary: #9a9eb5;
+  --color-content-disabled: #9a9eb5;
+  --color-content-ghost-disabled: rgb(255 255 255 / 40%);
+  --color-content-action: #0b0;
+  --color-content-action-hover: #039904;
+  --color-content-action-pressed: #067607;
+  --color-content-action-dark: #0a540b;
+  --color-content-action-secondary: #023dff;
+  --color-content-action-secondary-hover: #0534d0;
+  --color-content-action-secondary-pressed: #082ba0;
+  --color-content-action-secondary-dark: #0a2171;
   --color-content-action-on: #fff;
-  --color-content-error: #cd1b10;
-  --color-content-error-hover: #a4150d;
-  --color-content-error-pressed: #7a1009;
-  --color-content-error-dark: #660d07;
-  --color-content-warning: #c2420b;
-  --color-content-warning-hover: #943209;
-  --color-content-warning-pressed: #652306;
-  --color-content-warning-dark: #4e1b05;
-  --color-content-success: #379535;
-  --color-content-success-hover: #2a7329;
-  --color-content-success-pressed: #1e521d;
-  --color-content-success-dark: #184117;
-  --color-content-info: #5e1db1;
-  --color-content-info-hover: #481688;
-  --color-content-info-pressed: #33105e;
-  --color-content-info-dark: #280c4a;
+  --color-content-error: #ff5959;
+  --color-content-error-hover: #cf4a4b;
+  --color-content-error-pressed: #9f3b3d;
+  --color-content-error-dark: #702d2e;
+  --color-content-warning: #f90;
+  --color-content-warning-hover: #cf7d04;
+  --color-content-warning-pressed: #9f6207;
+  --color-content-warning-dark: #70460b;
+  --color-content-success: #0b0;
+  --color-content-success-hover: #039904;
+  --color-content-success-pressed: #067607;
+  --color-content-success-dark: #0a540b;
+  --color-content-info: #8002ff;
+  --color-content-info-hover: #6a05d0;
+  --color-content-info-pressed: #5307a0;
+  --color-content-info-dark: #3d0a71;
   --color-content-primary-inverse: #fff;
-  --color-content-accent-main: #a0a0a0;
-  --color-accent-main: #181818;
-  --color-content-accent-primary: #dcdcdc;
-  --color-accent-primary: #282828;
-  --color-content-accent-disabled: #606060;
+  --color-content-accent-secondary: #989aa5;
+  --color-accent-main: #14151b;
+  --color-content-accent-primary: #c7c8ce;
+  --color-accent-primary: #1b1c24;
+  --color-content-accent-disabled: #7b7e8c;
   --color-background-main: #fff;
-  --color-background-main-hover: #f5f5f5;
-  --color-background-main-pressed: #e8e8e8;
-  --color-background-primary: #f5f5f5;
-  --color-background-primary-hover: #e8e8e8;
-  --color-background-primary-pressed: #dcdcdc;
-  --color-background-secondary: #e8e8e8;
-  --color-background-secondary-hover: #dcdcdc;
-  --color-background-secondary-pressed: #c7c7c7;
-  --color-background-tertiary: #dcdcdc;
-  --color-background-tertiary-hover: #c7c7c7;
-  --color-background-tertiary-pressed: #b2b2b2;
-  --color-background-disabled: #e8e8e8;
-  --color-background-action: #43b741;
-  --color-background-action-hover: #2a7329;
-  --color-background-action-pressed: #1e521d;
-  --color-background-action-active-disabled: #b6e3b5;
-  --color-background-action-light: #d7f0d6;
-  --color-background-action-light-hover: #c6e9c6;
-  --color-background-action-light-pressed: #b6e3b5;
-  --color-background-error: #f62114;
-  --color-background-error-hover: #a4150d;
-  --color-background-error-pressed: #7a1009;
-  --color-background-error-light: #fdd9d6;
-  --color-background-error-light-hover: #fcc4c1;
-  --color-background-error-light-pressed: #fcb0ab;
-  --color-background-warning: #f0520e;
-  --color-background-warning-hover: #943209;
-  --color-background-warning-pressed: #652306;
-  --color-background-warning-light: #fde6dd;
-  --color-background-warning-light-hover: #fbd6c6;
-  --color-background-warning-light-pressed: #fac5af;
-  --color-background-success: #43b741;
-  --color-background-success-hover: #2a7329;
-  --color-background-success-pressed: #1e521d;
-  --color-background-success-light: #d7f0d6;
-  --color-background-success-light-hover: #c6e9c6;
-  --color-background-success-light-pressed: #b6e3b5;
-  --color-background-info: #7424da;
-  --color-background-info-hover: #481688;
-  --color-background-info-pressed: #33105e;
-  --color-background-info-light: #e9dcf9;
-  --color-background-info-light-hover: #dcc8f6;
-  --color-background-info-light-pressed: #deb7f7;
-  --color-background-main-inverse: #121212;
-  --color-background-overlay: rgb(0 0 0 / 55%);
-  --color-background-ghost: rgb(255 255 255 / 12%);
-  --color-background-ghost-hover: rgb(255 255 255 / 24%);
-  --color-background-ghost-pressed: rgb(255 255 255 / 32%);
-  --color-background-ghost-disabled: rgb(255 255 255 / 47%);
-  --color-background-accent-action-light-hover: #1e521d;
-  --color-background-accent-action-light-pressed: #184117;
-  --color-background-accent-error-light-hover: #7a1009;
-  --color-background-accent-error-light-pressed: #660d07;
-  --color-background-accent-warning-light-hover: #652306;
-  --color-background-accent-warning-light-pressed: #4e1b05;
+  --color-background-main-hover: #f5f5f8;
+  --color-background-main-pressed: #ebecf0;
+  --color-background-primary: #f5f5f8;
+  --color-background-primary-hover: #ebecf0;
+  --color-background-primary-pressed: #d7d8e1;
+  --color-background-secondary: #ebecf0;
+  --color-background-secondary-hover: #d7d8e1;
+  --color-background-secondary-pressed: #c2c5d3;
+  --color-background-tertiary: #d7d8e1;
+  --color-background-tertiary-hover: #c2c5d3;
+  --color-background-tertiary-pressed: #aeb1c4;
+  --color-background-disabled: #d7d8e1;
+  --color-background-action: #0b0;
+  --color-background-action-hover: #039904;
+  --color-background-action-pressed: #067607;
+  --color-background-action-active-disabled: #99e499;
+  --color-background-action-light: #e5f8e5;
+  --color-background-action-light-hover: #ccf1cc;
+  --color-background-action-light-pressed: #99e499;
+  --color-background-accent-action-light: #067607;
+  --color-background-accent-action-light-hover: #0a540b;
+  --color-background-accent-action-light-pressed: #0d310e;
+  --color-background-action-secondary: #023dff;
+  --color-background-action-secondary-hover: #0534d0;
+  --color-background-action-secondary-pressed: #082ba0;
+  --color-background-action-secondary-active-disabled: #9ab1ff;
+  --color-background-action-secondary-light: #e6ecff;
+  --color-background-action-secondary-light-hover: #ccd8ff;
+  --color-background-action-secondary-light-pressed: #9ab1ff;
+  --color-background-accent-action-secondary-light: #082ba0;
+  --color-background-accent-action-secondary-light-hover: #0a2171;
+  --color-background-accent-action-secondary-light-pressed: #0d1841;
+  --color-background-error: #ff5959;
+  --color-background-error-hover: #cf4a4b;
+  --color-background-error-pressed: #9f3b3d;
+  --color-background-error-light: #fee;
+  --color-background-error-light-hover: #ffdede;
+  --color-background-error-light-pressed: #ffbdbd;
+  --color-background-accent-error-light: #9f3b3d;
+  --color-background-accent-error-light-hover: #702d2e;
+  --color-background-accent-error-light-pressed: #401e20;
+  --color-background-warning: #f90;
+  --color-background-warning-hover: #cf7d04;
+  --color-background-warning-pressed: #9f6207;
+  --color-background-warning-light: #fff5e5;
+  --color-background-warning-light-hover: #ffebcc;
+  --color-background-warning-light-pressed: #ffd699;
+  --color-background-accent-warning-light: #9f6207;
+  --color-background-accent-warning-light-hover: #70460b;
+  --color-background-accent-warning-light-pressed: #402b0e;
+  --color-background-success: #0b0;
+  --color-background-success-hover: #039904;
+  --color-background-success-pressed: #067607;
+  --color-background-success-light: #e5f8e5;
+  --color-background-success-light-hover: #ccf1cc;
+  --color-background-success-light-pressed: #99e499;
+  --color-background-accent-success-light: #067607;
   --color-background-accent-success-light-hover: #1e521d;
   --color-background-accent-success-light-pressed: #184117;
-  --color-background-accent-info-light-hover: #33105e;
-  --color-background-accent-info-light-pressed: #280c4a;
-  --color-border-main: #c7c7c7;
-  --color-border-main-hover: #b2b2b2;
-  --color-border-main-pressed: #949494;
-  --color-border-secondary: #e8e8e8;
-  --color-border-secondary-hover: #c7c7c7;
-  --color-border-secondary-pressed: #b2b2b2;
-  --color-border-disabled: #c7c7c7;
-  --color-border-ghost-disabled: rgb(255 255 255 / 47%);
-  --color-border-focused: #85d083;
-  --color-border-action: #379535;
-  --color-border-action-hover: #2a7329;
-  --color-border-action-pressed: #184117;
-  --color-border-error: #cd1b10;
-  --color-border-warning: #c2420b;
-  --color-border-success: #379535;
-  --color-border-info: #5e1db1;
+  --color-background-info: #8002ff;
+  --color-background-info-hover: #6a05d0;
+  --color-background-info-pressed: #5307a0;
+  --color-background-info-light: #f4e8ff;
+  --color-background-info-light-hover: #e6ccff;
+  --color-background-info-light-pressed: #cd9aff;
+  --color-background-accent-info-light: #5307a0;
+  --color-background-accent-info-light-hover: #3d0a71;
+  --color-background-accent-info-light-pressed: #270d41;
+  --color-background-main-inverse: #1e1d22;
+  --color-background-overlay: rgb(0 0 0 / 50%);
+  --color-background-ghost: rgb(255 255 255 / 10%);
+  --color-background-ghost-hover: rgb(255 255 255 / 20%);
+  --color-background-ghost-pressed: rgb(255 255 255 / 30%);
+  --color-background-ghost-disabled: rgb(255 255 255 / 40%);
+  --color-border-main: #c2c5d3;
+  --color-border-main-hover: #aeb1c4;
+  --color-border-main-pressed: #9a9eb5;
+  --color-border-secondary: #ebecf0;
+  --color-border-secondary-hover: #d7d8e1;
+  --color-border-secondary-pressed: #c2c5d3;
+  --color-border-disabled: #c2c5d3;
+  --color-border-ghost-disabled: rgb(255 255 255 / 40%);
+  --color-border-focused: #99e499;
+  --color-border-action: #0b0;
+  --color-border-action-hover: #039904;
+  --color-border-action-pressed: #067607;
+  --color-border-action-secondary: #023dff;
+  --color-border-action-secondary-hover: #0534d0;
+  --color-border-action-secondary-pressed: #082ba0;
+  --color-border-error: #ff5959;
+  --color-border-warning: #f90;
+  --color-border-success: #0b0;
+  --color-border-info: #8002ff;
   --color-border-main-on: #fff;
-  --color-border-accent-main: #a0a0a0;
-  --color-border-accent-disabled: #606060;
-  --color-border-accent-focused: #184117;
-  --color-accent-main-hover: #282828;
-  --color-accent-main-pressed: #383838;
-  --color-accent-primary-hover: #383838;
-  --color-accent-primary-pressed: #484848;
-  --color-accent-secondary: #383838;
-  --color-accent-secondary-hover: #484848;
-  --color-accent-secondary-pressed: #585858;
-  --color-accent-tertiary: #484848;
-  --color-accent-tertiary-hover: #585858;
-  --color-accent-tertiary-pressed: #686868;
-  --color-accent-disabled: #484848;
-  --color-accent-secondary-inverse: #808080;
-  --color-accent-main-inverse: #dcdcdc;
+  --color-border-accent-main: #989aa5;
+  --color-border-accent-disabled: #5f6374;
+  --color-border-accent-focused: #0a540b;
+  --color-accent-main-hover: #1b1c24;
+  --color-accent-main-pressed: #252732;
+  --color-accent-primary-hover: #252732;
+  --color-accent-primary-pressed: #2f3240;
+  --color-accent-secondary: #252732;
+  --color-accent-secondary-hover: #393c4d;
+  --color-accent-secondary-pressed: #393c4d;
+  --color-accent-tertiary: #2f3240;
+  --color-accent-tertiary-hover: #393c4d;
+  --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;
@@ -148,4 +168,5 @@
   --color-additional-g3: #f4d37d;
   --color-additional-h1: #747e89;
   --color-additional-h2: #bdc4cb;
+  --color-additional-h3: #e1e4e7;
 }

package/__inner__/esm/components/ThemeProvider/index.d.ts

@@ -2,6 +2,7 @@ export * from './ThemeProvider';
 export * from './themes/themeOzenDark';
 export * from './themes/themeOzenDefault';
 export * from './themes/themeBBusinessDefault';
+export * from './themes/themeBBusinessDark';
 export * as themeHelper from './themes/helper';
 export { useTheme } from './ThemeProviderContext';
 export * from './localization/localization';

package/__inner__/esm/components/ThemeProvider/index.js

@@ -2,6 +2,7 @@ export * from './ThemeProvider';
 export * from './themes/themeOzenDark';
 export * from './themes/themeOzenDefault';
 export * from './themes/themeBBusinessDefault';
+export * from './themes/themeBBusinessDark';
 import * as themeHelper_1 from './themes/helper';
 export { themeHelper_1 as themeHelper };
 export { useTheme } from './ThemeProviderContext';

package/__inner__/esm/components/ThemeProvider/themes/helper.d.ts

@@ -1,4 +1,4 @@
-export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-additional-h3", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-content-accent-main", "--color-accent-main", "--color-content-accent-primary", "--color-accent-primary", "--color-content-accent-disabled", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-background-accent-action-light-hover", "--color-background-accent-action-light-pressed", "--color-background-accent-error-light-hover", "--color-background-accent-error-light-pressed", "--color-background-accent-warning-light-hover", "--color-background-accent-warning-light-pressed", "--color-background-accent-success-light-hover", "--color-background-accent-success-light-pressed", "--color-background-accent-info-light-hover", "--color-background-accent-info-light-pressed", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-border-accent-main", "--color-border-accent-disabled", "--color-border-accent-focused", "--color-accent-main-hover", "--color-accent-main-pressed", "--color-accent-primary-hover", "--color-accent-primary-pressed", "--color-accent-secondary", "--color-accent-secondary-hover", "--color-accent-secondary-pressed", "--color-accent-tertiary", "--color-accent-tertiary-hover", "--color-accent-tertiary-pressed", "--color-accent-disabled", "--color-accent-secondary-inverse", "--color-accent-main-inverse", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2"];
+export declare const color: readonly ["--color-content-primary", "--color-content-secondary", "--color-content-tertiary", "--color-content-disabled", "--color-content-ghost-disabled", "--color-content-action", "--color-content-action-hover", "--color-content-action-pressed", "--color-content-action-dark", "--color-content-action-secondary", "--color-content-action-secondary-hover", "--color-content-action-secondary-pressed", "--color-content-action-secondary-dark", "--color-content-action-on", "--color-content-error", "--color-content-error-hover", "--color-content-error-pressed", "--color-content-error-dark", "--color-content-warning", "--color-content-warning-hover", "--color-content-warning-pressed", "--color-content-warning-dark", "--color-content-success", "--color-content-success-hover", "--color-content-success-pressed", "--color-content-success-dark", "--color-content-info", "--color-content-info-hover", "--color-content-info-pressed", "--color-content-info-dark", "--color-content-primary-inverse", "--color-content-accent-secondary", "--color-accent-main", "--color-content-accent-primary", "--color-accent-primary", "--color-content-accent-disabled", "--color-background-main", "--color-background-main-hover", "--color-background-main-pressed", "--color-background-primary", "--color-background-primary-hover", "--color-background-primary-pressed", "--color-background-secondary", "--color-background-secondary-hover", "--color-background-secondary-pressed", "--color-background-tertiary", "--color-background-tertiary-hover", "--color-background-tertiary-pressed", "--color-background-disabled", "--color-background-action", "--color-background-action-hover", "--color-background-action-pressed", "--color-background-action-active-disabled", "--color-background-action-light", "--color-background-action-light-hover", "--color-background-action-light-pressed", "--color-background-accent-action-light", "--color-background-accent-action-light-hover", "--color-background-accent-action-light-pressed", "--color-background-action-secondary", "--color-background-action-secondary-hover", "--color-background-action-secondary-pressed", "--color-background-action-secondary-active-disabled", "--color-background-action-secondary-light", "--color-background-action-secondary-light-hover", "--color-background-action-secondary-light-pressed", "--color-background-accent-action-secondary-light", "--color-background-accent-action-secondary-light-hover", "--color-background-accent-action-secondary-light-pressed", "--color-background-error", "--color-background-error-hover", "--color-background-error-pressed", "--color-background-error-light", "--color-background-error-light-hover", "--color-background-error-light-pressed", "--color-background-accent-error-light", "--color-background-accent-error-light-hover", "--color-background-accent-error-light-pressed", "--color-background-warning", "--color-background-warning-hover", "--color-background-warning-pressed", "--color-background-warning-light", "--color-background-warning-light-hover", "--color-background-warning-light-pressed", "--color-background-accent-warning-light", "--color-background-accent-warning-light-hover", "--color-background-accent-warning-light-pressed", "--color-background-success", "--color-background-success-hover", "--color-background-success-pressed", "--color-background-success-light", "--color-background-success-light-hover", "--color-background-success-light-pressed", "--color-background-accent-success-light", "--color-background-accent-success-light-hover", "--color-background-accent-success-light-pressed", "--color-background-info", "--color-background-info-hover", "--color-background-info-pressed", "--color-background-info-light", "--color-background-info-light-hover", "--color-background-info-light-pressed", "--color-background-accent-info-light", "--color-background-accent-info-light-hover", "--color-background-accent-info-light-pressed", "--color-background-main-inverse", "--color-background-overlay", "--color-background-ghost", "--color-background-ghost-hover", "--color-background-ghost-pressed", "--color-background-ghost-disabled", "--color-border-main", "--color-border-main-hover", "--color-border-main-pressed", "--color-border-secondary", "--color-border-secondary-hover", "--color-border-secondary-pressed", "--color-border-disabled", "--color-border-ghost-disabled", "--color-border-focused", "--color-border-action", "--color-border-action-hover", "--color-border-action-pressed", "--color-border-action-secondary", "--color-border-action-secondary-hover", "--color-border-action-secondary-pressed", "--color-border-error", "--color-border-warning", "--color-border-success", "--color-border-info", "--color-border-main-on", "--color-border-accent-main", "--color-border-accent-disabled", "--color-border-accent-focused", "--color-accent-main-hover", "--color-accent-main-pressed", "--color-accent-primary-hover", "--color-accent-primary-pressed", "--color-accent-secondary", "--color-accent-secondary-hover", "--color-accent-secondary-pressed", "--color-accent-tertiary", "--color-accent-tertiary-hover", "--color-accent-tertiary-pressed", "--color-accent-disabled", "--color-accent-main-inverse", "--color-additional-a1", "--color-additional-a2", "--color-additional-a3", "--color-additional-b1", "--color-additional-b2", "--color-additional-b3", "--color-additional-c1", "--color-additional-c2", "--color-additional-c3", "--color-additional-d1", "--color-additional-d2", "--color-additional-d3", "--color-additional-e1", "--color-additional-e2", "--color-additional-e3", "--color-additional-f1", "--color-additional-f2", "--color-additional-f3", "--color-additional-g1", "--color-additional-g2", "--color-additional-g3", "--color-additional-h1", "--color-additional-h2", "--color-additional-h3"];
 export declare const borderRadius: readonly ["--border-radius-l", "--border-radius-xl", "--border-radius-m", "--border-radius-s", "--border-radius-xs", "--border-radius-2xs"];
 export declare const borderWidth: readonly ["--border-width-s", "--border-width-m"];
 export declare const shadow: readonly ["--shadow-l", "--shadow-m", "--shadow-s"];

package/__inner__/esm/components/ThemeProvider/themes/helper.js

@@ -1,7 +1,6 @@
 export var color = [
     '--color-content-primary',
     '--color-content-secondary',
-    '--color-additional-h3',
     '--color-content-tertiary',
     '--color-content-disabled',
     '--color-content-ghost-disabled',
@@ -9,6 +8,10 @@ export var color = [
     '--color-content-action-hover',
     '--color-content-action-pressed',
     '--color-content-action-dark',
+    '--color-content-action-secondary',
+    '--color-content-action-secondary-hover',
+    '--color-content-action-secondary-pressed',
+    '--color-content-action-secondary-dark',
     '--color-content-action-on',
     '--color-content-error',
     '--color-content-error-hover',
@@ -27,7 +30,7 @@ export var color = [
     '--color-content-info-pressed',
     '--color-content-info-dark',
     '--color-content-primary-inverse',
-    '--color-content-accent-main',
+    '--color-content-accent-secondary',
     '--color-accent-main',
     '--color-content-accent-primary',
     '--color-accent-primary',
@@ -52,46 +55,61 @@ export var color = [
     '--color-background-action-light',
     '--color-background-action-light-hover',
     '--color-background-action-light-pressed',
+    '--color-background-accent-action-light',
+    '--color-background-accent-action-light-hover',
+    '--color-background-accent-action-light-pressed',
+    '--color-background-action-secondary',
+    '--color-background-action-secondary-hover',
+    '--color-background-action-secondary-pressed',
+    '--color-background-action-secondary-active-disabled',
+    '--color-background-action-secondary-light',
+    '--color-background-action-secondary-light-hover',
+    '--color-background-action-secondary-light-pressed',
+    '--color-background-accent-action-secondary-light',
+    '--color-background-accent-action-secondary-light-hover',
+    '--color-background-accent-action-secondary-light-pressed',
     '--color-background-error',
     '--color-background-error-hover',
     '--color-background-error-pressed',
     '--color-background-error-light',
     '--color-background-error-light-hover',
     '--color-background-error-light-pressed',
+    '--color-background-accent-error-light',
+    '--color-background-accent-error-light-hover',
+    '--color-background-accent-error-light-pressed',
     '--color-background-warning',
     '--color-background-warning-hover',
     '--color-background-warning-pressed',
     '--color-background-warning-light',
     '--color-background-warning-light-hover',
     '--color-background-warning-light-pressed',
+    '--color-background-accent-warning-light',
+    '--color-background-accent-warning-light-hover',
+    '--color-background-accent-warning-light-pressed',
     '--color-background-success',
     '--color-background-success-hover',
     '--color-background-success-pressed',
     '--color-background-success-light',
     '--color-background-success-light-hover',
     '--color-background-success-light-pressed',
+    '--color-background-accent-success-light',
+    '--color-background-accent-success-light-hover',
+    '--color-background-accent-success-light-pressed',
     '--color-background-info',
     '--color-background-info-hover',
     '--color-background-info-pressed',
     '--color-background-info-light',
     '--color-background-info-light-hover',
     '--color-background-info-light-pressed',
+    '--color-background-accent-info-light',
+    '--color-background-accent-info-light-hover',
+    '--color-background-accent-info-light-pressed',
     '--color-background-main-inverse',
     '--color-background-overlay',
     '--color-background-ghost',
     '--color-background-ghost-hover',
     '--color-background-ghost-pressed',
     '--color-background-ghost-disabled',
-    '--color-background-accent-action-light-hover',
-    '--color-background-accent-action-light-pressed',
-    '--color-background-accent-error-light-hover',
-    '--color-background-accent-error-light-pressed',
-    '--color-background-accent-warning-light-hover',
-    '--color-background-accent-warning-light-pressed',
-    '--color-background-accent-success-light-hover',
-    '--color-background-accent-success-light-pressed',
-    '--color-background-accent-info-light-hover',
-    '--color-background-accent-info-light-pressed',
     '--color-border-main',
     '--color-border-main-hover',
     '--color-border-main-pressed',
@@ -104,6 +122,9 @@ export var color = [
     '--color-border-action',
     '--color-border-action-hover',
     '--color-border-action-pressed',
+    '--color-border-action-secondary',
+    '--color-border-action-secondary-hover',
+    '--color-border-action-secondary-pressed',
     '--color-border-error',
     '--color-border-warning',
     '--color-border-success',
@@ -123,7 +144,6 @@ export var color = [
     '--color-accent-tertiary-hover',
     '--color-accent-tertiary-pressed',
     '--color-accent-disabled',
-    '--color-accent-secondary-inverse',
     '--color-accent-main-inverse',
     '--color-additional-a1',
     '--color-additional-a2',
@@ -148,6 +168,7 @@ export var color = [
     '--color-additional-g3',
     '--color-additional-h1',
     '--color-additional-h2',
+    '--color-additional-h3',
 ];
 export var borderRadius = [
     '--border-radius-l',

package/__inner__/esm/components/ThemeProvider/themes/themeBBusinessDark.d.ts

@@ -0,0 +1,14 @@
+import '@ozen-ui/fonts';
+import type { Theme } from '../index';
+import '../_color/Theme_color_bBusinessDark.css';
+import '../_typography/Theme_typography_ozenDefault.css';
+import '../_borderRadius/Theme_borderRadius_ozenDefault.css';
+import '../_space/Theme_space_ozenDefault.css';
+import '../_spacing/Theme_spacing_ozenDefault.css';
+import '../_control/Theme_control_ozenDefault.css';
+import '../_shadow/Theme_shadow_ozenDefault.css';
+import '../_breakpoint/Theme_breakpoint_ozenDefault.css';
+import '../_borderWidth/Theme_borderWidth_ozenDefault.css';
+import '../_zIndex/Theme_zIndex_ozenDefault.css';
+import '../_transition/Theme_transition_ozenDefault.css';
+export declare const themeBBusinessDark: Theme;

package/__inner__/esm/components/ThemeProvider/themes/themeBBusinessDark.js

@@ -0,0 +1,28 @@
+import '@ozen-ui/fonts';
+import '../_color/Theme_color_bBusinessDark.css';
+import '../_typography/Theme_typography_ozenDefault.css';
+import '../_borderRadius/Theme_borderRadius_ozenDefault.css';
+import '../_space/Theme_space_ozenDefault.css';
+import '../_spacing/Theme_spacing_ozenDefault.css';
+import '../_control/Theme_control_ozenDefault.css';
+import '../_shadow/Theme_shadow_ozenDefault.css';
+import '../_breakpoint/Theme_breakpoint_ozenDefault.css';
+import '../_borderWidth/Theme_borderWidth_ozenDefault.css';
+import '../_zIndex/Theme_zIndex_ozenDefault.css';
+import '../_transition/Theme_transition_ozenDefault.css';
+export var themeBBusinessDark = {
+    tokens: {
+        color: 'bBusinessDark',
+        space: 'ozenDefault',
+        spacing: 'ozenDefault',
+        control: 'ozenDefault',
+        typography: 'ozenDefault',
+        borderRadius: 'ozenDefault',
+        borderWidth: 'ozenDefault',
+        shadow: 'ozenDefault',
+        breakpoint: 'ozenDefault',
+        zIndex: 'ozenDefault',
+        transition: 'ozenDefault',
+    },
+    defaultProps: {},
+};

package/__inner__/esm/components/Typography/Typography.css

@@ -110,12 +110,12 @@
 .Typography_color_infoDark {
       color: var(--color-content-info-dark);
     }
-.Typography_color_accentMain {
-      color: var(--color-content-accent-main);
-    }
 .Typography_color_accentPrimary {
       color: var(--color-content-accent-primary);
     }
+.Typography_color_accentSecondary {
+      color: var(--color-content-accent-secondary);
+    }
 .Typography_color_accentDisabled {
       color: var(--color-content-accent-disabled);
     }

package/__inner__/esm/components/Typography/Typography.d.ts

@@ -7,7 +7,7 @@ export declare const typographyDisplayVariant: readonly ["block", "inline", "inl
 export type TypographyDisplayVariant = (typeof typographyDisplayVariant)[number];
 export declare const typographyAlignVariant: readonly ["left", "center", "right"];
 export type TypographyAlignVariant = (typeof typographyAlignVariant)[number];
-export declare const typographyColorVariant: readonly ["primary", "secondary", "tertiary", "disabled", "ghostDisabled", "action", "actionPressed", "actionHover", "actionDark", "actionOn", "error", "errorHover", "errorPressed", "errorDark", "warning", "warningHover", "warningPressed", "warningDark", "success", "successHover", "successDark", "successPressed", "info", "infoHover", "infoPressed", "infoDark", "primaryInverse", "accentMain", "accentPrimary", "accentDisabled"];
+export declare const typographyColorVariant: readonly ["primary", "secondary", "tertiary", "disabled", "ghostDisabled", "action", "actionPressed", "actionHover", "actionDark", "actionOn", "error", "errorHover", "errorPressed", "errorDark", "warning", "warningHover", "warningPressed", "warningDark", "success", "successHover", "successDark", "successPressed", "info", "infoHover", "infoPressed", "infoDark", "primaryInverse", "accentPrimary", "accentSecondary", "accentDisabled"];
 export type TypographyColorVariant = (typeof typographyColorVariant)[number];
 export type TypographyBaseProps = {
     /** Вариант типографики */

package/__inner__/esm/components/Typography/Typography.js

@@ -68,8 +68,8 @@ export var typographyColorVariant = [
     'infoPressed',
     'infoDark',
     'primaryInverse',
-    'accentMain',
     'accentPrimary',
+    'accentSecondary',
     'accentDisabled',
 ];
 export var cnTypography = cn('Typography');

package/__inner__/esm/hooks/useDeviceDetect/index.d.ts

@@ -0,0 +1 @@
+export * from './useDeviceDetect';

package/__inner__/esm/hooks/useDeviceDetect/index.js

@@ -0,0 +1 @@
+export * from './useDeviceDetect';

package/__inner__/esm/hooks/useDeviceDetect/useDeviceDetect.d.ts

@@ -0,0 +1,6 @@
+export type Platform = 'undetermined' | 'macos' | 'ios' | 'windows' | 'android' | 'linux';
+export type UseDeviceDetectReturn = {
+    isMobile: boolean;
+    platform: Platform;
+};
+export declare function useDeviceDetect(): UseDeviceDetectReturn;

package/__inner__/esm/hooks/useDeviceDetect/useDeviceDetect.js

@@ -0,0 +1,43 @@
+import { __read } from "tslib";
+import { useState } from 'react';
+import { useIsomorphicEffect } from '../useIsomorphicEffect';
+function getPlatform(userAgent) {
+    var iosPlatforms = /iphone|ipad|ipod/i.test(userAgent);
+    var windowsPlatforms = /windows/i.test(userAgent);
+    var macosPlatforms = /macintosh|macintel|macppc|mac68k/i.test(userAgent);
+    var linuxPlatforms = /linux/i.test(userAgent);
+    var androidPlatforms = /android/i.test(userAgent);
+    if (iosPlatforms) {
+        return 'ios';
+    }
+    if (macosPlatforms) {
+        return 'macos';
+    }
+    if (windowsPlatforms) {
+        return 'windows';
+    }
+    /** Android обязательно должен быть перед Linux т.к Android использует ядро Linux и определяется двумя ОС */
+    if (androidPlatforms) {
+        return 'android';
+    }
+    if (linuxPlatforms) {
+        return 'linux';
+    }
+    return 'undetermined';
+}
+function detectIsMobile(userAgent) {
+    return Boolean(userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile|WPDesktop/i));
+}
+export function useDeviceDetect() {
+    var _a = __read(useState(false), 2), isMobile = _a[0], setIsMobile = _a[1];
+    var _b = __read(useState('undetermined'), 2), platform = _b[0], setPlatform = _b[1];
+    useIsomorphicEffect(function () {
+        if (typeof window === 'undefined') {
+            return;
+        }
+        var userAgent = window.navigator.userAgent;
+        setPlatform(getPlatform(userAgent));
+        setIsMobile(detectIsMobile(userAgent));
+    }, []);
+    return { isMobile: isMobile, platform: platform };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozen-ui/kit",
-  "version": "0.23.2",
+  "version": "0.24.0",
   "description": "React component library",
   "files": [
     "*"

package/useDeviceDetect/package.json

@@ -0,0 +1,5 @@
+{
+	"main": "../__inner__/cjs/hooks/useDeviceDetect/index.js",
+	"module": "../__inner__/esm/hooks/useDeviceDetect/index.js",
+	"types": "../__inner__/esm/hooks/useDeviceDetect/index.d.ts"
+}