mbt-ui-kit 0.1.18 → 0.1.20

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.
@@ -150,6 +150,20 @@ const panelStyle = {
150
150
  };
151
151
  ```
152
152
 
153
+ ## Gradient Tokens
154
+
155
+ ```tsx
156
+ import { colors } from 'mbt-ui-kit/tokens';
157
+
158
+ const heroStyle = {
159
+ background: colors.primaryGradient,
160
+ };
161
+
162
+ const customDiamondStyle = {
163
+ background: `linear-gradient(90deg, ${colors.diamondStop0} 0%, ${colors.diamondStop1} 25%, ${colors.diamondStop2} 50%, ${colors.diamondStop3} 75%, ${colors.diamondStop4} 100%)`,
164
+ };
165
+ ```
166
+
153
167
  ## CSS Custom Properties
154
168
 
155
169
  ```tsx
@@ -163,6 +177,10 @@ import 'mbt-ui-kit/tokens.css';
163
177
  padding: var(--mbt-space-4);
164
178
  border-radius: var(--mbt-radius-sm);
165
179
  }
180
+
181
+ .hero {
182
+ background: var(--mbt-color-primary-gradient);
183
+ }
166
184
  ```
167
185
 
168
186
  ## Sass Tokens
@@ -176,6 +194,10 @@ import 'mbt-ui-kit/tokens.css';
176
194
  padding: $space-4;
177
195
  border-radius: $radius-sm;
178
196
  }
197
+
198
+ .hero {
199
+ background: $diamond-gradient;
200
+ }
179
201
  ```
180
202
 
181
203
  ## Guidance
@@ -46,4 +46,11 @@ This folder holds factual package reference for `mbt-ui-kit`.
46
46
  - `zIndex`
47
47
  - `transitions`
48
48
 
49
+ ## Color Token Notes
50
+
51
+ - `colors` includes solid colors, gradient stop tokens, and convenience gradient strings.
52
+ - direct gradient tokens: `colors.primaryGradient` and `colors.diamondGradient`
53
+ - primary gradient stop tokens: `colors.primaryStop0`, `colors.primaryStop1`, `colors.primaryStop2`
54
+ - diamond gradient stop tokens: `colors.diamondStop0`, `colors.diamondStop1`, `colors.diamondStop2`, `colors.diamondStop3`, `colors.diamondStop4`
55
+
49
56
  Reference docs should stay factual. Policy and maintenance rules belong in `.ai/agent-rules/`.
@@ -34,4 +34,6 @@ These files are the canonical package-owned rules for `mbt-ui-kit`.
34
34
  ## Token Guidance
35
35
 
36
36
  - Preferred token families are `colors`, `fonts`, `fontSizes`, `fontWeights`, `fontFeatures`, `spacing`, `radius`, `zIndex`, and `transitions`.
37
+ - Use `colors.primaryGradient` and `colors.diamondGradient` when the consumer wants the package's default gradient strings directly.
38
+ - Use the exported gradient stop tokens when the consumer needs to compose the same gradients with a different angle or stop layout.
37
39
  - When a consumer needs a custom value outside the token system, keep the exception local to that consumer instead of expanding package docs with app-only design rules.
package/README.md CHANGED
@@ -193,6 +193,33 @@ Available token groups:
193
193
  - `zIndex`
194
194
  - `transitions`
195
195
 
196
+ The `colors` group also includes gradient tokens and gradient stop tokens:
197
+
198
+ - `primaryGradient`
199
+ - `diamondGradient`
200
+ - `primaryStop0`, `primaryStop1`, `primaryStop2`
201
+ - `diamondStop0`, `diamondStop1`, `diamondStop2`, `diamondStop3`, `diamondStop4`
202
+
203
+ Direct gradient usage:
204
+
205
+ ```tsx
206
+ import { colors } from 'mbt-ui-kit/tokens';
207
+
208
+ const heroStyle = {
209
+ background: colors.primaryGradient,
210
+ };
211
+ ```
212
+
213
+ Custom angle composition:
214
+
215
+ ```tsx
216
+ import { colors } from 'mbt-ui-kit/tokens';
217
+
218
+ const accentStyle = {
219
+ background: `linear-gradient(90deg, ${colors.diamondStop0} 0%, ${colors.diamondStop1} 25%, ${colors.diamondStop2} 50%, ${colors.diamondStop3} 75%, ${colors.diamondStop4} 100%)`,
220
+ };
221
+ ```
222
+
196
223
  ### CSS Custom Properties
197
224
 
198
225
  ```tsx
@@ -207,6 +234,10 @@ import 'mbt-ui-kit/tokens.css';
207
234
  border-radius: var(--mbt-radius-sm);
208
235
  transition: all var(--mbt-transition-fast);
209
236
  }
237
+
238
+ .hero {
239
+ background: var(--mbt-color-primary-gradient);
240
+ }
210
241
  ```
211
242
 
212
243
  ### Sass Tokens
@@ -220,6 +251,10 @@ import 'mbt-ui-kit/tokens.css';
220
251
  padding: $space-4;
221
252
  border-radius: $radius-sm;
222
253
  }
254
+
255
+ .hero {
256
+ background: $diamond-gradient;
257
+ }
223
258
  ```
224
259
 
225
260
  ## Development
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./tokens-Bcuwagjb.cjs"),t=require("react/jsx-runtime"),p=require("react");function f({size:n="md",className:e,...s}){const o=["mbt-loader",`mbt-loader--${n}`,e].filter(Boolean).join(" ");return t.jsxs("span",{className:o,...s,children:[t.jsx("span",{className:"mbt-loader__dot"}),t.jsx("span",{className:"mbt-loader__dot"}),t.jsx("span",{className:"mbt-loader__dot"})]})}function w({children:n,fullWidth:e,rounded:s=!0,disabled:o,loading:a,variant:r="primary",className:i,...c}){const u=o||a,m=["mbt-button",r&&`mbt-button--${r}`,e&&"mbt-button--full-width",!s&&"mbt-button--diagonal",o&&"mbt-button--disabled",a&&"mbt-button--loading",i].filter(Boolean).join(" ");return t.jsxs("button",{type:"button",className:m,disabled:u,...c,children:[t.jsx("span",{className:"mbt-button__content",children:n}),a&&t.jsx(f,{size:"md",className:"mbt-button__loader"})]})}function j({className:n,title:e="Search"}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,role:"img","aria-label":e,children:[t.jsx("title",{children:e}),t.jsx("circle",{cx:"11",cy:"11",r:"8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"m21 21-4.34-4.34",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}const x=p.forwardRef(({label:n,muted:e=!1,showSearchIcon:s=!1,icon:o,fullWidth:a=!1,className:r,...i},c)=>{const u=p.useId(),m=i.id??u,d=["mbt-input",a&&"mbt-input--full-width",r].filter(Boolean).join(" "),_=["mbt-input__label",e&&"mbt-input__label--muted"].filter(Boolean).join(" "),N=["mbt-input__wrapper",e&&"mbt-input__wrapper--muted"].filter(Boolean).join(" "),g=["mbt-input__field",e&&"mbt-input__field--muted"].filter(Boolean).join(" "),k=["mbt-input__icon",e&&"mbt-input__icon--muted"].filter(Boolean).join(" "),b=o||s&&t.jsx(j,{});return t.jsx("div",{className:d,children:t.jsxs("div",{className:"mbt-input__container",children:[n&&t.jsx("label",{htmlFor:m,className:_,children:n}),t.jsxs("div",{className:N,children:[t.jsx("input",{ref:c,id:m,type:"text",className:g,...i}),b&&t.jsx("div",{className:k,children:b})]})]})})});x.displayName="Input";function h({className:n,title:e="Graduation cap"}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,role:"img","aria-label":e,children:[t.jsx("title",{children:e}),t.jsx("path",{d:"M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M22 10v6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M6 12.5V16a6 3 0 0 0 12 0v-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}function B({children:n,icon:e,selected:s=!1,small:o=!1,disabled:a,className:r,...i}){const c=["mbt-menu-button",s&&"mbt-menu-button--selected",o&&"mbt-menu-button--small",r].filter(Boolean).join(" "),u=e??t.jsx(h,{});return t.jsxs("button",{type:"button",className:c,disabled:a,"aria-pressed":s,...i,children:[t.jsx("div",{className:"mbt-menu-button__icon",children:u}),t.jsx("span",{className:"mbt-menu-button__text",children:n})]})}function I({level:n,children:e,className:s,...o}){const a=`h${n}`,r=[`mbt-h${n}`,s].filter(Boolean).join(" ");return t.jsx(a,{className:r,...o,children:e})}function L({children:n,large:e=!1,muted:s=!1,as:o="div",className:a,...r}){const i=o,c=["mbt-metric",e&&"mbt-metric--large",s&&"mbt-metric--muted",a].filter(Boolean).join(" ");return t.jsx(i,{className:c,...r,children:n})}function v({children:n,strong:e=!1,small:s=!1,label:o=!1,muted:a=!1,disableFontFeatures:r=!1,as:i="p",className:c,...u}){const m=i,d=["mbt-text",e&&"mbt-text--strong",s&&"mbt-text--small",o&&"mbt-text--label",a&&"mbt-text--muted",r&&"mbt-text--no-features",c].filter(Boolean).join(" ");return t.jsx(m,{className:d,...u,children:n})}exports.colors=l.colors;exports.fontFeatures=l.fontFeatures;exports.fontSizes=l.fontSizes;exports.fontWeights=l.fontWeights;exports.fonts=l.fonts;exports.radius=l.radius;exports.spacing=l.spacing;exports.tokens=l.tokens;exports.transitions=l.transitions;exports.zIndex=l.zIndex;exports.Button=w;exports.GraduationCapIcon=h;exports.Heading=I;exports.Input=x;exports.Loader=f;exports.MenuButton=B;exports.Metric=L;exports.SearchIcon=j;exports.Text=v;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./tokens-DbQnrzz6.cjs"),t=require("react/jsx-runtime"),p=require("react");function f({size:n="md",className:e,...s}){const o=["mbt-loader",`mbt-loader--${n}`,e].filter(Boolean).join(" ");return t.jsxs("span",{className:o,...s,children:[t.jsx("span",{className:"mbt-loader__dot"}),t.jsx("span",{className:"mbt-loader__dot"}),t.jsx("span",{className:"mbt-loader__dot"})]})}function w({children:n,fullWidth:e,rounded:s=!0,disabled:o,loading:a,variant:r="primary",className:i,...c}){const u=o||a,m=["mbt-button",r&&`mbt-button--${r}`,e&&"mbt-button--full-width",!s&&"mbt-button--diagonal",o&&"mbt-button--disabled",a&&"mbt-button--loading",i].filter(Boolean).join(" ");return t.jsxs("button",{type:"button",className:m,disabled:u,...c,children:[t.jsx("span",{className:"mbt-button__content",children:n}),a&&t.jsx(f,{size:"md",className:"mbt-button__loader"})]})}function j({className:n,title:e="Search"}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,role:"img","aria-label":e,children:[t.jsx("title",{children:e}),t.jsx("circle",{cx:"11",cy:"11",r:"8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"m21 21-4.34-4.34",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}const x=p.forwardRef(({label:n,muted:e=!1,showSearchIcon:s=!1,icon:o,fullWidth:a=!1,className:r,...i},c)=>{const u=p.useId(),m=i.id??u,d=["mbt-input",a&&"mbt-input--full-width",r].filter(Boolean).join(" "),_=["mbt-input__label",e&&"mbt-input__label--muted"].filter(Boolean).join(" "),N=["mbt-input__wrapper",e&&"mbt-input__wrapper--muted"].filter(Boolean).join(" "),g=["mbt-input__field",e&&"mbt-input__field--muted"].filter(Boolean).join(" "),k=["mbt-input__icon",e&&"mbt-input__icon--muted"].filter(Boolean).join(" "),b=o||s&&t.jsx(j,{});return t.jsx("div",{className:d,children:t.jsxs("div",{className:"mbt-input__container",children:[n&&t.jsx("label",{htmlFor:m,className:_,children:n}),t.jsxs("div",{className:N,children:[t.jsx("input",{ref:c,id:m,type:"text",className:g,...i}),b&&t.jsx("div",{className:k,children:b})]})]})})});x.displayName="Input";function h({className:n,title:e="Graduation cap"}){return t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:n,role:"img","aria-label":e,children:[t.jsx("title",{children:e}),t.jsx("path",{d:"M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M22 10v6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),t.jsx("path",{d:"M6 12.5V16a6 3 0 0 0 12 0v-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}function B({children:n,icon:e,selected:s=!1,small:o=!1,disabled:a,className:r,...i}){const c=["mbt-menu-button",s&&"mbt-menu-button--selected",o&&"mbt-menu-button--small",r].filter(Boolean).join(" "),u=e??t.jsx(h,{});return t.jsxs("button",{type:"button",className:c,disabled:a,"aria-pressed":s,...i,children:[t.jsx("div",{className:"mbt-menu-button__icon",children:u}),t.jsx("span",{className:"mbt-menu-button__text",children:n})]})}function I({level:n,children:e,className:s,...o}){const a=`h${n}`,r=[`mbt-h${n}`,s].filter(Boolean).join(" ");return t.jsx(a,{className:r,...o,children:e})}function L({children:n,large:e=!1,muted:s=!1,as:o="div",className:a,...r}){const i=o,c=["mbt-metric",e&&"mbt-metric--large",s&&"mbt-metric--muted",a].filter(Boolean).join(" ");return t.jsx(i,{className:c,...r,children:n})}function v({children:n,strong:e=!1,small:s=!1,label:o=!1,muted:a=!1,disableFontFeatures:r=!1,as:i="p",className:c,...u}){const m=i,d=["mbt-text",e&&"mbt-text--strong",s&&"mbt-text--small",o&&"mbt-text--label",a&&"mbt-text--muted",r&&"mbt-text--no-features",c].filter(Boolean).join(" ");return t.jsx(m,{className:d,...u,children:n})}exports.colors=l.colors;exports.fontFeatures=l.fontFeatures;exports.fontSizes=l.fontSizes;exports.fontWeights=l.fontWeights;exports.fonts=l.fonts;exports.radius=l.radius;exports.spacing=l.spacing;exports.tokens=l.tokens;exports.transitions=l.transitions;exports.zIndex=l.zIndex;exports.Button=w;exports.GraduationCapIcon=h;exports.Heading=I;exports.Input=x;exports.Loader=f;exports.MenuButton=B;exports.Metric=L;exports.SearchIcon=j;exports.Text=v;
package/dist/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { c as T, f as $, a as S, b as F, d as G, r as D, s as H, t as R, e as V, z as q } from "./tokens-Bxhg1IBs.js";
1
+ import { c as T, f as $, a as S, b as F, d as G, r as D, s as H, t as R, e as V, z as q } from "./tokens-C9wefV-c.js";
2
2
  import { jsxs as c, jsx as t } from "react/jsx-runtime";
3
3
  import { forwardRef as N, useId as k } from "react";
4
4
  function g({ size: n = "md", className: e, ...o }) {
@@ -1 +1 @@
1
- @font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-regular.woff2) format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-500.woff2) format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-600.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/Inter-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-family:Inter;font-style:italic;font-weight:100 900;font-display:swap;src:url(../fonts/Inter-Italic-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-regular.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-500.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-600.woff2) format("woff2")}.mbt-button{appearance:none;border:none;background:none;cursor:pointer;outline:none;padding:8px 16px;display:grid;place-items:center;border-radius:8px}.mbt-button--diagonal{border-radius:0 8px}.mbt-button{font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:normal;text-transform:uppercase;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease}.mbt-button--primary{background-color:#f2f4fa;color:#0b0e14}.mbt-button--secondary{background-color:#474953;color:#f2f4fa}.mbt-button__content,.mbt-button__loader{grid-area:1/1}.mbt-button:hover{color:#6663fd}.mbt-button:active{opacity:.9}.mbt-button:focus-visible{box-shadow:0 0 0 2px #0b0e14,0 0 0 4px #6663fd}.mbt-button--disabled{background-color:#474953;color:#8b92a6;cursor:not-allowed;pointer-events:none}.mbt-button--loading{cursor:not-allowed;pointer-events:none}.mbt-button--loading .mbt-button__content{visibility:hidden}.mbt-button--full-width{width:100%}.mbt-input__container{display:flex;flex-direction:column;gap:10px;width:100%;max-width:296px}.mbt-input__label{font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;margin:0;font-feature-settings:"ss01" 1,"salt" 1,"ss02" 1}.mbt-input__label--muted{color:#8b92a6}.mbt-input__wrapper{position:relative;display:flex;align-items:center;width:100%;border:1px solid #f2f4fa;border-radius:8px;padding:8px 16px;background-color:transparent;transition:border-color .15s ease}.mbt-input__wrapper--muted{border-color:#8b92a6}.mbt-input__wrapper:focus-within{border-color:#6663fd}.mbt-input__field{flex:1;appearance:none;border:none;background:none;outline:none;font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;font-feature-settings:"ss01" 1,"salt" 1,"ss02" 1}.mbt-input__field::placeholder{color:#f2f4fa}.mbt-input__field--muted{color:#8b92a6}.mbt-input__field--muted::placeholder{color:#8b92a6}.mbt-input__icon{flex-shrink:0;width:24px;height:24px;margin-left:8px;color:#f2f4fa}.mbt-input__icon--muted{color:#8b92a6}.mbt-input--full-width .mbt-input__container{max-width:none}.mbt-h1{font-family:IBM Plex Sans,sans-serif;font-size:72px;font-weight:600;line-height:80px;color:#f2f4fa;margin:0}.mbt-h2{font-family:IBM Plex Sans,sans-serif;font-size:40px;font-weight:600;line-height:48px;color:#f2f4fa;margin:0}.mbt-h3{font-family:IBM Plex Sans,sans-serif;font-size:28px;font-weight:500;line-height:36px;color:#f2f4fa;margin:0}.mbt-h4{font-family:IBM Plex Sans,sans-serif;font-size:20px;font-weight:500;line-height:28px;color:#f2f4fa;margin:0}.mbt-h5{font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:24px;color:#f2f4fa;margin:0}.mbt-text{font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:normal;color:#f2f4fa;margin:0;font-feature-settings:"salt" on,"ss01" on,"ss02" on}.mbt-text--strong{font-weight:500}.mbt-text--small{font-size:12px;line-height:18px}.mbt-text--label{font-size:12px;text-transform:uppercase}.mbt-text--muted{color:#8b92a6}.mbt-text--no-features{font-feature-settings:normal}.mbt-metric{font-family:IBM Plex Mono,monospace;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;margin:0}.mbt-metric--large{font-size:24px;font-weight:500;line-height:32px}.mbt-metric--muted{color:#8b92a6}.mbt-menu-button{appearance:none;border:none;background:none;cursor:pointer;outline:none;display:flex;align-items:center;width:248px;height:44px;padding:4px 12px;gap:8px;font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:24px;color:#f2f4fa;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:8px;transition:background-color .15s ease,color .15s ease}.mbt-menu-button__icon{flex-shrink:0;width:24px;height:24px;color:#f2f4fa;transition:color .15s ease}.mbt-menu-button__text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mbt-menu-button:hover:not(:disabled):not(.mbt-menu-button--selected){background-color:#2a3148;color:#3d91ff}.mbt-menu-button:hover:not(:disabled):not(.mbt-menu-button--selected) .mbt-menu-button__icon{color:#3d91ff}.mbt-menu-button--selected{background-color:#1d2335;color:#6663fd}.mbt-menu-button--selected .mbt-menu-button__icon{color:#6663fd}.mbt-menu-button--small{padding:4px 8px;height:32px;gap:8px;font-family:Inter,sans-serif;font-size:12px;font-weight:400;line-height:18px}.mbt-menu-button--small .mbt-menu-button__icon{width:20px;height:20px}.mbt-menu-button:disabled{color:#8b92a6;cursor:not-allowed;pointer-events:none}.mbt-menu-button:disabled .mbt-menu-button__icon{color:#8b92a6}.mbt-loader{display:inline-flex;align-items:center;gap:4px}.mbt-loader__dot{display:inline-block;background-color:currentColor;border-radius:999px;animation:mbt-loader-bounce 1.4s infinite ease-in-out both}.mbt-loader__dot:nth-child(1){animation-delay:-.32s}.mbt-loader__dot:nth-child(2){animation-delay:-.16s}.mbt-loader--sm .mbt-loader__dot{width:6px;height:6px}.mbt-loader--md .mbt-loader__dot{width:9px;height:9px}.mbt-loader--lg .mbt-loader__dot{width:12px;height:12px}@keyframes mbt-loader-bounce{0%,80%,to{opacity:0;transform:scale(0)}40%{opacity:1;transform:scale(1)}}*,*:before,*:after{box-sizing:border-box}:root{--mbt-color-bg-0: #0b0e14;--mbt-color-bg-1: #111520;--mbt-color-surface: #171c2a;--mbt-color-surface-raised: #1d2335;--mbt-color-text-primary: #f2f4fa;--mbt-color-text-muted: #8b92a6;--mbt-color-text-inverse: #0b0e14;--mbt-color-primary: #6663fd;--mbt-color-secondary: #3d91ff;--mbt-color-gray: #474953;--mbt-color-border: #2a3148;--mbt-color-success: #4dba8a;--mbt-color-error: #c9636a;--mbt-color-warning: #d1a64a;--mbt-color-brilliant: #74cee9;--mbt-color-diamond: #e6f3ff;--mbt-color-diamond-stop-0: #beacd3;--mbt-color-diamond-stop-1: #bee3f7;--mbt-color-diamond-stop-2: #efece7;--mbt-color-diamond-stop-3: #f8ddde;--mbt-color-diamond-stop-4: #cfe6f1;--mbt-color-gold: #d1a64a;--mbt-color-silver: #a09ea6;--mbt-color-bronze: #956c68;--mbt-font-primary: "IBM Plex Sans", sans-serif;--mbt-font-secondary: "Inter", sans-serif;--mbt-font-mono: "IBM Plex Mono", monospace;--mbt-font-size-1: 12px;--mbt-font-size-2: 14px;--mbt-font-size-3: 16px;--mbt-font-size-4: 20px;--mbt-font-size-5: 24px;--mbt-font-size-6: 28px;--mbt-font-size-7: 40px;--mbt-font-size-8: 48px;--mbt-font-size-9: 72px;--mbt-font-weight-regular: 400;--mbt-font-weight-medium: 500;--mbt-font-weight-semibold: 600;--mbt-font-feature-inter-stylistic: "salt" on, "ss01" on, "ss02" on;--mbt-space-0: 0;--mbt-space-1: 4px;--mbt-space-2: 8px;--mbt-space-3: 12px;--mbt-space-4: 16px;--mbt-space-5: 24px;--mbt-space-6: 32px;--mbt-space-7: 48px;--mbt-space-8: 64px;--mbt-space-9: 96px;--mbt-space-10: 128px;--mbt-radius-0: 0;--mbt-radius-xs: 4px;--mbt-radius-sm: 8px;--mbt-radius-md: 12px;--mbt-radius-lg: 16px;--mbt-radius-xl: 24px;--mbt-radius-full: 999px;--mbt-z-index-0: 0;--mbt-z-index-1: 100;--mbt-z-index-2: 200;--mbt-z-index-3: 300;--mbt-z-index-4: 400;--mbt-z-index-5: 500;--mbt-transition-fast: .15s ease;--mbt-transition-normal: .25s ease;--mbt-transition-slow: .4s ease}
1
+ @font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-regular.woff2) format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-500.woff2) format("woff2")}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-v23-latin-600.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/Inter-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-family:Inter;font-style:italic;font-weight:100 900;font-display:swap;src:url(../fonts/Inter-Italic-VariableFont_opsz,wght.ttf) format("truetype")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-regular.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-500.woff2) format("woff2")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-mono-v20-latin-600.woff2) format("woff2")}.mbt-button{appearance:none;border:none;background:none;cursor:pointer;outline:none;padding:8px 16px;display:grid;place-items:center;border-radius:8px}.mbt-button--diagonal{border-radius:0 8px}.mbt-button{font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:normal;text-transform:uppercase;text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease}.mbt-button--primary{background-color:#f2f4fa;color:#0b0e14}.mbt-button--secondary{background-color:#475569;color:#f2f4fa}.mbt-button__content,.mbt-button__loader{grid-area:1/1}.mbt-button:hover{color:#6663fd}.mbt-button:active{opacity:.9}.mbt-button:focus-visible{box-shadow:0 0 0 2px #0b0e14,0 0 0 4px #6663fd}.mbt-button--disabled{background-color:#475569;color:#8d92a9;cursor:not-allowed;pointer-events:none}.mbt-button--loading{cursor:not-allowed;pointer-events:none}.mbt-button--loading .mbt-button__content{visibility:hidden}.mbt-button--full-width{width:100%}.mbt-input__container{display:flex;flex-direction:column;gap:10px;width:100%;max-width:296px}.mbt-input__label{font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;margin:0;font-feature-settings:"ss01" 1,"salt" 1,"ss02" 1}.mbt-input__label--muted{color:#8d92a9}.mbt-input__wrapper{position:relative;display:flex;align-items:center;width:100%;border:1px solid #f2f4fa;border-radius:8px;padding:8px 16px;background-color:transparent;transition:border-color .15s ease}.mbt-input__wrapper--muted{border-color:#8d92a9}.mbt-input__wrapper:focus-within{border-color:#6663fd}.mbt-input__field{flex:1;appearance:none;border:none;background:none;outline:none;font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;font-feature-settings:"ss01" 1,"salt" 1,"ss02" 1}.mbt-input__field::placeholder{color:#f2f4fa}.mbt-input__field--muted{color:#8d92a9}.mbt-input__field--muted::placeholder{color:#8d92a9}.mbt-input__icon{flex-shrink:0;width:24px;height:24px;margin-left:8px;color:#f2f4fa}.mbt-input__icon--muted{color:#8d92a9}.mbt-input--full-width .mbt-input__container{max-width:none}.mbt-h1{font-family:IBM Plex Sans,sans-serif;font-size:72px;font-weight:600;line-height:80px;color:#f2f4fa;margin:0}.mbt-h2{font-family:IBM Plex Sans,sans-serif;font-size:40px;font-weight:600;line-height:48px;color:#f2f4fa;margin:0}.mbt-h3{font-family:IBM Plex Sans,sans-serif;font-size:28px;font-weight:500;line-height:36px;color:#f2f4fa;margin:0}.mbt-h4{font-family:IBM Plex Sans,sans-serif;font-size:20px;font-weight:500;line-height:28px;color:#f2f4fa;margin:0}.mbt-h5{font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:24px;color:#f2f4fa;margin:0}.mbt-text{font-family:Inter,sans-serif;font-size:16px;font-weight:400;line-height:normal;color:#f2f4fa;margin:0;font-feature-settings:"salt" on,"ss01" on,"ss02" on}.mbt-text--strong{font-weight:500}.mbt-text--small{font-size:12px;line-height:18px}.mbt-text--label{font-size:12px;text-transform:uppercase}.mbt-text--muted{color:#8d92a9}.mbt-text--no-features{font-feature-settings:normal}.mbt-metric{font-family:IBM Plex Mono,monospace;font-size:16px;font-weight:400;line-height:1;color:#f2f4fa;margin:0}.mbt-metric--large{font-size:24px;font-weight:500;line-height:32px}.mbt-metric--muted{color:#8d92a9}.mbt-menu-button{appearance:none;border:none;background:none;cursor:pointer;outline:none;display:flex;align-items:center;width:248px;height:44px;padding:4px 12px;gap:8px;font-family:IBM Plex Sans,sans-serif;font-size:16px;font-weight:500;line-height:24px;color:#f2f4fa;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:8px;transition:background-color .15s ease,color .15s ease}.mbt-menu-button__icon{flex-shrink:0;width:24px;height:24px;color:#f2f4fa;transition:color .15s ease}.mbt-menu-button__text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.mbt-menu-button:hover:not(:disabled):not(.mbt-menu-button--selected){background-color:#2a3148;color:#0078fd}.mbt-menu-button:hover:not(:disabled):not(.mbt-menu-button--selected) .mbt-menu-button__icon{color:#0078fd}.mbt-menu-button--selected{background-color:#1d2335;color:#6663fd}.mbt-menu-button--selected .mbt-menu-button__icon{color:#6663fd}.mbt-menu-button--small{padding:4px 8px;height:32px;gap:8px;font-family:Inter,sans-serif;font-size:12px;font-weight:400;line-height:18px}.mbt-menu-button--small .mbt-menu-button__icon{width:20px;height:20px}.mbt-menu-button:disabled{color:#8d92a9;cursor:not-allowed;pointer-events:none}.mbt-menu-button:disabled .mbt-menu-button__icon{color:#8d92a9}.mbt-loader{display:inline-flex;align-items:center;gap:4px}.mbt-loader__dot{display:inline-block;background-color:currentColor;border-radius:999px;animation:mbt-loader-bounce 1.4s infinite ease-in-out both}.mbt-loader__dot:nth-child(1){animation-delay:-.32s}.mbt-loader__dot:nth-child(2){animation-delay:-.16s}.mbt-loader--sm .mbt-loader__dot{width:6px;height:6px}.mbt-loader--md .mbt-loader__dot{width:9px;height:9px}.mbt-loader--lg .mbt-loader__dot{width:12px;height:12px}@keyframes mbt-loader-bounce{0%,80%,to{opacity:0;transform:scale(0)}40%{opacity:1;transform:scale(1)}}*,*:before,*:after{box-sizing:border-box}:root{--mbt-color-bg-0: #0b0e14;--mbt-color-bg-1: #111520;--mbt-color-surface: #171c2a;--mbt-color-surface-raised: #1d2335;--mbt-color-border: #2a3148;--mbt-color-gray: #475569;--mbt-color-text-primary: #f2f4fa;--mbt-color-text-muted: #8d92a9;--mbt-color-text-inverse: #0b0e14;--mbt-color-primary: #6663fd;--mbt-color-secondary: #0078fd;--mbt-color-success: #00b279;--mbt-color-error: #f2766a;--mbt-color-warning: #e6c352;--mbt-color-diamond: #e6f3ff;--mbt-color-primary-stop-0: #65d5f4;--mbt-color-primary-stop-1: #0096fa;--mbt-color-primary-stop-2: #1c3dc2;--mbt-color-primary-gradient: linear-gradient( 45deg, #65d5f4 0%, #0096fa 40%, #1c3dc2 100% );--mbt-color-diamond-stop-0: #beacd3;--mbt-color-diamond-stop-1: #bee3f7;--mbt-color-diamond-stop-2: #efece7;--mbt-color-diamond-stop-3: #f8ddde;--mbt-color-diamond-stop-4: #cfe6f1;--mbt-color-diamond-gradient: linear-gradient( 45deg, #beacd3 0%, #bee3f7 25%, #efece7 50%, #f8ddde 75%, #cfe6f1 100% );--mbt-color-gold: #d1a64a;--mbt-color-silver: #969fa6;--mbt-color-bronze: #956c68;--mbt-font-primary: "IBM Plex Sans", sans-serif;--mbt-font-secondary: "Inter", sans-serif;--mbt-font-mono: "IBM Plex Mono", monospace;--mbt-font-size-1: 12px;--mbt-font-size-2: 14px;--mbt-font-size-3: 16px;--mbt-font-size-4: 20px;--mbt-font-size-5: 24px;--mbt-font-size-6: 28px;--mbt-font-size-7: 40px;--mbt-font-size-8: 48px;--mbt-font-size-9: 72px;--mbt-font-weight-regular: 400;--mbt-font-weight-medium: 500;--mbt-font-weight-semibold: 600;--mbt-font-feature-inter-stylistic: "salt" on, "ss01" on, "ss02" on;--mbt-space-0: 0;--mbt-space-1: 4px;--mbt-space-2: 8px;--mbt-space-3: 12px;--mbt-space-4: 16px;--mbt-space-5: 24px;--mbt-space-6: 32px;--mbt-space-7: 48px;--mbt-space-8: 64px;--mbt-space-9: 96px;--mbt-space-10: 128px;--mbt-radius-0: 0;--mbt-radius-xs: 4px;--mbt-radius-sm: 8px;--mbt-radius-md: 12px;--mbt-radius-lg: 16px;--mbt-radius-xl: 24px;--mbt-radius-full: 999px;--mbt-z-index-0: 0;--mbt-z-index-1: 100;--mbt-z-index-2: 200;--mbt-z-index-3: 300;--mbt-z-index-4: 400;--mbt-z-index-5: 500;--mbt-transition-fast: .15s ease;--mbt-transition-normal: .25s ease;--mbt-transition-slow: .4s ease}
@@ -15,35 +15,53 @@
15
15
  --mbt-color-bg-1: #111520;
16
16
  --mbt-color-surface: #171c2a;
17
17
  --mbt-color-surface-raised: #1d2335;
18
+ --mbt-color-border: #2a3148;
19
+ --mbt-color-gray: #475569;
18
20
 
19
21
  /* Text */
20
22
  --mbt-color-text-primary: #f2f4fa;
21
- --mbt-color-text-muted: #8b92a6;
23
+ --mbt-color-text-muted: #8d92a9;
22
24
  --mbt-color-text-inverse: #0b0e14;
23
25
 
24
26
  /* Brand */
25
27
  --mbt-color-primary: #6663fd;
26
- --mbt-color-secondary: #3d91ff;
28
+ --mbt-color-secondary: #0078fd;
27
29
 
28
30
  /* State */
29
- --mbt-color-gray: #474953;
30
- --mbt-color-border: #2a3148;
31
- --mbt-color-success: #4dba8a;
32
- --mbt-color-error: #c9636a;
33
- --mbt-color-warning: #d1a64a;
31
+ --mbt-color-success: #00b279;
32
+ --mbt-color-error: #f2766a;
33
+ --mbt-color-warning: #e6c352;
34
+ --mbt-color-diamond: #e6f3ff;
35
+
36
+ /* Primary gradient */
37
+ --mbt-color-primary-stop-0: #65d5f4;
38
+ --mbt-color-primary-stop-1: #0096fa;
39
+ --mbt-color-primary-stop-2: #1c3dc2;
40
+ --mbt-color-primary-gradient: linear-gradient(
41
+ 45deg,
42
+ #65d5f4 0%,
43
+ #0096fa 40%,
44
+ #1c3dc2 100%
45
+ );
34
46
 
35
47
  /* Diamond gradient */
36
- --mbt-color-brilliant: #74cee9;
37
- --mbt-color-diamond: #e6f3ff;
38
48
  --mbt-color-diamond-stop-0: #beacd3;
39
49
  --mbt-color-diamond-stop-1: #bee3f7;
40
50
  --mbt-color-diamond-stop-2: #efece7;
41
51
  --mbt-color-diamond-stop-3: #f8ddde;
42
52
  --mbt-color-diamond-stop-4: #cfe6f1;
53
+ --mbt-color-diamond-gradient: linear-gradient(
54
+ 45deg,
55
+ #beacd3 0%,
56
+ #bee3f7 25%,
57
+ #efece7 50%,
58
+ #f8ddde 75%,
59
+ #cfe6f1 100%
60
+ );
43
61
 
44
62
  /* Metals */
45
63
  --mbt-color-gold: #d1a64a;
46
- --mbt-color-silver: #a09ea6;
64
+ --mbt-color-silver: #969fa6;
47
65
  --mbt-color-bronze: #956c68;
48
66
 
49
67
  /* ========================================================================= */
@@ -10,24 +10,28 @@ export declare const colors: {
10
10
  readonly surface: "#171C2A";
11
11
  readonly surfaceRaised: "#1D2335";
12
12
  readonly textPrimary: "#F2F4FA";
13
- readonly textMuted: "#8B92A6";
13
+ readonly textMuted: "#8D92A9";
14
14
  readonly textInverse: "#0B0E14";
15
15
  readonly primary: "#6663FD";
16
- readonly secondary: "#3d91ff";
17
- readonly gray: "#474953";
16
+ readonly secondary: "#0078FD";
17
+ readonly gray: "#475569";
18
18
  readonly border: "#2A3148";
19
- readonly success: "#4DBA8A";
20
- readonly error: "#C9636A";
21
- readonly warning: "#D1A64A";
22
- readonly brilliant: "#74cee9";
19
+ readonly success: "#00B279";
20
+ readonly error: "#F2766A";
21
+ readonly warning: "#E6C352";
23
22
  readonly diamond: "#E6F3FF";
23
+ readonly primaryStop0: "#65D5F4";
24
+ readonly primaryStop1: "#0096FA";
25
+ readonly primaryStop2: "#1C3DC2";
26
+ readonly primaryGradient: "linear-gradient(45deg, #65D5F4 0%, #0096FA 40%, #1C3DC2 100%)";
24
27
  readonly diamondStop0: "#BEACD3";
25
28
  readonly diamondStop1: "#BEE3F7";
26
29
  readonly diamondStop2: "#EFECE7";
27
30
  readonly diamondStop3: "#F8DDDE";
28
31
  readonly diamondStop4: "#CFE6F1";
32
+ readonly diamondGradient: "linear-gradient(45deg, #BEACD3 0%, #BEE3F7 25%, #EFECE7 50%, #F8DDDE 75%, #CFE6F1 100%)";
29
33
  readonly gold: "#D1A64A";
30
- readonly silver: "#A09EA6";
34
+ readonly silver: "#969FA6";
31
35
  readonly bronze: "#956C68";
32
36
  };
33
37
  export declare const fonts: {
@@ -96,24 +100,28 @@ export declare const tokens: {
96
100
  readonly surface: "#171C2A";
97
101
  readonly surfaceRaised: "#1D2335";
98
102
  readonly textPrimary: "#F2F4FA";
99
- readonly textMuted: "#8B92A6";
103
+ readonly textMuted: "#8D92A9";
100
104
  readonly textInverse: "#0B0E14";
101
105
  readonly primary: "#6663FD";
102
- readonly secondary: "#3d91ff";
103
- readonly gray: "#474953";
106
+ readonly secondary: "#0078FD";
107
+ readonly gray: "#475569";
104
108
  readonly border: "#2A3148";
105
- readonly success: "#4DBA8A";
106
- readonly error: "#C9636A";
107
- readonly warning: "#D1A64A";
108
- readonly brilliant: "#74cee9";
109
+ readonly success: "#00B279";
110
+ readonly error: "#F2766A";
111
+ readonly warning: "#E6C352";
109
112
  readonly diamond: "#E6F3FF";
113
+ readonly primaryStop0: "#65D5F4";
114
+ readonly primaryStop1: "#0096FA";
115
+ readonly primaryStop2: "#1C3DC2";
116
+ readonly primaryGradient: "linear-gradient(45deg, #65D5F4 0%, #0096FA 40%, #1C3DC2 100%)";
110
117
  readonly diamondStop0: "#BEACD3";
111
118
  readonly diamondStop1: "#BEE3F7";
112
119
  readonly diamondStop2: "#EFECE7";
113
120
  readonly diamondStop3: "#F8DDDE";
114
121
  readonly diamondStop4: "#CFE6F1";
122
+ readonly diamondGradient: "linear-gradient(45deg, #BEACD3 0%, #BEE3F7 25%, #EFECE7 50%, #F8DDDE 75%, #CFE6F1 100%)";
115
123
  readonly gold: "#D1A64A";
116
- readonly silver: "#A09EA6";
124
+ readonly silver: "#969FA6";
117
125
  readonly bronze: "#956C68";
118
126
  };
119
127
  readonly fonts: {
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/styles/tokens.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;CAoCT,CAAC;AAMX,eAAO,MAAM,KAAK;;;;CAIR,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;;;;;;CAUZ,CAAC;AAEX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAEX,eAAO,MAAM,YAAY;;CAEf,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;CAYV,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;CAQT,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;CAOT,CAAC;AAMX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAUT,CAAC;AAEX,eAAe,MAAM,CAAC;AAMtB,MAAM,MAAM,KAAK,GAAG,MAAM,OAAO,MAAM,CAAC;AACxC,MAAM,MAAM,IAAI,GAAG,MAAM,OAAO,KAAK,CAAC;AACtC,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAC9C,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAClD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,YAAY,CAAC;AACpD,MAAM,MAAM,OAAO,GAAG,MAAM,OAAO,OAAO,CAAC;AAC3C,MAAM,MAAM,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC;AACzC,MAAM,MAAM,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC;AACzC,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC"}
1
+ {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/styles/tokens.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0CT,CAAC;AAMX,eAAO,MAAM,KAAK;;;;CAIR,CAAC;AAEX,eAAO,MAAM,SAAS;;;;;;;;;;CAUZ,CAAC;AAEX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAEX,eAAO,MAAM,YAAY;;CAEf,CAAC;AAMX,eAAO,MAAM,OAAO;;;;;;;;;;;;CAYV,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;CAQT,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;CAOT,CAAC;AAMX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAMX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAUT,CAAC;AAEX,eAAe,MAAM,CAAC;AAMtB,MAAM,MAAM,KAAK,GAAG,MAAM,OAAO,MAAM,CAAC;AACxC,MAAM,MAAM,IAAI,GAAG,MAAM,OAAO,KAAK,CAAC;AACtC,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAC9C,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAClD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,YAAY,CAAC;AACpD,MAAM,MAAM,OAAO,GAAG,MAAM,OAAO,OAAO,CAAC;AAC3C,MAAM,MAAM,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC;AACzC,MAAM,MAAM,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC;AACzC,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC"}
@@ -6,34 +6,38 @@ const s = {
6
6
  surfaceRaised: "#1D2335",
7
7
  // Text
8
8
  textPrimary: "#F2F4FA",
9
- textMuted: "#8B92A6",
9
+ textMuted: "#8D92A9",
10
10
  textInverse: "#0B0E14",
11
11
  // Brand
12
12
  primary: "#6663FD",
13
- secondary: "#3d91ff",
13
+ secondary: "#0078FD",
14
14
  // State
15
- gray: "#474953",
15
+ gray: "#475569",
16
16
  border: "#2A3148",
17
- success: "#4DBA8A",
18
- error: "#C9636A",
19
- warning: "#D1A64A",
20
- // Diamond gradient stops
21
- brilliant: "#74cee9",
17
+ success: "#00B279",
18
+ error: "#F2766A",
19
+ warning: "#E6C352",
20
+ // Gradient colors
22
21
  diamond: "#E6F3FF",
22
+ primaryStop0: "#65D5F4",
23
+ primaryStop1: "#0096FA",
24
+ primaryStop2: "#1C3DC2",
25
+ primaryGradient: "linear-gradient(45deg, #65D5F4 0%, #0096FA 40%, #1C3DC2 100%)",
23
26
  diamondStop0: "#BEACD3",
24
27
  diamondStop1: "#BEE3F7",
25
28
  diamondStop2: "#EFECE7",
26
29
  diamondStop3: "#F8DDDE",
27
30
  diamondStop4: "#CFE6F1",
31
+ diamondGradient: "linear-gradient(45deg, #BEACD3 0%, #BEE3F7 25%, #EFECE7 50%, #F8DDDE 75%, #CFE6F1 100%)",
28
32
  // Metals
29
33
  gold: "#D1A64A",
30
- silver: "#A09EA6",
34
+ silver: "#969FA6",
31
35
  bronze: "#956C68"
32
- }, o = {
36
+ }, a = {
33
37
  primary: '"IBM Plex Sans", sans-serif',
34
38
  secondary: '"Inter", sans-serif',
35
39
  mono: '"IBM Plex Mono", monospace'
36
- }, n = {
40
+ }, o = {
37
41
  1: "12px",
38
42
  2: "14px",
39
43
  3: "16px",
@@ -43,13 +47,13 @@ const s = {
43
47
  7: "40px",
44
48
  8: "48px",
45
49
  9: "72px"
46
- }, a = {
50
+ }, n = {
47
51
  regular: 400,
48
52
  medium: 500,
49
53
  semibold: 600
50
54
  }, e = {
51
55
  interStylistic: "'salt' on, 'ss01' on, 'ss02' on"
52
- }, t = {
56
+ }, r = {
53
57
  0: "0",
54
58
  1: "4px",
55
59
  2: "8px",
@@ -61,7 +65,7 @@ const s = {
61
65
  8: "64px",
62
66
  9: "96px",
63
67
  10: "128px"
64
- }, p = {
68
+ }, t = {
65
69
  0: "0",
66
70
  xs: "4px",
67
71
  sm: "8px",
@@ -69,37 +73,37 @@ const s = {
69
73
  lg: "16px",
70
74
  xl: "24px",
71
75
  full: "999px"
72
- }, r = {
76
+ }, p = {
73
77
  0: 0,
74
78
  1: 100,
75
79
  2: 200,
76
80
  3: 300,
77
81
  4: 400,
78
82
  5: 500
79
- }, x = {
83
+ }, i = {
80
84
  fast: "150ms ease",
81
85
  normal: "250ms ease",
82
86
  slow: "400ms ease"
83
- }, i = {
87
+ }, x = {
84
88
  colors: s,
85
- fonts: o,
86
- fontSizes: n,
87
- fontWeights: a,
89
+ fonts: a,
90
+ fontSizes: o,
91
+ fontWeights: n,
88
92
  fontFeatures: e,
89
- spacing: t,
90
- radius: p,
91
- zIndex: r,
92
- transitions: x
93
+ spacing: r,
94
+ radius: t,
95
+ zIndex: p,
96
+ transitions: i
93
97
  };
94
98
  export {
95
- n as a,
96
- a as b,
99
+ o as a,
100
+ n as b,
97
101
  s as c,
98
- o as d,
99
- x as e,
102
+ a as d,
103
+ i as e,
100
104
  e as f,
101
- p as r,
102
- t as s,
103
- i as t,
104
- r as z
105
+ t as r,
106
+ r as s,
107
+ x as t,
108
+ p as z
105
109
  };
@@ -0,0 +1 @@
1
+ "use strict";const s={bg0:"#0B0E14",bg1:"#111520",surface:"#171C2A",surfaceRaised:"#1D2335",textPrimary:"#F2F4FA",textMuted:"#8D92A9",textInverse:"#0B0E14",primary:"#6663FD",secondary:"#0078FD",gray:"#475569",border:"#2A3148",success:"#00B279",error:"#F2766A",warning:"#E6C352",diamond:"#E6F3FF",primaryStop0:"#65D5F4",primaryStop1:"#0096FA",primaryStop2:"#1C3DC2",primaryGradient:"linear-gradient(45deg, #65D5F4 0%, #0096FA 40%, #1C3DC2 100%)",diamondStop0:"#BEACD3",diamondStop1:"#BEE3F7",diamondStop2:"#EFECE7",diamondStop3:"#F8DDDE",diamondStop4:"#CFE6F1",diamondGradient:"linear-gradient(45deg, #BEACD3 0%, #BEE3F7 25%, #EFECE7 50%, #F8DDDE 75%, #CFE6F1 100%)",gold:"#D1A64A",silver:"#969FA6",bronze:"#956C68"},n={primary:'"IBM Plex Sans", sans-serif',secondary:'"Inter", sans-serif',mono:'"IBM Plex Mono", monospace'},o={1:"12px",2:"14px",3:"16px",4:"20px",5:"24px",6:"28px",7:"40px",8:"48px",9:"72px"},t={regular:400,medium:500,semibold:600},e={interStylistic:"'salt' on, 'ss01' on, 'ss02' on"},r={0:"0",1:"4px",2:"8px",3:"12px",4:"16px",5:"24px",6:"32px",7:"48px",8:"64px",9:"96px",10:"128px"},a={0:"0",xs:"4px",sm:"8px",md:"12px",lg:"16px",xl:"24px",full:"999px"},i={0:0,1:100,2:200,3:300,4:400,5:500},p={fast:"150ms ease",normal:"250ms ease",slow:"400ms ease"},x={colors:s,fonts:n,fontSizes:o,fontWeights:t,fontFeatures:e,spacing:r,radius:a,zIndex:i,transitions:p};exports.colors=s;exports.fontFeatures=e;exports.fontSizes=o;exports.fontWeights=t;exports.fonts=n;exports.radius=a;exports.spacing=r;exports.tokens=x;exports.transitions=p;exports.zIndex=i;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./tokens-Bcuwagjb.cjs");exports.colors=t.colors;exports.fontFeatures=t.fontFeatures;exports.fontSizes=t.fontSizes;exports.fontWeights=t.fontWeights;exports.fonts=t.fonts;exports.radius=t.radius;exports.spacing=t.spacing;exports.tokens=t.tokens;exports.transitions=t.transitions;exports.zIndex=t.zIndex;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./tokens-DbQnrzz6.cjs");exports.colors=t.colors;exports.fontFeatures=t.fontFeatures;exports.fontSizes=t.fontSizes;exports.fontWeights=t.fontWeights;exports.fonts=t.fonts;exports.radius=t.radius;exports.spacing=t.spacing;exports.tokens=t.tokens;exports.transitions=t.transitions;exports.zIndex=t.zIndex;
@@ -1,4 +1,4 @@
1
- import { c as t, f as o, a as n, b as e, d as r, r as f, s as i, t as c, e as d, z } from "./tokens-Bxhg1IBs.js";
1
+ import { c as t, f as o, a as n, b as e, d as r, r as f, s as i, t as c, e as d, z } from "./tokens-C9wefV-c.js";
2
2
  export {
3
3
  t as colors,
4
4
  o as fontFeatures,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mbt-ui-kit",
3
3
  "description": "React component library with SCSS",
4
- "version": "0.1.18",
4
+ "version": "0.1.20",
5
5
  "packageManager": "pnpm@10.28.0",
6
6
  "type": "module",
7
7
  "main": "dist/index.cjs",
@@ -14,32 +14,48 @@ $surface-raised: #1d2335;
14
14
 
15
15
  // Text
16
16
  $text-primary: #f2f4fa;
17
- $text-muted: #8b92a6;
17
+ $text-muted: #8d92a9;
18
18
  $text-inverse: #0b0e14;
19
19
 
20
20
  // Brand
21
21
  $primary: #6663fd;
22
- $secondary: #3d91ff;
22
+ $secondary: #0078fd;
23
23
 
24
24
  // State
25
- $gray: #474953;
25
+ $gray: #475569;
26
26
  $border: #2a3148;
27
- $success: #4dba8a;
28
- $error: #c9636a;
29
- $warning: #d1a64a;
30
-
31
- // Diamond gradient stops
32
- $brilliant: #74cee9;
27
+ $success: #00b279;
28
+ $error: #f2766a;
29
+ $warning: #e6c352;
33
30
  $diamond: #e6f3ff;
31
+
32
+ // Gradient colors
33
+ $primary-stop-0: #65d5f4;
34
+ $primary-stop-1: #0096fa;
35
+ $primary-stop-2: #1c3dc2;
36
+ $primary-gradient: linear-gradient(
37
+ 45deg,
38
+ #65d5f4 0%,
39
+ #0096fa 40%,
40
+ #1c3dc2 100%
41
+ );
34
42
  $diamond-stop-0: #beacd3;
35
43
  $diamond-stop-1: #bee3f7;
36
44
  $diamond-stop-2: #efece7;
37
45
  $diamond-stop-3: #f8ddde;
38
46
  $diamond-stop-4: #cfe6f1;
47
+ $diamond-gradient: linear-gradient(
48
+ 45deg,
49
+ #beacd3 0%,
50
+ #bee3f7 25%,
51
+ #efece7 50%,
52
+ #f8ddde 75%,
53
+ #cfe6f1 100%
54
+ );
39
55
 
40
56
  // Metals
41
57
  $gold: #d1a64a;
42
- $silver: #a09ea6;
58
+ $silver: #969fa6;
43
59
  $bronze: #956c68;
44
60
 
45
61
  // -----------------------------------------------------------------------------
@@ -1 +0,0 @@
1
- "use strict";const s={bg0:"#0B0E14",bg1:"#111520",surface:"#171C2A",surfaceRaised:"#1D2335",textPrimary:"#F2F4FA",textMuted:"#8B92A6",textInverse:"#0B0E14",primary:"#6663FD",secondary:"#3d91ff",gray:"#474953",border:"#2A3148",success:"#4DBA8A",error:"#C9636A",warning:"#D1A64A",brilliant:"#74cee9",diamond:"#E6F3FF",diamondStop0:"#BEACD3",diamondStop1:"#BEE3F7",diamondStop2:"#EFECE7",diamondStop3:"#F8DDDE",diamondStop4:"#CFE6F1",gold:"#D1A64A",silver:"#A09EA6",bronze:"#956C68"},o={primary:'"IBM Plex Sans", sans-serif',secondary:'"Inter", sans-serif',mono:'"IBM Plex Mono", monospace'},n={1:"12px",2:"14px",3:"16px",4:"20px",5:"24px",6:"28px",7:"40px",8:"48px",9:"72px"},t={regular:400,medium:500,semibold:600},e={interStylistic:"'salt' on, 'ss01' on, 'ss02' on"},r={0:"0",1:"4px",2:"8px",3:"12px",4:"16px",5:"24px",6:"32px",7:"48px",8:"64px",9:"96px",10:"128px"},a={0:"0",xs:"4px",sm:"8px",md:"12px",lg:"16px",xl:"24px",full:"999px"},p={0:0,1:100,2:200,3:300,4:400,5:500},i={fast:"150ms ease",normal:"250ms ease",slow:"400ms ease"},x={colors:s,fonts:o,fontSizes:n,fontWeights:t,fontFeatures:e,spacing:r,radius:a,zIndex:p,transitions:i};exports.colors=s;exports.fontFeatures=e;exports.fontSizes=n;exports.fontWeights=t;exports.fonts=o;exports.radius=a;exports.spacing=r;exports.tokens=x;exports.transitions=i;exports.zIndex=p;