@astral/ui 1.16.2 → 1.17.0

package/esm/Placeholder/Placeholder.d.ts

@@ -8,6 +8,14 @@ export declare type PlaceholderProps = {
      * Описание изображения
      */
     imgAlt: string;
+    /**
+     * ширина изображения
+     */
+    imgWidth?: string;
+    /**
+     * высота изображения
+     */
+    imgHeight?: string;
     /**
      * Заголовок
      */
@@ -21,4 +29,4 @@ export declare type PlaceholderProps = {
      */
     Actions?: ReactNode;
 };
-export declare const Placeholder: ({ title, imgSrc, imgAlt, description, Actions, }: PlaceholderProps) => JSX.Element;
+export declare const Placeholder: ({ title, imgSrc, imgAlt, imgWidth, imgHeight, description, Actions, }: PlaceholderProps) => JSX.Element;

package/esm/Placeholder/Placeholder.js

@@ -1,17 +1,5 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { PlaceholderActions, PlaceholderDescription, PlaceholderImage, PlaceholderInnerContainer, PlaceholderRoot, PlaceholderTitle, } from './styles';
-export var Placeholder = function (_a) {
-    var title = _a.title, imgSrc = _a.imgSrc, imgAlt = _a.imgAlt, description = _a.description, Actions = _a.Actions;
-    return (_jsxs(PlaceholderRoot, { children: [_jsxs(PlaceholderInnerContainer, { children: [_jsx(PlaceholderImage, { src: imgSrc, alt: imgAlt }), _jsx(PlaceholderTitle, __assign({ variant: "h4" }, { children: title })), description && (_jsx(PlaceholderDescription, __assign({ variant: "ui" }, { children: description })))] }), Actions && _jsx(PlaceholderActions, { children: Actions })] }));
+export const Placeholder = ({ title, imgSrc, imgAlt, imgWidth, imgHeight, description, Actions, }) => {
+    return (_jsxs(PlaceholderRoot, { children: [_jsxs(PlaceholderInnerContainer, { children: [_jsx(PlaceholderImage, { src: imgSrc, alt: imgAlt, width: imgWidth, height: imgHeight }), _jsx(PlaceholderTitle, Object.assign({ variant: "h4" }, { children: title })), description && (_jsx(PlaceholderDescription, Object.assign({ variant: "ui" }, { children: description })))] }), Actions && _jsx(PlaceholderActions, { children: Actions })] }));
 };

package/esm/Placeholder/styles.js

@@ -1,76 +1,70 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import { styled } from '../styles';
 import { Typography } from '../Typography';
-export var PlaceholderRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.background.paper;
-});
-export var PlaceholderInnerContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 384px;\n"], ["\n  max-width: 384px;\n"])));
-export var PlaceholderImage = styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto auto ", ";\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n  }\n"], ["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto auto ", ";\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(6);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.breakpoints.up('sm');
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(8);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[900];
-});
-export var PlaceholderTitle = styled(Typography)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-bottom: ", ";\n\n  color: ", ";\n  font-weight: ", ";\n\n  text-align: center;\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n    font-weight: ", ";\n  }\n"], ["\n  margin-bottom: ", ";\n\n  color: ", ";\n  font-weight: ", ";\n\n  text-align: center;\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n    font-weight: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(6);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[700];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.fontWeightRegular;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.breakpoints.up('sm');
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[900];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.fontWeightMedium;
-});
-export var PlaceholderDescription = styled(Typography)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  color: ", ";\n\n  text-align: center;\n\n  ", " {\n    color: ", ";\n  }\n"], ["\n  display: block;\n\n  color: ", ";\n\n  text-align: center;\n\n  ", " {\n    color: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[700];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.breakpoints.up('sm');
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[900];
-});
-export var PlaceholderActions = styled.footer(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n\n  ", " {\n    margin-bottom: ", ";\n\n    color: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(6);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.breakpoints.up('sm');
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(5);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[900];
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+export const PlaceholderRoot = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  padding: ${({ theme }) => theme.spacing(4)};
+
+  background-color: ${({ theme }) => theme.palette.background.paper};
+`;
+export const PlaceholderInnerContainer = styled.div `
+  max-width: 384px;
+`;
+export const PlaceholderImage = styled.img `
+  display: block;
+  width: ${({ width }) => width || '100%'};
+  height: ${({ height }) => height || 'auto'};
+  margin: auto auto ${({ theme }) => theme.spacing(6)};
+  object-fit: contain;
+
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    margin-bottom: ${({ theme }) => theme.spacing(8)};
+
+    color: ${({ theme }) => theme.palette.grey[900]};
+  }
+`;
+export const PlaceholderTitle = styled(Typography) `
+  margin-bottom: ${({ theme }) => theme.spacing(6)};
+
+  color: ${({ theme }) => theme.palette.grey[700]};
+  font-weight: ${({ theme }) => theme.typography.fontWeightRegular};
+
+  text-align: center;
+
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    margin-bottom: ${({ theme }) => theme.spacing(4)};
+
+    color: ${({ theme }) => theme.palette.grey[900]};
+    font-weight: ${({ theme }) => theme.typography.fontWeightMedium};
+  }
+`;
+export const PlaceholderDescription = styled(Typography) `
+  display: block;
+
+  color: ${({ theme }) => theme.palette.grey[700]};
+
+  text-align: center;
+
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    color: ${({ theme }) => theme.palette.grey[900]};
+  }
+`;
+export const PlaceholderActions = styled.footer `
+  display: flex;
+  flex-wrap: wrap;
+
+  gap: ${({ theme }) => theme.spacing(1)};
+  justify-content: center;
+
+  margin-top: ${({ theme }) => theme.spacing(6)};
+
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    margin-bottom: ${({ theme }) => theme.spacing(5)};
+
+    color: ${({ theme }) => theme.palette.grey[900]};
+  }
+`;

package/esm/Product/Product.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -23,8 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { Button } from '../Button';
-export var Product = forwardRef(function (props, ref) {
-    var Logo = props.logo, name = props.name, _a = props.variant, variant = _a === void 0 ? 'text' : _a, restProps = __rest(props, ["logo", "name", "variant"]);
-    return (_jsx(Button, __assign({ ref: ref }, restProps, { variant: variant, startIcon: _jsx(Logo, {}) }, { children: name })));
+export const Product = forwardRef((props, ref) => {
+    const { logo: Logo, name, variant = 'text' } = props, restProps = __rest(props, ["logo", "name", "variant"]);
+    return (_jsx(Button, Object.assign({ ref: ref }, restProps, { variant: variant, startIcon: _jsx(Logo, {}) }, { children: name })));
 });
 export default Product;

package/esm/Profile/Profile.js

@@ -1,23 +1,12 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { Avatar, ClickAwayListener } from '@mui/material';
 import { useMenu } from '../hooks';
 import { Chevron } from '../Chevron';
 import { ProfileAnnotation, ProfileCredentials, ProfileDisplayName, ProfileRoot, ProfileUser, } from './styled';
-export var Profile = forwardRef(function (props, ref) {
-    var displayName = props.displayName, annotation = props.annotation, _a = props.avatar, avatar = _a === void 0 ? {} : _a, Menu = props.menu;
-    var _b = useMenu(), open = _b.open, anchorRef = _b.anchorRef, handleOpenMenu = _b.handleOpenMenu, handleCloseMenu = _b.handleCloseMenu;
-    return (_jsxs(_Fragment, { children: [_jsx(ClickAwayListener, __assign({ ref: ref, onClickAway: handleCloseMenu }, { children: _jsxs(ProfileRoot, __assign({ ref: anchorRef, variant: "text", onClick: handleOpenMenu }, { children: [_jsxs(ProfileUser, { children: [_jsxs(ProfileCredentials, { children: [_jsx(ProfileDisplayName, { children: displayName }), _jsx(ProfileAnnotation, { children: annotation })] }), _jsx(Avatar, __assign({}, avatar))] }), _jsx(Chevron, { isActive: open })] })) })), _jsx(Menu, { open: open, anchorEl: anchorRef.current, onClose: handleCloseMenu })] }));
+export const Profile = forwardRef((props, ref) => {
+    const { displayName, annotation, avatar = {}, menu: Menu } = props;
+    const { open, anchorRef, handleOpenMenu, handleCloseMenu } = useMenu();
+    return (_jsxs(_Fragment, { children: [_jsx(ClickAwayListener, Object.assign({ ref: ref, onClickAway: handleCloseMenu }, { children: _jsxs(ProfileRoot, Object.assign({ ref: anchorRef, variant: "text", onClick: handleOpenMenu }, { children: [_jsxs(ProfileUser, { children: [_jsxs(ProfileCredentials, { children: [_jsx(ProfileDisplayName, { children: displayName }), _jsx(ProfileAnnotation, { children: annotation })] }), _jsx(Avatar, Object.assign({}, avatar))] }), _jsx(Chevron, { isActive: open })] })) })), _jsx(Menu, { open: open, anchorEl: anchorRef.current, onClose: handleCloseMenu })] }));
 });
 export default Profile;

package/esm/Profile/styled.js

@@ -1,36 +1,32 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import { Button } from '../Button';
 import { styled } from '../styles';
-export var ProfileRoot = styled(Button)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  height: auto;\n  padding: ", ";\n\n  text-align: right;\n"], ["\n  display: flex;\n  align-items: center;\n  height: auto;\n  padding: ", ";\n\n  text-align: right;\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(0.5, 0.5, 0.5, 2);
-});
-export var ProfileUser = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  gap: ", ";\n  align-items: center;\n"], ["\n  display: flex;\n  gap: ", ";\n  align-items: center;\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(2);
-});
-export var ProfileCredentials = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n"], ["\n  display: block;\n"])));
-export var ProfileDisplayName = styled.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: block;\n\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n"], ["\n  display: block;\n\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.typography.fontWeightBold;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.pxToRem(12);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.pxToRem(14);
-});
-export var ProfileAnnotation = styled.span(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  color: ", ";\n  font-size: ", ";\n  line-height: ", ";\n"], ["\n  display: block;\n\n  color: ", ";\n  font-size: ", ";\n  line-height: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[500];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.pxToRem(12);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.typography.pxToRem(16);
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+export const ProfileRoot = styled(Button) `
+  display: flex;
+  align-items: center;
+  height: auto;
+  padding: ${({ theme }) => theme.spacing(0.5, 0.5, 0.5, 2)};
+
+  text-align: right;
+`;
+export const ProfileUser = styled.div `
+  display: flex;
+  gap: ${({ theme }) => theme.spacing(2)};
+  align-items: center;
+`;
+export const ProfileCredentials = styled.div `
+  display: block;
+`;
+export const ProfileDisplayName = styled.span `
+  display: block;
+
+  font-weight: ${({ theme }) => theme.typography.fontWeightBold};
+  font-size: ${({ theme }) => theme.typography.pxToRem(12)};
+  line-height: ${({ theme }) => theme.typography.pxToRem(14)};
+`;
+export const ProfileAnnotation = styled.span `
+  display: block;
+
+  color: ${({ theme }) => theme.palette.grey[500]};
+  font-size: ${({ theme }) => theme.typography.pxToRem(12)};
+  line-height: ${({ theme }) => theme.typography.pxToRem(16)};
+`;

package/esm/Radio/Icon.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -22,11 +11,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { SvgIcon } from '@mui/material';
-export var DefaultIcon = function (_a) {
+export const DefaultIcon = (_a) => {
     var props = __rest(_a, []);
-    return (_jsxs(SvgIcon, __assign({ viewBox: "0 0 24 24" }, props, { children: [_jsx("circle", { cx: "12", cy: "12", r: "7", fill: "#DDE2E8" }), _jsx("circle", { cx: "12", cy: "12", r: "5" })] })));
+    return (_jsxs(SvgIcon, Object.assign({ viewBox: "0 0 24 24" }, props, { children: [_jsx("circle", { cx: "12", cy: "12", r: "7", fill: "#DDE2E8" }), _jsx("circle", { cx: "12", cy: "12", r: "5" })] })));
 };
-export var CheckedCircleIcon = function (_a) {
+export const CheckedCircleIcon = (_a) => {
     var props = __rest(_a, []);
-    return (_jsxs(SvgIcon, __assign({ viewBox: "0 0 24 24" }, props, { children: [_jsx("circle", { cx: "12", cy: "12", r: "7" }), _jsx("circle", { cx: "12", cy: "12", r: "2", fill: "#FAFBFC" }), _jsx("path", { d: "M0 0V-1H-1V0H0ZM24 0H25V-1H24V0ZM24 24V25H25V24H24ZM0 24H-1V25H0V24ZM0 1H24V-1H0V1ZM23 0V24H25V0H23ZM24 23H0V25H24V23ZM1 24V0H-1V24H1Z", fill: "#E64343" })] })));
+    return (_jsxs(SvgIcon, Object.assign({ viewBox: "0 0 24 24" }, props, { children: [_jsx("circle", { cx: "12", cy: "12", r: "7" }), _jsx("circle", { cx: "12", cy: "12", r: "2", fill: "#FAFBFC" }), _jsx("path", { d: "M0 0V-1H-1V0H0ZM24 0H25V-1H24V0ZM24 24V25H25V24H24ZM0 24H-1V25H0V24ZM0 1H24V-1H0V1ZM23 0V24H25V0H23ZM24 23H0V25H24V23ZM1 24V0H-1V24H1Z", fill: "#E64343" })] })));
 };

package/esm/Radio/Radio.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { RadioProps } from './types';
-export declare const Radio: React.ForwardRefExoticComponent<Pick<RadioProps, "disabled" | "icon" | "action" | "translate" | "onFocusVisible" | "tabIndex" | "className" | "form" | "slot" | "style" | "title" | "key" | "css" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "required" | "inputProps" | "inputRef" | "readOnly" | "checkedIcon" | "checked" | "edge"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Radio: React.ForwardRefExoticComponent<Pick<RadioProps, "disabled" | "icon" | "action" | "translate" | "onFocusVisible" | "tabIndex" | "className" | "form" | "slot" | "style" | "title" | "key" | "css" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "readOnly" | "required" | "inputProps" | "inputRef" | "checkedIcon" | "checked" | "edge"> & React.RefAttributes<HTMLButtonElement>>;
 export default Radio;

package/esm/Radio/Radio.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -24,8 +13,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { StyledRadio } from './styled';
 import { CheckedCircleIcon, DefaultIcon } from './Icon';
-export var Radio = React.forwardRef(function (_a, ref) {
-    var _b = _a.icon, icon = _b === void 0 ? _jsx(DefaultIcon, {}) : _b, _c = _a.checkedIcon, checkedIcon = _c === void 0 ? _jsx(CheckedCircleIcon, {}) : _c, props = __rest(_a, ["icon", "checkedIcon"]);
-    return (_jsx(StyledRadio, __assign({ icon: icon, checkedIcon: checkedIcon, ref: ref }, props)));
+export const Radio = React.forwardRef((_a, ref) => {
+    var { icon = _jsx(DefaultIcon, {}), checkedIcon = _jsx(CheckedCircleIcon, {}) } = _a, props = __rest(_a, ["icon", "checkedIcon"]);
+    return (_jsx(StyledRadio, Object.assign({ icon: icon, checkedIcon: checkedIcon, ref: ref }, props)));
 });
 export default Radio;

package/esm/Radio/styled.js

@@ -1,32 +1,43 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import { Radio } from '@mui/material';
 import { styled } from '../styles';
-export var StyledRadio = styled(Radio)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: 5px;\n\n  color: ", ";\n\n  border-radius: unset;\n\n  &:hover {\n    background: none;\n\n    & > svg {\n      color: ", ";\n    }\n  }\n\n  &.Mui-disabled:not(.Mui-checked) {\n    color: ", ";\n\n    & > svg {\n      color: ", ";\n    }\n  }\n\n  &.Mui-checked {\n    color: ", ";\n\n    &:hover {\n      & > svg {\n        color: ", ";\n      }\n    }\n\n    &.Mui-disabled {\n      color: ", ";\n    }\n\n    & > svg > path {\n      fill: ", ";\n    }\n  }\n"], ["\n  padding: 5px;\n\n  color: ", ";\n\n  border-radius: unset;\n\n  &:hover {\n    background: none;\n\n    & > svg {\n      color: ", ";\n    }\n  }\n\n  &.Mui-disabled:not(.Mui-checked) {\n    color: ", ";\n\n    & > svg {\n      color: ", ";\n    }\n  }\n\n  &.Mui-checked {\n    color: ", ";\n\n    &:hover {\n      & > svg {\n        color: ", ";\n      }\n    }\n\n    &.Mui-disabled {\n      color: ", ";\n    }\n\n    & > svg > path {\n      fill: ", ";\n    }\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.palette.background.default;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[200];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[200];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[300];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.primary.main;
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.primary[700];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey[500];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.common.white;
-});
-var templateObject_1;
+export const StyledRadio = styled(Radio) `
+  padding: 5px;
+
+  color: ${({ theme }) => theme.palette.background.default};
+
+  border-radius: unset;
+
+  &:hover {
+    background: none;
+
+    & > svg {
+      color: ${({ theme }) => theme.palette.grey[200]};
+    }
+  }
+
+  &.Mui-disabled:not(.Mui-checked) {
+    color: ${({ theme }) => theme.palette.grey[200]};
+
+    & > svg {
+      color: ${({ theme }) => theme.palette.grey[300]};
+    }
+  }
+
+  &.Mui-checked {
+    color: ${({ theme }) => theme.palette.primary.main};
+
+    &:hover {
+      & > svg {
+        color: ${({ theme }) => theme.palette.primary[700]};
+      }
+    }
+
+    &.Mui-disabled {
+      color: ${({ theme }) => theme.palette.grey[500]};
+    }
+
+    & > svg > path {
+      fill: ${({ theme }) => theme.palette.common.white};
+    }
+  }
+`;

package/esm/Select/Select.js

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -28,13 +17,13 @@ import { Tag } from '../Tag';
 import { CircularProgress } from '../CircularProgress';
 import { MenuItem } from '../MenuItem';
 import { Placeholder, ProgressWrapper, TagsWrapper } from './styled';
-export var Select = function (_a) {
-    var multiple = _a.multiple, loading = _a.loading, placeholder = _a.placeholder, _b = _a.getOptionLabel, getOptionLabel = _b === void 0 ? function (value) { return value; } : _b, helperText = _a.helperText, success = _a.success, children = _a.children, label = _a.label, error = _a.error, props = __rest(_a, ["multiple", "loading", "placeholder", "getOptionLabel", "helperText", "success", "children", "label", "error"]);
+export const Select = (_a) => {
+    var { multiple, loading, placeholder, getOptionLabel = (value) => value, helperText, success, children, label, error } = _a, props = __rest(_a, ["multiple", "loading", "placeholder", "getOptionLabel", "helperText", "success", "children", "label", "error"]);
     // unknown, т.к. ts ругается на несоответствие типов. По-умолчанию в selectedOptions string или string[].
-    var renderValue = function (selectedOptions) {
+    const renderValue = (selectedOptions) => {
         if (Array.isArray(selectedOptions) && selectedOptions.length) {
-            return (_jsx(TagsWrapper, { children: selectedOptions.map(function (option) {
-                    var optionLabel = getOptionLabel(option);
+            return (_jsx(TagsWrapper, { children: selectedOptions.map((option) => {
+                    const optionLabel = getOptionLabel(option);
                     return _jsx(Tag, { color: "grey", label: optionLabel }, option);
                 }) }));
         }
@@ -44,6 +33,7 @@ export var Select = function (_a) {
         }
         return getOptionLabel(selectedOptions);
     };
-    var isNoData = !Boolean(React.Children.count(children));
-    return (_jsxs(TextField, __assign({ select: true, label: label, helperText: helperText, error: error, success: success, SelectProps: __assign(__assign({}, props), { multiple: multiple, renderValue: renderValue, displayEmpty: true, IconComponent: ChevronDOutlineMd }) }, { children: [_jsx(Placeholder, __assign({ value: "" }, { children: "placeholder" })), loading && (_jsx(ProgressWrapper, { children: _jsx(CircularProgress, { color: "primary" }) })), !loading && children, !loading && isNoData && _jsx(MenuItem, __assign({ disabled: true }, { children: "\u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445" }))] })));
+    const isNoData = !Boolean(React.Children.count(children));
+    return (_jsxs(TextField, Object.assign({ select: true, label: label, helperText: helperText, error: error, success: success, SelectProps: Object.assign(Object.assign({}, props), { multiple,
+            renderValue, displayEmpty: true, IconComponent: ChevronDOutlineMd }) }, { children: [_jsx(Placeholder, Object.assign({ value: "" }, { children: "placeholder" })), loading && (_jsx(ProgressWrapper, { children: _jsx(CircularProgress, { color: "primary" }) })), !loading && children, !loading && isNoData && _jsx(MenuItem, Object.assign({ disabled: true }, { children: "\u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445" }))] })));
 };

package/esm/Select/styled.js

@@ -1,31 +1,36 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import { styled } from '../styles';
 import { MenuItem } from '../MenuItem';
-export var TagsWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n  margin-bottom: -", ";\n\n  .MuiChip-root {\n    margin-bottom: ", ";\n\n    background-color: ", ";\n  }\n\n  .MuiChip-root:hover {\n    background-color: ", ";\n  }\n\n  .MuiChip-root:not(:last-of-type) {\n    margin-right: ", ";\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n  margin-bottom: -", ";\n\n  .MuiChip-root {\n    margin-bottom: ", ";\n\n    background-color: ", ";\n  }\n\n  .MuiChip-root:hover {\n    background-color: ", ";\n  }\n\n  .MuiChip-root:not(:last-of-type) {\n    margin-right: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey['300'];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey['300'];
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-});
-export var ProgressWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  min-height: 64px;\n\n  .MuiCircularProgress-root {\n    margin-top: ", ";\n\n    color: ", ";\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  min-height: 64px;\n\n  .MuiCircularProgress-root {\n    margin-top: ", ";\n\n    color: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(5);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.grey['900'];
-});
-export var Placeholder = styled(MenuItem)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: none;\n"], ["\n  display: none;\n"])));
-var templateObject_1, templateObject_2, templateObject_3;
+export const TagsWrapper = styled.div `
+  display: flex;
+  flex-wrap: wrap;
+  margin-bottom: -${({ theme }) => theme.spacing(1)};
+
+  .MuiChip-root {
+    margin-bottom: ${({ theme }) => theme.spacing(1)};
+
+    background-color: ${({ theme }) => theme.palette.grey['300']};
+  }
+
+  .MuiChip-root:hover {
+    background-color: ${({ theme }) => theme.palette.grey['300']};
+  }
+
+  .MuiChip-root:not(:last-of-type) {
+    margin-right: ${({ theme }) => theme.spacing(1)};
+  }
+`;
+export const ProgressWrapper = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-height: 64px;
+
+  .MuiCircularProgress-root {
+    margin-top: ${({ theme }) => theme.spacing(5)};
+
+    color: ${({ theme }) => theme.palette.grey['900']};
+  }
+`;
+export const Placeholder = styled(MenuItem) `
+  display: none;
+`;