@salutejs/plasma-new-hope 0.337.0-canary.2184.17942080334.0 → 0.337.0-canary.2184.17969522274.0

package/styled-components/es/components/TimePicker/TimePicker.js

@@ -135,11 +135,11 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
-import React, { forwardRef, useRef, useState, useEffect } from "react";
+import React, { forwardRef, useRef, useState, useEffect, useCallback } from "react";
 import cls from "classnames";
 import { getPlacements } from "../../utils";
 import { range, processTimeInput, animateScrollTo } from "./utils";
-import { base, StyledInput, StyledPopover, StyledTimeColumn, StyledTimeItem, StyledTimePicker } from "./TimePicker.styles";
+import { base, StyledInput, StyledPopover, StyledTimeColumn, StyledTimeItem, StyledTimePicker, CustomScrollbar, ScrollbarTrack, ScrollbarThumb, StyledEmpty } from "./TimePicker.styles";
 import { classes } from "./TimePicker.tokens";
 import { base as sizeCSS } from "./variations/_size/base";
 import { base as viewCSS } from "./variations/_view/base";
@@ -187,6 +187,15 @@ export var timePickerRoot = function(Root) {
         var minutesColumnRef = useRef(null);
         var secondsColumnRef = useRef(null);
         var timeItemRefs = useRef({});
+        var hoursScrollbarRef = useRef(null);
+        var minutesScrollbarRef = useRef(null);
+        var secondsScrollbarRef = useRef(null);
+        var hoursThumbRef = useRef(null);
+        var minutesThumbRef = useRef(null);
+        var secondsThumbRef = useRef(null);
+        var hoursHideTimeoutRef = useRef(null);
+        var minutesHideTimeoutRef = useRef(null);
+        var secondsHideTimeoutRef = useRef(null);
         var _useState = _sliced_to_array(useState(opened), 2), isInnerOpen = _useState[0], setIsInnerOpen = _useState[1];
         var _useState1 = _sliced_to_array(useState(outerValue || ''), 2), innerTime = _useState1[0], setInnerTime = _useState1[1];
         var _useState2 = _sliced_to_array(useState({
@@ -197,11 +206,154 @@ export var timePickerRoot = function(Root) {
         }), 2), activeTime = _useState2[0], setActiveTime = _useState2[1];
         var _useState3 = _sliced_to_array(useState(0), 2), itemHeight = _useState3[0], setItemHeight = _useState3[1];
         var _useState4 = _sliced_to_array(useState(0), 2), gap = _useState4[0], setGap = _useState4[1];
+        var _useState5 = _sliced_to_array(useState({
+            isVisible: false,
+            thumbHeight: 0,
+            thumbPosition: 0,
+            isDragging: false
+        }), 2), hoursScrollbar = _useState5[0], setHoursScrollbar = _useState5[1];
+        var _useState6 = _sliced_to_array(useState({
+            isVisible: false,
+            thumbHeight: 0,
+            thumbPosition: 0,
+            isDragging: false
+        }), 2), minutesScrollbar = _useState6[0], setMinutesScrollbar = _useState6[1];
+        var _useState7 = _sliced_to_array(useState({
+            isVisible: false,
+            thumbHeight: 0,
+            thumbPosition: 0,
+            isDragging: false
+        }), 2), secondsScrollbar = _useState7[0], setSecondsScrollbar = _useState7[1];
         var viewValue = outerValue !== null && outerValue !== void 0 ? outerValue : innerTime;
         var format = columnsQuantity === 3 ? 'HH:mm:ss' : 'HH:mm';
         var hours = range(24);
         var minutes = range(60);
         var seconds = range(60);
+        var calculateScrollbar = useCallback(function(columnRef) {
+            if (!columnRef.current) return {
+                thumbHeight: 0,
+                thumbPosition: 0
+            };
+            var _columnRef_current = columnRef.current, scrollTop = _columnRef_current.scrollTop, scrollHeight = _columnRef_current.scrollHeight, clientHeight = _columnRef_current.clientHeight;
+            var trackHeight = clientHeight;
+            var thumbHeight = Math.max(trackHeight / scrollHeight * trackHeight, 20); // Минимальная высота 20px
+            var maxScroll = scrollHeight - clientHeight;
+            var thumbPosition = maxScroll > 0 ? scrollTop / maxScroll * (trackHeight - thumbHeight) : 0;
+            return {
+                thumbHeight: thumbHeight,
+                thumbPosition: thumbPosition
+            };
+        }, []);
+        var showScrollbarWithDelay = useCallback(function(setScrollbar, timeoutRef, columnRef) {
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+            updateScrollbar(columnRef, setScrollbar, true);
+            timeoutRef.current = setTimeout(function() {
+                setScrollbar(function(prev) {
+                    return _object_spread_props(_object_spread({}, prev), {
+                        isVisible: false
+                    });
+                });
+                timeoutRef.current = null;
+            }, 2000);
+        }, []);
+        var updateScrollbar = useCallback(function(columnRef, setScrollbar) {
+            var show = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
+            if (!columnRef.current) return;
+            var _calculateScrollbar = calculateScrollbar(columnRef), thumbHeight = _calculateScrollbar.thumbHeight, thumbPosition = _calculateScrollbar.thumbPosition;
+            setScrollbar(function(prev) {
+                return _object_spread_props(_object_spread({}, prev), {
+                    thumbHeight: thumbHeight,
+                    thumbPosition: thumbPosition,
+                    isVisible: show || prev.isVisible
+                });
+            });
+        }, [
+            calculateScrollbar
+        ]);
+        var handleColumnScroll = useCallback(function(columnRef, setScrollbar, timeoutRef) {
+            showScrollbarWithDelay(setScrollbar, timeoutRef, columnRef);
+        }, [
+            showScrollbarWithDelay
+        ]);
+        var createScrollbarDragHandler = useCallback(function(columnRef, setScrollbar, timeoutRef) {
+            return function(e) {
+                e.preventDefault();
+                var thumb = e.currentTarget;
+                var track = thumb.parentElement;
+                if (!columnRef.current || !track) return;
+                if (timeoutRef.current) {
+                    clearTimeout(timeoutRef.current);
+                    timeoutRef.current = null;
+                }
+                var startY = e.clientY;
+                var startThumbPosition = parseFloat(thumb.style.top || '0');
+                var trackRect = track.getBoundingClientRect();
+                var trackHeight = trackRect.height;
+                var thumbHeight = thumb.offsetHeight;
+                var _columnRef_current = columnRef.current, scrollHeight = _columnRef_current.scrollHeight, clientHeight = _columnRef_current.clientHeight;
+                var maxScroll = scrollHeight - clientHeight;
+                var handleMouseMove = function(moveEvent) {
+                    var deltaY = moveEvent.clientY - startY;
+                    var newThumbPosition = Math.max(0, Math.min(trackHeight - thumbHeight, startThumbPosition + deltaY));
+                    var scrollPercentage = newThumbPosition / (trackHeight - thumbHeight);
+                    var newScrollTop = scrollPercentage * maxScroll;
+                    if (columnRef.current) {
+                        columnRef.current.scrollTop = newScrollTop;
+                    }
+                    setScrollbar(function(prev) {
+                        return _object_spread_props(_object_spread({}, prev), {
+                            thumbPosition: newThumbPosition,
+                            isDragging: true,
+                            isVisible: true
+                        });
+                    });
+                };
+                var handleMouseUp = function() {
+                    document.removeEventListener('mousemove', handleMouseMove);
+                    document.removeEventListener('mouseup', handleMouseUp);
+                    setScrollbar(function(prev) {
+                        return _object_spread_props(_object_spread({}, prev), {
+                            isDragging: false
+                        });
+                    });
+                    showScrollbarWithDelay(setScrollbar, timeoutRef, columnRef);
+                };
+                document.addEventListener('mousemove', handleMouseMove);
+                document.addEventListener('mouseup', handleMouseUp);
+            };
+        }, [
+            showScrollbarWithDelay
+        ]);
+        useEffect(function() {
+            return function() {
+                [
+                    hoursHideTimeoutRef,
+                    minutesHideTimeoutRef,
+                    secondsHideTimeoutRef
+                ].forEach(function(timeoutRef) {
+                    if (timeoutRef.current) {
+                        clearTimeout(timeoutRef.current);
+                    }
+                });
+            };
+        }, []);
+        useEffect(function() {
+            if (isInnerOpen) {
+                setTimeout(function() {
+                    updateScrollbar(hoursColumnRef, setHoursScrollbar);
+                    updateScrollbar(minutesColumnRef, setMinutesScrollbar);
+                    if (columnsQuantity === 3) {
+                        updateScrollbar(secondsColumnRef, setSecondsScrollbar);
+                    }
+                }, 100);
+            }
+        }, [
+            isInnerOpen,
+            columnsQuantity,
+            updateScrollbar
+        ]);
         useEffect(function() {
             if (viewValue) {
                 var timeString = viewValue;
@@ -250,6 +402,15 @@ export var timePickerRoot = function(Root) {
                 if (columnRef.current && index !== null) {
                     var scrollPosition = index * (itemHeight + gap);
                     animateScrollTo(columnRef.current, scrollPosition);
+                    setTimeout(function() {
+                        if (columnRef === hoursColumnRef) {
+                            updateScrollbar(hoursColumnRef, setHoursScrollbar);
+                        } else if (columnRef === minutesColumnRef) {
+                            updateScrollbar(minutesColumnRef, setMinutesScrollbar);
+                        } else if (columnRef === secondsColumnRef) {
+                            updateScrollbar(secondsColumnRef, setSecondsScrollbar);
+                        }
+                    }, 300);
                 }
             };
             scrollToActiveItem(hoursColumnRef, activeTime.hours);
@@ -258,7 +419,83 @@ export var timePickerRoot = function(Root) {
         }, [
             activeTime,
             isInnerOpen,
-            itemHeight
+            itemHeight,
+            gap,
+            updateScrollbar
+        ]);
+        useEffect(function() {
+            var hoursColumn = hoursColumnRef.current;
+            var minutesColumn = minutesColumnRef.current;
+            var secondsColumn = secondsColumnRef.current;
+            var handleHoursScroll = function() {
+                return handleColumnScroll(hoursColumnRef, setHoursScrollbar, hoursHideTimeoutRef);
+            };
+            var handleMinutesScroll = function() {
+                return handleColumnScroll(minutesColumnRef, setMinutesScrollbar, minutesHideTimeoutRef);
+            };
+            var handleSecondsScroll = function() {
+                return handleColumnScroll(secondsColumnRef, setSecondsScrollbar, secondsHideTimeoutRef);
+            };
+            if (hoursColumn) {
+                hoursColumn.addEventListener('scroll', handleHoursScroll);
+            }
+            if (minutesColumn) {
+                minutesColumn.addEventListener('scroll', handleMinutesScroll);
+            }
+            if (secondsColumn) {
+                secondsColumn.addEventListener('scroll', handleSecondsScroll);
+            }
+            return function() {
+                if (hoursColumn) {
+                    hoursColumn.removeEventListener('scroll', handleHoursScroll);
+                }
+                if (minutesColumn) {
+                    minutesColumn.removeEventListener('scroll', handleMinutesScroll);
+                }
+                if (secondsColumn) {
+                    secondsColumn.removeEventListener('scroll', handleSecondsScroll);
+                }
+            };
+        }, [
+            isInnerOpen,
+            handleColumnScroll
+        ]);
+        useEffect(function() {
+            var hoursColumn = hoursColumnRef.current;
+            var minutesColumn = minutesColumnRef.current;
+            var secondsColumn = secondsColumnRef.current;
+            var handleHoursMouseEnter = function() {
+                return showScrollbarWithDelay(setHoursScrollbar, hoursHideTimeoutRef, hoursColumnRef);
+            };
+            var handleMinutesMouseEnter = function() {
+                return showScrollbarWithDelay(setMinutesScrollbar, minutesHideTimeoutRef, minutesColumnRef);
+            };
+            var handleSecondsMouseEnter = function() {
+                return showScrollbarWithDelay(setSecondsScrollbar, secondsHideTimeoutRef, secondsColumnRef);
+            };
+            if (hoursColumn) {
+                hoursColumn.addEventListener('mouseenter', handleHoursMouseEnter);
+            }
+            if (minutesColumn) {
+                minutesColumn.addEventListener('mouseenter', handleMinutesMouseEnter);
+            }
+            if (secondsColumn) {
+                secondsColumn.addEventListener('mouseenter', handleSecondsMouseEnter);
+            }
+            return function() {
+                if (hoursColumn) {
+                    hoursColumn.removeEventListener('mouseenter', handleHoursMouseEnter);
+                }
+                if (minutesColumn) {
+                    minutesColumn.removeEventListener('mouseenter', handleMinutesMouseEnter);
+                }
+                if (secondsColumn) {
+                    secondsColumn.removeEventListener('mouseenter', handleSecondsMouseEnter);
+                }
+            };
+        }, [
+            isInnerOpen,
+            showScrollbarWithDelay
         ]);
         var handleToggle = function() {
             if (disabled || readonly) return;
@@ -503,11 +740,17 @@ export var timePickerRoot = function(Root) {
             labelPlacement: labelPlacement,
             keepPlaceholder: keepPlaceholder
         });
-        var renderTimeColumn = function(values, column, columnRef) {
-            return /*#__PURE__*/ React.createElement(StyledTimeColumn, {
+        var renderTimeColumn = function(values, column, columnRef, scrollbarState, setScrollbar, scrollbarRef, thumbRef, timeoutRef) {
+            return /*#__PURE__*/ React.createElement("div", {
+                style: {
+                    position: 'relative',
+                    width: '100%'
+                }
+            }, /*#__PURE__*/ React.createElement(StyledTimeColumn, {
                 key: column,
                 ref: columnRef,
-                height: dropdownHeight
+                height: dropdownHeight,
+                className: classes.timeColumn
             }, values.map(function(value, index) {
                 return /*#__PURE__*/ React.createElement(StyledTimeItem, {
                     key: value,
@@ -522,7 +765,17 @@ export var timePickerRoot = function(Root) {
                         return handleTimeItemKeyDown(e, column, value);
                     }
                 }, value);
-            }));
+            }), /*#__PURE__*/ React.createElement(StyledEmpty, null)), /*#__PURE__*/ React.createElement(CustomScrollbar, {
+                ref: scrollbarRef,
+                className: cls(_define_property({}, classes.scrollbarVisible, scrollbarState.isVisible))
+            }, /*#__PURE__*/ React.createElement(ScrollbarTrack, null, /*#__PURE__*/ React.createElement(ScrollbarThumb, {
+                ref: thumbRef,
+                style: {
+                    height: "".concat(scrollbarState.thumbHeight, "px"),
+                    top: "".concat(scrollbarState.thumbPosition, "px")
+                },
+                onMouseDown: createScrollbarDragHandler(columnRef, setScrollbar, timeoutRef)
+            }))));
         };
         return /*#__PURE__*/ React.createElement(Root, _object_spread({
             stretched: stretched,
@@ -555,7 +808,7 @@ export var timePickerRoot = function(Root) {
             stretched: stretched
         }, /*#__PURE__*/ React.createElement(StyledTimePicker, {
             width: dropdownWidth
-        }, renderTimeColumn(hours, 'hours', hoursColumnRef), renderTimeColumn(minutes, 'minutes', minutesColumnRef), columnsQuantity === 3 && renderTimeColumn(seconds, 'seconds', secondsColumnRef)))));
+        }, renderTimeColumn(hours, 'hours', hoursColumnRef, hoursScrollbar, setHoursScrollbar, hoursScrollbarRef, hoursThumbRef, hoursHideTimeoutRef), renderTimeColumn(minutes, 'minutes', minutesColumnRef, minutesScrollbar, setMinutesScrollbar, minutesScrollbarRef, minutesThumbRef, minutesHideTimeoutRef), columnsQuantity === 3 && renderTimeColumn(seconds, 'seconds', secondsColumnRef, secondsScrollbar, setSecondsScrollbar, secondsScrollbarRef, secondsThumbRef, secondsHideTimeoutRef)))));
     });
 };
 export var timePickerConfig = {

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

@@ -10,14 +10,14 @@ var mergedPopoverConfig = mergeConfig(popoverConfig);
 var Popover = component(mergedPopoverConfig);
 export var StyledPopover = styled(Popover).withConfig({
     displayName: "TimePicker.styles__StyledPopover",
-    componentId: "sc-45298523-0"
+    componentId: "sc-90a263ab-0"
 })([
     ""
 ]);
 // NOTE: переопределение токенов TextField
 export var StyledInput = styled(TextField).withConfig({
     displayName: "TimePicker.styles__StyledInput",
-    componentId: "sc-45298523-1"
+    componentId: "sc-90a263ab-1"
 })([
     "width:100%;",
     ":var(",
@@ -168,34 +168,36 @@ export var StyledInput = styled(TextField).withConfig({
 ], textFieldTokens.color, tokens.textFieldColor, textFieldTokens.placeholderColor, tokens.textFieldPlaceholderColor, textFieldTokens.placeholderColorFocus, tokens.textFieldPlaceholderColorFocus, textFieldTokens.caretColor, tokens.textFieldCaretColor, textFieldTokens.focusColor, tokens.textFieldFocusColor, textFieldTokens.backgroundColor, tokens.textFieldBackgroundColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundColorFocus, textFieldTokens.borderColor, tokens.borderColor, textFieldTokens.borderColorHover, tokens.borderColorHover, textFieldTokens.borderColorFocus, tokens.borderColorFocus, textFieldTokens.colorReadOnly, tokens.textFieldColorReadOnly, textFieldTokens.backgroundColorReadOnly, tokens.textFieldBackgroundColorReadOnly, textFieldTokens.borderColorReadOnly, tokens.textFieldBorderColorReadOnly, textFieldTokens.placeholderColorReadOnly, tokens.textFieldPlaceholderColorReadOnly, textFieldTokens.height, tokens.textFieldHeight, textFieldTokens.borderWidth, tokens.textFieldBorderWidth, textFieldTokens.borderRadius, tokens.textFieldBorderRadius, textFieldTokens.padding, tokens.textFieldPadding, textFieldTokens.labelInnerPadding, tokens.labelInnerPadding, textFieldTokens.contentLabelInnerPadding, tokens.contentLabelInnerPadding, textFieldTokens.labelOffset, tokens.labelOffset, textFieldTokens.labelFontFamily, tokens.labelFontFamily, textFieldTokens.labelFontStyle, tokens.labelFontStyle, textFieldTokens.labelFontSize, tokens.labelFontSize, textFieldTokens.labelFontWeight, tokens.labelFontWeight, textFieldTokens.labelLetterSpacing, tokens.labelLetterSpacing, textFieldTokens.labelLineHeight, tokens.labelLineHeight, textFieldTokens.labelInnerFontFamily, tokens.labelInnerFontFamily, textFieldTokens.labelInnerFontSize, tokens.labelInnerFontSize, textFieldTokens.labelInnerFontStyle, tokens.labelInnerFontStyle, textFieldTokens.labelInnerFontWeight, tokens.labelInnerFontWeight, textFieldTokens.labelInnerLetterSpacing, tokens.labelInnerLetterSpacing, textFieldTokens.labelInnerLineHeight, tokens.labelInnerLineHeight, textFieldTokens.labelColorReadOnly, tokens.labelColorReadOnly, textFieldTokens.indicatorColor, tokens.indicatorColor, textFieldTokens.indicatorSizeInner, tokens.indicatorSize, textFieldTokens.indicatorSizeOuter, tokens.indicatorSizeOuter, textFieldTokens.indicatorLabelPlacementInner, tokens.indicatorPlacement, textFieldTokens.indicatorLabelPlacementOuter, tokens.indicatorOuterPlacement, textFieldTokens.indicatorLabelPlacementInnerRight, tokens.indicatorPlacementRight, textFieldTokens.indicatorLabelPlacementOuterRight, tokens.indicatorOuterPlacementRight, textFieldTokens.leftContentMargin, tokens.textFieldLeftContentMargin, textFieldTokens.rightContentMargin, tokens.textFieldRightContentMargin, textFieldTokens.fontFamily, tokens.textFieldFontFamily, textFieldTokens.fontSize, tokens.textFieldFontSize, textFieldTokens.fontStyle, tokens.textFieldFontStyle, textFieldTokens.fontWeight, tokens.textFieldFontWeight, textFieldTokens.letterSpacing, tokens.textFieldLetterSpacing, textFieldTokens.lineHeight, tokens.textFieldLineHeight, textFieldTokens.disabledOpacity, tokens.disabledOpacity, textFieldTokens.textBeforeColor, tokens.textFieldTextBeforeColor, textFieldTokens.textAfterColor, tokens.textFieldTextAfterColor, textFieldTokens.textBeforeMargin, tokens.textFieldTextBeforeMargin, textFieldTokens.textAfterMargin, tokens.textFieldTextAfterMargin, textFieldTokens.contentSlotColor, tokens.textFieldContentSlotColor, tokens.textFieldColor, textFieldTokens.contentSlotRightColor, tokens.textFieldContentRightSlotColor, textFieldTokens.contentSlotColor, textFieldTokens.contentSlotRightColorHover, tokens.textFieldContentRightSlotColorHover, textFieldTokens.contentSlotRightColor, classes.timePickerError, textFieldTokens.backgroundColor, tokens.textFieldBackgroundErrorColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundErrorColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundErrorColorFocus, textFieldTokens.borderColor, tokens.textFieldBorderColorError, textFieldTokens.borderColorHover, tokens.textFieldBorderColorErrorHover, textFieldTokens.borderColorFocus, tokens.textFieldBorderColorErrorFocus, classes.timePickerSuccess, textFieldTokens.backgroundColor, tokens.textFieldBackgroundSuccessColor, textFieldTokens.backgroundColorHover, tokens.textFieldBackgroundSuccessColorHover, textFieldTokens.backgroundColorFocus, tokens.textFieldBackgroundSuccessColorFocus, textFieldTokens.borderColor, tokens.textFieldBorderColorSuccess, textFieldTokens.borderColorHover, tokens.textFieldBorderColorSuccessHover, textFieldTokens.borderColorFocus, tokens.textFieldBorderColorSuccessFocus);
 export var base = css([
     "display:inline-block;width:var(",
+    ");margin-top:var(",
     ");.",
     ",.",
     "{width:inherit;}&.",
     "{width:100%;.",
     "{width:100%;}}&.",
     "{width:100%;}"
-], tokens.width, popoverClasses.wrapper, popoverClasses.target, classes.timePickerstretched, popoverClasses.root, classes.timePickerFullWidth);
+], tokens.width, tokens.dropdownMarginTop, popoverClasses.wrapper, popoverClasses.target, classes.timePickerstretched, popoverClasses.root, classes.timePickerFullWidth);
 export var StyledTimePicker = styled.div.withConfig({
     displayName: "TimePicker.styles__StyledTimePicker",
-    componentId: "sc-45298523-2"
+    componentId: "sc-90a263ab-2"
 })([
     "background:var(",
     ");border-radius:var(",
     ");width:",
     ";display:flex;padding:var(",
-    ");flex:1 1 1;box-sizing:border-box;position:relative;"
+    ");flex:1 1 1;gap:var(",
+    ");box-sizing:border-box;position:relative;"
 ], tokens.timePickerBackground, tokens.timePickerBorderRadius, function(param) {
     var width = param.width;
     return (width === 'fullWidth' ? "var(".concat(tokens.width, ")") : width) || "var(".concat(tokens.timePickerWidth, ")");
-}, tokens.timePickerPadding);
+}, tokens.timePickerPadding, tokens.scrollbarWidth);
 export var StyledTimeItem = styled.div.withConfig({
     displayName: "TimePicker.styles__StyledTimeItem",
-    componentId: "sc-45298523-3"
+    componentId: "sc-90a263ab-3"
 })([
     "height:var(",
     ");padding:var(",
     ");box-sizing:border-box;display:flex;justify-content:center;align-items:center;transition:0.05s;border-radius:var(",
-    ");cursor:pointer;flex-shrink:0;font-family:var(",
+    ");cursor:pointer;flex-shrink:0;overflow:auto;font-family:var(",
     ");font-size:var(",
     ");font-style:var(",
     ");font-weight:var(",
@@ -208,24 +210,49 @@ export var StyledTimeItem = styled.div.withConfig({
 ], tokens.itemHeight, tokens.itemPadding, tokens.itemBorderRadius, tokens.itemFontFamily, tokens.itemFontSize, tokens.itemFontStyle, tokens.itemFontWeight, tokens.itemLetterSpacing, tokens.itemLineHeight, tokens.itemHoverBackground, classes.timeItemActive, tokens.itemActiveBackground);
 export var StyledTimeColumn = styled.div.withConfig({
     displayName: "TimePicker.styles__StyledTimeColumn",
-    componentId: "sc-45298523-4"
+    componentId: "sc-90a263ab-4"
 })([
     "max-height:",
-    ";overflow-y:scroll;flex:1;z-index:3;margin:calc(var(",
-    ") / 2);box-sizing:border-box;display:flex;flex-direction:column;gap:var(",
+    ";overflow-y:scroll;flex:1;z-index:3;box-sizing:border-box;display:flex;flex-direction:column;gap:var(",
     ");width:100%;&.",
     "{border:0.125rem solid var(",
     ");border-radius:var(",
-    ");}&::-webkit-scrollbar{width:var(",
-    ");height:var(",
-    ");}&::-webkit-scrollbar-track{background:var(",
-    ");border-radius:var(",
-    ");margin-top:var(",
-    ");margin-bottom:var(",
-    ");}&::-webkit-scrollbar-thumb{background:var(",
-    ");border-radius:var(",
-    ");}"
+    ");}scrollbar-width:none;-ms-overflow-style:none;&::-webkit-scrollbar{display:none;width:0;}"
 ], function(param) {
     var height = param.height;
     return height || "var(".concat(tokens.columnHeight, ")");
-}, tokens.scrollbarWidth, tokens.scrollbarWidth, classes.timeColumnActive, tokens.itemHoverBackground, tokens.itemBorderRadius, tokens.scrollbarWidth, tokens.scrollbarWidth, tokens.scrollbarTrackColor, tokens.scrollbarWidth, tokens.scrollbarMargin, tokens.scrollbarMargin, tokens.scrollbarColor, tokens.scrollbarWidth);
+}, tokens.scrollbarWidth, classes.timeColumnActive, tokens.itemHoverBackground, tokens.itemBorderRadius);
+export var CustomScrollbar = styled.div.withConfig({
+    displayName: "TimePicker.styles__CustomScrollbar",
+    componentId: "sc-90a263ab-5"
+})([
+    "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;}"
+], tokens.scrollbarMargin, tokens.scrollbarMargin, tokens.scrollbarWidth, classes.scrollbarVisible);
+export var ScrollbarTrack = styled.div.withConfig({
+    displayName: "TimePicker.styles__ScrollbarTrack",
+    componentId: "sc-90a263ab-6"
+})([
+    "position:relative;width:100%;height:100%;background:var(",
+    ");border-radius:var(",
+    ");"
+], tokens.scrollbarTrackColor, tokens.scrollbarWidth);
+export var ScrollbarThumb = styled.div.withConfig({
+    displayName: "TimePicker.styles__ScrollbarThumb",
+    componentId: "sc-90a263ab-7"
+})([
+    "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(",
+    ");}"
+], tokens.scrollbarColor, tokens.scrollbarWidth, tokens.scrollbarColor, tokens.scrollbarTrackColor);
+export var StyledEmpty = styled.div.withConfig({
+    displayName: "TimePicker.styles__StyledEmpty",
+    componentId: "sc-90a263ab-8"
+})([
+    "width:100%;height:0%.125rem;"
+]);

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

@@ -7,7 +7,10 @@ export var classes = {
     timeItemActive: 'plasma-time-picker-item-active',
     timePickerFullWidth: 'plasma-time-picker-full-width',
     timePickerActive: 'plasma-time-picker-active',
-    timeColumnActive: 'plasma-time-picker-column-active'
+    timeColumnActive: 'plasma-time-picker-column-active',
+    timeColumn: 'plasma-time-picker-column',
+    timeColumnScrolling: 'plasma-time-picker-column-scrolling',
+    scrollbarVisible: 'plasma-time-picker-scrollbar-visible'
 };
 export var tokens = {
     width: '--plasma-time-picker-width',
@@ -95,6 +98,7 @@ export var tokens = {
     textFieldContentRightSlotColor: '--plasma-time-picker-textfield__content-right-color',
     textFieldContentRightSlotColorHover: '--plasma-time-picker-textfield__content-right-color-hover',
     /** Прозрачность для всего компонента в состоянии disabled */ disabledOpacity: '--plasma-time-picker-disabled-opacity',
+    dropdownMarginTop: '--plasma-time-picker-dropdown-margin-top',
     timePickerBackground: '--plasma-time-picker-ui-background',
     timePickerBorderRadius: '--plasma-time-picker-ui-border-radius',
     timePickerWidth: '--plasma-time-picker-ui-width',

package/styled-components/es/components/Tooltip/Tooltip.styles.js

@@ -2,14 +2,16 @@ import styled from "styled-components";
 import { tokens } from "./Tooltip.tokens";
 export var TooltipRoot = styled.div.withConfig({
     displayName: "Tooltip.styles__TooltipRoot",
-    componentId: "sc-e6446bfb-0"
+    componentId: "sc-7a496a90-0"
 })([
-    "padding:var(",
+    "display:flex;align-items:center;padding:var(",
     ") var(",
     ") var(",
     ") var(",
     ");min-height:var(",
-    ");box-sizing:border-box;background-color:var(",
+    ");max-width:",
+    ";min-width:",
+    ";width:max-content;background-color:var(",
     ");border-radius:var(",
     ");box-shadow:var(",
     ");color:var(",
@@ -19,19 +21,17 @@ export var TooltipRoot = styled.div.withConfig({
     ");font-weight:var(",
     ");letter-spacing:var(",
     ");line-height:var(",
-    ");max-width:",
-    ";min-width:",
-    ";width:max-content;word-break:break-word;pointer-events:none;display:flex;align-items:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
-], tokens.paddingTop, tokens.paddingRight, tokens.paddingBottom, tokens.paddingLeft, tokens.minHeight, tokens.backgroundColor, tokens.borderRadius, tokens.boxShadow, tokens.color, tokens.textFontFamily, tokens.textFontSize, tokens.textFontStyle, tokens.textFontWeight, tokens.textFontLetterSpacing, tokens.textFontLineHeight, function(param) {
+    ");box-sizing:border-box;word-break:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
+], tokens.paddingTop, tokens.paddingRight, tokens.paddingBottom, tokens.paddingLeft, tokens.minHeight, function(param) {
     var maxWidth = param.maxWidth;
     return maxWidth || 'unset';
 }, function(param) {
     var minWidth = param.minWidth;
     return minWidth || 'unset';
-});
+}, tokens.backgroundColor, tokens.borderRadius, tokens.boxShadow, tokens.color, tokens.textFontFamily, tokens.textFontSize, tokens.textFontStyle, tokens.textFontWeight, tokens.textFontLetterSpacing, tokens.textFontLineHeight);
 export var StyledContentLeft = styled.div.withConfig({
     displayName: "Tooltip.styles__StyledContentLeft",
-    componentId: "sc-e6446bfb-1"
+    componentId: "sc-7a496a90-1"
 })([
     "display:flex;align-items:center;margin-right:var(",
     ");height:var(",

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

@@ -0,0 +1,7 @@
+import { component, mergeConfig } from "../../../engines";
+import { comboboxNewConfig } from "../../..";
+import { config } from "./Combobox.config";
+var mergedConfig = mergeConfig(comboboxNewConfig, config);
+var ComboboxComponent = component(mergedConfig);
+var Combobox = ComboboxComponent;
+export { Combobox };

package/types/components/Note/Note.d.ts

@@ -2,8 +2,8 @@ import React from 'react';
 import type { RootProps } from '../../engines';
 import type { NoteProps } from './Note.types';
 export declare const noteRoot: (Root: RootProps<HTMLDivElement, NoteProps>) => React.ForwardRefExoticComponent<{
-    title?: string;
-    text?: string;
+    title?: React.ReactNode;
+    text?: React.ReactNode;
     contentBefore?: React.ReactNode;
     contentBeforeSizing?: "fixed" | "scalable";
     stretch?: boolean;
@@ -18,8 +18,8 @@ export declare const noteConfig: {
     name: string;
     tag: string;
     layout: (Root: RootProps<HTMLDivElement, NoteProps>) => React.ForwardRefExoticComponent<{
-        title?: string;
-        text?: string;
+        title?: React.ReactNode;
+        text?: React.ReactNode;
         contentBefore?: React.ReactNode;
         contentBeforeSizing?: "fixed" | "scalable";
         stretch?: boolean;

package/types/components/Note/Note.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../../src/components/Note/Note.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAKxF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAe9C,eAAO,MAAM,QAAQ,SAAU,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;;;;;;;;;;;;+EAwJ9D,CAAC;AAEN,eAAO,MAAM,UAAU;;;mBA1JQ,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;CA2KlE,CAAC"}
+{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../../src/components/Note/Note.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAKxF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAe9C,eAAO,MAAM,QAAQ,SAAU,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;;;;;;;;;;;;+EAyJ9D,CAAC;AAEN,eAAO,MAAM,UAAU;;;mBA3JQ,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;CA4KlE,CAAC"}

package/types/components/Note/Note.types.d.ts

@@ -3,11 +3,11 @@ export type NoteProps = {
     /**
      * Заголовок к Note.
      */
-    title?: string;
+    title?: ReactNode;
     /**
      * Текст к Note.
      */
-    text?: string;
+    text?: ReactNode;
     /**
      * Слот под иконку слева от контента.
      */

package/types/components/Note/Note.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Note.types.d.ts","sourceRoot":"","sources":["../../../src/components/Note/Note.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,SAAS,GAAG;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3C;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC"}
+{"version":3,"file":"Note.types.d.ts","sourceRoot":"","sources":["../../../src/components/Note/Note.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,MAAM,SAAS,GAAG;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3C;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;CACnC,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC"}

package/types/components/TimePicker/TimePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAGvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAI7C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAuBrD,eAAO,MAAM,cAAc,SACjB,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,eAAe,EAAE,QAAQ,GAAG,cAAc,GAAG,UAAU,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;kBAA/C,MAAO,YAAY;mBAE/C,MAAO,YAAY;;;;iNA2crC,CAAC;AAEN,eAAO,MAAM,gBAAgB;;;mBA/cnB,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,eAAe,EAAE,QAAQ,GAAG,cAAc,GAAG,UAAU,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;sBAA/C,MAAO,YAAY;uBAE/C,MAAO,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;CAsezC,CAAC"}
+{"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAGpF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAI7C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAkCrD,eAAO,MAAM,cAAc,SACjB,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,eAAe,EAAE,QAAQ,GAAG,cAAc,GAAG,UAAU,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;kBAX5C,MAGtD,YAAW;mBAEO,MACd,YAAQ;;;;iNAixBP,CAAC;AAEN,eAAO,MAAM,gBAAgB;;;mBA9wBnB,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,eAAe,EAAE,QAAQ,GAAG,cAAc,GAAG,UAAU,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;sBAX5C,MAGtD,YAAW;uBAEO,MACd,YAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;CA4yBX,CAAC"}

package/types/components/TimePicker/TimePicker.styles.d.ts

@@ -1,7 +1,4 @@
-export declare const StyledPopover: import("@linaria/react").StyledComponent<{
-    align?: "left" | "right";
-    width?: string | number;
-} & import("../../engines/types").PropsType<import("../../engines/types").Variants> & import("react").HTMLAttributes<HTMLDivElement> & import("../Popover/Popover.types").CustomPopoverProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const StyledPopover: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../engines/types").PropsType<import("../../engines/types").Variants> & import("react").HTMLAttributes<HTMLDivElement> & import("../Popover/Popover.types").CustomPopoverProps & import("react").RefAttributes<HTMLDivElement>>;
 export declare const StyledInput: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../engines/types").PropsType<import("../../engines/types").Variants> & (({
     size?: string;
     view?: string;
@@ -307,4 +304,8 @@ export declare const StyledTimeItem: import("@linaria/react").StyledComponent<im
 export declare const StyledTimeColumn: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     height?: string | number;
 }>;
+export declare const CustomScrollbar: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const ScrollbarTrack: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const ScrollbarThumb: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
+export declare const StyledEmpty: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
 //# sourceMappingURL=TimePicker.styles.d.ts.map

package/types/components/TimePicker/TimePicker.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.styles.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,aAAa;YAA6B,MAAM,GAAG,OAAO;YAAU,MAAM,GAAG,MAAM;6OAAK,CAAC;AAGtG,eAAO,MAAM,WAAW;;;;;;;;kBAgFmD,MACnE,YAAI;mBAAqE,MAAO,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhFxC,CAAH;;;;;;;;;;;;wBA0EO,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBANpC,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhFxC,CAAH;;;;;;;;;;;;wBA0EO,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBANpC,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhFxC,CAAH;;;;;;;;;;;;wBA0EO,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBANpC,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhFxC,CAAH;;;;;;;;;;;;wBA0EO,YAAI;yBAA4E,YAChF;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;yIAO3C,CAAC;AAEF,eAAO,MAAM,IAAI,0CAmBhB,CAAC;AAEF,eAAO,MAAM,gBAAgB;YAAwB,MAAM,GAAG,MAAM;EAUnE,CAAC;AAEF,eAAO,MAAM,cAAc,qKAyB1B,CAAC;AAEF,eAAO,MAAM,gBAAgB;aAAyB,MAAM,GAAG,MAAM;EAiCpE,CAAC"}
+{"version":3,"file":"TimePicker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.styles.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,aAAa,mTAAoB,CAAC;AAG/C,eAAO,MAAM,WAAW;;;;;;;;kBAiFwB,MAAO,YAAY;mBACtB,MAAM,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhF5C,CAAC;;;;;;;;;;;;wBA0ED,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAN5C,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhF5C,CAAC;;;;;;;;;;;;wBA0ED,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAN5C,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhF5C,CAAC;;;;;;;;;;;;wBA0ED,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAN5C,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;oCAhF5C,CAAC;;;;;;;;;;;;wBA0ED,YAAY;yBAChB,YAAY;;;oCAKmC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;yIAOlG,CAAC;AAEF,eAAO,MAAM,IAAI,0CAoBhB,CAAC;AAEF,eAAO,MAAM,gBAAgB;YAAwB,MAAM,GAAG,MAAM;EAWnE,CAAC;AAEF,eAAO,MAAM,cAAc,qKA0B1B,CAAC;AAEF,eAAO,MAAM,gBAAgB;aAAyB,MAAM,GAAG,MAAM;EAuBpE,CAAC;AAEF,eAAO,MAAM,eAAe,qKAgB3B,CAAC;AAEF,eAAO,MAAM,cAAc,qKAM1B,CAAC;AAEF,eAAO,MAAM,cAAc,qKAiB1B,CAAC;AAEF,eAAO,MAAM,WAAW,qKAGvB,CAAC"}

package/types/components/TimePicker/TimePicker.tokens.d.ts

@@ -8,6 +8,9 @@ export declare const classes: {
     timePickerFullWidth: string;
     timePickerActive: string;
     timeColumnActive: string;
+    timeColumn: string;
+    timeColumnScrolling: string;
+    scrollbarVisible: string;
 };
 export declare const tokens: {
     width: string;
@@ -96,6 +99,7 @@ export declare const tokens: {
     textFieldContentRightSlotColorHover: string;
     /** Прозрачность для всего компонента в состоянии disabled */
     disabledOpacity: string;
+    dropdownMarginTop: string;
     timePickerBackground: string;
     timePickerBorderRadius: string;
     timePickerWidth: string;