@astral/ui 4.0.0-alpha.35 → 4.0.0-alpha.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/components/Switch/Switch.d.ts +10 -1
  2. package/components/Switch/Switch.js +19 -2
  3. package/components/Switch/styles.js +5 -3
  4. package/components/declaration/emotion.d.ts +6 -0
  5. package/components/declaration/mui-material.d.ts +20 -0
  6. package/components/index.d.ts +1 -0
  7. package/components/index.js +1 -0
  8. package/components/theme/components/MuiSwitch.js +5 -5
  9. package/node/components/Switch/Switch.d.ts +10 -1
  10. package/node/components/Switch/Switch.js +19 -2
  11. package/node/components/Switch/styles.js +5 -3
  12. package/node/components/index.d.ts +1 -0
  13. package/node/components/index.js +4 -1
  14. package/node/components/theme/components/MuiSwitch.js +5 -5
  15. package/package.json +1 -1
package/components/Switch/Switch.d.ts CHANGED
@@ -1,5 +1,14 @@
1
1
  /// <reference types="react" />
2
2
  import { type SwitchProps as MuiSwitchProps } from '@mui/material';
3
3
  import { type WithoutEmotionSpecific } from '../types';
4
- export type SwitchProps = WithoutEmotionSpecific<MuiSwitchProps>;
4
+ export type SwitchProps = WithoutEmotionSpecific<MuiSwitchProps> & {
5
+ /**
6
+ * Текст поля
7
+ */
8
+ label?: string;
9
+ /**
10
+ * Расположение текста
11
+ */
12
+ labelPlacement?: 'end' | 'start' | 'top' | 'bottom';
13
+ };
5
14
  export declare const Switch: import("react").ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
package/components/Switch/Switch.js CHANGED
@@ -1,6 +1,23 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
1
12
  import { jsx as _jsx } from "react/jsx-runtime";
2
13
  import { forwardRef } from 'react';
14
+ import { FormControlLabel } from '../FormControlLabel';
15
+ import { Typography } from '../Typography';
3
16
  import { StyledSwitch } from './styles';
4
- export const Switch = forwardRef((props, ref) => {
5
- return _jsx(StyledSwitch, Object.assign({ ref: ref }, props));
17
+ export const Switch = forwardRef((_a, ref) => {
18
+ var { label, labelPlacement } = _a, restProps = __rest(_a, ["label", "labelPlacement"]);
19
+ if (label) {
20
+ return (_jsx(FormControlLabel, { control: _jsx(StyledSwitch, Object.assign({ ref: ref }, restProps)), label: _jsx(Typography, { variant: "body1", component: "span", children: label }), labelPlacement: labelPlacement }));
21
+ }
22
+ return _jsx(StyledSwitch, Object.assign({ ref: ref }, restProps));
6
23
  });
package/components/Switch/styles.js CHANGED
@@ -1,9 +1,7 @@
1
1
  import { Switch as MuiSwitch, switchClasses } from '@mui/material';
2
2
  import { styled } from '../styles';
3
3
  export const StyledSwitch = styled(MuiSwitch) `
4
- .Mui-focusVisible {
5
- border: 2px solid ${({ theme }) => theme.palette.components.focused};
6
- }
4
+
7
5
  ${`.${switchClasses.track}`}::before {
8
6
  display: none;
9
7
  }
@@ -11,4 +9,8 @@ export const StyledSwitch = styled(MuiSwitch) `
11
9
  ${`.${switchClasses.track}`}::after {
12
10
  display: none;
13
11
  }
12
+
13
+ ${({ theme }) => theme.breakpoints.down('sm')} {
14
+ margin: ${({ theme }) => theme.microSpacing(3, 0)};
15
+ }
14
16
  `;
package/components/declaration/emotion.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import '@emotion/react';
2
+ import { type Theme as UIKitTheme } from '../theme';
3
+
4
+ declare module '@emotion/react' {
5
+ export interface Theme extends UIKitTheme {}
6
+ }
package/components/declaration/mui-material.d.ts ADDED
@@ -0,0 +1,20 @@
1
+ import { type Theme as MuiTheme } from '@mui/material/styles';
2
+
3
+ import {
4
+ type Elevation,
5
+ type Palette,
6
+ type Shape,
7
+ type MicroSpacing,
8
+ } from '../theme';
9
+ import { type TypographyThemeOptions } from '../theme/typography';
10
+
11
+ declare module '@mui/material/styles' {
12
+ export interface Theme
13
+ extends Omit<MuiTheme, 'shadows' | 'palette' | 'shape' | 'typography'> {
14
+ elevation: Elevation;
15
+ palette: Palette;
16
+ shape: Shape;
17
+ typography: TypographyThemeOptions;
18
+ microSpacing: MicroSpacing;
19
+ }
20
+ }
package/components/index.d.ts CHANGED
@@ -132,6 +132,7 @@ export { StepperWizard, type StepperWizardProps, type StepWizard, } from './Step
132
132
  export { StepSlider, type StepSliderProps } from './StepSlider';
133
133
  export * from './StylesCacheProvider';
134
134
  export * from './Switch';
135
+ export { SvgIcon, type SvgIconProps, type SvgIconColor, svgIconClassnames, } from './SvgIcon';
135
136
  export { SecondsCountdown as UNSTABLE_SecondsCountdownService } from './services';
136
137
  export * from './styles';
137
138
  export * from './Tabs';
package/components/index.js CHANGED
@@ -132,6 +132,7 @@ export { StepperWizard, } from './StepperWizard';
132
132
  export { StepSlider } from './StepSlider';
133
133
  export * from './StylesCacheProvider';
134
134
  export * from './Switch';
135
+ export { SvgIcon, svgIconClassnames, } from './SvgIcon';
135
136
  // biome-ignore lint/style/useNamingConvention: <Может использоваться продуктами>
136
137
  export { SecondsCountdown as UNSTABLE_SecondsCountdownService } from './services';
137
138
  export * from './styles';
package/components/theme/components/MuiSwitch.js CHANGED
@@ -26,7 +26,7 @@ export const MuiSwitch = {
26
26
  '& :not(.Mui-checked).MuiSwitch-switchBase': {
27
27
  padding: 0,
28
28
  '& + .MuiSwitch-track': {
29
- backgroundColor: theme.palette.grey[700],
29
+ backgroundColor: theme.palette.grey[500],
30
30
  opacity: 1,
31
31
  },
32
32
  },
@@ -36,7 +36,7 @@ export const MuiSwitch = {
36
36
  },
37
37
  // NOT CHECKED HOVER
38
38
  '& :not(.Mui-checked):hover + .MuiSwitch-track': {
39
- backgroundColor: theme.palette.grey[500],
39
+ backgroundColor: theme.palette.grey[600],
40
40
  },
41
41
  // DISABLED TRACK
42
42
  '& .MuiButtonBase-root.MuiSwitch-switchBase.Mui-disabled': {
@@ -50,9 +50,9 @@ export const MuiSwitch = {
50
50
  },
51
51
  },
52
52
  },
53
- // ACTIVE TRACK
54
- '& :not(.Mui-disabled):active + .MuiSwitch-track': {
55
- border: `2px solid ${theme.palette.components.focused}`,
53
+ // FOCUS
54
+ '& .Mui-focusVisible + .MuiSwitch-track': {
55
+ outline: `2px solid ${theme.palette.components.focused}`,
56
56
  },
57
57
  };
58
58
  },
package/node/components/Switch/Switch.d.ts CHANGED
@@ -1,5 +1,14 @@
1
1
  /// <reference types="react" />
2
2
  import { type SwitchProps as MuiSwitchProps } from '@mui/material';
3
3
  import { type WithoutEmotionSpecific } from '../types';
4
- export type SwitchProps = WithoutEmotionSpecific<MuiSwitchProps>;
4
+ export type SwitchProps = WithoutEmotionSpecific<MuiSwitchProps> & {
5
+ /**
6
+ * Текст поля
7
+ */
8
+ label?: string;
9
+ /**
10
+ * Расположение текста
11
+ */
12
+ labelPlacement?: 'end' | 'start' | 'top' | 'bottom';
13
+ };
5
14
  export declare const Switch: import("react").ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
package/node/components/Switch/Switch.js CHANGED
@@ -1,9 +1,26 @@
1
1
  "use strict";
2
+ var __rest = (this && this.__rest) || function (s, e) {
3
+ var t = {};
4
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
2
13
  Object.defineProperty(exports, "__esModule", { value: true });
3
14
  exports.Switch = void 0;
4
15
  const jsx_runtime_1 = require("react/jsx-runtime");
5
16
  const react_1 = require("react");
17
+ const FormControlLabel_1 = require("../FormControlLabel");
18
+ const Typography_1 = require("../Typography");
6
19
  const styles_1 = require("./styles");
7
- exports.Switch = (0, react_1.forwardRef)((props, ref) => {
8
- return (0, jsx_runtime_1.jsx)(styles_1.StyledSwitch, Object.assign({ ref: ref }, props));
20
+ exports.Switch = (0, react_1.forwardRef)((_a, ref) => {
21
+ var { label, labelPlacement } = _a, restProps = __rest(_a, ["label", "labelPlacement"]);
22
+ if (label) {
23
+ return ((0, jsx_runtime_1.jsx)(FormControlLabel_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(styles_1.StyledSwitch, Object.assign({ ref: ref }, restProps)), label: (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "body1", component: "span", children: label }), labelPlacement: labelPlacement }));
24
+ }
25
+ return (0, jsx_runtime_1.jsx)(styles_1.StyledSwitch, Object.assign({ ref: ref }, restProps));
9
26
  });
package/node/components/Switch/styles.js CHANGED
@@ -4,9 +4,7 @@ exports.StyledSwitch = void 0;
4
4
  const material_1 = require("@mui/material");
5
5
  const styles_1 = require("../styles");
6
6
  exports.StyledSwitch = (0, styles_1.styled)(material_1.Switch) `
7
- .Mui-focusVisible {
8
- border: 2px solid ${({ theme }) => theme.palette.components.focused};
9
- }
7
+
10
8
  ${`.${material_1.switchClasses.track}`}::before {
11
9
  display: none;
12
10
  }
@@ -14,4 +12,8 @@ exports.StyledSwitch = (0, styles_1.styled)(material_1.Switch) `
14
12
  ${`.${material_1.switchClasses.track}`}::after {
15
13
  display: none;
16
14
  }
15
+
16
+ ${({ theme }) => theme.breakpoints.down('sm')} {
17
+ margin: ${({ theme }) => theme.microSpacing(3, 0)};
18
+ }
17
19
  `;
package/node/components/index.d.ts CHANGED
@@ -132,6 +132,7 @@ export { StepperWizard, type StepperWizardProps, type StepWizard, } from './Step
132
132
  export { StepSlider, type StepSliderProps } from './StepSlider';
133
133
  export * from './StylesCacheProvider';
134
134
  export * from './Switch';
135
+ export { SvgIcon, type SvgIconProps, type SvgIconColor, svgIconClassnames, } from './SvgIcon';
135
136
  export { SecondsCountdown as UNSTABLE_SecondsCountdownService } from './services';
136
137
  export * from './styles';
137
138
  export * from './Tabs';
package/node/components/index.js CHANGED
@@ -16,7 +16,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  exports.useFileUploader = exports.PreviewFileUploaderFile = exports.PreviewFileUploaderDropZone = exports.PreviewFileUploader = exports.FileUploaderFile = exports.FileUploaderDropzone = exports.FileUploader = exports.Filename = exports.Fieldset = exports.Grow = exports.Slide = exports.Zoom = exports.Fade = exports.expansionPanelClassnames = exports.ExpansionPanel = exports.EmailOrPhoneField = exports.EmailField = exports.DescriptionList = exports.DescriptionCell = exports.datePickerClassnames = exports.DatePicker = exports.DataGridMinimalisticPagination = exports.DataGridActionCell = exports.SidebarContext = exports.SidebarSkeleton = exports.DashboardContext = exports.SidebarPopover = exports.SidebarCounter = exports.SidebarButton = exports.MenuSidebarButton = exports.DashboardLayout = exports.DashboardAlert = exports.Counter = exports.CopyTypography = exports.ConfirmAction = exports.ComplianceStatus = exports.CodeField = exports.BulletListItem = exports.BulletListInlineItem = exports.BulletList = exports.Breadcrumbs = exports.AvatarGroup = exports.Avatar = exports.AutoSaveIndicator = exports.AsyncAutocomplete = exports.Alert = exports.alertClassnames = exports.AddressAutocomplete = exports.useMainActions = exports.ActionGroup = void 0;
18
18
  exports.SearchField = exports.ScrollToTopButton = exports.RadioGroup = exports.RadioField = exports.radioCardClassnames = exports.RadioCard = exports.Radio = exports.radioClassnames = exports.Placeholder = exports.LoadingPlaceholder = exports.useHidePersonalData = exports.PersonalData = exports.Pagination = exports.pageHeaderClassnames = exports.pageContentClassnames = exports.PagePinnableAside = exports.PageLayoutLoader = exports.PageLayoutFooter = exports.PageLayoutContainer = exports.PageLayout = exports.PageHeader = exports.PageContextProvider = exports.PageContext = exports.PageContentHeaderActions = exports.PageContentHeader = exports.PageContent = exports.PageAsideBlock = exports.PageAside = exports.PageAlert = exports.PageActions = exports.PageActionSkeleton = exports.NumberField = exports.NumberedListItem = exports.NumberedList = exports.notFoundPageClassnames = exports.NotFoundPage = exports.MenuOrganizationSkeleton = exports.MenuOrganization = exports.DateRangePicker = exports.DataGridInfinite = exports.DataGrid = exports.MinimalisticPagination = exports.loaderClassnames = exports.Loader = exports.Link = exports.InfiniteDataList = exports.Iframe = exports.HintIcon = exports.GuidTypography = exports.usePreviewFileUploader = void 0;
19
- exports.WelcomeScreen = exports.redirectToLink = exports.createUIKitClassname = exports.classNames = exports.TreeLikeList = exports.TreeLikeAutocomplete = exports.TreeAutocomplete = exports.TreeList = exports.MultipleTreeList = exports.UNSTABLE_SecondsCountdownService = exports.StepSlider = exports.StepperWizard = exports.staticDaysCalendarClassnames = exports.StaticDaysCalendar = exports.Skeleton = void 0;
19
+ exports.WelcomeScreen = exports.redirectToLink = exports.createUIKitClassname = exports.classNames = exports.TreeLikeList = exports.TreeLikeAutocomplete = exports.TreeAutocomplete = exports.TreeList = exports.MultipleTreeList = exports.UNSTABLE_SecondsCountdownService = exports.svgIconClassnames = exports.SvgIcon = exports.StepSlider = exports.StepperWizard = exports.staticDaysCalendarClassnames = exports.StaticDaysCalendar = exports.Skeleton = void 0;
20
20
  __exportStar(require("./Accordion"), exports);
21
21
  var ActionGroup_1 = require("./ActionGroup");
22
22
  Object.defineProperty(exports, "ActionGroup", { enumerable: true, get: function () { return ActionGroup_1.ActionGroup; } });
@@ -256,6 +256,9 @@ var StepSlider_1 = require("./StepSlider");
256
256
  Object.defineProperty(exports, "StepSlider", { enumerable: true, get: function () { return StepSlider_1.StepSlider; } });
257
257
  __exportStar(require("./StylesCacheProvider"), exports);
258
258
  __exportStar(require("./Switch"), exports);
259
+ var SvgIcon_1 = require("./SvgIcon");
260
+ Object.defineProperty(exports, "SvgIcon", { enumerable: true, get: function () { return SvgIcon_1.SvgIcon; } });
261
+ Object.defineProperty(exports, "svgIconClassnames", { enumerable: true, get: function () { return SvgIcon_1.svgIconClassnames; } });
259
262
  // biome-ignore lint/style/useNamingConvention: <Может использоваться продуктами>
260
263
  var services_1 = require("./services");
261
264
  Object.defineProperty(exports, "UNSTABLE_SecondsCountdownService", { enumerable: true, get: function () { return services_1.SecondsCountdown; } });
package/node/components/theme/components/MuiSwitch.js CHANGED
@@ -29,7 +29,7 @@ exports.MuiSwitch = {
29
29
  '& :not(.Mui-checked).MuiSwitch-switchBase': {
30
30
  padding: 0,
31
31
  '& + .MuiSwitch-track': {
32
- backgroundColor: theme.palette.grey[700],
32
+ backgroundColor: theme.palette.grey[500],
33
33
  opacity: 1,
34
34
  },
35
35
  },
@@ -39,7 +39,7 @@ exports.MuiSwitch = {
39
39
  },
40
40
  // NOT CHECKED HOVER
41
41
  '& :not(.Mui-checked):hover + .MuiSwitch-track': {
42
- backgroundColor: theme.palette.grey[500],
42
+ backgroundColor: theme.palette.grey[600],
43
43
  },
44
44
  // DISABLED TRACK
45
45
  '& .MuiButtonBase-root.MuiSwitch-switchBase.Mui-disabled': {
@@ -53,9 +53,9 @@ exports.MuiSwitch = {
53
53
  },
54
54
  },
55
55
  },
56
- // ACTIVE TRACK
57
- '& :not(.Mui-disabled):active + .MuiSwitch-track': {
58
- border: `2px solid ${theme.palette.components.focused}`,
56
+ // FOCUS
57
+ '& .Mui-focusVisible + .MuiSwitch-track': {
58
+ outline: `2px solid ${theme.palette.components.focused}`,
59
59
  },
60
60
  };
61
61
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astral/ui",
3
- "version": "4.0.0-alpha.35",
3
+ "version": "4.0.0-alpha.37",
4
4
  "browser": "./index.js",
5
5
  "main": "./node/index.js",
6
6
  "dependencies": {