@salutejs/plasma-new-hope 0.133.1 → 0.133.2-canary.1407.10627806569.0

package/emotion/cjs/examples/sds_engineer/components/Tooltip/Tooltip.config.js

@@ -1,22 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.config = void 0;
-var _react = /*#__PURE__*/require("@emotion/react");
-var _Tooltip = /*#__PURE__*/require("../../../../components/Tooltip");
-var config = exports.config = {
-  defaults: {
-    view: 'default',
-    size: 'm'
-  },
-  variations: {
-    size: {
-      m: /*#__PURE__*/(0, _react.css)(_Tooltip.tooltipTokens.paddingTop, ":0.25rem;", _Tooltip.tooltipTokens.paddingRight, ":0.5rem;", _Tooltip.tooltipTokens.paddingBottom, ":0.25rem;", _Tooltip.tooltipTokens.paddingLeft, ":0.5rem;", _Tooltip.tooltipTokens.minHeight, ":1.5rem;", _Tooltip.tooltipTokens.borderRadius, ":0.25rem;", _Tooltip.tooltipTokens.textFontFamily, ":var(--plasma-typo-body-s-font-family);", _Tooltip.tooltipTokens.textFontSize, ":var(--plasma-typo-body-s-font-size);", _Tooltip.tooltipTokens.textFontStyle, ":var(--plasma-typo-body-s-font-style);", _Tooltip.tooltipTokens.textFontWeight, ":500;", _Tooltip.tooltipTokens.textFontLetterSpacing, ":0px;", _Tooltip.tooltipTokens.textFontLineHeight, ":1rem;", _Tooltip.tooltipTokens.contentLeftMargin, ":0.25rem;", _Tooltip.tooltipTokens.arrowMaskWidth, ":1rem;", _Tooltip.tooltipTokens.arrowMaskHeight, ":1rem;", _Tooltip.tooltipTokens.arrowMaskImage, ":url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0ibTgsMTUuNzhsLTIuMjQsLTQuMzRjLTAuOTIsLTEuNzkgLTEuMzgsLTIuNjggLTIuMTUsLTMuMTdjLTAuNzcsLTAuNDkgLTEuNzIsLTAuNDkgLTMuNjEsLTAuNDlsMTYsMGMtMS44OSwwIC0yLjgzLDAgLTMuNiwwLjQ5Yy0wLjc4LDAuNDkgLTEuMjQsMS4zOCAtMi4xNiwzLjE2bC0yLjI0LDQuMzV6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLW9wYWNpdHk9IjEiIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9InBvaW50ZXIiLz4KPC9zdmc+\");", _Tooltip.tooltipTokens.arrowHeight, ":0.5rem;", _Tooltip.tooltipTokens.arrowEdgeMargin, ":0.625rem;", _Tooltip.tooltipTokens.arrowBackground, ":#475056;;label:plasma-new-hope__m;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2V4YW1wbGVzL3Nkc19lbmdpbmVlci9jb21wb25lbnRzL1Rvb2x0aXAvVG9vbHRpcC5jb25maWcudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBV2tCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2V4YW1wbGVzL3Nkc19lbmdpbmVlci9jb21wb25lbnRzL1Rvb2x0aXAvVG9vbHRpcC5jb25maWcudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRvb2x0aXBUb2tlbnMgfSBmcm9tICcuLi8uLi8uLi8uLi9jb21wb25lbnRzL1Rvb2x0aXAnO1xuXG5leHBvcnQgY29uc3QgY29uZmlnID0ge1xuICAgIGRlZmF1bHRzOiB7XG4gICAgICAgIHZpZXc6ICdkZWZhdWx0JyxcbiAgICAgICAgc2l6ZTogJ20nLFxuICAgIH0sXG4gICAgdmFyaWF0aW9uczoge1xuICAgICAgICBzaXplOiB7XG4gICAgICAgICAgICBtOiBjc3NgXG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnBhZGRpbmdUb3B9OiAwLjI1cmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5wYWRkaW5nUmlnaHR9OiAwLjVyZW07XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnBhZGRpbmdCb3R0b219OiAwLjI1cmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5wYWRkaW5nTGVmdH06IDAuNXJlbTtcblxuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5taW5IZWlnaHR9OiAxLjVyZW07XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmJvcmRlclJhZGl1c306IDAuMjVyZW07XG5cbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMudGV4dEZvbnRGYW1pbHl9OiB2YXIoLS1wbGFzbWEtdHlwby1ib2R5LXMtZm9udC1mYW1pbHkpO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy50ZXh0Rm9udFNpemV9OiB2YXIoLS1wbGFzbWEtdHlwby1ib2R5LXMtZm9udC1zaXplKTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMudGV4dEZvbnRTdHlsZX06IHZhcigtLXBsYXNtYS10eXBvLWJvZHktcy1mb250LXN0eWxlKTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMudGV4dEZvbnRXZWlnaHR9OiA1MDA7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnRleHRGb250TGV0dGVyU3BhY2luZ306IDBweDtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMudGV4dEZvbnRMaW5lSGVpZ2h0fTogMXJlbTtcblxuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5jb250ZW50TGVmdE1hcmdpbn06IDAuMjVyZW07XG5cbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYXJyb3dNYXNrV2lkdGh9OiAxcmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5hcnJvd01hc2tIZWlnaHR9OiAxcmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5hcnJvd01hc2tJbWFnZX06IHVybChcImRhdGE6aW1hZ2Uvc3ZnK3htbDtiYXNlNjQsUEhOMlp5QjNhV1IwYUQwaU1UWWlJR2hsYVdkb2REMGlNVFlpSUhodGJHNXpQU0pvZEhSd09pOHZkM2QzTG5jekxtOXlaeTh5TURBd0wzTjJaeUlnZUcxc2JuTTZjM1puUFNKb2RIUndPaTh2ZDNkM0xuY3pMbTl5Wnk4eU1EQXdMM04yWnlJK0NpQWdQSEJoZEdnZ1pEMGliVGdzTVRVdU56aHNMVEl1TWpRc0xUUXVNelJqTFRBdU9USXNMVEV1TnprZ0xURXVNemdzTFRJdU5qZ2dMVEl1TVRVc0xUTXVNVGRqTFRBdU56Y3NMVEF1TkRrZ0xURXVOeklzTFRBdU5Ea2dMVE11TmpFc0xUQXVORGxzTVRZc01HTXRNUzQ0T1N3d0lDMHlMamd6TERBZ0xUTXVOaXd3TGpRNVl5MHdMamM0TERBdU5Ea2dMVEV1TWpRc01TNHpPQ0F0TWk0eE5pd3pMakUyYkMweUxqSTBMRFF1TXpWNklpQm1hV3hzUFNJak1UY3hOekUzSWlCbWFXeHNMVzl3WVdOcGRIazlJakVpSUdacGJHd3RjblZzWlQwaVpYWmxibTlrWkNJZ2FXUTlJbkJ2YVc1MFpYSWlMejRLUEM5emRtYytcIik7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmFycm93SGVpZ2h0fTogMC41cmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5hcnJvd0VkZ2VNYXJnaW59OiAwLjYyNXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYXJyb3dCYWNrZ3JvdW5kfTogIzQ3NTA1NjtcbiAgICAgICAgICAgIGAsXG4gICAgICAgIH0sXG4gICAgICAgIHZpZXc6IHtcbiAgICAgICAgICAgIGRlZmF1bHQ6IGNzc2BcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYmFja2dyb3VuZENvbG9yfTogIzQ3NTA1NjtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYm94U2hhZG93fTogMHB4IDFweCAycHggMHB4IHJnYmEoMiwgMTMsIDc2LCAwLjE1KSwwcHggMy42cHggNy4xcHggMHB4IHJnYmEoMiwgMTMsIDc2LCAwLjEyKSwwcHggMTZweCAzMnB4IDBweCByZ2JhKDIsIDEzLCA3NiwgMC4yKTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuY29sb3J9OiB2YXIoLS1vbi1kYXJrLXRleHQtcHJpbWFyeSk7XG4gICAgICAgICAgICBgLFxuICAgICAgICB9LFxuICAgIH0sXG59O1xuIl19 */"))
-    },
-    view: {
-      "default": /*#__PURE__*/(0, _react.css)(_Tooltip.tooltipTokens.backgroundColor, ":#475056;", _Tooltip.tooltipTokens.boxShadow, ":0px 1px 2px 0px rgba(2, 13, 76, 0.15),0px 3.6px 7.1px 0px rgba(2, 13, 76, 0.12),0px 16px 32px 0px rgba(2, 13, 76, 0.2);", _Tooltip.tooltipTokens.color, ":var(--on-dark-text-primary);;label:plasma-new-hope__default;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2V4YW1wbGVzL3Nkc19lbmdpbmVlci9jb21wb25lbnRzL1Rvb2x0aXAvVG9vbHRpcC5jb25maWcudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0N3QiIsImZpbGUiOiIuLi8uLi8uLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9leGFtcGxlcy9zZHNfZW5naW5lZXIvY29tcG9uZW50cy9Ub29sdGlwL1Rvb2x0aXAuY29uZmlnLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5pbXBvcnQgeyB0b29sdGlwVG9rZW5zIH0gZnJvbSAnLi4vLi4vLi4vLi4vY29tcG9uZW50cy9Ub29sdGlwJztcblxuZXhwb3J0IGNvbnN0IGNvbmZpZyA9IHtcbiAgICBkZWZhdWx0czoge1xuICAgICAgICB2aWV3OiAnZGVmYXVsdCcsXG4gICAgICAgIHNpemU6ICdtJyxcbiAgICB9LFxuICAgIHZhcmlhdGlvbnM6IHtcbiAgICAgICAgc2l6ZToge1xuICAgICAgICAgICAgbTogY3NzYFxuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5wYWRkaW5nVG9wfTogMC4yNXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMucGFkZGluZ1JpZ2h0fTogMC41cmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5wYWRkaW5nQm90dG9tfTogMC4yNXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMucGFkZGluZ0xlZnR9OiAwLjVyZW07XG5cbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMubWluSGVpZ2h0fTogMS41cmVtO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5ib3JkZXJSYWRpdXN9OiAwLjI1cmVtO1xuXG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnRleHRGb250RmFtaWx5fTogdmFyKC0tcGxhc21hLXR5cG8tYm9keS1zLWZvbnQtZmFtaWx5KTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMudGV4dEZvbnRTaXplfTogdmFyKC0tcGxhc21hLXR5cG8tYm9keS1zLWZvbnQtc2l6ZSk7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnRleHRGb250U3R5bGV9OiB2YXIoLS1wbGFzbWEtdHlwby1ib2R5LXMtZm9udC1zdHlsZSk7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnRleHRGb250V2VpZ2h0fTogNTAwO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy50ZXh0Rm9udExldHRlclNwYWNpbmd9OiAwcHg7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLnRleHRGb250TGluZUhlaWdodH06IDFyZW07XG5cbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuY29udGVudExlZnRNYXJnaW59OiAwLjI1cmVtO1xuXG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmFycm93TWFza1dpZHRofTogMXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYXJyb3dNYXNrSGVpZ2h0fTogMXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYXJyb3dNYXNrSW1hZ2V9OiB1cmwoXCJkYXRhOmltYWdlL3N2Zyt4bWw7YmFzZTY0LFBITjJaeUIzYVdSMGFEMGlNVFlpSUdobGFXZG9kRDBpTVRZaUlIaHRiRzV6UFNKb2RIUndPaTh2ZDNkM0xuY3pMbTl5Wnk4eU1EQXdMM04yWnlJZ2VHMXNibk02YzNablBTSm9kSFJ3T2k4dmQzZDNMbmN6TG05eVp5OHlNREF3TDNOMlp5SStDaUFnUEhCaGRHZ2daRDBpYlRnc01UVXVOemhzTFRJdU1qUXNMVFF1TXpSakxUQXVPVElzTFRFdU56a2dMVEV1TXpnc0xUSXVOamdnTFRJdU1UVXNMVE11TVRkakxUQXVOemNzTFRBdU5Ea2dMVEV1TnpJc0xUQXVORGtnTFRNdU5qRXNMVEF1TkRsc01UWXNNR010TVM0NE9Td3dJQzB5TGpnekxEQWdMVE11Tml3d0xqUTVZeTB3TGpjNExEQXVORGtnTFRFdU1qUXNNUzR6T0NBdE1pNHhOaXd6TGpFMmJDMHlMakkwTERRdU16VjZJaUJtYVd4c1BTSWpNVGN4TnpFM0lpQm1hV3hzTFc5d1lXTnBkSGs5SWpFaUlHWnBiR3d0Y25Wc1pUMGlaWFpsYm05a1pDSWdhV1E5SW5CdmFXNTBaWElpTHo0S1BDOXpkbWMrXCIpO1xuICAgICAgICAgICAgICAgICR7dG9vbHRpcFRva2Vucy5hcnJvd0hlaWdodH06IDAuNXJlbTtcbiAgICAgICAgICAgICAgICAke3Rvb2x0aXBUb2tlbnMuYXJyb3dFZGdlTWFyZ2lufTogMC42MjVyZW07XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmFycm93QmFja2dyb3VuZH06ICM0NzUwNTY7XG4gICAgICAgICAgICBgLFxuICAgICAgICB9LFxuICAgICAgICB2aWV3OiB7XG4gICAgICAgICAgICBkZWZhdWx0OiBjc3NgXG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmJhY2tncm91bmRDb2xvcn06ICM0NzUwNTY7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmJveFNoYWRvd306IDBweCAxcHggMnB4IDBweCByZ2JhKDIsIDEzLCA3NiwgMC4xNSksMHB4IDMuNnB4IDcuMXB4IDBweCByZ2JhKDIsIDEzLCA3NiwgMC4xMiksMHB4IDE2cHggMzJweCAwcHggcmdiYSgyLCAxMywgNzYsIDAuMik7XG4gICAgICAgICAgICAgICAgJHt0b29sdGlwVG9rZW5zLmNvbG9yfTogdmFyKC0tb24tZGFyay10ZXh0LXByaW1hcnkpO1xuICAgICAgICAgICAgYCxcbiAgICAgICAgfSxcbiAgICB9LFxufTtcbiJdfQ== */"))
-    }
-  }
-};

package/emotion/cjs/examples/sds_engineer/components/Tooltip/Tooltip.js

@@ -1,11 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Tooltip = void 0;
-var _Tooltip = /*#__PURE__*/require("../../../../components/Tooltip");
-var _engines = /*#__PURE__*/require("../../../../engines");
-var _Tooltip2 = /*#__PURE__*/require("./Tooltip.config");
-var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Tooltip.tooltipConfig, _Tooltip2.config);
-var Tooltip = exports.Tooltip = /*#__PURE__*/(0, _engines.component)(mergedConfig);

package/emotion/cjs/examples/sds_engineer/components/Tooltip/Tooltip.stories.tsx

@@ -1,205 +0,0 @@
-import React, { useState } from 'react';
-import styled from '@emotion/styled';
-import type { StoryObj, Meta } from '@storybook/react';
-
-import { WithTheme } from '../../../_helpers';
-import { Button } from '../Button/Button';
-import { PopoverPlacement } from '../Popover/Popover';
-import { IconDisclosureRight } from '../../../../components/_Icon';
-
-import { Tooltip } from './Tooltip';
-import type { TooltipProps } from './Tooltip';
-
-const placements: Array<PopoverPlacement> = [
-    'top',
-    'top-start',
-    'top-end',
-
-    'bottom',
-    'bottom-start',
-    'bottom-end',
-
-    'left',
-    'left-start',
-    'left-end',
-
-    'right',
-    'right-start',
-    'right-end',
-
-    'auto',
-];
-
-const meta: Meta<TooltipProps> = {
-    title: 'sds_engineer/Tooltip',
-    decorators: [WithTheme],
-    component: Tooltip,
-    parameters: {
-        docs: { story: { inline: false, iframeHeight: '20rem' } },
-    },
-};
-
-export default meta;
-
-const StyledGrid = styled.div`
-    display: grid;
-    grid-template-columns: repeat(3, max-content);
-    grid-gap: 1rem 3.5rem;
-    padding: 3.5rem;
-`;
-
-const StoryDefault = ({ size }: TooltipProps) => {
-    return (
-        <StyledGrid>
-            <Tooltip
-                target={
-                    <Tooltip
-                        target={<Button>Btn</Button>}
-                        placement="left"
-                        size={size}
-                        opened
-                        hasArrow
-                        text="left"
-                        frame="theme-root"
-                    />
-                }
-                placement="top-start"
-                size={size}
-                opened
-                hasArrow
-                text="top-start"
-                frame="theme-root"
-            />
-            <Tooltip
-                target={<Button>Btn</Button>}
-                placement="top"
-                size={size}
-                opened
-                hasArrow
-                text="top"
-                frame="theme-root"
-            />
-            <Tooltip
-                target={
-                    <Tooltip
-                        target={<Button>Btn</Button>}
-                        placement="right"
-                        size={size}
-                        opened
-                        hasArrow
-                        text="right"
-                        frame="theme-root"
-                    />
-                }
-                placement="top-end"
-                size={size}
-                opened
-                hasArrow
-                text="top-end"
-                frame="theme-root"
-            />
-            <Tooltip
-                target={<Button>Btn</Button>}
-                placement="bottom-start"
-                size={size}
-                opened
-                hasArrow
-                text="bottom-start"
-                frame="theme-root"
-            />
-            <Tooltip
-                target={<Button>Btn</Button>}
-                placement="bottom"
-                size={size}
-                opened
-                hasArrow
-                text="bottom"
-                frame="theme-root"
-            />
-            <Tooltip
-                target={<Button>Btn</Button>}
-                placement="bottom-end"
-                size={size}
-                opened
-                hasArrow
-                text="bottom-end"
-                frame="theme-root"
-            />
-        </StyledGrid>
-    );
-};
-
-export const Default: StoryObj<TooltipProps> = {
-    argTypes: {
-        size: {
-            options: ['m', 's'],
-            control: {
-                type: 'select',
-            },
-        },
-    },
-    args: {
-        size: 'm',
-    },
-    render: (args) => <StoryDefault {...args} />,
-};
-
-const StyledRow = styled.div`
-    display: flex;
-    width: 150vw;
-    height: 150vh;
-    padding: 10rem;
-`;
-
-const StoryLive = (args: TooltipProps) => {
-    const [text, setText] = useState('Type here');
-
-    return (
-        <>
-            <StyledRow>
-                <Tooltip
-                    target={
-                        <input
-                            name="Имя"
-                            value={text}
-                            onChange={(e) => setText(e.target.value)}
-                            aria-describedby="example-tooltip-firstname"
-                        />
-                    }
-                    contentLeft={<IconDisclosureRight size="xs" />}
-                    {...args}
-                    id="example-tooltip-firstname"
-                    text={text}
-                    opened
-                    frame="theme-root"
-                />
-            </StyledRow>
-        </>
-    );
-};
-
-export const Live: StoryObj<TooltipProps> = {
-    argTypes: {
-        placement: {
-            options: placements,
-            control: {
-                type: 'select',
-            },
-            mapping: placements,
-        },
-        size: {
-            options: ['m', 's'],
-            control: {
-                type: 'select',
-            },
-        },
-    },
-    args: {
-        placement: 'bottom',
-        maxWidth: 10,
-        minWidth: 3,
-        hasArrow: true,
-        size: 'm',
-    },
-    render: (args) => <StoryLive {...args} />,
-};

package/emotion/cjs/examples/themes/sds_engineer.module.css

@@ -1,373 +0,0 @@
-/* Generated by robots, do not change this manually! */
-
-.dark {
-  --overlay-soft: rgba(0, 0, 0, 0.56);
-  --overlay-hard: rgba(0, 0, 0, 0.9);
-  --on-dark-overlay-soft: rgba(0, 0, 0, 0.56);
-  --on-dark-overlay-hard: rgba(0, 0, 0, 0.9);
-  --on-light-overlay-soft: rgba(0, 0, 0, 0.56);
-  --on-light-overlay-hard: rgba(0, 0, 0, 0.9);
-  --inverse-overlay-soft: rgba(0, 0, 0, 0.56);
-  --inverse-overlay-hard: rgba(0, 0, 0, 0.9);
-  --text-primary: rgba(245, 245, 245, 0.96);
-  --text-secondary: rgba(245, 245, 245, 0.56);
-  --text-tertiary: rgba(245, 245, 245, 0.4);
-  --text-paragraph: rgba(245, 245, 245, 0.8);
-  --text-accent: #FFFFFF;
-  --text-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --text-positive: #1A9E32;
-  --text-warning: #FA5F05;
-  --text-negative: #FF293E;
-  --on-dark-text-primary: rgba(245, 245, 245, 0.96);
-  --on-dark-text-secondary: rgba(245, 245, 245, 0.56);
-  --on-dark-text-tertiary: rgba(245, 245, 245, 0.4);
-  --on-dark-text-paragraph: rgba(245, 245, 245, 0.8);
-  --on-dark-text-accent: #FFFFFF;
-  --on-dark-text-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --on-dark-text-positive: #1A9E32;
-  --on-dark-text-warning: #FA5F05;
-  --on-dark-text-negative: #FF293E;
-  --on-light-text-primary: rgba(8, 8, 8, 0.96);
-  --on-light-text-secondary: rgba(8, 8, 8, 0.56);
-  --on-light-text-tertiary: rgba(8, 8, 8, 0.4);
-  --on-light-text-paragraph: rgba(8, 8, 8, 0.8);
-  --on-light-text-accent: #FFFFFF;
-  --on-light-text-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --on-light-text-positive: #108E25;
-  --on-light-text-warning: #E85702;
-  --on-light-text-negative: #F31B30;
-  --inverse-text-primary: rgba(8, 8, 8, 0.96);
-  --inverse-text-secondary: rgba(8, 8, 8, 0.56);
-  --inverse-text-tertiary: rgba(8, 8, 8, 0.4);
-  --inverse-text-paragraph: rgba(8, 8, 8, 0.8);
-  --inverse-text-accent: #FFFFFF;
-  --inverse-text-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --inverse-text-positive: #108E25;
-  --inverse-text-warning: #E85702;
-  --inverse-text-negative: #F31B30;
-  --surface-solid-default: #FFFFFF;
-  --surface-solid-primary: #171717;
-  --surface-solid-secondary: #262626;
-  --surface-solid-tertiary: #363636;
-  --surface-solid-card: #171717;
-  --surface-transparent-default: #FFFFFF;
-  --surface-transparent-primary: rgba(255, 255, 255, 0.06);
-  --surface-transparent-secondary: rgba(255, 255, 255, 0.12);
-  --surface-transparent-tertiary: rgba(255, 255, 255, 0.2);
-  --surface-transparent-card: rgba(255, 255, 255, 0.12);
-  --surface-accent: #FFFFFF;
-  /* добавлены вручную */
-  --surface-accent-hover: #1383cf80;
-  /* добавлены вручную */
-  --surface-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --surface-positive: #1A9E32;
-  --surface-warning: #FA5F05;
-  --surface-negative: #FF293E;
-  /* добавлены вручную */
-  --surface-transparent-negative: #e3122712;
-  --surface-clear: rgba(0, 0, 0, 0);
-  --on-dark-surface-solid-default: #FFFFFF;
-  --on-dark-surface-solid-primary: #171717;
-  --on-dark-surface-solid-secondary: #262626;
-  --on-dark-surface-solid-tertiary: #363636;
-  --on-dark-surface-solid-card: #171717;
-  --on-dark-surface-transparent-default: #FFFFFF;
-  --on-dark-surface-transparent-primary: rgba(255, 255, 255, 0.06);
-  --on-dark-surface-transparent-secondary: rgba(255, 255, 255, 0.12);
-  --on-dark-surface-transparent-tertiary: rgba(255, 255, 255, 0.2);
-  --on-dark-surface-transparent-card: rgba(255, 255, 255, 0.12);
-  --on-dark-surface-accent: #FFFFFF;
-  --on-dark-surface-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --on-dark-surface-positive: #1A9E32;
-  --on-dark-surface-warning: #FA5F05;
-  --on-dark-surface-negative: #FF293E;
-  --on-dark-surface-clear: rgba(0, 0, 0, 0);
-  --on-light-surface-solid-default: #080808;
-  --on-light-surface-solid-primary: #F5F5F5;
-  --on-light-surface-solid-secondary: #ECECEC;
-  --on-light-surface-solid-tertiary: #DDDDDD;
-  --on-light-surface-solid-card: #F7F7F7;
-  --on-light-surface-transparent-default: #080808;
-  --on-light-surface-transparent-primary: rgba(8, 8, 8, 0.02);
-  --on-light-surface-transparent-secondary: rgba(8, 8, 8, 0.06);
-  --on-light-surface-transparent-tertiary: rgba(8, 8, 8, 0.12);
-  --on-light-surface-transparent-card: rgba(8, 8, 8, 0.06);
-  --on-light-surface-accent: #FFFFFF;
-  --on-light-surface-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --on-light-surface-positive: #108E25;
-  --on-light-surface-warning: #E85702;
-  --on-light-surface-negative: #F31B30;
-  --on-light-surface-clear: rgba(0, 0, 0, 0);
-  --inverse-surface-solid-default: #080808;
-  --inverse-surface-solid-primary: #F5F5F5;
-  --inverse-surface-solid-secondary: #ECECEC;
-  --inverse-surface-solid-tertiary: #DDDDDD;
-  --inverse-surface-solid-card: #F7F7F7;
-  --inverse-surface-transparent-default: #080808;
-  --inverse-surface-transparent-primary: rgba(8, 8, 8, 0.02);
-  --inverse-surface-transparent-secondary: rgba(8, 8, 8, 0.06);
-  --inverse-surface-transparent-tertiary: rgba(8, 8, 8, 0.12);
-  --inverse-surface-transparent-card: rgba(8, 8, 8, 0.06);
-  --inverse-surface-accent: #FFFFFF;
-  --inverse-surface-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --inverse-surface-positive: #108E25;
-  --inverse-surface-warning: #E85702;
-  --inverse-surface-negative: #F31B30;
-  --inverse-surface-clear: rgba(0, 0, 0, 0);
-  --background-primary: #000000;
-  --background-secondary: #080808;
-  --background-tertiary: #171717;
-  --dark-background-primary: #000000;
-  --dark-background-secondary: #080808;
-  --dark-background-tertiary: #171717;
-  --light-background-primary: #FFFFFF;
-  --light-background-secondary: #FFFFFF;
-  --light-background-tertiary: #FFFFFF;
-  --inverse-background-primary: #FFFFFF;
-  --inverse-background-secondary: #FFFFFF;
-  --inverse-background-tertiary: #FFFFFF;
-  --text-primary-hover:  #17171793;
-  --text-primary-active:  #171717C4;
-  --surface-solid-default-hover:  #0D0D0DFF;
-  --surface-solid-default-active:  #030303FF;
-  --surface-accent-hover:  #0C8ADFFF;
-  --surface-accent-active:  #0A78C2FF;
-  --surface-positive-hover:  #1DAF37FF;
-  --surface-positive-active:  #18952FFF;
-  --surface-warning-hover:  #FB7223FF;
-  --surface-warning-active:  #F05B05FF;
-  --surface-negative-hover:  #EA1A2FFF;
-  --surface-negative-active:  #D21427FF;
-  --surface-transparent-secondary-hover:  #0808081F;
-  --surface-transparent-secondary-active:  #0808080A;
-  --on-light-surface-solid-default-hover:  #0D0D0DFF;
-  --on-light-surface-solid-default-active:  #030303FF;
-  --on-dark-surface-solid-default-hover:  #FFFFFFFF;
-  --on-dark-surface-solid-default-active:  #FFFFFFFF;
-  --on-light-surface-transparent-deep-hover: #080808C2;
-  --on-light-surface-transparent-deep-active: #08080894;
-  --on-light-surface-transparent-deep: rgba(8, 8, 8, 0.64);
-  --surface-skeleton-gradient: linear-gradient( 90deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.08) 6.25%, rgba(255, 255, 255, 0.05) 12.5%, rgba(255, 255, 255, 0.01) 25%, rgba(255, 255, 255, 0.05) 37.5%, rgba(255, 255, 255, 0.08) 43.75%, rgba(255, 255, 255, 0.09) 50%, rgba(255, 255, 255, 0.08) 56.25%, rgba(255, 255, 255, 0.05) 62.5%, rgba(255, 255, 255, 0.01) 75%, rgba(255, 255, 255, 0.05) 87.5%, rgba(255, 255, 255, 0.08) 93.75%, rgba(255, 255, 255, 0.09) 100% );
-  --surface-skeleton-deep-gradient: linear-gradient( 90deg, rgba(255, 255, 255, 0.36) 0%, rgba(255, 255, 255, 0.32) 6.25%, rgba(255, 255, 255, 0.20) 12.5%, rgba(255, 255, 255, 0.04) 25%, rgba(255, 255, 255, 0.20) 37.5%, rgba(255, 255, 255, 0.32) 43.75%, rgba(255, 255, 255, 0.36) 50%, rgba(255, 255, 255, 0.08) 56.25%, rgba(255, 255, 255, 0.20) 62.5%, rgba(255, 255, 255, 0.04) 75%, rgba(255, 255, 255, 0.20) 87.5%, rgba(255, 255, 255, 0.32) 93.75%, rgba(255, 255, 255, 0.36) 100% );
-  --plasma-colors-white-primary: var(--on-dark-text-primary);
-  --plasma-colors-white-secondary: var(--on-dark-text-secondary);
-  --plasma-colors-white-tertiary: var(--on-dark-text-tertiary);
-  --plasma-colors-black-primary: var(--on-light-text-primary);
-  --plasma-colors-black-secondary: var(--on-light-text-secondary);
-  --plasma-colors-black-tertiary: var(--on-light-text-tertiary);
-  --plasma-colors-button-black: var(--on-light-surface-solid-default);
-  --plasma-colors-button-black-secondary: var(--on-light-surface-transparent-secondary);
-  --plasma-colors-button-white: var(--on-dark-surface-solid-default);
-  --plasma-colors-button-white-secondary: var(--on-dark-surface-transparent-secondary);
-  --plasma-colors-text: var(--text-primary);
-  --plasma-colors-primary: var(--text-primary);
-  --plasma-colors-secondary: var(--text-secondary);
-  --plasma-colors-tertiary: var(--text-tertiary);
-  --plasma-colors-paragraph: var(--text-paragraph);
-  --plasma-colors-background: var(--background-primary);
-  --plasma-colors-accent: var(--text-accent);
-  --plasma-colors-success: var(--text-positive);
-  --plasma-colors-warning: var(--text-warning);
-  --plasma-colors-critical: var(--text-negative);
-  --plasma-colors-overlay: var(--overlay-soft);
-  --plasma-colors-surface-liquid01: var(--surface-transparent-primary);
-  --plasma-colors-surface-liquid02: var(--surface-transparent-secondary);
-  --plasma-colors-surface-liquid03: var(--surface-transparent-tertiary);
-  --plasma-colors-surface-solid01: var(--surface-solid-primary);
-  --plasma-colors-surface-solid02: var(--surface-solid-secondary);
-  --plasma-colors-surface-solid03: var(--surface-solid-tertiary);
-  --plasma-colors-surface-card: var(--surface-transparent-card);
-  --plasma-colors-button-secondary: var(--surface-transparent-secondary);
-  --plasma-colors-button-accent: var(--text-accent);
-  --plasma-colors-button-success: var(--surface-positive);
-  --plasma-colors-button-warning: var(--surface-warning);
-  --plasma-colors-button-critical: var(--surface-negative);
-  color: var(--text-primary);
-  background-color: var(--background-primary);
-}
-
-.light {
-  --overlay-soft: rgba(0, 0, 0, 0.56);
-  --overlay-hard: rgba(0, 0, 0, 0.9);
-  --on-dark-overlay-soft: rgba(0, 0, 0, 0.56);
-  --on-dark-overlay-hard: rgba(0, 0, 0, 0.9);
-  --on-light-overlay-soft: rgba(0, 0, 0, 0.56);
-  --on-light-overlay-hard: rgba(0, 0, 0, 0.9);
-  --inverse-overlay-soft: rgba(0, 0, 0, 0.56);
-  --inverse-overlay-hard: rgba(0, 0, 0, 0.9);
-  --text-primary: rgba(23, 23, 23, 0.96);
-  --text-secondary: rgba(23, 23, 23, 0.56);
-  --text-tertiary: rgba(23, 23, 23, 0.4);
-  --text-paragraph: rgba(23, 23, 23, 0.8);
-  --text-accent: #0C72B6;
-  --text-accent-gradient: linear-gradient(45.00deg, rgb(30, 44, 108) 0%,rgb(43, 101, 185) 100%);
-  --text-positive: #108E25;
-  --text-warning: #E85702;
-  --text-negative: #F31B31;
-  --on-dark-text-primary: rgba(245, 245, 245, 0.96);
-  --on-dark-text-secondary: rgba(245, 245, 245, 0.56);
-  --on-dark-text-tertiary: rgba(245, 245, 245, 0.4);
-  --on-dark-text-paragraph: rgba(245, 245, 245, 0.8);
-  --on-dark-text-accent: #FFFFFF;
-  --on-dark-text-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --on-dark-text-positive: #1A9E32;
-  --on-dark-text-warning: #FA5F05;
-  --on-dark-text-negative: #FF293E;
-  --on-light-text-primary: rgba(8, 8, 8, 0.96);
-  --on-light-text-secondary: rgba(8, 8, 8, 0.56);
-  --on-light-text-tertiary: rgba(8, 8, 8, 0.4);
-  --on-light-text-paragraph: rgba(8, 8, 8, 0.8);
-  --on-light-text-accent: #FFFFFF;
-  --on-light-text-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --on-light-text-positive: #108E25;
-  --on-light-text-warning: #E85702;
-  --on-light-text-negative: #F31B30;
-  --inverse-text-primary: rgba(245, 245, 245, 0.96);
-  --inverse-text-secondary: rgba(245, 245, 245, 0.56);
-  --inverse-text-tertiary: rgba(245, 245, 245, 0.4);
-  --inverse-text-paragraph: rgba(245, 245, 245, 0.8);
-  --inverse-text-accent: #FFFFFF;
-  --inverse-text-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --inverse-text-positive: #1A9E32;
-  --inverse-text-warning: #FA5F05;
-  --inverse-text-negative: #FF293E;
-  --surface-solid-default: #080808;
-  --surface-solid-primary: #F5F5F5;
-  --surface-solid-secondary: #ECECEC;
-  --surface-solid-tertiary: #DDDDDD;
-  --surface-solid-card: #FFFFFF;
-  --surface-transparent-default: #080808;
-  --surface-transparent-primary: rgba(8, 8, 8, 0.02);
-  --surface-transparent-secondary: rgba(8, 8, 8, 0.06);
-  --surface-transparent-tertiary: rgba(8, 8, 8, 0.12);
-  --surface-transparent-card: #FFFFFF;
-  --surface-accent: #0B7ECB;
-  /* добавлены вручную */
-  --surface-accent-hover: #1383cf80;
-  /* добавлены вручную */
-  --surface-accent-gradient: linear-gradient(45.00deg, rgb(30, 44, 108) 0%,rgb(43, 101, 185) 100%);
-  --surface-positive: #1A9E32;
-  --surface-warning: #FA5F05;
-  --surface-negative: #DD1428;
-  /* добавлены вручную */
-  --surface-transparent-negative: #e3122712;
-  --surface-clear: rgba(0, 0, 0, 0);
-  --on-dark-surface-solid-default: #FFFFFF;
-  --on-dark-surface-solid-primary: #171717;
-  --on-dark-surface-solid-secondary: #262626;
-  --on-dark-surface-solid-tertiary: #363636;
-  --on-dark-surface-solid-card: #171717;
-  --on-dark-surface-transparent-default: #FFFFFF;
-  --on-dark-surface-transparent-primary: rgba(255, 255, 255, 0.06);
-  --on-dark-surface-transparent-secondary: rgba(255, 255, 255, 0.12);
-  --on-dark-surface-transparent-tertiary: rgba(255, 255, 255, 0.2);
-  --on-dark-surface-transparent-card: rgba(255, 255, 255, 0.12);
-  --on-dark-surface-accent: #FFFFFF;
-  --on-dark-surface-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --on-dark-surface-positive: #1A9E32;
-  --on-dark-surface-warning: #FA5F05;
-  --on-dark-surface-negative: #FF293E;
-  --on-dark-surface-clear: rgba(0, 0, 0, 0);
-  --on-light-surface-solid-default: #080808;
-  --on-light-surface-solid-primary: #F5F5F5;
-  --on-light-surface-solid-secondary: #ECECEC;
-  --on-light-surface-solid-tertiary: #DDDDDD;
-  --on-light-surface-solid-card: #F7F7F7;
-  --on-light-surface-transparent-default: #080808;
-  --on-light-surface-transparent-primary: rgba(8, 8, 8, 0.02);
-  --on-light-surface-transparent-secondary: rgba(8, 8, 8, 0.06);
-  --on-light-surface-transparent-tertiary: rgba(8, 8, 8, 0.12);
-  --on-light-surface-transparent-card: rgba(8, 8, 8, 0.06);
-  --on-light-surface-accent: #FFFFFF;
-  --on-light-surface-accent-gradient: linear-gradient(135deg, white 0%, #FFFFFF 100%);
-  --on-light-surface-positive: #108E25;
-  --on-light-surface-warning: #E85702;
-  --on-light-surface-negative: #F31B30;
-  --on-light-surface-clear: rgba(0, 0, 0, 0);
-  --inverse-surface-solid-default: #FFFFFF;
-  --inverse-surface-solid-primary: #171717;
-  --inverse-surface-solid-secondary: #262626;
-  --inverse-surface-solid-tertiary: #363636;
-  --inverse-surface-solid-card: #171717;
-  --inverse-surface-transparent-default: #FFFFFF;
-  --inverse-surface-transparent-primary: rgba(255, 255, 255, 0.06);
-  --inverse-surface-transparent-secondary: rgba(255, 255, 255, 0.12);
-  --inverse-surface-transparent-tertiary: rgba(255, 255, 255, 0.2);
-  --inverse-surface-transparent-card: rgba(255, 255, 255, 0.12);
-  --inverse-surface-accent: #FFFFFF;
-  --inverse-surface-accent-gradient: linear-gradient(135deg, black 0%, #FFFFFF 100%);
-  --inverse-surface-positive: #1A9E32;
-  --inverse-surface-warning: #FA5F05;
-  --inverse-surface-negative: #FF293E;
-  --inverse-surface-clear: rgba(0, 0, 0, 0);
-  --background-primary: #F9F9F9;
-  --background-secondary: #FFFFFF;
-  --background-tertiary: #FFFFFF;
-  --dark-background-primary: #000000;
-  --dark-background-secondary: #080808;
-  --dark-background-tertiary: #171717;
-  --light-background-primary: #FFFFFF;
-  --light-background-secondary: #FFFFFF;
-  --light-background-tertiary: #FFFFFF;
-  --inverse-background-primary: #000000;
-  --inverse-background-secondary: #080808;
-  --inverse-background-tertiary: #171717;
-  --text-primary-hover:  #17171793;
-  --text-primary-active:  #171717C4;
-  --surface-solid-default-hover:  #262626FF;
-  --surface-solid-default-active:  #030303FF;
-  --surface-accent-hover:  #0C8ADFFF;
-  --surface-accent-active:  #0A72B8FF;
-  --surface-positive-hover:  #1EB83AFF;
-  --surface-positive-active:  #178C2CFF;
-  --surface-warning-hover:  #FB782DFF;
-  --surface-warning-active:  #E65705FF;
-  --surface-negative-hover:  #EA1A2FFF;
-  --surface-negative-active:  #C91325FF;
-  --surface-transparent-secondary-hover:  #08080805;
-  --surface-transparent-secondary-active:  #0808081A;
-  --on-light-surface-solid-default-hover:  #262626FF;
-  --on-light-surface-solid-default-active:  #030303FF;
-  --on-dark-surface-solid-default-hover:  #FFFFFFFF;
-  --on-dark-surface-solid-default-active:  #FFFFFFFF;
-  --on-light-surface-transparent-deep-hover: #0808088F;
-  --on-light-surface-transparent-deep-active: #080808AD;
-  --on-light-surface-transparent-deep: rgba(8, 8, 8, 0.64);
-  --skeleton-gradient: linear-gradient( 90deg, rgba(8, 8, 8, 0.09) 0%, rgba(8, 8, 8, 0.08) 6.25%, rgba(8, 8, 8, 0.05) 12.5%, rgba(8, 8, 8, 0.01) 25%, rgba(8, 8, 8, 0.05) 37.5%, rgba(8, 8, 8, 0.08) 43.75%, rgba(8, 8, 8, 0.09) 50%, rgba(8, 8, 8, 0.08) 56.25%, rgba(8, 8, 8, 0.05) 62.5%, rgba(8, 8, 8, 0.01) 75%, rgba(8, 8, 8, 0.05) 87.5%, rgba(8, 8, 8, 0.08) 93.75%, rgba(8, 8, 8, 0.09) 100% );
-  --skeleton-gradient-lighter: linear-gradient( 90deg, rgba(8, 8, 8, 0.36) 0%, rgba(8, 8, 8, 0.32) 6.25%, rgba(8, 8, 8, 0.20) 12.5%, rgba(8, 8, 8, 0.04) 25%, rgba(8, 8, 8, 0.20) 37.5%, rgba(8, 8, 8, 0.32) 43.75%, rgba(8, 8, 8, 0.36) 50%, rgba(8, 8, 8, 0.08) 56.25%, rgba(8, 8, 8, 0.20) 62.5%, rgba(8, 8, 8, 0.04) 75%, rgba(8, 8, 8, 0.20) 87.5%, rgba(8, 8, 8, 0.32) 93.75%, rgba(8, 8, 8, 0.36) 100% );
-  --plasma-colors-white-primary: var(--on-dark-text-primary);
-  --plasma-colors-white-secondary: var(--on-dark-text-secondary);
-  --plasma-colors-white-tertiary: var(--on-dark-text-tertiary);
-  --plasma-colors-black-primary: var(--on-light-text-primary);
-  --plasma-colors-black-secondary: var(--on-light-text-secondary);
-  --plasma-colors-black-tertiary: var(--on-light-text-tertiary);
-  --plasma-colors-button-black: var(--on-light-surface-solid-default);
-  --plasma-colors-button-black-secondary: var(--on-light-surface-transparent-secondary);
-  --plasma-colors-button-white: var(--on-dark-surface-solid-default);
-  --plasma-colors-button-white-secondary: var(--on-dark-surface-transparent-secondary);
-  --plasma-colors-text: var(--text-primary);
-  --plasma-colors-primary: var(--text-primary);
-  --plasma-colors-secondary: var(--text-secondary);
-  --plasma-colors-tertiary: var(--text-tertiary);
-  --plasma-colors-paragraph: var(--text-paragraph);
-  --plasma-colors-background: var(--background-primary);
-  --plasma-colors-accent: var(--text-accent);
-  --plasma-colors-success: var(--text-positive);
-  --plasma-colors-warning: var(--text-warning);
-  --plasma-colors-critical: var(--text-negative);
-  --plasma-colors-overlay: var(--overlay-soft);
-  --plasma-colors-surface-liquid01: var(--surface-transparent-primary);
-  --plasma-colors-surface-liquid02: var(--surface-transparent-secondary);
-  --plasma-colors-surface-liquid03: var(--surface-transparent-tertiary);
-  --plasma-colors-surface-solid01: var(--surface-solid-primary);
-  --plasma-colors-surface-solid02: var(--surface-solid-secondary);
-  --plasma-colors-surface-solid03: var(--surface-solid-tertiary);
-  --plasma-colors-surface-card: var(--surface-transparent-card);
-  --plasma-colors-button-secondary: var(--surface-transparent-secondary);
-  --plasma-colors-button-accent: var(--text-accent);
-  --plasma-colors-button-success: var(--surface-positive);
-  --plasma-colors-button-warning: var(--surface-warning);
-  --plasma-colors-button-critical: var(--surface-negative);
-  color: var(--text-primary);
-  background-color: var(--background-primary);
-}