@salutejs/plasma-new-hope 0.339.0-canary.2287.18675801044.0 → 0.339.0-canary.2289.18688678772.0

package/styled-components/cjs/components/TimePicker/TimePicker.styles.js

@@ -18,9 +18,6 @@ _export(exports, {
     get StyledTimePicker () {
         return StyledTimePicker;
     },
-    get StyledTimePickerGrid () {
-        return StyledTimePickerGrid;
-    },
     get base () {
         return base;
     }
@@ -29,7 +26,6 @@ var _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-
 var _engines = require("../../engines");
 var _TextField = require("../TextField");
 var _Popover = require("../Popover");
-var _TimePickerGrid = require("../TimePickerGrid");
 var _TimePickertokens = require("./TimePicker.tokens");
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
@@ -76,65 +72,15 @@ var mergedTextFieldConfig = (0, _engines.mergeConfig)(_TextField.textFieldConfig
 var TextField = (0, _engines.component)(mergedTextFieldConfig);
 var mergedPopoverConfig = (0, _engines.mergeConfig)(_Popover.popoverConfig);
 var Popover = (0, _engines.component)(mergedPopoverConfig);
-var mergedTimePickerGrid = (0, _engines.mergeConfig)(_TimePickerGrid.timePickerGridConfig);
-var TimePickerGrid = (0, _engines.component)(mergedTimePickerGrid);
 var StyledPopover = (0, _styledcomponents.default)(Popover).withConfig({
     displayName: "TimePicker.styles__StyledPopover",
-    componentId: "sc-fa04016d-0"
+    componentId: "sc-8a747fd1-0"
 })([
     ""
 ]);
-var StyledTimePickerGrid = (0, _styledcomponents.default)(TimePickerGrid).withConfig({
-    displayName: "TimePicker.styles__StyledTimePickerGrid",
-    componentId: "sc-fa04016d-1"
-})([
-    "",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");",
-    ":var(",
-    ");"
-], _TimePickerGrid.timePickerGridTokens.timePickerGridBackground, _TimePickertokens.tokens.timePickerBackground, _TimePickerGrid.timePickerGridTokens.timePickerGridBorderRadius, _TimePickertokens.tokens.timePickerBorderRadius, _TimePickerGrid.timePickerGridTokens.timePickerGridWidth, _TimePickertokens.tokens.timePickerWidth, _TimePickerGrid.timePickerGridTokens.timePickerGridPadding, _TimePickertokens.tokens.timePickerPadding, _TimePickerGrid.timePickerGridTokens.disabledOpacity, _TimePickertokens.tokens.disabledOpacity, _TimePickerGrid.timePickerGridTokens.columnHeight, _TimePickertokens.tokens.columnHeight, _TimePickerGrid.timePickerGridTokens.itemHeight, _TimePickertokens.tokens.itemHeight, _TimePickerGrid.timePickerGridTokens.itemBorderRadius, _TimePickertokens.tokens.itemBorderRadius, _TimePickerGrid.timePickerGridTokens.itemPadding, _TimePickertokens.tokens.itemPadding, _TimePickerGrid.timePickerGridTokens.itemBackgroundHover, _TimePickertokens.tokens.itemBackgroundHover, _TimePickerGrid.timePickerGridTokens.itemBackgroundActive, _TimePickertokens.tokens.itemBackgroundActive, _TimePickerGrid.timePickerGridTokens.itemFontFamily, _TimePickertokens.tokens.itemFontFamily, _TimePickerGrid.timePickerGridTokens.itemFontSize, _TimePickertokens.tokens.itemFontSize, _TimePickerGrid.timePickerGridTokens.itemFontStyle, _TimePickertokens.tokens.itemFontStyle, _TimePickerGrid.timePickerGridTokens.itemFontWeight, _TimePickertokens.tokens.itemFontWeight, _TimePickerGrid.timePickerGridTokens.itemLetterSpacing, _TimePickertokens.tokens.itemLetterSpacing, _TimePickerGrid.timePickerGridTokens.itemLineHeight, _TimePickertokens.tokens.itemLineHeight, _TimePickerGrid.timePickerGridTokens.scrollbarWidth, _TimePickertokens.tokens.scrollbarWidth, _TimePickerGrid.timePickerGridTokens.scrollbarColor, _TimePickertokens.tokens.scrollbarColor, _TimePickerGrid.timePickerGridTokens.scrollbarTrackColor, _TimePickertokens.tokens.scrollbarTrackColor, _TimePickerGrid.timePickerGridTokens.scrollbarMargin, _TimePickertokens.tokens.scrollbarMargin);
 var StyledInput = (0, _styledcomponents.default)(TextField).withConfig({
     displayName: "TimePicker.styles__StyledInput",
-    componentId: "sc-fa04016d-2"
+    componentId: "sc-8a747fd1-1"
 })([
     "width:100%;",
     ":var(",
@@ -298,7 +244,7 @@ var base = (0, _styledcomponents.css)([
 ], _TimePickertokens.tokens.width, _TimePickertokens.tokens.dropdownMarginTop, _Popover.popoverClasses.wrapper, _Popover.popoverClasses.target, _TimePickertokens.classes.timePickerstretched, _Popover.popoverClasses.root, _TimePickertokens.classes.timePickerFullWidth, _TimePickertokens.classes.timePickerPlacementRight);
 var StyledTimePicker = _styledcomponents.default.div.withConfig({
     displayName: "TimePicker.styles__StyledTimePicker",
-    componentId: "sc-fa04016d-3"
+    componentId: "sc-8a747fd1-2"
 })([
     "background:var(",
     ");border-radius:var(",

package/styled-components/cjs/components/TimePicker/ui/TimeColumn/TimeColumn.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderTimeColumn", {
+    enumerable: true,
+    get: function() {
+        return renderTimeColumn;
+    }
+});
+var _react = /*#__PURE__*/ _interop_require_default(require("react"));
+var _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+var _TimePickertokens = require("../../TimePicker.tokens");
+var _TimeColumnstyles = require("./TimeColumn.styles");
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+var renderTimeColumn = function(param) {
+    var values = param.values, dropdownHeight = param.dropdownHeight, column = param.column, columnRef = param.columnRef, scrollbarState = param.scrollbarState, setScrollbar = param.setScrollbar, scrollbarRef = param.scrollbarRef, thumbRef = param.thumbRef, timeoutRef = param.timeoutRef, timeItemRefs = param.timeItemRefs, activeTime = param.activeTime, handleTimeItemClick = param.handleTimeItemClick, handleTimeItemKeyDown = param.handleTimeItemKeyDown, createScrollbarDragHandler = param.createScrollbarDragHandler;
+    return /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.StyledRoot, null, /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.StyledTimeColumn, {
+        key: column,
+        ref: columnRef,
+        height: dropdownHeight,
+        className: _TimePickertokens.classes.timeColumn
+    }, values.map(function(value, index) {
+        return /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.StyledTimeItem, {
+            key: value,
+            ref: function(el) {
+                timeItemRefs.current["".concat(column, "-").concat(value)] = el;
+            },
+            className: (0, _classnames.default)(_define_property({}, _TimePickertokens.classes.timeItemActive, activeTime[column] === index)),
+            onClick: function() {
+                return handleTimeItemClick(value, column);
+            },
+            onKeyDown: function(e) {
+                return handleTimeItemKeyDown(e, column, value);
+            }
+        }, value);
+    }), /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.StyledEmpty, null)), /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.CustomScrollbar, {
+        ref: scrollbarRef,
+        className: (0, _classnames.default)(_define_property({}, _TimePickertokens.classes.scrollbarVisible, scrollbarState.isVisible))
+    }, /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.ScrollbarTrack, null, /*#__PURE__*/ _react.default.createElement(_TimeColumnstyles.ScrollbarThumb, {
+        ref: thumbRef,
+        style: {
+            height: "".concat(scrollbarState.thumbHeight, "px"),
+            top: "".concat(scrollbarState.thumbPosition, "px")
+        },
+        onMouseDown: createScrollbarDragHandler(columnRef, setScrollbar, timeoutRef)
+    }))));
+};

package/styled-components/cjs/components/{TimePickerGrid → TimePicker}/ui/TimeColumn/TimeColumn.styles.js

@@ -32,7 +32,7 @@ _export(exports, {
     }
 });
 var _styledcomponents = /*#__PURE__*/ _interop_require_default(require("styled-components"));
-var _TimePickerGridtokens = require("../../TimePickerGrid.tokens");
+var _TimePickertokens = require("../../TimePicker.tokens");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -40,13 +40,13 @@ function _interop_require_default(obj) {
 }
 var StyledRoot = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__StyledRoot",
-    componentId: "sc-2a18995b-0"
+    componentId: "sc-a5ee4233-0"
 })([
     "position:relative;width:100%;"
 ]);
 var StyledTimeItem = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__StyledTimeItem",
-    componentId: "sc-2a18995b-1"
+    componentId: "sc-a5ee4233-1"
 })([
     "height:var(",
     ");padding:var(",
@@ -60,13 +60,11 @@ var StyledTimeItem = _styledcomponents.default.div.withConfig({
     ");&:hover{background:var(",
     ");}&.",
     "{background:var(",
-    ");}&.",
-    "{cursor:not-allowed;opacity:var(",
     ");}"
-], _TimePickerGridtokens.tokens.itemHeight, _TimePickerGridtokens.tokens.itemPadding, _TimePickerGridtokens.tokens.itemBorderRadius, _TimePickerGridtokens.tokens.itemFontFamily, _TimePickerGridtokens.tokens.itemFontSize, _TimePickerGridtokens.tokens.itemFontStyle, _TimePickerGridtokens.tokens.itemFontWeight, _TimePickerGridtokens.tokens.itemLetterSpacing, _TimePickerGridtokens.tokens.itemLineHeight, _TimePickerGridtokens.tokens.itemBackgroundHover, _TimePickerGridtokens.classes.timeItemActive, _TimePickerGridtokens.tokens.itemBackgroundActive, _TimePickerGridtokens.classes.itemDisabled, _TimePickerGridtokens.tokens.disabledOpacity);
+], _TimePickertokens.tokens.itemHeight, _TimePickertokens.tokens.itemPadding, _TimePickertokens.tokens.itemBorderRadius, _TimePickertokens.tokens.itemFontFamily, _TimePickertokens.tokens.itemFontSize, _TimePickertokens.tokens.itemFontStyle, _TimePickertokens.tokens.itemFontWeight, _TimePickertokens.tokens.itemLetterSpacing, _TimePickertokens.tokens.itemLineHeight, _TimePickertokens.tokens.itemBackgroundHover, _TimePickertokens.classes.timeItemActive, _TimePickertokens.tokens.itemBackgroundActive);
 var StyledTimeColumn = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__StyledTimeColumn",
-    componentId: "sc-2a18995b-2"
+    componentId: "sc-a5ee4233-2"
 })([
     "max-height:",
     ";overflow-y:scroll;flex:1;z-index:3;box-sizing:border-box;display:flex;flex-direction:column;gap:var(",
@@ -76,39 +74,39 @@ var StyledTimeColumn = _styledcomponents.default.div.withConfig({
     ");}scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none;width:0;}"
 ], function(param) {
     var height = param.height;
-    return height || "var(".concat(_TimePickerGridtokens.tokens.columnHeight, ")");
-}, _TimePickerGridtokens.tokens.scrollbarWidth, _TimePickerGridtokens.classes.timeColumnActive, _TimePickerGridtokens.tokens.itemBackgroundHover, _TimePickerGridtokens.tokens.itemBorderRadius);
+    return height || "var(".concat(_TimePickertokens.tokens.columnHeight, ")");
+}, _TimePickertokens.tokens.scrollbarWidth, _TimePickertokens.classes.timeColumnActive, _TimePickertokens.tokens.itemBackgroundHover, _TimePickertokens.tokens.itemBorderRadius);
 var CustomScrollbar = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__CustomScrollbar",
-    componentId: "sc-2a18995b-3"
+    componentId: "sc-a5ee4233-3"
 })([
     "position:absolute;top:var(",
     ");right:0;bottom:var(",
     ");width:var(",
     ");opacity:0;transition:opacity 0.3s ease;pointer-events:none;z-index:10;overflow:hidden;&.",
     "{opacity:1;pointer-events:auto;}"
-], _TimePickerGridtokens.tokens.scrollbarMargin, _TimePickerGridtokens.tokens.scrollbarMargin, _TimePickerGridtokens.tokens.scrollbarWidth, _TimePickerGridtokens.classes.scrollbarVisible);
+], _TimePickertokens.tokens.scrollbarMargin, _TimePickertokens.tokens.scrollbarMargin, _TimePickertokens.tokens.scrollbarWidth, _TimePickertokens.classes.scrollbarVisible);
 var ScrollbarTrack = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__ScrollbarTrack",
-    componentId: "sc-2a18995b-4"
+    componentId: "sc-a5ee4233-4"
 })([
     "position:relative;width:100%;height:100%;background:var(",
     ");border-radius:var(",
     ");"
-], _TimePickerGridtokens.tokens.scrollbarTrackColor, _TimePickerGridtokens.tokens.scrollbarWidth);
+], _TimePickertokens.tokens.scrollbarTrackColor, _TimePickertokens.tokens.scrollbarWidth);
 var ScrollbarThumb = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__ScrollbarThumb",
-    componentId: "sc-2a18995b-5"
+    componentId: "sc-a5ee4233-5"
 })([
     "position:absolute;top:0;left:0;width:100%;background:var(",
     ");border-radius:var(",
     ");cursor:pointer;transition:background-color 0.2s ease;&:hover{background:var(",
     ");}&:active{background:var(",
     ");}"
-], _TimePickerGridtokens.tokens.scrollbarColor, _TimePickerGridtokens.tokens.scrollbarWidth, _TimePickerGridtokens.tokens.scrollbarColor, _TimePickerGridtokens.tokens.scrollbarTrackColor);
+], _TimePickertokens.tokens.scrollbarColor, _TimePickertokens.tokens.scrollbarWidth, _TimePickertokens.tokens.scrollbarColor, _TimePickertokens.tokens.scrollbarTrackColor);
 var StyledEmpty = _styledcomponents.default.div.withConfig({
     displayName: "TimeColumn.styles__StyledEmpty",
-    componentId: "sc-2a18995b-6"
+    componentId: "sc-a5ee4233-6"
 })([
     "width:100%;height:0%.125rem;"
 ]);

package/styled-components/cjs/components/TimePicker/utils/index.js

@@ -9,6 +9,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    get animateScrollTo () {
+        return animateScrollTo;
+    },
     get delimiter () {
         return delimiter;
     },
@@ -92,7 +95,8 @@ var normalizeTimeSegment = function(type, input) {
         carryover: digits.slice(1)
     };
 };
-var processTimeInput = function(input, format, cursorPosition) {
+var processTimeInput = function(input) {
+    var format = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 'HH:mm:ss', cursorPosition = arguments.length > 2 ? arguments[2] : void 0;
     var digits = input.replace(/\D/g, '');
     var tokens = format.split(delimiter);
     var values = {
@@ -126,3 +130,23 @@ var processTimeInput = function(input, format, cursorPosition) {
         newCursorPosition: newCursorPosition
     };
 };
+var animateScrollTo = function(element, targetScrollTop) {
+    var duration = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 300;
+    var startScrollTop = element.scrollTop;
+    var distance = targetScrollTop - startScrollTop;
+    var startTime = null;
+    var animate = function(currentTime) {
+        if (!startTime) startTime = currentTime;
+        var timeElapsed = currentTime - startTime;
+        var progress = Math.min(timeElapsed / duration, 1);
+        var easeOut = function(t) {
+            return 1 - Math.pow(1 - t, 3);
+        };
+        var scrollPosition = startScrollTop + distance * easeOut(progress);
+        element.scrollTop = scrollPosition;
+        if (timeElapsed < duration) {
+            requestAnimationFrame(animate);
+        }
+    };
+    requestAnimationFrame(animate);
+};

package/styled-components/cjs/examples/components/Calendar/CalendarBase.config.js

@@ -13,7 +13,8 @@ var _Calendartokens = require("../../../components/Calendar/Calendar.tokens");
 var config = {
     defaults: {
         view: 'default',
-        size: 'm'
+        size: 'm',
+        tooltipSize: 'm'
     },
     variations: {
         view: {
@@ -46,8 +47,11 @@ var config = {
                 ":var(--surface-clear);",
                 ":var(--text-primary-hover);",
                 ":var(--surface-clear);",
-                ":var(--surface-accent);"
-            ], _Calendartokens.tokens.calendarSelectedItemBackground, _Calendartokens.tokens.calendarSelectedItemColor, _Calendartokens.tokens.calendarSelectableItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemBorderColor, _Calendartokens.tokens.calendarCurrentItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemColorHover, _Calendartokens.tokens.calendarCurrentItemChildBackgroundHover, _Calendartokens.tokens.calendarActiveItemBackground, _Calendartokens.tokens.calendarActiveItemColor, _Calendartokens.tokens.calendarHoveredItemBackground, _Calendartokens.tokens.calendarHoveredItemColor, _Calendartokens.tokens.calendarRangeBackground, _Calendartokens.tokens.calendarOutlineFocusColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentPrimaryDisabledColor, _Calendartokens.tokens.calendarContentSecondaryColor, _Calendartokens.tokens.calendarContentSecondaryDisabledColor, _Calendartokens.tokens.calendarHeaderArrowColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarDayOfWeekColor, _Calendartokens.tokens.calendarDisabledOpacity, _Calendartokens.tokens.iconButtonColor, _Calendartokens.tokens.iconButtonBackgroundColor, _Calendartokens.tokens.iconButtonColorHover, _Calendartokens.tokens.iconButtonBackgroundColorHover, _Calendartokens.tokens.iconButtonColorActive, _Calendartokens.tokens.iconButtonBackgroundColorActive, _Calendartokens.tokens.iconButtonFocusColor)
+                ":var(--surface-accent);",
+                ":var(--surface-solid-card-brightness);",
+                ":var(--shadow-down-hard-s);",
+                ":var(--text-primary);"
+            ], _Calendartokens.tokens.calendarSelectedItemBackground, _Calendartokens.tokens.calendarSelectedItemColor, _Calendartokens.tokens.calendarSelectableItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemBorderColor, _Calendartokens.tokens.calendarCurrentItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemColorHover, _Calendartokens.tokens.calendarCurrentItemChildBackgroundHover, _Calendartokens.tokens.calendarActiveItemBackground, _Calendartokens.tokens.calendarActiveItemColor, _Calendartokens.tokens.calendarHoveredItemBackground, _Calendartokens.tokens.calendarHoveredItemColor, _Calendartokens.tokens.calendarRangeBackground, _Calendartokens.tokens.calendarOutlineFocusColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentPrimaryDisabledColor, _Calendartokens.tokens.calendarContentSecondaryColor, _Calendartokens.tokens.calendarContentSecondaryDisabledColor, _Calendartokens.tokens.calendarHeaderArrowColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarDayOfWeekColor, _Calendartokens.tokens.calendarDisabledOpacity, _Calendartokens.tokens.iconButtonColor, _Calendartokens.tokens.iconButtonBackgroundColor, _Calendartokens.tokens.iconButtonColorHover, _Calendartokens.tokens.iconButtonBackgroundColorHover, _Calendartokens.tokens.iconButtonColorActive, _Calendartokens.tokens.iconButtonBackgroundColorActive, _Calendartokens.tokens.iconButtonFocusColor, _Calendartokens.tokens.tooltipBackgroundColor, _Calendartokens.tokens.tooltipBoxShadow, _Calendartokens.tokens.tooltipColor)
         },
         size: {
             l: (0, _styledcomponents.css)([
@@ -278,6 +282,52 @@ var config = {
                 ":0.75rem;",
                 ":0.5rem;"
             ], _Calendartokens.tokens.calendarContainerWidth, _Calendartokens.tokens.calendarContainerHeight, _Calendartokens.tokens.calendarYearsPadding, _Calendartokens.tokens.calendarYearItemBorderRadius, _Calendartokens.tokens.calendarYearFontFamily, _Calendartokens.tokens.calendarYearFontSize, _Calendartokens.tokens.calendarYearFontStyle, _Calendartokens.tokens.calendarYearFontLetterSpacing, _Calendartokens.tokens.calendarYearFontLineHeight, _Calendartokens.tokens.calendarYearFontWeight, _Calendartokens.tokens.calendarYearSelectedFontWeight, _Calendartokens.tokens.calendarQuartersPadding, _Calendartokens.tokens.calendarQuarterItemBorderRadius, _Calendartokens.tokens.calendarQuarterFontFamily, _Calendartokens.tokens.calendarQuarterFontSize, _Calendartokens.tokens.calendarQuarterFontStyle, _Calendartokens.tokens.calendarQuarterFontLetterSpacing, _Calendartokens.tokens.calendarQuarterFontLineHeight, _Calendartokens.tokens.calendarQuarterFontWeight, _Calendartokens.tokens.calendarQuarterSelectedFontWeight, _Calendartokens.tokens.calendarMonthsPadding, _Calendartokens.tokens.calendarMonthItemBorderRadius, _Calendartokens.tokens.calendarMonthFontFamily, _Calendartokens.tokens.calendarMonthFontSize, _Calendartokens.tokens.calendarMonthFontStyle, _Calendartokens.tokens.calendarMonthFontLetterSpacing, _Calendartokens.tokens.calendarMonthFontLineHeight, _Calendartokens.tokens.calendarMonthFontWeight, _Calendartokens.tokens.calendarMonthSelectedFontWeight, _Calendartokens.tokens.calendarDaysPadding, _Calendartokens.tokens.calendarDayItemBorderRadius, _Calendartokens.tokens.calendarDayFontFamily, _Calendartokens.tokens.calendarDayFontSize, _Calendartokens.tokens.calendarDayFontStyle, _Calendartokens.tokens.calendarDayFontLetterSpacing, _Calendartokens.tokens.calendarDayFontLineHeight, _Calendartokens.tokens.calendarDayFontWeight, _Calendartokens.tokens.calendarDaySelectedFontWeight, _Calendartokens.tokens.calendarCurrentItemBorderWidth, _Calendartokens.tokens.calendarHeaderArrowGap, _Calendartokens.tokens.calendarArrowHeaderCustomSize, _Calendartokens.tokens.calendarHeaderPadding, _Calendartokens.tokens.calendarHeaderDateGap, _Calendartokens.tokens.calendarHeaderFontFamily, _Calendartokens.tokens.calendarHeaderFontSize, _Calendartokens.tokens.calendarHeaderFontStyle, _Calendartokens.tokens.calendarHeaderFontLetterSpacing, _Calendartokens.tokens.calendarHeaderFontLineHeight, _Calendartokens.tokens.calendarHeaderFontWeight, _Calendartokens.tokens.calendarHeaderFontWeightBold, _Calendartokens.tokens.iconButtonHeight, _Calendartokens.tokens.iconButtonWidth, _Calendartokens.tokens.iconButtonPadding, _Calendartokens.tokens.iconButtonRadius)
+        },
+        eventTooltipSize: {
+            m: (0, _styledcomponents.css)([
+                "",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":2.5rem;",
+                ":0.625rem;",
+                ":var(--plasma-typo-body-s-font-family);",
+                ":var(--plasma-typo-body-s-font-size);",
+                ":var(--plasma-typo-body-s-font-style);",
+                ":var(--plasma-typo-body-s-font-weight);",
+                ":var(--plasma-typo-body-s-letter-spacing);",
+                ":var(--plasma-typo-body-s-line-height);",
+                ":0.375rem;",
+                ":1.25rem;",
+                ":1.25rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMC4xNywxMS44M2wyMCwwYy01LjUyLDAgLTEwLDMuNTkgLTEwLDhjMCwtNC40MSAtNC40OCwtOCAtMTAsLTh6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGlkPSJUYWlsIi8+Cjwvc3ZnPg==");',
+                ":0.5rem;",
+                ":0.625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _Calendartokens.tokens.tooltipPaddingTop, _Calendartokens.tokens.tooltipPaddingRight, _Calendartokens.tokens.tooltipPaddingBottom, _Calendartokens.tokens.tooltipPaddingLeft, _Calendartokens.tokens.tooltipMinHeight, _Calendartokens.tokens.tooltipBorderRadius, _Calendartokens.tokens.tooltipTextFontFamily, _Calendartokens.tokens.tooltipTextFontSize, _Calendartokens.tokens.tooltipTextFontStyle, _Calendartokens.tokens.tooltipTextFontWeight, _Calendartokens.tokens.tooltipTextFontLetterSpacing, _Calendartokens.tokens.tooltipTextFontLineHeight, _Calendartokens.tokens.tooltipContentLeftMargin, _Calendartokens.tokens.tooltipArrowMaskWidth, _Calendartokens.tokens.tooltipArrowMaskHeight, _Calendartokens.tokens.tooltipArrowMaskImage, _Calendartokens.tokens.tooltipArrowHeight, _Calendartokens.tokens.tooltipArrowEdgeMargin, _Calendartokens.tokens.tooltipArrowBackground),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":2rem;",
+                ":0.5rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":1rem;",
+                ":1rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMCw5Ljg1bDE2LDBjLTQuNDEsMCAtOCwyLjY5IC04LDZjMCwtMy4zMSAtMy41OSwtNiAtOCwtNnoiIGZpbGw9IiMxNzE3MTciIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9IlRhaWwiLz4KPC9zdmc+");',
+                ":0.375rem;",
+                ":0.5625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _Calendartokens.tokens.tooltipPaddingTop, _Calendartokens.tokens.tooltipPaddingRight, _Calendartokens.tokens.tooltipPaddingBottom, _Calendartokens.tokens.tooltipPaddingLeft, _Calendartokens.tokens.tooltipMinHeight, _Calendartokens.tokens.tooltipBorderRadius, _Calendartokens.tokens.tooltipTextFontFamily, _Calendartokens.tokens.tooltipTextFontSize, _Calendartokens.tokens.tooltipTextFontStyle, _Calendartokens.tokens.tooltipTextFontWeight, _Calendartokens.tokens.tooltipTextFontLetterSpacing, _Calendartokens.tokens.tooltipTextFontLineHeight, _Calendartokens.tokens.tooltipContentLeftMargin, _Calendartokens.tokens.tooltipArrowMaskWidth, _Calendartokens.tokens.tooltipArrowMaskHeight, _Calendartokens.tokens.tooltipArrowMaskImage, _Calendartokens.tokens.tooltipArrowHeight, _Calendartokens.tokens.tooltipArrowEdgeMargin, _Calendartokens.tokens.tooltipArrowBackground)
         }
     }
 };

package/styled-components/cjs/examples/components/Calendar/CalendarDouble.config.js

@@ -13,7 +13,8 @@ var _Calendartokens = require("../../../components/Calendar/Calendar.tokens");
 var config = {
     defaults: {
         view: 'default',
-        size: 'm'
+        size: 'm',
+        tooltipSize: 'm'
     },
     variations: {
         view: {
@@ -47,8 +48,11 @@ var config = {
                 ":var(--surface-clear);",
                 ":var(--text-primary-hover);",
                 ":var(--surface-clear);",
-                ":var(--surface-accent);"
-            ], _Calendartokens.tokens.calendarSeparatorBackground, _Calendartokens.tokens.calendarBackgroundColor, _Calendartokens.tokens.calendarSelectedItemBackground, _Calendartokens.tokens.calendarSelectedItemColor, _Calendartokens.tokens.calendarSelectableItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemBorderColor, _Calendartokens.tokens.calendarCurrentItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemColorHover, _Calendartokens.tokens.calendarCurrentItemChildBackgroundHover, _Calendartokens.tokens.calendarActiveItemBackground, _Calendartokens.tokens.calendarActiveItemColor, _Calendartokens.tokens.calendarHoveredItemBackground, _Calendartokens.tokens.calendarHoveredItemColor, _Calendartokens.tokens.calendarRangeBackground, _Calendartokens.tokens.calendarOutlineFocusColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentPrimaryDisabledColor, _Calendartokens.tokens.calendarHeaderArrowColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentSecondaryColor, _Calendartokens.tokens.calendarContentSecondaryDisabledColor, _Calendartokens.tokens.calendarDisabledOpacity, _Calendartokens.tokens.iconButtonColor, _Calendartokens.tokens.iconButtonBackgroundColor, _Calendartokens.tokens.iconButtonColorHover, _Calendartokens.tokens.iconButtonBackgroundColorHover, _Calendartokens.tokens.iconButtonColorActive, _Calendartokens.tokens.iconButtonBackgroundColorActive, _Calendartokens.tokens.iconButtonFocusColor)
+                ":var(--surface-accent);",
+                ":var(--surface-solid-card-brightness);",
+                ":var(--shadow-down-hard-s);",
+                ":var(--text-primary);"
+            ], _Calendartokens.tokens.calendarSeparatorBackground, _Calendartokens.tokens.calendarBackgroundColor, _Calendartokens.tokens.calendarSelectedItemBackground, _Calendartokens.tokens.calendarSelectedItemColor, _Calendartokens.tokens.calendarSelectableItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemBorderColor, _Calendartokens.tokens.calendarCurrentItemBackgroundHover, _Calendartokens.tokens.calendarCurrentItemColorHover, _Calendartokens.tokens.calendarCurrentItemChildBackgroundHover, _Calendartokens.tokens.calendarActiveItemBackground, _Calendartokens.tokens.calendarActiveItemColor, _Calendartokens.tokens.calendarHoveredItemBackground, _Calendartokens.tokens.calendarHoveredItemColor, _Calendartokens.tokens.calendarRangeBackground, _Calendartokens.tokens.calendarOutlineFocusColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentPrimaryDisabledColor, _Calendartokens.tokens.calendarHeaderArrowColor, _Calendartokens.tokens.calendarContentPrimaryColor, _Calendartokens.tokens.calendarContentSecondaryColor, _Calendartokens.tokens.calendarContentSecondaryDisabledColor, _Calendartokens.tokens.calendarDisabledOpacity, _Calendartokens.tokens.iconButtonColor, _Calendartokens.tokens.iconButtonBackgroundColor, _Calendartokens.tokens.iconButtonColorHover, _Calendartokens.tokens.iconButtonBackgroundColorHover, _Calendartokens.tokens.iconButtonColorActive, _Calendartokens.tokens.iconButtonBackgroundColorActive, _Calendartokens.tokens.iconButtonFocusColor, _Calendartokens.tokens.tooltipBackgroundColor, _Calendartokens.tokens.tooltipBoxShadow, _Calendartokens.tokens.tooltipColor)
         },
         size: {
             l: (0, _styledcomponents.css)([
@@ -280,6 +284,52 @@ var config = {
                 ":0.75rem;",
                 ":0.5rem;"
             ], _Calendartokens.tokens.calendarContainerWidth, _Calendartokens.tokens.calendarContainerHeight, _Calendartokens.tokens.calendarYearsPadding, _Calendartokens.tokens.calendarYearItemBorderRadius, _Calendartokens.tokens.calendarYearFontFamily, _Calendartokens.tokens.calendarYearFontSize, _Calendartokens.tokens.calendarYearFontStyle, _Calendartokens.tokens.calendarYearFontLetterSpacing, _Calendartokens.tokens.calendarYearFontLineHeight, _Calendartokens.tokens.calendarYearFontWeight, _Calendartokens.tokens.calendarYearSelectedFontWeight, _Calendartokens.tokens.calendarQuartersPadding, _Calendartokens.tokens.calendarQuarterItemBorderRadius, _Calendartokens.tokens.calendarQuarterFontFamily, _Calendartokens.tokens.calendarQuarterFontSize, _Calendartokens.tokens.calendarQuarterFontStyle, _Calendartokens.tokens.calendarQuarterFontLetterSpacing, _Calendartokens.tokens.calendarQuarterFontLineHeight, _Calendartokens.tokens.calendarQuarterFontWeight, _Calendartokens.tokens.calendarQuarterSelectedFontWeight, _Calendartokens.tokens.calendarMonthsPadding, _Calendartokens.tokens.calendarMonthItemBorderRadius, _Calendartokens.tokens.calendarMonthFontFamily, _Calendartokens.tokens.calendarMonthFontSize, _Calendartokens.tokens.calendarMonthFontStyle, _Calendartokens.tokens.calendarMonthFontLetterSpacing, _Calendartokens.tokens.calendarMonthFontLineHeight, _Calendartokens.tokens.calendarMonthFontWeight, _Calendartokens.tokens.calendarMonthSelectedFontWeight, _Calendartokens.tokens.calendarDaysPadding, _Calendartokens.tokens.calendarDayItemBorderRadius, _Calendartokens.tokens.calendarDayFontFamily, _Calendartokens.tokens.calendarDayFontSize, _Calendartokens.tokens.calendarDayFontStyle, _Calendartokens.tokens.calendarDayFontLetterSpacing, _Calendartokens.tokens.calendarDayFontLineHeight, _Calendartokens.tokens.calendarDayFontWeight, _Calendartokens.tokens.calendarDaySelectedFontWeight, _Calendartokens.tokens.calendarCurrentItemBorderWidth, _Calendartokens.tokens.calendarHeaderArrowGap, _Calendartokens.tokens.calendarArrowHeaderCustomSize, _Calendartokens.tokens.calendarHeaderPadding, _Calendartokens.tokens.calendarHeaderDateGap, _Calendartokens.tokens.calendarHeaderFontFamily, _Calendartokens.tokens.calendarHeaderFontSize, _Calendartokens.tokens.calendarHeaderFontStyle, _Calendartokens.tokens.calendarHeaderFontLetterSpacing, _Calendartokens.tokens.calendarHeaderFontLineHeight, _Calendartokens.tokens.calendarHeaderFontWeight, _Calendartokens.tokens.calendarHeaderFontWeightBold, _Calendartokens.tokens.iconButtonHeight, _Calendartokens.tokens.iconButtonWidth, _Calendartokens.tokens.iconButtonPadding, _Calendartokens.tokens.iconButtonRadius)
+        },
+        eventTooltipSize: {
+            m: (0, _styledcomponents.css)([
+                "",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":2.5rem;",
+                ":0.625rem;",
+                ":var(--plasma-typo-body-s-font-family);",
+                ":var(--plasma-typo-body-s-font-size);",
+                ":var(--plasma-typo-body-s-font-style);",
+                ":var(--plasma-typo-body-s-font-weight);",
+                ":var(--plasma-typo-body-s-letter-spacing);",
+                ":var(--plasma-typo-body-s-line-height);",
+                ":0.375rem;",
+                ":1.25rem;",
+                ":1.25rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMC4xNywxMS44M2wyMCwwYy01LjUyLDAgLTEwLDMuNTkgLTEwLDhjMCwtNC40MSAtNC40OCwtOCAtMTAsLTh6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGlkPSJUYWlsIi8+Cjwvc3ZnPg==");',
+                ":0.5rem;",
+                ":0.625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _Calendartokens.tokens.tooltipPaddingTop, _Calendartokens.tokens.tooltipPaddingRight, _Calendartokens.tokens.tooltipPaddingBottom, _Calendartokens.tokens.tooltipPaddingLeft, _Calendartokens.tokens.tooltipMinHeight, _Calendartokens.tokens.tooltipBorderRadius, _Calendartokens.tokens.tooltipTextFontFamily, _Calendartokens.tokens.tooltipTextFontSize, _Calendartokens.tokens.tooltipTextFontStyle, _Calendartokens.tokens.tooltipTextFontWeight, _Calendartokens.tokens.tooltipTextFontLetterSpacing, _Calendartokens.tokens.tooltipTextFontLineHeight, _Calendartokens.tokens.tooltipContentLeftMargin, _Calendartokens.tokens.tooltipArrowMaskWidth, _Calendartokens.tokens.tooltipArrowMaskHeight, _Calendartokens.tokens.tooltipArrowMaskImage, _Calendartokens.tokens.tooltipArrowHeight, _Calendartokens.tokens.tooltipArrowEdgeMargin, _Calendartokens.tokens.tooltipArrowBackground),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":2rem;",
+                ":0.5rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":1rem;",
+                ":1rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMCw5Ljg1bDE2LDBjLTQuNDEsMCAtOCwyLjY5IC04LDZjMCwtMy4zMSAtMy41OSwtNiAtOCwtNnoiIGZpbGw9IiMxNzE3MTciIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9IlRhaWwiLz4KPC9zdmc+");',
+                ":0.375rem;",
+                ":0.5625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _Calendartokens.tokens.tooltipPaddingTop, _Calendartokens.tokens.tooltipPaddingRight, _Calendartokens.tokens.tooltipPaddingBottom, _Calendartokens.tokens.tooltipPaddingLeft, _Calendartokens.tokens.tooltipMinHeight, _Calendartokens.tokens.tooltipBorderRadius, _Calendartokens.tokens.tooltipTextFontFamily, _Calendartokens.tokens.tooltipTextFontSize, _Calendartokens.tokens.tooltipTextFontStyle, _Calendartokens.tokens.tooltipTextFontWeight, _Calendartokens.tokens.tooltipTextFontLetterSpacing, _Calendartokens.tokens.tooltipTextFontLineHeight, _Calendartokens.tokens.tooltipContentLeftMargin, _Calendartokens.tokens.tooltipArrowMaskWidth, _Calendartokens.tokens.tooltipArrowMaskHeight, _Calendartokens.tokens.tooltipArrowMaskImage, _Calendartokens.tokens.tooltipArrowHeight, _Calendartokens.tokens.tooltipArrowEdgeMargin, _Calendartokens.tokens.tooltipArrowBackground)
         }
     }
 };

package/styled-components/cjs/examples/components/Combobox/Combobox.js

@@ -1 +1,16 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Combobox", {
+    enumerable: true,
+    get: function() {
+        return Combobox;
+    }
+});
+var _engines = require("../../../engines");
+var _ = require("../../..");
+var _Comboboxconfig = require("./Combobox.config");
+var mergedConfig = (0, _engines.mergeConfig)(_.comboboxNewConfig, _Comboboxconfig.config);
+var ComboboxComponent = (0, _engines.component)(mergedConfig);
+var Combobox = ComboboxComponent;

package/styled-components/cjs/examples/components/DatePicker/DatePicker.config.js

@@ -76,8 +76,11 @@ var config = {
                 ":var(--surface-clear);",
                 ":var(--text-primary-hover);",
                 ":var(--surface-clear);",
-                ":var(--surface-accent);"
-            ], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.backgroundError, _DatePicker.datePickerTokens.backgroundSuccess, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.leftHelperColorError, _DatePicker.datePickerTokens.leftHelperColorSuccess, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBackgroundColor, _DatePicker.datePickerTokens.textFieldBackgroundColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundErrorColor, _DatePicker.datePickerTokens.textFieldBackgroundErrorColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColor, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColorFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentPrimaryDisabledColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryDisabledColor, _DatePicker.datePickerTokens.calendarDisabledOpacity, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor)
+                ":var(--surface-accent);",
+                ":var(--surface-solid-card-brightness);",
+                ":var(--shadow-down-hard-s);",
+                ":var(--text-primary);"
+            ], _DatePicker.datePickerTokens.background, _DatePicker.datePickerTokens.backgroundError, _DatePicker.datePickerTokens.backgroundSuccess, _DatePicker.datePickerTokens.dividerColor, _DatePicker.datePickerTokens.labelColor, _DatePicker.datePickerTokens.leftHelperColor, _DatePicker.datePickerTokens.leftHelperColorError, _DatePicker.datePickerTokens.leftHelperColorSuccess, _DatePicker.datePickerTokens.textFieldColor, _DatePicker.datePickerTokens.textFieldPlaceholderColor, _DatePicker.datePickerTokens.textFieldCaretColor, _DatePicker.datePickerTokens.labelInnerFontFamily, _DatePicker.datePickerTokens.labelInnerFontSize, _DatePicker.datePickerTokens.labelInnerFontStyle, _DatePicker.datePickerTokens.labelInnerFontWeight, _DatePicker.datePickerTokens.labelInnerLetterSpacing, _DatePicker.datePickerTokens.labelInnerLineHeight, _DatePicker.datePickerTokens.indicatorColor, _DatePicker.datePickerTokens.textFieldBackgroundColor, _DatePicker.datePickerTokens.textFieldBackgroundColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundErrorColor, _DatePicker.datePickerTokens.textFieldBackgroundErrorColorFocus, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColor, _DatePicker.datePickerTokens.textFieldBackgroundSuccessColorFocus, _DatePicker.datePickerTokens.textFieldTextBeforeColor, _DatePicker.datePickerTokens.textFieldTextAfterColor, _DatePicker.datePickerTokens.focusColor, _DatePicker.datePickerTokens.textFieldPlaceholderColorFocus, _DatePicker.datePickerTokens.calendarShadow, _DatePicker.datePickerTokens.calendarSeparatorBackground, _DatePicker.datePickerTokens.calendarBackgroundColor, _DatePicker.datePickerTokens.calendarSelectedItemBackground, _DatePicker.datePickerTokens.calendarSelectedItemColor, _DatePicker.datePickerTokens.calendarSelectableItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemBorderColor, _DatePicker.datePickerTokens.calendarCurrentItemBackgroundHover, _DatePicker.datePickerTokens.calendarCurrentItemColorHover, _DatePicker.datePickerTokens.calendarCurrentItemChildBackgroundHover, _DatePicker.datePickerTokens.calendarActiveItemBackground, _DatePicker.datePickerTokens.calendarActiveItemColor, _DatePicker.datePickerTokens.calendarHoveredItemBackground, _DatePicker.datePickerTokens.calendarHoveredItemColor, _DatePicker.datePickerTokens.calendarRangeBackground, _DatePicker.datePickerTokens.calendarOutlineFocusColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentPrimaryDisabledColor, _DatePicker.datePickerTokens.calendarHeaderArrowColor, _DatePicker.datePickerTokens.calendarContentPrimaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryColor, _DatePicker.datePickerTokens.calendarContentSecondaryDisabledColor, _DatePicker.datePickerTokens.calendarDisabledOpacity, _DatePicker.datePickerTokens.iconButtonColor, _DatePicker.datePickerTokens.iconButtonBackgroundColor, _DatePicker.datePickerTokens.iconButtonColorHover, _DatePicker.datePickerTokens.iconButtonBackgroundColorHover, _DatePicker.datePickerTokens.iconButtonColorActive, _DatePicker.datePickerTokens.iconButtonBackgroundColorActive, _DatePicker.datePickerTokens.iconButtonFocusColor, _DatePicker.datePickerTokens.tooltipBackgroundColor, _DatePicker.datePickerTokens.tooltipBoxShadow, _DatePicker.datePickerTokens.tooltipColor)
         },
         size: {
             l: (0, _styledcomponents.css)([
@@ -501,6 +504,52 @@ var config = {
                 ":0.5rem;"
             ], _DatePicker.datePickerTokens.width, _DatePicker.datePickerTokens.borderRadius, _DatePicker.datePickerTokens.dividerPadding, _DatePicker.datePickerTokens.dividerFontFamily, _DatePicker.datePickerTokens.dividerFontStyle, _DatePicker.datePickerTokens.dividerFontSize, _DatePicker.datePickerTokens.dividerFontWeight, _DatePicker.datePickerTokens.dividerLetterSpacing, _DatePicker.datePickerTokens.dividerLineHeight, _DatePicker.datePickerTokens.leftContentMargin, _DatePicker.datePickerTokens.rightContentMargin, _DatePicker.datePickerTokens.labelOffset, _DatePicker.datePickerTokens.labelInnerPadding, _DatePicker.datePickerTokens.contentLabelInnerPadding, _DatePicker.datePickerTokens.labelFontFamily, _DatePicker.datePickerTokens.labelFontStyle, _DatePicker.datePickerTokens.labelFontSize, _DatePicker.datePickerTokens.labelFontWeight, _DatePicker.datePickerTokens.labelLetterSpacing, _DatePicker.datePickerTokens.labelLineHeight, _DatePicker.datePickerTokens.indicatorSize, _DatePicker.datePickerTokens.indicatorSizeOuter, _DatePicker.datePickerTokens.indicatorPlacement, _DatePicker.datePickerTokens.indicatorOuterPlacement, _DatePicker.datePickerTokens.indicatorPlacementRight, _DatePicker.datePickerTokens.indicatorOuterPlacementRight, _DatePicker.datePickerTokens.textFieldHeight, _DatePicker.datePickerTokens.textFieldBorderRadius, _DatePicker.datePickerTokens.textFieldPadding, _DatePicker.datePickerTokens.textFieldFontFamily, _DatePicker.datePickerTokens.textFieldFontStyle, _DatePicker.datePickerTokens.textFieldFontSize, _DatePicker.datePickerTokens.textFieldFontWeight, _DatePicker.datePickerTokens.textFieldLetterSpacing, _DatePicker.datePickerTokens.textFieldLineHeight, _DatePicker.datePickerTokens.leftHelperOffset, _DatePicker.datePickerTokens.leftHelperFontFamily, _DatePicker.datePickerTokens.leftHelperFontStyle, _DatePicker.datePickerTokens.leftHelperFontSize, _DatePicker.datePickerTokens.leftHelperFontWeight, _DatePicker.datePickerTokens.leftHelperLetterSpacing, _DatePicker.datePickerTokens.leftHelperLineHeight, _DatePicker.datePickerTokens.textFieldLeftContentMargin, _DatePicker.datePickerTokens.textFieldRightContentMargin, _DatePicker.datePickerTokens.textFieldTextBeforeMargin, _DatePicker.datePickerTokens.textFieldTextAfterMargin, _DatePicker.datePickerTokens.calendarContainerWidth, _DatePicker.datePickerTokens.calendarContainerHeight, _DatePicker.datePickerTokens.calendarBorderRadius, _DatePicker.datePickerTokens.calendarYearsPadding, _DatePicker.datePickerTokens.calendarYearItemBorderRadius, _DatePicker.datePickerTokens.calendarYearFontFamily, _DatePicker.datePickerTokens.calendarYearFontSize, _DatePicker.datePickerTokens.calendarYearFontStyle, _DatePicker.datePickerTokens.calendarYearFontLetterSpacing, _DatePicker.datePickerTokens.calendarYearFontLineHeight, _DatePicker.datePickerTokens.calendarYearFontWeight, _DatePicker.datePickerTokens.calendarYearSelectedFontWeight, _DatePicker.datePickerTokens.calendarQuartersPadding, _DatePicker.datePickerTokens.calendarQuarterItemBorderRadius, _DatePicker.datePickerTokens.calendarQuarterFontFamily, _DatePicker.datePickerTokens.calendarQuarterFontSize, _DatePicker.datePickerTokens.calendarQuarterFontStyle, _DatePicker.datePickerTokens.calendarQuarterFontLetterSpacing, _DatePicker.datePickerTokens.calendarQuarterFontLineHeight, _DatePicker.datePickerTokens.calendarQuarterFontWeight, _DatePicker.datePickerTokens.calendarQuarterSelectedFontWeight, _DatePicker.datePickerTokens.calendarMonthsPadding, _DatePicker.datePickerTokens.calendarMonthItemBorderRadius, _DatePicker.datePickerTokens.calendarMonthFontFamily, _DatePicker.datePickerTokens.calendarMonthFontSize, _DatePicker.datePickerTokens.calendarMonthFontStyle, _DatePicker.datePickerTokens.calendarMonthFontLetterSpacing, _DatePicker.datePickerTokens.calendarMonthFontLineHeight, _DatePicker.datePickerTokens.calendarMonthFontWeight, _DatePicker.datePickerTokens.calendarMonthSelectedFontWeight, _DatePicker.datePickerTokens.calendarDaysPadding, _DatePicker.datePickerTokens.calendarDayItemBorderRadius, _DatePicker.datePickerTokens.calendarDayFontFamily, _DatePicker.datePickerTokens.calendarDayFontSize, _DatePicker.datePickerTokens.calendarDayFontStyle, _DatePicker.datePickerTokens.calendarDayFontLetterSpacing, _DatePicker.datePickerTokens.calendarDayFontLineHeight, _DatePicker.datePickerTokens.calendarDayFontWeight, _DatePicker.datePickerTokens.calendarDaySelectedFontWeight, _DatePicker.datePickerTokens.calendarCurrentItemBorderWidth, _DatePicker.datePickerTokens.calendarHeaderWrapperPadding, _DatePicker.datePickerTokens.calendarHeaderArrowGap, _DatePicker.datePickerTokens.calendarHeaderArrowCustomSize, _DatePicker.datePickerTokens.calendarHeaderPadding, _DatePicker.datePickerTokens.calendarHeaderDateGap, _DatePicker.datePickerTokens.calendarHeaderFontFamily, _DatePicker.datePickerTokens.calendarHeaderFontSize, _DatePicker.datePickerTokens.calendarHeaderFontStyle, _DatePicker.datePickerTokens.calendarHeaderFontLetterSpacing, _DatePicker.datePickerTokens.calendarHeaderFontLineHeight, _DatePicker.datePickerTokens.calendarHeaderFontWeight, _DatePicker.datePickerTokens.calendarHeaderFontWeightBold, _DatePicker.datePickerTokens.iconButtonHeight, _DatePicker.datePickerTokens.iconButtonWidth, _DatePicker.datePickerTokens.iconButtonPadding, _DatePicker.datePickerTokens.iconButtonRadius)
         },
+        eventTooltipSize: {
+            m: (0, _styledcomponents.css)([
+                "",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":0.6875rem;",
+                ":0.875rem;",
+                ":2.5rem;",
+                ":0.625rem;",
+                ":var(--plasma-typo-body-s-font-family);",
+                ":var(--plasma-typo-body-s-font-size);",
+                ":var(--plasma-typo-body-s-font-style);",
+                ":var(--plasma-typo-body-s-font-weight);",
+                ":var(--plasma-typo-body-s-letter-spacing);",
+                ":var(--plasma-typo-body-s-line-height);",
+                ":0.375rem;",
+                ":1.25rem;",
+                ":1.25rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMC4xNywxMS44M2wyMCwwYy01LjUyLDAgLTEwLDMuNTkgLTEwLDhjMCwtNC40MSAtNC40OCwtOCAtMTAsLTh6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGlkPSJUYWlsIi8+Cjwvc3ZnPg==");',
+                ":0.5rem;",
+                ":0.625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _DatePicker.datePickerTokens.tooltipPaddingTop, _DatePicker.datePickerTokens.tooltipPaddingRight, _DatePicker.datePickerTokens.tooltipPaddingBottom, _DatePicker.datePickerTokens.tooltipPaddingLeft, _DatePicker.datePickerTokens.tooltipMinHeight, _DatePicker.datePickerTokens.tooltipBorderRadius, _DatePicker.datePickerTokens.tooltipTextFontFamily, _DatePicker.datePickerTokens.tooltipTextFontSize, _DatePicker.datePickerTokens.tooltipTextFontStyle, _DatePicker.datePickerTokens.tooltipTextFontWeight, _DatePicker.datePickerTokens.tooltipTextFontLetterSpacing, _DatePicker.datePickerTokens.tooltipTextFontLineHeight, _DatePicker.datePickerTokens.tooltipContentLeftMargin, _DatePicker.datePickerTokens.tooltipArrowMaskWidth, _DatePicker.datePickerTokens.tooltipArrowMaskHeight, _DatePicker.datePickerTokens.tooltipArrowMaskImage, _DatePicker.datePickerTokens.tooltipArrowHeight, _DatePicker.datePickerTokens.tooltipArrowEdgeMargin, _DatePicker.datePickerTokens.tooltipArrowBackground),
+            s: (0, _styledcomponents.css)([
+                "",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":0.5rem;",
+                ":0.75rem;",
+                ":2rem;",
+                ":0.5rem;",
+                ":var(--plasma-typo-body-xs-font-family);",
+                ":var(--plasma-typo-body-xs-font-size);",
+                ":var(--plasma-typo-body-xs-font-style);",
+                ":var(--plasma-typo-body-xs-font-weight);",
+                ":var(--plasma-typo-body-xs-letter-spacing);",
+                ":var(--plasma-typo-body-xs-line-height);",
+                ":0.25rem;",
+                ":1rem;",
+                ":1rem;",
+                ':url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMCw5Ljg1bDE2LDBjLTQuNDEsMCAtOCwyLjY5IC04LDZjMCwtMy4zMSAtMy41OSwtNiAtOCwtNnoiIGZpbGw9IiMxNzE3MTciIGZpbGwtcnVsZT0iZXZlbm9kZCIgaWQ9IlRhaWwiLz4KPC9zdmc+");',
+                ":0.375rem;",
+                ":0.5625rem;",
+                ":var(--surface-solid-card-brightness);"
+            ], _DatePicker.datePickerTokens.tooltipPaddingTop, _DatePicker.datePickerTokens.tooltipPaddingRight, _DatePicker.datePickerTokens.tooltipPaddingBottom, _DatePicker.datePickerTokens.tooltipPaddingLeft, _DatePicker.datePickerTokens.tooltipMinHeight, _DatePicker.datePickerTokens.tooltipBorderRadius, _DatePicker.datePickerTokens.tooltipTextFontFamily, _DatePicker.datePickerTokens.tooltipTextFontSize, _DatePicker.datePickerTokens.tooltipTextFontStyle, _DatePicker.datePickerTokens.tooltipTextFontWeight, _DatePicker.datePickerTokens.tooltipTextFontLetterSpacing, _DatePicker.datePickerTokens.tooltipTextFontLineHeight, _DatePicker.datePickerTokens.tooltipContentLeftMargin, _DatePicker.datePickerTokens.tooltipArrowMaskWidth, _DatePicker.datePickerTokens.tooltipArrowMaskHeight, _DatePicker.datePickerTokens.tooltipArrowMaskImage, _DatePicker.datePickerTokens.tooltipArrowHeight, _DatePicker.datePickerTokens.tooltipArrowEdgeMargin, _DatePicker.datePickerTokens.tooltipArrowBackground)
+        },
         disabled: {
             true: (0, _styledcomponents.css)([
                 "",

package/styled-components/cjs/examples/components/TimePicker/TimePicker.config.js

@@ -40,9 +40,8 @@ var config = {
                 ":var(--surface-transparent-secondary);",
                 ":var(--surface-transparent-secondary);",
                 ":var(--surface-transparent-tertiary);",
-                ":var(--surface-transparent-primary);",
-                ":0.4;"
-            ], _TimePicker.timePickerTokens.background, _TimePicker.timePickerTokens.backgroundError, _TimePicker.timePickerTokens.backgroundSuccess, _TimePicker.timePickerTokens.labelColor, _TimePicker.timePickerTokens.textFieldColor, _TimePicker.timePickerTokens.textFieldPlaceholderColor, _TimePicker.timePickerTokens.textFieldCaretColor, _TimePicker.timePickerTokens.indicatorColor, _TimePicker.timePickerTokens.textFieldBackgroundColor, _TimePicker.timePickerTokens.textFieldBackgroundColorFocus, _TimePicker.timePickerTokens.textFieldBackgroundErrorColor, _TimePicker.timePickerTokens.textFieldBackgroundErrorColorFocus, _TimePicker.timePickerTokens.textFieldBackgroundSuccessColor, _TimePicker.timePickerTokens.textFieldBackgroundSuccessColorFocus, _TimePicker.timePickerTokens.textFieldTextBeforeColor, _TimePicker.timePickerTokens.textFieldTextAfterColor, _TimePicker.timePickerTokens.textFieldPlaceholderColorFocus, _TimePicker.timePickerTokens.timePickerBackground, _TimePicker.timePickerTokens.itemBackgroundHover, _TimePicker.timePickerTokens.itemBackgroundActive, _TimePicker.timePickerTokens.scrollbarColor, _TimePicker.timePickerTokens.scrollbarTrackColor, _TimePicker.timePickerTokens.disabledOpacity)
+                ":var(--surface-transparent-primary);"
+            ], _TimePicker.timePickerTokens.background, _TimePicker.timePickerTokens.backgroundError, _TimePicker.timePickerTokens.backgroundSuccess, _TimePicker.timePickerTokens.labelColor, _TimePicker.timePickerTokens.textFieldColor, _TimePicker.timePickerTokens.textFieldPlaceholderColor, _TimePicker.timePickerTokens.textFieldCaretColor, _TimePicker.timePickerTokens.indicatorColor, _TimePicker.timePickerTokens.textFieldBackgroundColor, _TimePicker.timePickerTokens.textFieldBackgroundColorFocus, _TimePicker.timePickerTokens.textFieldBackgroundErrorColor, _TimePicker.timePickerTokens.textFieldBackgroundErrorColorFocus, _TimePicker.timePickerTokens.textFieldBackgroundSuccessColor, _TimePicker.timePickerTokens.textFieldBackgroundSuccessColorFocus, _TimePicker.timePickerTokens.textFieldTextBeforeColor, _TimePicker.timePickerTokens.textFieldTextAfterColor, _TimePicker.timePickerTokens.textFieldPlaceholderColorFocus, _TimePicker.timePickerTokens.timePickerBackground, _TimePicker.timePickerTokens.itemBackgroundHover, _TimePicker.timePickerTokens.itemBackgroundActive, _TimePicker.timePickerTokens.scrollbarColor, _TimePicker.timePickerTokens.scrollbarTrackColor)
         },
         size: {
             l: (0, _styledcomponents.css)([

package/styled-components/es/components/Calendar/Calendar.tokens.js

@@ -114,5 +114,27 @@ export var tokens = {
     calendarContentPrimaryDisabledColor: '--plasma-calendar-content-primary-disabled-color',
     calendarContentSecondaryColor: '--plasma-calendar-content-secondary-color',
     calendarContentSecondaryDisabledColor: '--plasma-calendar-content-secondary-disabled-color',
-    calendarDisabledOpacity: '--plasma-calendar-disabled-opacity'
+    calendarDisabledOpacity: '--plasma-calendar-disabled-opacity',
+    /* Токены тултипа для событий */ tooltipPaddingTop: '--plasma-calendar-tooltip-padding-top',
+    tooltipPaddingRight: '--plasma-calendar-tooltip-padding-right',
+    tooltipPaddingBottom: '--plasma-calendar-tooltip-padding-bottom',
+    tooltipPaddingLeft: '--plasma-calendar-tooltip-padding-left',
+    tooltipMinHeight: '--plasma-calendar-tooltip-min-height',
+    tooltipBackgroundColor: '--plasma-calendar-tooltip-background-color',
+    tooltipBoxShadow: '--plasma-calendar-tooltip-box-shadow',
+    tooltipBorderRadius: '--plasma-calendar-tooltip-border-radius',
+    tooltipColor: '--plasma-calendar-tooltip-color',
+    tooltipTextFontFamily: '--plasma-calendar-tooltip-text-font-family',
+    tooltipTextFontSize: '--plasma-calendar-tooltip-text-font-size',
+    tooltipTextFontStyle: '--plasma-calendar-tooltip-text-font-style',
+    tooltipTextFontWeight: '--plasma-calendar-tooltip-text-font-weight',
+    tooltipTextFontLetterSpacing: '--plasma-calendar-tooltip-text-font-letter-spacing',
+    tooltipTextFontLineHeight: '--plasma-calendar-tooltip-text-font-line-height',
+    tooltipContentLeftMargin: '--plasma-calendar-tooltip-content-left-margin',
+    tooltipArrowMaskWidth: '--plasma-calendar-tooltip-arrow-mask-width',
+    tooltipArrowMaskHeight: '--plasma-calendar-tooltip-arrow-mask-height',
+    tooltipArrowMaskImage: '--plasma-calendar-tooltip-arrow-mask-image',
+    tooltipArrowBackground: '--plasma-calendar-tooltip-arrow-background',
+    tooltipArrowHeight: '--plasma-calendar-tooltip-arrow-height',
+    tooltipArrowEdgeMargin: '--plasma-calendar-tooltip-arrow-edge-margin'
 };