@skbkontur/react-ui 6.4.2-static-css.0 → 6.4.3-6344a.0

package/lib/renderEnvironment/RenderEnvironmentDecorator.js

@@ -18,7 +18,6 @@ var __setFunctionName = (this && this.__setFunctionName) || function (f, name, p
     return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
 };
 import React from 'react';
-import { concatClassNames } from '../theming/Emotion.js';
 import { RenderEnvironmentContext } from './RenderEnvironmentContext.js';
 export function withRenderEnvironment(constructor) {
     var _a;
@@ -30,12 +29,10 @@ export function withRenderEnvironment(constructor) {
             class_1.prototype.render = function () {
                 var _this = this;
                 return (React.createElement(RenderEnvironmentContext.Consumer, null, function (_b) {
-                    var globalObject = _b.globalObject;
+                    var globalObject = _b.globalObject, emotion = _b.emotion;
                     _this.globalObject = globalObject;
-                    // Не из контекста: `cx` — константа, и возить её через контекст было
-                    // платой за ничто. Поле остаётся, потому что `this.cx` зовут из
-                    // полутора сотен мест классовых компонентов.
-                    _this.cx = concatClassNames;
+                    _this.emotion = emotion;
+                    _this.cx = emotion.cx;
                     var originalRender = _super.prototype.render;
                     if (typeof originalRender === 'function') {
                         return originalRender.call(_this);

package/lib/renderEnvironment/RenderEnvironmentDecorator.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderEnvironmentDecorator.js","sourceRoot":"","sources":["RenderEnvironmentDecorator.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AASzE,MAAM,UAAU,qBAAqB,CACnC,WAAc;;IAEd,IAAM,0BAA0B;YAAiB,2BAAW;YAAzB;;YA2BnC,CAAC;YApBQ,wBAAM,GAAb;gBAAA,iBAmBC;gBAlBC,OAAO,CACL,oBAAC,wBAAwB,CAAC,QAAQ,QAC/B,UAAC,EAAgB;wBAAd,YAAY,kBAAA;oBACd,KAAI,CAAC,YAAY,GAAG,YAAY,CAAC;oBACjC,qEAAqE;oBACrE,gEAAgE;oBAChE,6CAA6C;oBAC7C,KAAI,CAAC,EAAE,GAAG,gBAAgB,CAAC;oBAE3B,IAAM,cAAc,GAAG,gBAAK,CAAC,MAAM,CAAC;oBACpC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;wBACzC,OAAO,cAAc,CAAC,IAAI,CAAC,KAAI,CAAC,CAAC;oBACnC,CAAC;oBAED,OAAO,IAAI,CAAC;gBACd,CAAC,CACiC,CACrC,CAAC;YACJ,CAAC;YACH,cAAC;QAAD,CAAC,AA3BkC,CAAc,WAAW;;QAC5C,sBAAmB,GAAG,WAAW,CAAC,mBAAoB;QACtD,cAAW,GAAG,WAAW,CAAC,WAAY;WAyBrD,CAAC;IAEF,IAAM,cAAc,GAAG,MAAM,CAAC,wBAAwB,CAAC,0BAA0B,EAAE,MAAM,CAAC,CAAC;IAC3F,IAAI,CAAC,cAAc,IAAI,cAAc,CAAC,YAAY,EAAE,CAAC;QACnD,MAAM,CAAC,cAAc,CAAC,0BAA0B,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC;IACzF,CAAC;IAED,OAAO,0BAA0B,CAAC;AACpC,CAAC","sourcesContent":["import React from 'react';\n\nimport type { GlobalObject } from '../globalObject.js';\nimport { concatClassNames } from '../theming/Emotion.js';\nimport type { ClassNames } from '../theming/Emotion.js';\nimport { RenderEnvironmentContext } from './RenderEnvironmentContext.js';\n\ninterface ComponentWithKonturReactUI {\n  __KONTUR_REACT_UI__?: string;\n  displayName?: string;\n}\n\ntype Constructor<T = NonNullable<unknown>> = (new (...args: any[]) => T) & ComponentWithKonturReactUI;\n\nexport function withRenderEnvironment<T extends Constructor<React.Component>>(\n  constructor: T,\n): ComponentWithKonturReactUI & T {\n  const RenderEnvironmentDecorator = class extends constructor {\n    public static __KONTUR_REACT_UI__ = constructor.__KONTUR_REACT_UI__;\n    public static displayName = constructor.displayName;\n\n    public globalObject!: GlobalObject;\n    public cx!: ClassNames;\n\n    public render(): React.ReactNode {\n      return (\n        <RenderEnvironmentContext.Consumer>\n          {({ globalObject }) => {\n            this.globalObject = globalObject;\n            // Не из контекста: `cx` — константа, и возить её через контекст было\n            // платой за ничто. Поле остаётся, потому что `this.cx` зовут из\n            // полутора сотен мест классовых компонентов.\n            this.cx = concatClassNames;\n\n            const originalRender = super.render;\n            if (typeof originalRender === 'function') {\n              return originalRender.call(this);\n            }\n\n            return null;\n          }}\n        </RenderEnvironmentContext.Consumer>\n      );\n    }\n  };\n\n  const nameDescriptor = Object.getOwnPropertyDescriptor(RenderEnvironmentDecorator, 'name');\n  if (!nameDescriptor || nameDescriptor.configurable) {\n    Object.defineProperty(RenderEnvironmentDecorator, 'name', { value: constructor.name });\n  }\n\n  return RenderEnvironmentDecorator;\n}\n"]}
+{"version":3,"file":"RenderEnvironmentDecorator.js","sourceRoot":"","sources":["RenderEnvironmentDecorator.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AASzE,MAAM,UAAU,qBAAqB,CACnC,WAAc;;IAEd,IAAM,0BAA0B;YAAiB,2BAAW;YAAzB;;YA0BnC,CAAC;YAlBQ,wBAAM,GAAb;gBAAA,iBAiBC;gBAhBC,OAAO,CACL,oBAAC,wBAAwB,CAAC,QAAQ,QAC/B,UAAC,EAAyB;wBAAvB,YAAY,kBAAA,EAAE,OAAO,aAAA;oBACvB,KAAI,CAAC,YAAY,GAAG,YAAY,CAAC;oBACjC,KAAI,CAAC,OAAO,GAAG,OAAO,CAAC;oBACvB,KAAI,CAAC,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC;oBAErB,IAAM,cAAc,GAAG,gBAAK,CAAC,MAAM,CAAC;oBACpC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;wBACzC,OAAO,cAAc,CAAC,IAAI,CAAC,KAAI,CAAC,CAAC;oBACnC,CAAC;oBAED,OAAO,IAAI,CAAC;gBACd,CAAC,CACiC,CACrC,CAAC;YACJ,CAAC;YACH,cAAC;QAAD,CAAC,AA1BkC,CAAc,WAAW;;QAC5C,sBAAmB,GAAG,WAAW,CAAC,mBAAoB;QACtD,cAAW,GAAG,WAAW,CAAC,WAAY;WAwBrD,CAAC;IAEF,IAAM,cAAc,GAAG,MAAM,CAAC,wBAAwB,CAAC,0BAA0B,EAAE,MAAM,CAAC,CAAC;IAC3F,IAAI,CAAC,cAAc,IAAI,cAAc,CAAC,YAAY,EAAE,CAAC;QACnD,MAAM,CAAC,cAAc,CAAC,0BAA0B,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC;IACzF,CAAC;IAED,OAAO,0BAA0B,CAAC;AACpC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport React from 'react';\n\nimport type { GlobalObject } from '../globalObject.js';\nimport { RenderEnvironmentContext } from './RenderEnvironmentContext.js';\n\ninterface ComponentWithKonturReactUI {\n  __KONTUR_REACT_UI__?: string;\n  displayName?: string;\n}\n\ntype Constructor<T = NonNullable<unknown>> = (new (...args: any[]) => T) & ComponentWithKonturReactUI;\n\nexport function withRenderEnvironment<T extends Constructor<React.Component>>(\n  constructor: T,\n): ComponentWithKonturReactUI & T {\n  const RenderEnvironmentDecorator = class extends constructor {\n    public static __KONTUR_REACT_UI__ = constructor.__KONTUR_REACT_UI__;\n    public static displayName = constructor.displayName;\n\n    public globalObject!: GlobalObject;\n    public cx!: Emotion['cx'];\n    public emotion!: Emotion;\n\n    public render(): React.ReactNode {\n      return (\n        <RenderEnvironmentContext.Consumer>\n          {({ globalObject, emotion }) => {\n            this.globalObject = globalObject;\n            this.emotion = emotion;\n            this.cx = emotion.cx;\n\n            const originalRender = super.render;\n            if (typeof originalRender === 'function') {\n              return originalRender.call(this);\n            }\n\n            return null;\n          }}\n        </RenderEnvironmentContext.Consumer>\n      );\n    }\n  };\n\n  const nameDescriptor = Object.getOwnPropertyDescriptor(RenderEnvironmentDecorator, 'name');\n  if (!nameDescriptor || nameDescriptor.configurable) {\n    Object.defineProperty(RenderEnvironmentDecorator, 'name', { value: constructor.name });\n  }\n\n  return RenderEnvironmentDecorator;\n}\n"]}

package/lib/styles/LabGrotesqueBaseline.css.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/styles/LabGrotesqueBaseline.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabGrotesqueBaseline.css.js","sourceRoot":"","sources":["LabGrotesqueBaseline.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;;;GAIG;AACH,WAAW,CAAC,gCAAgC,EAAE;IAC5C,IAAI,EAAE,EAAE,mBAAmB,EAAE,GAAG,EAAE,iBAAiB,EAAE,IAAI,EAAE,iBAAiB,EAAE,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE;CAClH,CAAC,CAAC;AACH,WAAW,CAAC,iCAAiC,EAAE;IAC7C,IAAI,EAAE,EAAE,mBAAmB,EAAE,GAAG,EAAE,iBAAiB,EAAE,GAAG,EAAE,iBAAiB,EAAE,IAAI,EAAE;CACpF,CAAC,CAAC","sourcesContent":["import { globalStyle } from '@vanilla-extract/css';\n\n/**\n * Поправка базовой линии Lab Grotesque зависит от браузера. Браузер узнаётся в рантайме\n * (атрибут `data-k-browser` на `<html>`, см. bindStaticStyles.ts), множители — здесь.\n * Значения без атрибута — запасные в `getLabGrotesqueBaselineCompensationCss`.\n */\nglobalStyle(':root[data-k-browser=\"chrome\"]', {\n  vars: { '--k-baseline-lt16': '0', '--k-baseline-16': '-1', '--k-baseline-18': '-1', '--k-baseline-toggle': '-1' },\n});\nglobalStyle(':root[data-k-browser=\"firefox\"]', {\n  vars: { '--k-baseline-lt16': '1', '--k-baseline-16': '0', '--k-baseline-18': '-1' },\n});\n"]}

package/lib/styles/Mixins.d.ts

@@ -0,0 +1,2 @@
+export declare const resetButton: () => string;
+export declare const resetText: () => string;

package/lib/styles/Mixins.js

@@ -0,0 +1,7 @@
+export var resetButton = function () {
+    return "\n    outline: none;\n    border: none;\n    margin: 0; /* Need for Safari. */\n    padding: 0;\n    width: auto;\n    overflow: visible; /* On IE it's hidden by default. */\n    background: transparent;\n\n    /* inherit font & color from ancestor */\n    color: inherit;\n    font: inherit;\n\n    /* Normalize 'line-height'. Cannot be changed from 'normal' in Firefox 4+. */\n    line-height: normal;\n\n    /* Corrects font smoothing for webkit */\n    -webkit-font-smoothing: inherit;\n    -moz-osx-font-smoothing: inherit;\n\n    /* Corrects inability to style clickable 'input' types in iOS */\n    -webkit-appearance: none;\n    text-align: inherit;\n\n    &::-moz-focus-inner {\n      border: 0;\n      padding: 0;\n    }\n  ";
+};
+export var resetText = function () {
+    return "\n    letter-spacing: normal;\n    line-height: normal;\n    font-family: inherit;\n    font-weight: normal;\n    font-style: normal;\n    font-variant: normal;\n    font-stretch: normal;\n\n    text-align: initial;\n    text-transform: none;\n    text-shadow: none;\n  ";
+};
+//# sourceMappingURL=Mixins.js.map

package/lib/styles/Mixins.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mixins.js","sourceRoot":"","sources":["Mixins.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,WAAW,GAAG;IACzB,OAAO,guBA4BN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG;IACvB,OAAO,gRAYN,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export const resetButton = (): string => {\n  return `\n    outline: none;\n    border: none;\n    margin: 0; /* Need for Safari. */\n    padding: 0;\n    width: auto;\n    overflow: visible; /* On IE it's hidden by default. */\n    background: transparent;\n\n    /* inherit font & color from ancestor */\n    color: inherit;\n    font: inherit;\n\n    /* Normalize 'line-height'. Cannot be changed from 'normal' in Firefox 4+. */\n    line-height: normal;\n\n    /* Corrects font smoothing for webkit */\n    -webkit-font-smoothing: inherit;\n    -moz-osx-font-smoothing: inherit;\n\n    /* Corrects inability to style clickable 'input' types in iOS */\n    -webkit-appearance: none;\n    text-align: inherit;\n\n    &::-moz-focus-inner {\n      border: 0;\n      padding: 0;\n    }\n  `;\n};\n\nexport const resetText = (): string => {\n  return `\n    letter-spacing: normal;\n    line-height: normal;\n    font-family: inherit;\n    font-weight: normal;\n    font-style: normal;\n    font-variant: normal;\n    font-stretch: normal;\n\n    text-align: initial;\n    text-transform: none;\n    text-shadow: none;\n  `;\n};\n"]}

package/lib/styles/UiFont.d.ts

@@ -0,0 +1,3 @@
+import type { Emotion } from '@emotion/css/create-instance';
+export declare const UI_FONT_NAME = "ui";
+export declare const injectGlobalFont: (emotion: Emotion) => void;

package/lib/styles/UiFont.js

@@ -0,0 +1,18 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+export var UI_FONT_NAME = 'ui';
+var uiFontWoff2 = 'd09GMk9UVE8AAAM0AAkAAAAABOwAAALtAAEZmQAAAAAAAAAAAAAAAAAAAAAAAAAADYNHBmAATAE2AiQDEAQGBYJHByAbSQTIHodxLLFkxvCafPI36w' +
+    'UCtbTOiShd0zOVLzXnVD3Mprf8381PJXqgZb2jFq3JN9rLLMKAEi2lMG8HzqkL4rRGmlAlSFHfIhL0YtdjFEbbAPDD2JUXUURAJRBjl6txH54vKxuX' +
+    'HP/FwmZOmLmImVsys1HRh8nnGD0jMldklFN+ebnk32ymBCATYs9eUNfDZcK63rHvdC91WW2od/d1rYdytB4ACDwoN9HVhJLspIz5RfRs95ndG4zTxu' +
+    '3dG6+tN0Ly/p5bjC179u3ZfKvxOMDp6+i3YZ4iUvhUwYyOfKYo5+ZXruz7oHVcM0dmlNMivlyinulTxYFn2m7b8zNK/G7eqhMX4hso3Eu3ilY8XuO5' +
+    'eCuRyxYDne7OaZTk7IwtqKJCx5F9atBVXuFM5GzWGqcZPOaxIRi9+roWJEcV4/H+ZIO36ojjbYJxXeN+4MY/7jDOb7pm2ILwjHq8P9XgLTrito87qk' +
+    'Ef7CLmfwstiPJxdjqjM48An8/cQb1yxj7tl46qhw/xmMX4tAfkDF/mP/g07YE4zeY5k9ycI+PNf7K5QjTQzkXUEz2Dl5pzl/LqS9U8KxsELOaYwly3' +
+    'nS/t5+cy9nI2c4OSS2QmFNilyVIzAGr660kbyLBgcFdC+l4OaAguNq6ZufAiH9rKWzMjgPsMoflAVgCABOkcgHxIlAIygBC0iN9OkQDACXsjQagsjb' +
+    'Z4LKu1EndYL6271lqrPVQNEX1Ksi/K1yM4o6035S9k+QMAvEqtx/19iZkRySVvBWCbVeohr26j1AwKEiTXeAUAoKWtE36AzEVifNwB1ANQAG6sbhkQ' +
+    'OGevBSTY4ETLtAxRkA1+WD0mg1AHCEIoDhEJHqQiMkqg5jKtRxTo6LesomUfNP1jDP2SljAv944saTKsxwF9qtLkKpVVq96UW3Q0xgCOHAtWMIxYiB' +
+    'HqxBI7OpBSCWUQhm52JqMxLGRwwwl9nBSD9eoApB6rAhMqLNTYSkMdMgw+qyIwAAAAAA==';
+export var injectGlobalFont = function (emotion) { return emotion.injectGlobal(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  @font-face {\n    font-family: ", ";\n    src: url(data:font/woff2;base64,", ") format('woff2');\n  }\n"], ["\n  @font-face {\n    font-family: ", ";\n    src: url(data:font/woff2;base64,", ") format('woff2');\n  }\n"])), UI_FONT_NAME, uiFontWoff2); };
+var templateObject_1;
+//# sourceMappingURL=UiFont.js.map

package/lib/styles/UiFont.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiFont.js","sourceRoot":"","sources":["UiFont.ts"],"names":[],"mappings":";;;;AAEA,MAAM,CAAC,IAAM,YAAY,GAAG,IAAI,CAAC;AAEjC,IAAM,WAAW,GACf,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,oHAAoH;IACpH,wEAAwE,CAAC;AAE3E,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAC,OAAgB,IAAW,OAAA,OAAO,CAAC,YAAY,gLAAA,qCAE7D,EAAY,yCACO,EAAW,2BAEhD,KAHkB,YAAY,EACO,WAAW,GAHW,CAK3D,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nexport const UI_FONT_NAME = 'ui';\n\nconst uiFontWoff2 =\n  'd09GMk9UVE8AAAM0AAkAAAAABOwAAALtAAEZmQAAAAAAAAAAAAAAAAAAAAAAAAAADYNHBmAATAE2AiQDEAQGBYJHByAbSQTIHodxLLFkxvCafPI36w' +\n  'UCtbTOiShd0zOVLzXnVD3Mprf8381PJXqgZb2jFq3JN9rLLMKAEi2lMG8HzqkL4rRGmlAlSFHfIhL0YtdjFEbbAPDD2JUXUURAJRBjl6txH54vKxuX' +\n  'HP/FwmZOmLmImVsys1HRh8nnGD0jMldklFN+ebnk32ymBCATYs9eUNfDZcK63rHvdC91WW2od/d1rYdytB4ACDwoN9HVhJLspIz5RfRs95ndG4zTxu' +\n  '3dG6+tN0Ly/p5bjC179u3ZfKvxOMDp6+i3YZ4iUvhUwYyOfKYo5+ZXruz7oHVcM0dmlNMivlyinulTxYFn2m7b8zNK/G7eqhMX4hso3Eu3ilY8XuO5' +\n  'eCuRyxYDne7OaZTk7IwtqKJCx5F9atBVXuFM5GzWGqcZPOaxIRi9+roWJEcV4/H+ZIO36ojjbYJxXeN+4MY/7jDOb7pm2ILwjHq8P9XgLTrito87qk' +\n  'Ef7CLmfwstiPJxdjqjM48An8/cQb1yxj7tl46qhw/xmMX4tAfkDF/mP/g07YE4zeY5k9ycI+PNf7K5QjTQzkXUEz2Dl5pzl/LqS9U8KxsELOaYwly3' +\n  'nS/t5+cy9nI2c4OSS2QmFNilyVIzAGr660kbyLBgcFdC+l4OaAguNq6ZufAiH9rKWzMjgPsMoflAVgCABOkcgHxIlAIygBC0iN9OkQDACXsjQagsjb' +\n  'Z4LKu1EndYL6271lqrPVQNEX1Ksi/K1yM4o6035S9k+QMAvEqtx/19iZkRySVvBWCbVeohr26j1AwKEiTXeAUAoKWtE36AzEVifNwB1ANQAG6sbhkQ' +\n  'OGevBSTY4ETLtAxRkA1+WD0mg1AHCEIoDhEJHqQiMkqg5jKtRxTo6LesomUfNP1jDP2SljAv944saTKsxwF9qtLkKpVVq96UW3Q0xgCOHAtWMIxYiB' +\n  'HqxBI7OpBSCWUQhm52JqMxLGRwwwl9nBSD9eoApB6rAhMqLNTYSkMdMgw+qyIwAAAAAA==';\n\nexport const injectGlobalFont = (emotion: Emotion): void => emotion.injectGlobal`\n  @font-face {\n    font-family: ${UI_FONT_NAME};\n    src: url(data:font/woff2;base64,${uiFontWoff2}) format('woff2');\n  }\n`;\n"]}

package/lib/styles/getLabGrotesqueBaselineCompensation.d.ts

@@ -0,0 +1,7 @@
+export declare const getLabGrotesqueBaselineCompensation: (fontSize: number, compensation: number, isChrome: boolean, isFirefox: boolean) => number;
+/**
+ * То же, что getLabGrotesqueBaselineCompensation, но для стилей, собираемых при сборке: условие по размеру
+ * шрифта считается для значения по умолчанию, браузер — множителем из LabGrotesqueBaseline.css.ts.
+ */
+export declare const getLabGrotesqueBaselineCompensationCss: (fontSize: string, compensation: string) => string;
+export declare const getToggleBaselineCompensationCss: (fontSize: string, compensation: string) => string;

package/lib/styles/getLabGrotesqueBaselineCompensation.js

@@ -0,0 +1,36 @@
+export var getLabGrotesqueBaselineCompensation = function (fontSize, compensation, isChrome, isFirefox) {
+    if (fontSize < 16 && !isChrome) {
+        return compensation;
+    }
+    else if ((fontSize === 16 && isChrome) || (fontSize === 18 && (isFirefox || isChrome))) {
+        return -compensation;
+    }
+    return 0;
+};
+// `var(--k-x, var(--k-y, 14px))` -> 14
+var defaultPx = function (value) { var _a, _b; return parseInt((_b = (_a = value.match(/(\d+(?:\.\d+)?)px\)*\s*$/)) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : value); };
+/**
+ * То же, что getLabGrotesqueBaselineCompensation, но для стилей, собираемых при сборке: условие по размеру
+ * шрифта считается для значения по умолчанию, браузер — множителем из LabGrotesqueBaseline.css.ts.
+ */
+export var getLabGrotesqueBaselineCompensationCss = function (fontSize, compensation) {
+    var size = defaultPx(fontSize);
+    var factor;
+    if (size < 16) {
+        factor = 'var(--k-baseline-lt16, 1)';
+    }
+    else if (size === 16) {
+        factor = 'var(--k-baseline-16, 0)';
+    }
+    else if (size === 18) {
+        factor = 'var(--k-baseline-18, 0)';
+    }
+    else {
+        return '0px';
+    }
+    return "calc(".concat(factor, " * ").concat(compensation, " * 1px)");
+};
+export var getToggleBaselineCompensationCss = function (fontSize, compensation) {
+    return defaultPx(fontSize) <= 16 ? "calc(var(--k-baseline-toggle, 0) * ".concat(compensation, " * 1px)") : '0px';
+};
+//# sourceMappingURL=getLabGrotesqueBaselineCompensation.js.map

package/lib/styles/getLabGrotesqueBaselineCompensation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getLabGrotesqueBaselineCompensation.js","sourceRoot":"","sources":["getLabGrotesqueBaselineCompensation.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,mCAAmC,GAAG,UACjD,QAAgB,EAChB,YAAoB,EACpB,QAAiB,EACjB,SAAkB;IAElB,IAAI,QAAQ,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;QAC/B,OAAO,YAAY,CAAC;IACtB,CAAC;SAAM,IAAI,CAAC,QAAQ,KAAK,EAAE,IAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,KAAK,EAAE,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,CAAC,EAAE,CAAC;QACzF,OAAO,CAAC,YAAY,CAAC;IACvB,CAAC;IAED,OAAO,CAAC,CAAC;AACX,CAAC,CAAC;AAEF,uCAAuC;AACvC,IAAM,SAAS,GAAG,UAAC,KAAa,gBAAa,OAAA,QAAQ,CAAC,MAAA,MAAA,KAAK,CAAC,KAAK,CAAC,0BAA0B,CAAC,0CAAG,CAAC,CAAC,mCAAI,KAAK,CAAC,CAAA,EAAA,CAAC;AAE7G;;;GAGG;AACH,MAAM,CAAC,IAAM,sCAAsC,GAAG,UAAC,QAAgB,EAAE,YAAoB;IAC3F,IAAM,IAAI,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;IACjC,IAAI,MAAM,CAAC;IACX,IAAI,IAAI,GAAG,EAAE,EAAE,CAAC;QACd,MAAM,GAAG,2BAA2B,CAAC;IACvC,CAAC;SAAM,IAAI,IAAI,KAAK,EAAE,EAAE,CAAC;QACvB,MAAM,GAAG,yBAAyB,CAAC;IACrC,CAAC;SAAM,IAAI,IAAI,KAAK,EAAE,EAAE,CAAC;QACvB,MAAM,GAAG,yBAAyB,CAAC;IACrC,CAAC;SAAM,CAAC;QACN,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,eAAQ,MAAM,gBAAM,YAAY,YAAS,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,gCAAgC,GAAG,UAAC,QAAgB,EAAE,YAAoB;IACrF,OAAA,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,6CAAsC,YAAY,YAAS,CAAC,CAAC,CAAC,KAAK;AAA/F,CAA+F,CAAC","sourcesContent":["export const getLabGrotesqueBaselineCompensation = (\n  fontSize: number,\n  compensation: number,\n  isChrome: boolean,\n  isFirefox: boolean,\n): number => {\n  if (fontSize < 16 && !isChrome) {\n    return compensation;\n  } else if ((fontSize === 16 && isChrome) || (fontSize === 18 && (isFirefox || isChrome))) {\n    return -compensation;\n  }\n\n  return 0;\n};\n\n// `var(--k-x, var(--k-y, 14px))` -> 14\nconst defaultPx = (value: string): number => parseInt(value.match(/(\\d+(?:\\.\\d+)?)px\\)*\\s*$/)?.[1] ?? value);\n\n/**\n * То же, что getLabGrotesqueBaselineCompensation, но для стилей, собираемых при сборке: условие по размеру\n * шрифта считается для значения по умолчанию, браузер — множителем из LabGrotesqueBaseline.css.ts.\n */\nexport const getLabGrotesqueBaselineCompensationCss = (fontSize: string, compensation: string): string => {\n  const size = defaultPx(fontSize);\n  let factor;\n  if (size < 16) {\n    factor = 'var(--k-baseline-lt16, 1)';\n  } else if (size === 16) {\n    factor = 'var(--k-baseline-16, 0)';\n  } else if (size === 18) {\n    factor = 'var(--k-baseline-18, 0)';\n  } else {\n    return '0px';\n  }\n  return `calc(${factor} * ${compensation} * 1px)`;\n};\n\nexport const getToggleBaselineCompensationCss = (fontSize: string, compensation: string): string =>\n  defaultPx(fontSize) <= 16 ? `calc(var(--k-baseline-toggle, 0) * ${compensation} * 1px)` : '0px';\n"]}

package/lib/theming/AnimationKeyframes.d.ts

@@ -0,0 +1,7 @@
+import type { Theme } from './Theme.js';
+export declare const getAnimationKeyframes: import("./StaticStyles.js").StylesGetter<{
+    spinnerCircleOffset(): string;
+    spinnerCircleLength(): string;
+    spinnerCircleRotate(): string;
+    spinnerColor(t: Theme): string;
+}>;

package/lib/theming/AnimationKeyframes.js

@@ -0,0 +1,24 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from './StaticStyles.js';
+export var getAnimationKeyframes = memoizeGetStyles(function (_a) {
+    var keyframes = _a.keyframes;
+    return ({
+        spinnerCircleOffset: function () {
+            return keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        0% { stroke-dashoffset: 231.25%; }\n        100% { stroke-dashoffset: 0%; }\n      "], ["\n        0% { stroke-dashoffset: 231.25%; }\n        100% { stroke-dashoffset: 0%; }\n      "])));
+        },
+        spinnerCircleLength: function () {
+            return keyframes(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      "], ["\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      "])));
+        },
+        spinnerCircleRotate: function () {
+            return keyframes(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        100% { transform: rotate(360deg); }\n      "], ["\n        100% { transform: rotate(360deg); }\n      "])));
+        },
+        spinnerColor: function (t) {
+            return keyframes(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n        100%, 0% { stroke: ", "; }\n        40% { stroke: ", "; }\n        66% { stroke: ", "; }\n        80%, 90% { stroke: ", "; }\n      "], ["\n        100%, 0% { stroke: ", "; }\n        40% { stroke: ", "; }\n        66% { stroke: ", "; }\n        80%, 90% { stroke: ", "; }\n      "])), t.red, t.yellow, t.green, t.brand);
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=AnimationKeyframes.js.map

package/lib/theming/AnimationKeyframes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationKeyframes.js","sourceRoot":"","sources":["AnimationKeyframes.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAGrD,MAAM,CAAC,IAAM,qBAAqB,GAAG,gBAAgB,CAAC,UAAC,EAAsB;QAApB,SAAS,eAAA;IAAgB,OAAA,CAAC;QACjF,mBAAmB;YACjB,OAAO,SAAS,kKAAA,+FAGb,KAAC;QACN,CAAC;QACD,mBAAmB;YACjB,OAAO,SAAS,uOAAA,oKAIb,KAAC;QACN,CAAC;QACD,mBAAmB;YACjB,OAAO,SAAS,0HAAA,uDAEb,KAAC;QACN,CAAC;QACD,YAAY,YAAC,CAAQ;YACnB,OAAO,SAAS,mNAAA,+BACS,EAAK,6BACV,EAAQ,6BACR,EAAO,kCACF,EAAO,aAC7B,KAJsB,CAAC,CAAC,GAAG,EACV,CAAC,CAAC,MAAM,EACR,CAAC,CAAC,KAAK,EACF,CAAC,CAAC,KAAK,EAC5B;QACN,CAAC;KACF,CAAC;AA3BgF,CA2BhF,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from './StaticStyles.js';\nimport type { Theme } from './Theme.js';\n\nexport const getAnimationKeyframes = memoizeGetStyles(({ keyframes }: Emotion) => ({\n  spinnerCircleOffset() {\n    return keyframes`\n        0% { stroke-dashoffset: 231.25%; }\n        100% { stroke-dashoffset: 0%; }\n      `;\n  },\n  spinnerCircleLength() {\n    return keyframes`\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      `;\n  },\n  spinnerCircleRotate() {\n    return keyframes`\n        100% { transform: rotate(360deg); }\n      `;\n  },\n  spinnerColor(t: Theme) {\n    return keyframes`\n        100%, 0% { stroke: ${t.red}; }\n        40% { stroke: ${t.yellow}; }\n        66% { stroke: ${t.green}; }\n        80%, 90% { stroke: ${t.brand}; }\n      `;\n  },\n}));\n"]}

package/lib/theming/Emotion.d.ts

@@ -1,49 +1,19 @@
-/**
- * Что осталось от Emotion: склейка имён и префикс классов.
- *
- * Инстанса здесь больше нет. Он держался ради двух вещей — вставки правил и
- * `cx`, — и первой не осталось: все стилевые модули отдают готовые имена
- * классов, а правила приезжают файлом `react-ui.css`. От второй осталась чистая
- * функция: ни кеша, ни тега `<style>`, ни контейнера ей не нужно.
- *
- * Тип `Emotion` импортируется только ради сигнатуры `cx` — чтобы у приложений,
- * которые брали её из инстанса, тип не поменялся.
- */
+import type { Emotion } from '@emotion/css/create-instance';
+import type { Theme } from './Theme.js';
 export declare const REACT_UI_PREFIX: string;
-/** Аргумент `cx`: строка, число, массив таких же или словарь «класс → условие». */
-type ClassNamesArg = string | number | boolean | null | undefined | ClassNamesArg[] | Record<string, unknown>;
-/** Склейка имён классов: то, что осталось от `cx`. */
-export type ClassNames = (...args: ClassNamesArg[]) => string;
 /**
- * Склейка имён вместо слияния зарегистрированных классов.
- *
- * `cx` из Emotion не склеивает имена, а сливает содержимое классов в один
- * новый, чьё правило вставляется в рантайме. Сливать нечего: правила
- * компонентов приезжают файлом, и слияние породило бы правило, которого в файле
- * нет.
- *
- * Без слияния спор между правилами решает порядок в таблице стилей. Пока
- * правила вставлял рантайм, этот порядок равнялся порядку первого вызова `css`:
- * у `Button` размерный класс оказывался в таблице раньше `root`, и сброс кнопки
- * (`padding: 0`) перебивал размер — снимок вычисленных стилей дал на этом 6452
- * расхождения. В извлечённом файле порядок задаёт обход геттеров: `root`
- * объявлен первым, модификаторы после, и каскад отрабатывает как надо.
+ * Стили собираются при сборке, в рантайме от Emotion остался только `cx`.
+ * Форма объекта сохранена, чтобы компоненты не менялись.
  */
-export declare const concatClassNames: ClassNames;
-/** Словарь классов компонента: имя геттера → имя класса. */
+export declare const getEmotion: (_options?: {
+    container?: HTMLElement;
+    key?: string;
+    nonce?: string;
+}) => Emotion;
 export interface StylesObject {
-    [key: string]: (...args: never[]) => string;
+    [className: string]: (() => string) | ((t: Theme) => string);
 }
-/**
- * Фабрика словаря классов.
- *
- * Аргумент остался необязательным ради формы вызова: модули объявляют
- * `staticStyles({...})`, а компоненты зовут `getStyles()`. Инстанс сюда больше
- * не передаётся.
- */
-export type StylesGetter<S> = (ignored?: unknown) => S;
+export type StylesGetter<S> = (emotion: Emotion) => S;
 export declare const memoizeStyle: <S extends StylesObject>(styles: S) => S;
 export declare const memoizeGetStyles: <S extends StylesObject>(getStyles: StylesGetter<S>) => StylesGetter<S>;
-/** `prefix('button')({ root: 'root' })` -> `{ root: 'react-ui-button-root' }`. */
 export declare const prefix: (component: string, app?: string) => <T extends Record<string, string>>(classes: T) => T;
-export {};

package/lib/theming/Emotion.js

@@ -10,91 +10,79 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { Upgrade } from '../Upgrades.js';
-/**
- * Что осталось от Emotion: склейка имён и префикс классов.
- *
- * Инстанса здесь больше нет. Он держался ради двух вещей — вставки правил и
- * `cx`, — и первой не осталось: все стилевые модули отдают готовые имена
- * классов, а правила приезжают файлом `react-ui.css`. От второй осталась чистая
- * функция: ни кеша, ни тега `<style>`, ни контейнера ей не нужно.
- *
- * Тип `Emotion` импортируется только ради сигнатуры `cx` — чтобы у приложений,
- * которые брали её из инстанса, тип не поменялся.
- */
 export var REACT_UI_PREFIX = Upgrade.getSpecificityClassName();
-/**
- * Склейка имён вместо слияния зарегистрированных классов.
- *
- * `cx` из Emotion не склеивает имена, а сливает содержимое классов в один
- * новый, чьё правило вставляется в рантайме. Сливать нечего: правила
- * компонентов приезжают файлом, и слияние породило бы правило, которого в файле
- * нет.
- *
- * Без слияния спор между правилами решает порядок в таблице стилей. Пока
- * правила вставлял рантайм, этот порядок равнялся порядку первого вызова `css`:
- * у `Button` размерный класс оказывался в таблице раньше `root`, и сброс кнопки
- * (`padding: 0`) перебивал размер — снимок вычисленных стилей дал на этом 6452
- * расхождения. В извлечённом файле порядок задаёт обход геттеров: `root`
- * объявлен первым, модификаторы после, и каскад отрабатывает как надо.
- */
-export var concatClassNames = function () {
+var cx = function () {
     var args = [];
     for (var _i = 0; _i < arguments.length; _i++) {
         args[_i] = arguments[_i];
     }
-    var names = [];
-    var push = function (arg) {
+    return args
+        .flatMap(function (arg) {
         if (!arg) {
-            return;
-        }
-        if (typeof arg === 'string' || typeof arg === 'number') {
-            names.push(String(arg));
-            return;
+            return [];
         }
         if (Array.isArray(arg)) {
-            arg.forEach(push);
-            return;
+            return [cx.apply(void 0, arg)];
         }
-        for (var _i = 0, _a = Object.entries(arg); _i < _a.length; _i++) {
-            var _b = _a[_i], name_1 = _b[0], value = _b[1];
-            if (value) {
-                names.push(name_1);
-            }
+        if (typeof arg === 'object') {
+            return Object.keys(arg).filter(function (key) { return arg[key]; });
         }
-    };
-    args.forEach(push);
-    return names.join(' ');
+        return [String(arg)];
+    })
+        .filter(Boolean)
+        .join(' ');
+};
+var notAvailable = function () {
+    throw new Error('[react-ui] Стили собираются при сборке (vanilla-extract), рантайм-Emotion недоступен');
+};
+/**
+ * Стили собираются при сборке, в рантайме от Emotion остался только `cx`.
+ * Форма объекта сохранена, чтобы компоненты не менялись.
+ */
+export var getEmotion = function (_options) {
+    return ({
+        cx: cx,
+        css: notAvailable,
+        keyframes: notAvailable,
+        injectGlobal: notAvailable,
+    });
 };
 function isZeroArgs(fn) {
     return fn.length === 0;
 }
 var memoize = function (fn) {
-    var cache = new Map();
-    var noArgs = Symbol('no-args');
+    if (isZeroArgs(fn)) {
+        var isCalled_1 = false;
+        var result_1;
+        return function () {
+            if (!isCalled_1) {
+                isCalled_1 = true;
+                result_1 = fn();
+            }
+            return result_1;
+        };
+    }
+    var cache = new WeakMap();
     return function (arg) {
-        var key = arg !== null && arg !== void 0 ? arg : noArgs;
-        if (!cache.has(key)) {
-            cache.set(key, isZeroArgs(fn) ? fn() : fn(arg));
+        if (!cache.has(arg)) {
+            cache.set(arg, fn(arg));
         }
-        return cache.get(key);
+        return cache.get(arg);
     };
 };
 export var memoizeStyle = function (styles) {
-    var result = {};
-    for (var _i = 0, _a = Object.keys(styles); _i < _a.length; _i++) {
-        var key = _a[_i];
-        result[key] = memoize(styles[key]);
-    }
-    return result;
+    Object.keys(styles).forEach(function (className) { return (styles[className] = memoize(styles[className])); });
+    return styles;
 };
 export var memoizeGetStyles = function (getStyles) {
-    var cached;
-    return function () {
-        cached !== null && cached !== void 0 ? cached : (cached = memoizeStyle(getStyles()));
-        return cached;
+    var stylesCache = new WeakMap();
+    return function (emotion) {
+        if (!stylesCache.has(emotion)) {
+            stylesCache.set(emotion, memoizeStyle(getStyles(emotion)));
+        }
+        return stylesCache.get(emotion);
     };
 };
-/** `prefix('button')({ root: 'root' })` -> `{ root: 'react-ui-button-root' }`. */
 export var prefix = function (component, app) {
     if (app === void 0) { app = REACT_UI_PREFIX; }
     return function (classes) {

package/lib/theming/Emotion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Emotion.js","sourceRoot":"","sources":["Emotion.ts"],"names":[],"mappings":"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","sourcesContent":["import { Upgrade } from '../Upgrades.js';\nimport type { AnyObject, FunctionWithParams } from '../utils.js';\n\n/**\n * Что осталось от Emotion: склейка имён и префикс классов.\n *\n * Инстанса здесь больше нет. Он держался ради двух вещей — вставки правил и\n * `cx`, — и первой не осталось: все стилевые модули отдают готовые имена\n * классов, а правила приезжают файлом `react-ui.css`. От второй осталась чистая\n * функция: ни кеша, ни тега `<style>`, ни контейнера ей не нужно.\n *\n * Тип `Emotion` импортируется только ради сигнатуры `cx` — чтобы у приложений,\n * которые брали её из инстанса, тип не поменялся.\n */\nexport const REACT_UI_PREFIX = Upgrade.getSpecificityClassName();\n\n/** Аргумент `cx`: строка, число, массив таких же или словарь «класс → условие». */\ntype ClassNamesArg = string | number | boolean | null | undefined | ClassNamesArg[] | Record<string, unknown>;\n\n/** Склейка имён классов: то, что осталось от `cx`. */\nexport type ClassNames = (...args: ClassNamesArg[]) => string;\n\n/**\n * Склейка имён вместо слияния зарегистрированных классов.\n *\n * `cx` из Emotion не склеивает имена, а сливает содержимое классов в один\n * новый, чьё правило вставляется в рантайме. Сливать нечего: правила\n * компонентов приезжают файлом, и слияние породило бы правило, которого в файле\n * нет.\n *\n * Без слияния спор между правилами решает порядок в таблице стилей. Пока\n * правила вставлял рантайм, этот порядок равнялся порядку первого вызова `css`:\n * у `Button` размерный класс оказывался в таблице раньше `root`, и сброс кнопки\n * (`padding: 0`) перебивал размер — снимок вычисленных стилей дал на этом 6452\n * расхождения. В извлечённом файле порядок задаёт обход геттеров: `root`\n * объявлен первым, модификаторы после, и каскад отрабатывает как надо.\n */\nexport const concatClassNames: ClassNames = (...args: ClassNamesArg[]) => {\n  const names: string[] = [];\n\n  const push = (arg: ClassNamesArg) => {\n    if (!arg) {\n      return;\n    }\n    if (typeof arg === 'string' || typeof arg === 'number') {\n      names.push(String(arg));\n      return;\n    }\n    if (Array.isArray(arg)) {\n      arg.forEach(push);\n      return;\n    }\n    for (const [name, value] of Object.entries(arg)) {\n      if (value) {\n        names.push(name);\n      }\n    }\n  };\n\n  args.forEach(push);\n\n  return names.join(' ');\n};\n\nfunction isZeroArgs<R, T extends FunctionWithParams<R>>(fn: T | FunctionWithParams<R>): fn is () => R {\n  return fn.length === 0;\n}\n\nconst memoize = <A extends AnyObject, R>(fn: (() => R) | ((arg: A) => R)): (() => R) | ((arg: A) => R) => {\n  const cache = new Map<A | symbol, R>();\n  const noArgs = Symbol('no-args');\n\n  return (arg?: A) => {\n    const key = arg ?? noArgs;\n    if (!cache.has(key)) {\n      cache.set(key, isZeroArgs(fn) ? fn() : (fn as (value: A) => R)(arg as A));\n    }\n\n    return cache.get(key) as R;\n  };\n};\n\n/** Словарь классов компонента: имя геттера → имя класса. */\nexport interface StylesObject {\n  [key: string]: (...args: never[]) => string;\n}\n\n/**\n * Фабрика словаря классов.\n *\n * Аргумент остался необязательным ради формы вызова: модули объявляют\n * `staticStyles({...})`, а компоненты зовут `getStyles()`. Инстанс сюда больше\n * не передаётся.\n */\nexport type StylesGetter<S> = (ignored?: unknown) => S;\n\nexport const memoizeStyle = <S extends StylesObject>(styles: S): S => {\n  const result = {} as S;\n\n  for (const key of Object.keys(styles) as Array<keyof S>) {\n    result[key] = memoize(styles[key] as never) as S[keyof S];\n  }\n\n  return result;\n};\n\nexport const memoizeGetStyles = <S extends StylesObject>(getStyles: StylesGetter<S>): StylesGetter<S> => {\n  let cached: S | undefined;\n\n  return () => {\n    cached ??= memoizeStyle(getStyles());\n\n    return cached;\n  };\n};\n\n/** `prefix('button')({ root: 'root' })` -> `{ root: 'react-ui-button-root' }`. */\nexport const prefix =\n  (component: string, app = REACT_UI_PREFIX) =>\n  <T extends Record<string, string>>(classes: T): T =>\n    Object.keys(classes).reduce((acc, key) => {\n      return { ...acc, [key]: `${app}-${component}-${classes[key]}` };\n    }, {} as T);\n"]}
+{"version":3,"file":"Emotion.js","sourceRoot":"","sources":["Emotion.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { Upgrade } from '../Upgrades.js';\nimport type { AnyObject, FunctionWithParams } from '../utils.js';\nimport type { Theme } from './Theme.js';\n\nexport const REACT_UI_PREFIX = Upgrade.getSpecificityClassName();\n\nconst cx = (...args: unknown[]): string =>\n  args\n    .flatMap((arg): string[] => {\n      if (!arg) {\n        return [];\n      }\n      if (Array.isArray(arg)) {\n        return [cx(...arg)];\n      }\n      if (typeof arg === 'object') {\n        return Object.keys(arg as AnyObject).filter((key) => (arg as AnyObject)[key]);\n      }\n      return [String(arg)];\n    })\n    .filter(Boolean)\n    .join(' ');\n\nconst notAvailable = (): never => {\n  throw new Error('[react-ui] Стили собираются при сборке (vanilla-extract), рантайм-Emotion недоступен');\n};\n\n/**\n * Стили собираются при сборке, в рантайме от Emotion остался только `cx`.\n * Форма объекта сохранена, чтобы компоненты не менялись.\n */\nexport const getEmotion = (_options?: { container?: HTMLElement; key?: string; nonce?: string }): Emotion =>\n  ({\n    cx,\n    css: notAvailable,\n    keyframes: notAvailable,\n    injectGlobal: notAvailable,\n  }) as unknown as Emotion;\n\nfunction isZeroArgs<R, T extends FunctionWithParams<R>>(fn: T | FunctionWithParams<R>): fn is () => R {\n  return fn.length === 0;\n}\n\nconst memoize = <A extends AnyObject, R>(fn: (() => R) | ((arg: A) => R)): (() => R) | ((arg: A) => R) => {\n  if (isZeroArgs(fn)) {\n    let isCalled = false;\n    let result: R;\n    return () => {\n      if (!isCalled) {\n        isCalled = true;\n        result = fn();\n      }\n      return result;\n    };\n  }\n\n  const cache = new WeakMap();\n  return (arg: A) => {\n    if (!cache.has(arg)) {\n      cache.set(arg, fn(arg));\n    }\n\n    return cache.get(arg);\n  };\n};\n\nexport interface StylesObject {\n  [className: string]: (() => string) | ((t: Theme) => string);\n}\n\nexport type StylesGetter<S> = (emotion: Emotion) => S;\n\nexport const memoizeStyle = <S extends StylesObject>(styles: S): S => {\n  Object.keys(styles).forEach((className) => (styles[className as keyof S] = memoize(styles[className]) as S[keyof S]));\n  return styles;\n};\n\nexport const memoizeGetStyles = <S extends StylesObject>(getStyles: StylesGetter<S>): StylesGetter<S> => {\n  const stylesCache = new WeakMap<Emotion, S>();\n  return (emotion: Emotion): S => {\n    if (!stylesCache.has(emotion)) {\n      stylesCache.set(emotion, memoizeStyle(getStyles(emotion)));\n    }\n\n    return stylesCache.get(emotion) as S;\n  };\n};\n\nexport const prefix =\n  (component: string, app = REACT_UI_PREFIX) =>\n  <T extends Record<string, string>>(classes: T): T =>\n    Object.keys(classes).reduce((acc, key) => {\n      return { ...acc, [key]: `${app}-${component}-${classes[key]}` };\n    }, {} as T);\n"]}

package/lib/theming/StaticStyles.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Адаптер Emotion → vanilla-extract. Работает только при сборке, внутри файлов `*.css.ts`.
+ *
+ * Геттеры стилей остаются в прежнем виде (`emotion.css` + шаблон + токены темы), но вычисляются
+ * один раз при сборке: вместо темы им подаётся словарь `var(--k-<токен>, <значение по умолчанию>)`,
+ * а каждый вызов `css` регистрирует статическое правило через `globalStyle`. В рантайм попадает
+ * только карта класснеймов, её собирает `bindStaticStyles`.
+ */
+import type { Emotion } from '@emotion/css/create-instance';
+import type { Theme } from './Theme.js';
+export declare const REACT_UI_CLASS_PREFIX = "react-ui";
+type Getter = ((...args: any[]) => string) | (() => string);
+export interface StylesObject {
+    [className: string]: Getter;
+}
+export type StylesGetter<S> = (emotion: Emotion) => S;
+export declare const themeAtBuildTime: Theme;
+export declare const staticEmotion: Emotion;
+export declare const memoizeGetStyles: <S extends StylesObject>(getStyles: StylesGetter<S>) => StylesGetter<S>;
+/**
+ * Последняя строка каждого *.css.ts: вычисляет стили файла в порядке объявления.
+ * Отдельный шаг нужен, потому что геттеры ссылаются на объявленные ниже (`getActiveStyles` в Button).
+ *
+ * `late` — геттеры, чьи правила должны идти в конце файла. Emotion вставлял правила в порядке вызова,
+ * и модификаторы вроде `disabled`, зовущиеся последними в `cx(...)`, выигрывали у базовых при равном весе;
+ * в статическом CSS выигрывает объявленное ниже. Так порядок чинится без перестановки кода.
+ */
+export declare const finalizeStaticStyles: (late?: string[]) => void;
+export declare const memoizeStyle: <S extends StylesObject>(styles: S) => S;
+export {};