@astral/ui 0.13.0 → 0.16.0

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 (72) hide show
  1. package/DashboardLayout/DashboardLayout.d.ts +2 -2
  2. package/DashboardLayout/DashboardLayout.js +4 -4
  3. package/DashboardLayout/Header/Header.js +3 -3
  4. package/DashboardLayout/Sidebar/Sidebar.d.ts +6 -0
  5. package/DashboardLayout/{SideBar/SideBar.js → Sidebar/Sidebar.js} +3 -3
  6. package/DashboardLayout/Sidebar/index.d.ts +1 -0
  7. package/DashboardLayout/{SideBar → Sidebar}/index.js +1 -1
  8. package/DashboardLayout/{SideBar → Sidebar}/styled.d.ts +0 -0
  9. package/DashboardLayout/{SideBar → Sidebar}/styled.js +0 -0
  10. package/DatePicker/DatePicker.d.ts +4 -0
  11. package/DatePicker/DatePicker.js +70 -0
  12. package/DatePicker/index.d.ts +1 -0
  13. package/DatePicker/index.js +13 -0
  14. package/DatePicker/types.d.ts +3 -0
  15. package/DatePicker/types.js +2 -0
  16. package/LocalizationProvider/LocalizationProvider.d.ts +4 -0
  17. package/LocalizationProvider/LocalizationProvider.js +27 -0
  18. package/LocalizationProvider/index.d.ts +1 -0
  19. package/LocalizationProvider/index.js +13 -0
  20. package/LocalizationProvider/types.d.ts +2 -0
  21. package/LocalizationProvider/types.js +2 -0
  22. package/esm/DashboardLayout/DashboardLayout.d.ts +2 -2
  23. package/esm/DashboardLayout/DashboardLayout.js +4 -4
  24. package/esm/DashboardLayout/Header/Header.js +3 -3
  25. package/esm/DashboardLayout/Sidebar/Sidebar.d.ts +6 -0
  26. package/esm/DashboardLayout/{SideBar/SideBar.js → Sidebar/Sidebar.js} +2 -2
  27. package/esm/DashboardLayout/Sidebar/index.d.ts +1 -0
  28. package/esm/DashboardLayout/Sidebar/index.js +1 -0
  29. package/esm/DashboardLayout/{SideBar → Sidebar}/styled.d.ts +0 -0
  30. package/esm/DashboardLayout/{SideBar → Sidebar}/styled.js +0 -0
  31. package/esm/DatePicker/DatePicker.d.ts +4 -0
  32. package/esm/DatePicker/DatePicker.js +67 -0
  33. package/esm/DatePicker/index.d.ts +1 -0
  34. package/esm/DatePicker/index.js +1 -0
  35. package/esm/DatePicker/types.d.ts +3 -0
  36. package/esm/DatePicker/types.js +1 -0
  37. package/esm/LocalizationProvider/LocalizationProvider.d.ts +4 -0
  38. package/esm/LocalizationProvider/LocalizationProvider.js +20 -0
  39. package/esm/LocalizationProvider/index.d.ts +1 -0
  40. package/esm/LocalizationProvider/index.js +1 -0
  41. package/esm/LocalizationProvider/types.d.ts +2 -0
  42. package/esm/LocalizationProvider/types.js +1 -0
  43. package/esm/index.d.ts +5 -0
  44. package/esm/index.js +5 -0
  45. package/esm/theme/__tests__/BaseTheme.test.js +1 -1
  46. package/esm/theme/components/MuiCalendarPicker.d.ts +2 -0
  47. package/esm/theme/components/MuiCalendarPicker.js +16 -0
  48. package/esm/theme/components/MuiOutlinedInput.js +3 -0
  49. package/esm/theme/components/MuiPickersDay.d.ts +2 -0
  50. package/esm/theme/components/MuiPickersDay.js +46 -0
  51. package/esm/theme/components/MuiYearPicker.d.ts +2 -0
  52. package/esm/theme/components/MuiYearPicker.js +13 -0
  53. package/esm/theme/components/components.js +6 -0
  54. package/esm/theme/elevation.js +5 -5
  55. package/index.d.ts +5 -0
  56. package/index.js +5 -0
  57. package/package.json +3 -2
  58. package/theme/__tests__/BaseTheme.test.js +1 -1
  59. package/theme/components/MuiCalendarPicker.d.ts +2 -0
  60. package/theme/components/MuiCalendarPicker.js +19 -0
  61. package/theme/components/MuiOutlinedInput.js +3 -0
  62. package/theme/components/MuiPickersDay.d.ts +2 -0
  63. package/theme/components/MuiPickersDay.js +49 -0
  64. package/theme/components/MuiYearPicker.d.ts +2 -0
  65. package/theme/components/MuiYearPicker.js +16 -0
  66. package/theme/components/components.js +6 -0
  67. package/theme/elevation.js +5 -5
  68. package/DashboardLayout/SideBar/SideBar.d.ts +0 -6
  69. package/DashboardLayout/SideBar/index.d.ts +0 -1
  70. package/esm/DashboardLayout/SideBar/SideBar.d.ts +0 -6
  71. package/esm/DashboardLayout/SideBar/index.d.ts +0 -1
  72. package/esm/DashboardLayout/SideBar/index.js +0 -1
@@ -4,8 +4,8 @@ interface DashBoardLayoutProps {
4
4
  }
5
5
  export declare const DashboardLayout: {
6
6
  ({ children }: DashBoardLayoutProps): JSX.Element;
7
- Header: import("react").ForwardRefExoticComponent<import("./Header/types").HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
8
- SideBar: import("react").ForwardRefExoticComponent<{
7
+ Header: import("react").ForwardRefExoticComponent<import("./Header").HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
8
+ Sidebar: import("react").ForwardRefExoticComponent<{
9
9
  children: ReactNode;
10
10
  } & import("react").RefAttributes<HTMLDivElement>>;
11
11
  Main: import("react").ForwardRefExoticComponent<{
@@ -13,9 +13,9 @@ var __assign = (this && this.__assign) || function () {
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
14
  exports.DashboardLayout = void 0;
15
15
  var jsx_runtime_1 = require("react/jsx-runtime");
16
- var Header_1 = require("./Header/");
17
- var SideBar_1 = require("./SideBar/");
18
- var Main_1 = require("./Main/");
16
+ var Header_1 = require("./Header");
17
+ var Sidebar_1 = require("./Sidebar");
18
+ var Main_1 = require("./Main");
19
19
  var styled_1 = require("./styled");
20
20
  var DashboardLayout = function (_a) {
21
21
  var children = _a.children;
@@ -23,6 +23,6 @@ var DashboardLayout = function (_a) {
23
23
  };
24
24
  exports.DashboardLayout = DashboardLayout;
25
25
  exports.DashboardLayout.Header = Header_1.Header;
26
- exports.DashboardLayout.SideBar = SideBar_1.SideBar;
26
+ exports.DashboardLayout.Sidebar = Sidebar_1.Sidebar;
27
27
  exports.DashboardLayout.Main = Main_1.Main;
28
28
  exports.default = exports.DashboardLayout;
@@ -15,8 +15,8 @@ exports.Header = void 0;
15
15
  var jsx_runtime_1 = require("react/jsx-runtime");
16
16
  var react_1 = require("react");
17
17
  var styled_1 = require("./styled");
18
- exports.Header = (0, react_1.forwardRef)(function (_a, ref) {
19
- var children = _a.children, logoSrc = _a.logoSrc, logoAlt = _a.logoAlt, LogoLink = _a.LogoLink, Widget = _a.Widget;
20
- return ((0, jsx_runtime_1.jsx)(styled_1.StyledHeader, __assign({ ref: ref }, { children: (0, jsx_runtime_1.jsxs)(styled_1.InnerContainer, { children: [(0, jsx_runtime_1.jsxs)(styled_1.LeftContainer, { children: [Widget && (0, jsx_runtime_1.jsx)(Widget, {}, void 0), (0, jsx_runtime_1.jsx)(styled_1.LogoContainer, __assign({ withWidget: !!Widget }, { children: (0, jsx_runtime_1.jsx)(LogoLink, { Logo: (0, jsx_runtime_1.jsx)(styled_1.LogoStyle, { src: logoSrc, alt: logoAlt }, void 0) }, void 0) }), void 0)] }, void 0), children] }, void 0) }), void 0));
18
+ exports.Header = (0, react_1.forwardRef)(function (props, ref) {
19
+ var children = props.children, logoSrc = props.logoSrc, logoAlt = props.logoAlt, LogoLink = props.LogoLink, Widget = props.Widget;
20
+ return ((0, jsx_runtime_1.jsx)(styled_1.StyledHeader, __assign({ ref: ref }, { children: (0, jsx_runtime_1.jsxs)(styled_1.InnerContainer, { children: [(0, jsx_runtime_1.jsxs)(styled_1.LeftContainer, { children: [Widget && (0, jsx_runtime_1.jsx)(Widget, {}, void 0), (0, jsx_runtime_1.jsx)(styled_1.LogoContainer, __assign({ withWidget: Boolean(Widget) }, { children: (0, jsx_runtime_1.jsx)(LogoLink, { Logo: (0, jsx_runtime_1.jsx)(styled_1.LogoStyle, { src: logoSrc, alt: logoAlt }, void 0) }, void 0) }), void 0)] }, void 0), children] }, void 0) }), void 0));
21
21
  });
22
22
  exports.default = exports.Header;
@@ -0,0 +1,6 @@
1
+ import { ReactNode } from 'react';
2
+ declare type SidebarProps = {
3
+ children: ReactNode;
4
+ };
5
+ export declare const Sidebar: import("react").ForwardRefExoticComponent<SidebarProps & import("react").RefAttributes<HTMLDivElement>>;
6
+ export default Sidebar;
@@ -11,12 +11,12 @@ var __assign = (this && this.__assign) || function () {
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
- exports.SideBar = void 0;
14
+ exports.Sidebar = void 0;
15
15
  var jsx_runtime_1 = require("react/jsx-runtime");
16
16
  var react_1 = require("react");
17
17
  var styled_1 = require("./styled");
18
- exports.SideBar = (0, react_1.forwardRef)(function (_a, ref) {
18
+ exports.Sidebar = (0, react_1.forwardRef)(function (_a, ref) {
19
19
  var children = _a.children;
20
20
  return ((0, jsx_runtime_1.jsx)(styled_1.StyledDrawer, __assign({ ref: ref, open: true, variant: "persistent" }, { children: children }), void 0));
21
21
  });
22
- exports.default = exports.SideBar;
22
+ exports.default = exports.Sidebar;
@@ -0,0 +1 @@
1
+ export * from './Sidebar';
@@ -10,4 +10,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
10
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
11
  };
12
12
  Object.defineProperty(exports, "__esModule", { value: true });
13
- __exportStar(require("./SideBar"), exports);
13
+ __exportStar(require("./Sidebar"), exports);
File without changes
File without changes
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { DatePickerProps } from './types';
3
+ export declare const DatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("react").RefAttributes<HTMLDivElement>>;
4
+ export default DatePicker;
@@ -0,0 +1,70 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __rest = (this && this.__rest) || function (s, e) {
14
+ var t = {};
15
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
+ t[p] = s[p];
17
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
+ t[p[i]] = s[p[i]];
21
+ }
22
+ return t;
23
+ };
24
+ Object.defineProperty(exports, "__esModule", { value: true });
25
+ exports.DatePicker = void 0;
26
+ var jsx_runtime_1 = require("react/jsx-runtime");
27
+ var react_1 = require("react");
28
+ var lab_1 = require("@mui/lab");
29
+ var icons_1 = require("@astral/icons");
30
+ var TextField_1 = require("../TextField");
31
+ var componentsProps = {
32
+ switchViewButton: {
33
+ sx: {
34
+ padding: 1,
35
+ borderRadius: 1,
36
+ },
37
+ },
38
+ leftArrowButton: {
39
+ sx: {
40
+ padding: 1,
41
+ borderRadius: 1,
42
+ },
43
+ },
44
+ rightArrowButton: {
45
+ sx: {
46
+ padding: 1,
47
+ borderRadius: 1,
48
+ },
49
+ },
50
+ };
51
+ exports.DatePicker = (0, react_1.forwardRef)(function (props, ref) {
52
+ var _a = props.value, value = _a === void 0 ? new Date() : _a, _b = props.mask, mask = _b === void 0 ? '__.__.____' : _b, restProps = __rest(props, ["value", "mask"]);
53
+ var renderInput = (0, react_1.useCallback)(function (params) {
54
+ var textFieldParams = params;
55
+ return (0, jsx_runtime_1.jsx)(TextField_1.TextField, __assign({}, textFieldParams), void 0);
56
+ }, []);
57
+ return ((0, jsx_runtime_1.jsx)(lab_1.DatePicker, __assign({}, restProps, { ref: ref, value: value, mask: mask, showDaysOutsideCurrentMonth: true, renderInput: renderInput, components: { OpenPickerIcon: icons_1.CalendarOutlineMd }, componentsProps: componentsProps, OpenPickerButtonProps: {
58
+ sx: {
59
+ borderRadius: 1,
60
+ },
61
+ }, PaperProps: {
62
+ sx: {
63
+ marginTop: 2,
64
+ boxShadow: function (theme) { return theme.elevation[200]; },
65
+ },
66
+ }, PopperProps: {
67
+ placement: 'bottom-start',
68
+ } }), void 0));
69
+ });
70
+ exports.default = exports.DatePicker;
@@ -0,0 +1 @@
1
+ export * from './DatePicker';
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
+ };
12
+ Object.defineProperty(exports, "__esModule", { value: true });
13
+ __exportStar(require("./DatePicker"), exports);
@@ -0,0 +1,3 @@
1
+ import { DatePickerProps as MuiDatePickerProps } from '@mui/lab';
2
+ export declare type DatePickerProps = Omit<MuiDatePickerProps<Date>, 'components' | 'renderInput' | 'showDaysOutsideCurrentMonth' | 'components' | 'componentsProps' | 'OpenPickerButtonProps' | 'PaperProps' | 'PopperProps'>;
3
+ export declare type DatePickerValue = Date;
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { LocalizationProviderProps } from './types';
3
+ export declare const LocalizationProvider: FC<LocalizationProviderProps>;
4
+ export default LocalizationProvider;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.LocalizationProvider = void 0;
18
+ var jsx_runtime_1 = require("react/jsx-runtime");
19
+ var AdapterDateFns_1 = __importDefault(require("@mui/lab/AdapterDateFns"));
20
+ var lab_1 = require("@mui/lab");
21
+ var locale_1 = require("date-fns/locale");
22
+ var LocalizationProvider = function (_a) {
23
+ var children = _a.children, _b = _a.locale, locale = _b === void 0 ? locale_1.ru : _b;
24
+ return ((0, jsx_runtime_1.jsx)(lab_1.LocalizationProvider, __assign({ dateAdapter: AdapterDateFns_1.default, locale: locale }, { children: children }), void 0));
25
+ };
26
+ exports.LocalizationProvider = LocalizationProvider;
27
+ exports.default = exports.LocalizationProvider;
@@ -0,0 +1 @@
1
+ export * from './LocalizationProvider';
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
+ };
12
+ Object.defineProperty(exports, "__esModule", { value: true });
13
+ __exportStar(require("./LocalizationProvider"), exports);
@@ -0,0 +1,2 @@
1
+ import { LocalizationProviderProps as MuiLocalizationProviderProps } from '@mui/lab';
2
+ export declare type LocalizationProviderProps = Omit<MuiLocalizationProviderProps, 'dateAdapter'>;
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -4,8 +4,8 @@ interface DashBoardLayoutProps {
4
4
  }
5
5
  export declare const DashboardLayout: {
6
6
  ({ children }: DashBoardLayoutProps): JSX.Element;
7
- Header: import("react").ForwardRefExoticComponent<import("./Header/types").HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
8
- SideBar: import("react").ForwardRefExoticComponent<{
7
+ Header: import("react").ForwardRefExoticComponent<import("./Header").HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
8
+ Sidebar: import("react").ForwardRefExoticComponent<{
9
9
  children: ReactNode;
10
10
  } & import("react").RefAttributes<HTMLDivElement>>;
11
11
  Main: import("react").ForwardRefExoticComponent<{
@@ -10,15 +10,15 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
- import { Header } from './Header/';
14
- import { SideBar } from './SideBar/';
15
- import { Main } from './Main/';
13
+ import { Header } from './Header';
14
+ import { Sidebar } from './Sidebar';
15
+ import { Main } from './Main';
16
16
  import { StyledDashboard } from './styled';
17
17
  export var DashboardLayout = function (_a) {
18
18
  var children = _a.children;
19
19
  return (_jsx(StyledDashboard, __assign({ container: true, templateColumns: "auto 1fr", templateRows: "auto 1fr" }, { children: children }), void 0));
20
20
  };
21
21
  DashboardLayout.Header = Header;
22
- DashboardLayout.SideBar = SideBar;
22
+ DashboardLayout.Sidebar = Sidebar;
23
23
  DashboardLayout.Main = Main;
24
24
  export default DashboardLayout;
@@ -12,8 +12,8 @@ var __assign = (this && this.__assign) || function () {
12
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import { forwardRef } from 'react';
14
14
  import { InnerContainer, LeftContainer, LogoContainer, LogoStyle, StyledHeader, } from './styled';
15
- export var Header = forwardRef(function (_a, ref) {
16
- var children = _a.children, logoSrc = _a.logoSrc, logoAlt = _a.logoAlt, LogoLink = _a.LogoLink, Widget = _a.Widget;
17
- return (_jsx(StyledHeader, __assign({ ref: ref }, { children: _jsxs(InnerContainer, { children: [_jsxs(LeftContainer, { children: [Widget && _jsx(Widget, {}, void 0), _jsx(LogoContainer, __assign({ withWidget: !!Widget }, { children: _jsx(LogoLink, { Logo: _jsx(LogoStyle, { src: logoSrc, alt: logoAlt }, void 0) }, void 0) }), void 0)] }, void 0), children] }, void 0) }), void 0));
15
+ export var Header = forwardRef(function (props, ref) {
16
+ var children = props.children, logoSrc = props.logoSrc, logoAlt = props.logoAlt, LogoLink = props.LogoLink, Widget = props.Widget;
17
+ return (_jsx(StyledHeader, __assign({ ref: ref }, { children: _jsxs(InnerContainer, { children: [_jsxs(LeftContainer, { children: [Widget && _jsx(Widget, {}, void 0), _jsx(LogoContainer, __assign({ withWidget: Boolean(Widget) }, { children: _jsx(LogoLink, { Logo: _jsx(LogoStyle, { src: logoSrc, alt: logoAlt }, void 0) }, void 0) }), void 0)] }, void 0), children] }, void 0) }), void 0));
18
18
  });
19
19
  export default Header;
@@ -0,0 +1,6 @@
1
+ import { ReactNode } from 'react';
2
+ declare type SidebarProps = {
3
+ children: ReactNode;
4
+ };
5
+ export declare const Sidebar: import("react").ForwardRefExoticComponent<SidebarProps & import("react").RefAttributes<HTMLDivElement>>;
6
+ export default Sidebar;
@@ -12,8 +12,8 @@ var __assign = (this && this.__assign) || function () {
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { forwardRef } from 'react';
14
14
  import { StyledDrawer } from './styled';
15
- export var SideBar = forwardRef(function (_a, ref) {
15
+ export var Sidebar = forwardRef(function (_a, ref) {
16
16
  var children = _a.children;
17
17
  return (_jsx(StyledDrawer, __assign({ ref: ref, open: true, variant: "persistent" }, { children: children }), void 0));
18
18
  });
19
- export default SideBar;
19
+ export default Sidebar;
@@ -0,0 +1 @@
1
+ export * from './Sidebar';
@@ -0,0 +1 @@
1
+ export * from './Sidebar';
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { DatePickerProps } from './types';
3
+ export declare const DatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("react").RefAttributes<HTMLDivElement>>;
4
+ export default DatePicker;
@@ -0,0 +1,67 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import { jsx as _jsx } from "react/jsx-runtime";
24
+ import { forwardRef, useCallback } from 'react';
25
+ import { DatePicker as MuiDatePicker } from '@mui/lab';
26
+ import { CalendarOutlineMd } from '@astral/icons';
27
+ import { TextField } from '../TextField';
28
+ var componentsProps = {
29
+ switchViewButton: {
30
+ sx: {
31
+ padding: 1,
32
+ borderRadius: 1,
33
+ },
34
+ },
35
+ leftArrowButton: {
36
+ sx: {
37
+ padding: 1,
38
+ borderRadius: 1,
39
+ },
40
+ },
41
+ rightArrowButton: {
42
+ sx: {
43
+ padding: 1,
44
+ borderRadius: 1,
45
+ },
46
+ },
47
+ };
48
+ export var DatePicker = forwardRef(function (props, ref) {
49
+ var _a = props.value, value = _a === void 0 ? new Date() : _a, _b = props.mask, mask = _b === void 0 ? '__.__.____' : _b, restProps = __rest(props, ["value", "mask"]);
50
+ var renderInput = useCallback(function (params) {
51
+ var textFieldParams = params;
52
+ return _jsx(TextField, __assign({}, textFieldParams), void 0);
53
+ }, []);
54
+ return (_jsx(MuiDatePicker, __assign({}, restProps, { ref: ref, value: value, mask: mask, showDaysOutsideCurrentMonth: true, renderInput: renderInput, components: { OpenPickerIcon: CalendarOutlineMd }, componentsProps: componentsProps, OpenPickerButtonProps: {
55
+ sx: {
56
+ borderRadius: 1,
57
+ },
58
+ }, PaperProps: {
59
+ sx: {
60
+ marginTop: 2,
61
+ boxShadow: function (theme) { return theme.elevation[200]; },
62
+ },
63
+ }, PopperProps: {
64
+ placement: 'bottom-start',
65
+ } }), void 0));
66
+ });
67
+ export default DatePicker;
@@ -0,0 +1 @@
1
+ export * from './DatePicker';
@@ -0,0 +1 @@
1
+ export * from './DatePicker';
@@ -0,0 +1,3 @@
1
+ import { DatePickerProps as MuiDatePickerProps } from '@mui/lab';
2
+ export declare type DatePickerProps = Omit<MuiDatePickerProps<Date>, 'components' | 'renderInput' | 'showDaysOutsideCurrentMonth' | 'components' | 'componentsProps' | 'OpenPickerButtonProps' | 'PaperProps' | 'PopperProps'>;
3
+ export declare type DatePickerValue = Date;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { LocalizationProviderProps } from './types';
3
+ export declare const LocalizationProvider: FC<LocalizationProviderProps>;
4
+ export default LocalizationProvider;
@@ -0,0 +1,20 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ import AdapterDateFns from '@mui/lab/AdapterDateFns';
14
+ import { LocalizationProvider as MuiLocalizationProvider } from '@mui/lab';
15
+ import { ru } from 'date-fns/locale';
16
+ export var LocalizationProvider = function (_a) {
17
+ var children = _a.children, _b = _a.locale, locale = _b === void 0 ? ru : _b;
18
+ return (_jsx(MuiLocalizationProvider, __assign({ dateAdapter: AdapterDateFns, locale: locale }, { children: children }), void 0));
19
+ };
20
+ export default LocalizationProvider;
@@ -0,0 +1 @@
1
+ export * from './LocalizationProvider';
@@ -0,0 +1 @@
1
+ export * from './LocalizationProvider';
@@ -0,0 +1,2 @@
1
+ import { LocalizationProviderProps as MuiLocalizationProviderProps } from '@mui/lab';
2
+ export declare type LocalizationProviderProps = Omit<MuiLocalizationProviderProps, 'dateAdapter'>;
@@ -0,0 +1 @@
1
+ export {};
package/esm/index.d.ts CHANGED
@@ -34,3 +34,8 @@ export * from './Tag';
34
34
  export * from './TextArea';
35
35
  export * from './theme';
36
36
  export * from './ThemeProvider';
37
+ export * from './TextField';
38
+ export * from './Typography';
39
+ export * from './Tooltip';
40
+ export * from './DatePicker';
41
+ export * from './LocalizationProvider';
package/esm/index.js CHANGED
@@ -34,3 +34,8 @@ export * from './Tag';
34
34
  export * from './TextArea';
35
35
  export * from './theme';
36
36
  export * from './ThemeProvider';
37
+ export * from './TextField';
38
+ export * from './Typography';
39
+ export * from './Tooltip';
40
+ export * from './DatePicker';
41
+ export * from './LocalizationProvider';
@@ -49,6 +49,6 @@ describe('createTheme', function () {
49
49
  });
50
50
  it('Theme has elevation params', function () {
51
51
  var theme = createTheme({ brand: Brand.SIGN, fontsUrls: fontsUrls });
52
- expect(theme.elevation[100]).toBe('0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;');
52
+ expect(theme.elevation[100]).toBe('0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740');
53
53
  });
54
54
  });
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiCalendarPicker: LabComponents['MuiCalendarPicker'];
@@ -0,0 +1,16 @@
1
+ export var MuiCalendarPicker = {
2
+ styleOverrides: {
3
+ viewTransitionContainer: function (_a) {
4
+ var theme = _a.theme;
5
+ return {
6
+ maxHeight: 260,
7
+ overflow: 'hidden',
8
+ '& span': {
9
+ color: theme.palette.grey[600],
10
+ width: 41,
11
+ margin: 0,
12
+ },
13
+ };
14
+ },
15
+ },
16
+ };
@@ -13,6 +13,9 @@ export var MuiOutlinedInput = {
13
13
  '&:hover': {
14
14
  // FIXME: to theme
15
15
  background: '#EEF1F4',
16
+ '&.Mui-disabled': {
17
+ background: theme.palette.background.element,
18
+ },
16
19
  },
17
20
  '&:hover .MuiOutlinedInput-notchedOutline': {
18
21
  borderColor: theme.palette.grey[300],
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiPickersDay: LabComponents['MuiPickersDay'];
@@ -0,0 +1,46 @@
1
+ export var MuiPickersDay = {
2
+ styleOverrides: {
3
+ root: function (_a) {
4
+ var theme = _a.theme;
5
+ return {
6
+ width: 41,
7
+ height: 32,
8
+ margin: 0,
9
+ color: theme.palette.grey[900],
10
+ fontSize: theme.typography.link.fontSize,
11
+ fontWeight: theme.typography.fontWeightRegular,
12
+ borderRadius: theme.shape.small,
13
+ '&.MuiPickersDay-today': {
14
+ border: 0,
15
+ fontWeight: theme.typography.fontWeightMedium,
16
+ '&:before': {
17
+ content: '""',
18
+ position: 'absolute',
19
+ height: 2,
20
+ width: 33,
21
+ background: theme.palette.primary[900],
22
+ bottom: theme.spacing(1),
23
+ },
24
+ '&.Mui-selected': {
25
+ '&:before': {
26
+ background: theme.palette.primary[200],
27
+ },
28
+ },
29
+ },
30
+ '&.Mui-selected': {
31
+ fontWeight: theme.typography.fontWeightRegular,
32
+ },
33
+ '&.Mui-focusVisible': {
34
+ background: theme.palette.primary[200],
35
+ },
36
+ '&.MuiPickersDay-dayOutsideMonth': {
37
+ color: theme.palette.grey[600],
38
+ },
39
+ '&.Mui-disabled': {
40
+ color: theme.palette.grey[300],
41
+ fontWeight: theme.typography.fontWeightRegular,
42
+ },
43
+ };
44
+ },
45
+ },
46
+ };
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiYearPicker: LabComponents['MuiYearPicker'];
@@ -0,0 +1,13 @@
1
+ export var MuiYearPicker = {
2
+ styleOverrides: {
3
+ root: function (_a) {
4
+ var theme = _a.theme;
5
+ return {
6
+ '& .PrivatePickersYear-yearButton': {
7
+ fontSize: theme.typography.link.fontSize,
8
+ borderRadius: theme.shape.small,
9
+ },
10
+ };
11
+ },
12
+ },
13
+ };
@@ -10,6 +10,9 @@ import { MuiDialog } from './MuiDialog';
10
10
  import { MuiDialogTitle } from './MuiDialogTitle';
11
11
  import { MuiDialogContent } from './MuiDialogContent';
12
12
  import { MuiDialogActions } from './MuiDialogActions';
13
+ import { MuiPickersDay } from './MuiPickersDay';
14
+ import { MuiCalendarPicker } from './MuiCalendarPicker';
15
+ import { MuiYearPicker } from './MuiYearPicker';
13
16
  var getMuiCssBaseline = function (fontUrls) { return ({
14
17
  styleOverrides: "\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 300;\n font-display: swap;\n src: url(".concat(fontUrls.light.woff2, ") format('woff2'), url(").concat(fontUrls.light.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 400;\n font-display: swap;\n src: url(").concat(fontUrls.regular.woff2, ") format('woff2'), url(").concat(fontUrls.regular.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 500;\n font-display: swap;\n src: url(").concat(fontUrls.medium.woff2, ") format('woff2'), url(").concat(fontUrls.medium.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 700;\n font-display: swap;\n src: url(").concat(fontUrls.bold.woff2, ") format('woff2'), url(").concat(fontUrls.bold.woff, ") format('woff');\n }\n "),
15
18
  }); };
@@ -76,4 +79,7 @@ export var getComponents = function (fontUrls) { return ({
76
79
  MuiDialogTitle: MuiDialogTitle,
77
80
  MuiDialogContent: MuiDialogContent,
78
81
  MuiDialogActions: MuiDialogActions,
82
+ MuiPickersDay: MuiPickersDay,
83
+ MuiCalendarPicker: MuiCalendarPicker,
84
+ MuiYearPicker: MuiYearPicker,
79
85
  }); };
@@ -1,7 +1,7 @@
1
1
  export var elevation = {
2
- 100: '0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;',
3
- 200: '0px 0px 1px 0px #072D574F, 0px 3px 5px 0px #072D5733;',
4
- 300: '0px 0px 1px 0px #072D574F, 0px 8px 12px 0px #072D5726;',
5
- 400: '0px 0px 1px 0px #072D574F, 0px 10px 18px 0px #072D5726;',
6
- 500: '0px 0px 1px 0px #072D574F, 0px 18px 28px 0px #072D5726;',
2
+ 100: '0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740',
3
+ 200: '0px 0px 1px 0px #072D574F, 0px 3px 5px 0px #072D5733',
4
+ 300: '0px 0px 1px 0px #072D574F, 0px 8px 12px 0px #072D5726',
5
+ 400: '0px 0px 1px 0px #072D574F, 0px 10px 18px 0px #072D5726',
6
+ 500: '0px 0px 1px 0px #072D574F, 0px 18px 28px 0px #072D5726',
7
7
  };
package/index.d.ts CHANGED
@@ -34,3 +34,8 @@ export * from './Tag';
34
34
  export * from './TextArea';
35
35
  export * from './theme';
36
36
  export * from './ThemeProvider';
37
+ export * from './TextField';
38
+ export * from './Typography';
39
+ export * from './Tooltip';
40
+ export * from './DatePicker';
41
+ export * from './LocalizationProvider';
package/index.js CHANGED
@@ -46,3 +46,8 @@ __exportStar(require("./Tag"), exports);
46
46
  __exportStar(require("./TextArea"), exports);
47
47
  __exportStar(require("./theme"), exports);
48
48
  __exportStar(require("./ThemeProvider"), exports);
49
+ __exportStar(require("./TextField"), exports);
50
+ __exportStar(require("./Typography"), exports);
51
+ __exportStar(require("./Tooltip"), exports);
52
+ __exportStar(require("./DatePicker"), exports);
53
+ __exportStar(require("./LocalizationProvider"), exports);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astral/ui",
3
- "version": "0.13.0",
3
+ "version": "0.16.0",
4
4
  "browser": "./src/index.ts",
5
5
  "jest": {
6
6
  "moduleNameMapper": {
@@ -8,7 +8,7 @@
8
8
  }
9
9
  },
10
10
  "dependencies": {
11
- "@astral/icons": "^0.13.0",
11
+ "@astral/icons": "^0.16.0",
12
12
  "@emotion/cache": "11.7.1",
13
13
  "@emotion/react": "11.8.1",
14
14
  "@emotion/server": "11.4.0",
@@ -16,6 +16,7 @@
16
16
  "@mui/base": "5.0.0-alpha.69",
17
17
  "@mui/lab": "5.0.0-alpha.70",
18
18
  "@mui/material": "5.4.3",
19
+ "date-fns": "^2.28.0",
19
20
  "lodash-es": "4.17.21",
20
21
  "react-imask": "^6.4.2"
21
22
  },
@@ -51,6 +51,6 @@ describe('createTheme', function () {
51
51
  });
52
52
  it('Theme has elevation params', function () {
53
53
  var theme = (0, baseTheme_1.createTheme)({ brand: constants_1.Brand.SIGN, fontsUrls: fontsUrls });
54
- expect(theme.elevation[100]).toBe('0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;');
54
+ expect(theme.elevation[100]).toBe('0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740');
55
55
  });
56
56
  });
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiCalendarPicker: LabComponents['MuiCalendarPicker'];
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.MuiCalendarPicker = void 0;
4
+ exports.MuiCalendarPicker = {
5
+ styleOverrides: {
6
+ viewTransitionContainer: function (_a) {
7
+ var theme = _a.theme;
8
+ return {
9
+ maxHeight: 260,
10
+ overflow: 'hidden',
11
+ '& span': {
12
+ color: theme.palette.grey[600],
13
+ width: 41,
14
+ margin: 0,
15
+ },
16
+ };
17
+ },
18
+ },
19
+ };
@@ -16,6 +16,9 @@ exports.MuiOutlinedInput = {
16
16
  '&:hover': {
17
17
  // FIXME: to theme
18
18
  background: '#EEF1F4',
19
+ '&.Mui-disabled': {
20
+ background: theme.palette.background.element,
21
+ },
19
22
  },
20
23
  '&:hover .MuiOutlinedInput-notchedOutline': {
21
24
  borderColor: theme.palette.grey[300],
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiPickersDay: LabComponents['MuiPickersDay'];
@@ -0,0 +1,49 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.MuiPickersDay = void 0;
4
+ exports.MuiPickersDay = {
5
+ styleOverrides: {
6
+ root: function (_a) {
7
+ var theme = _a.theme;
8
+ return {
9
+ width: 41,
10
+ height: 32,
11
+ margin: 0,
12
+ color: theme.palette.grey[900],
13
+ fontSize: theme.typography.link.fontSize,
14
+ fontWeight: theme.typography.fontWeightRegular,
15
+ borderRadius: theme.shape.small,
16
+ '&.MuiPickersDay-today': {
17
+ border: 0,
18
+ fontWeight: theme.typography.fontWeightMedium,
19
+ '&:before': {
20
+ content: '""',
21
+ position: 'absolute',
22
+ height: 2,
23
+ width: 33,
24
+ background: theme.palette.primary[900],
25
+ bottom: theme.spacing(1),
26
+ },
27
+ '&.Mui-selected': {
28
+ '&:before': {
29
+ background: theme.palette.primary[200],
30
+ },
31
+ },
32
+ },
33
+ '&.Mui-selected': {
34
+ fontWeight: theme.typography.fontWeightRegular,
35
+ },
36
+ '&.Mui-focusVisible': {
37
+ background: theme.palette.primary[200],
38
+ },
39
+ '&.MuiPickersDay-dayOutsideMonth': {
40
+ color: theme.palette.grey[600],
41
+ },
42
+ '&.Mui-disabled': {
43
+ color: theme.palette.grey[300],
44
+ fontWeight: theme.typography.fontWeightRegular,
45
+ },
46
+ };
47
+ },
48
+ },
49
+ };
@@ -0,0 +1,2 @@
1
+ import { LabComponents } from '@mui/lab/themeAugmentation';
2
+ export declare const MuiYearPicker: LabComponents['MuiYearPicker'];
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.MuiYearPicker = void 0;
4
+ exports.MuiYearPicker = {
5
+ styleOverrides: {
6
+ root: function (_a) {
7
+ var theme = _a.theme;
8
+ return {
9
+ '& .PrivatePickersYear-yearButton': {
10
+ fontSize: theme.typography.link.fontSize,
11
+ borderRadius: theme.shape.small,
12
+ },
13
+ };
14
+ },
15
+ },
16
+ };
@@ -13,6 +13,9 @@ var MuiDialog_1 = require("./MuiDialog");
13
13
  var MuiDialogTitle_1 = require("./MuiDialogTitle");
14
14
  var MuiDialogContent_1 = require("./MuiDialogContent");
15
15
  var MuiDialogActions_1 = require("./MuiDialogActions");
16
+ var MuiPickersDay_1 = require("./MuiPickersDay");
17
+ var MuiCalendarPicker_1 = require("./MuiCalendarPicker");
18
+ var MuiYearPicker_1 = require("./MuiYearPicker");
16
19
  var getMuiCssBaseline = function (fontUrls) { return ({
17
20
  styleOverrides: "\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 300;\n font-display: swap;\n src: url(".concat(fontUrls.light.woff2, ") format('woff2'), url(").concat(fontUrls.light.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 400;\n font-display: swap;\n src: url(").concat(fontUrls.regular.woff2, ") format('woff2'), url(").concat(fontUrls.regular.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 500;\n font-display: swap;\n src: url(").concat(fontUrls.medium.woff2, ") format('woff2'), url(").concat(fontUrls.medium.woff, ") format('woff');\n }\n @font-face {\n font-family: 'Ubuntu';\n font-style: 'normal';\n font-weight: 700;\n font-display: swap;\n src: url(").concat(fontUrls.bold.woff2, ") format('woff2'), url(").concat(fontUrls.bold.woff, ") format('woff');\n }\n "),
18
21
  }); };
@@ -79,5 +82,8 @@ var getComponents = function (fontUrls) { return ({
79
82
  MuiDialogTitle: MuiDialogTitle_1.MuiDialogTitle,
80
83
  MuiDialogContent: MuiDialogContent_1.MuiDialogContent,
81
84
  MuiDialogActions: MuiDialogActions_1.MuiDialogActions,
85
+ MuiPickersDay: MuiPickersDay_1.MuiPickersDay,
86
+ MuiCalendarPicker: MuiCalendarPicker_1.MuiCalendarPicker,
87
+ MuiYearPicker: MuiYearPicker_1.MuiYearPicker,
82
88
  }); };
83
89
  exports.getComponents = getComponents;
@@ -2,9 +2,9 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.elevation = void 0;
4
4
  exports.elevation = {
5
- 100: '0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740;',
6
- 200: '0px 0px 1px 0px #072D574F, 0px 3px 5px 0px #072D5733;',
7
- 300: '0px 0px 1px 0px #072D574F, 0px 8px 12px 0px #072D5726;',
8
- 400: '0px 0px 1px 0px #072D574F, 0px 10px 18px 0px #072D5726;',
9
- 500: '0px 0px 1px 0px #072D574F, 0px 18px 28px 0px #072D5726;',
5
+ 100: '0px 0px 1px 0px #072D574F, 0px 1px 1px 0px #072D5740',
6
+ 200: '0px 0px 1px 0px #072D574F, 0px 3px 5px 0px #072D5733',
7
+ 300: '0px 0px 1px 0px #072D574F, 0px 8px 12px 0px #072D5726',
8
+ 400: '0px 0px 1px 0px #072D574F, 0px 10px 18px 0px #072D5726',
9
+ 500: '0px 0px 1px 0px #072D574F, 0px 18px 28px 0px #072D5726',
10
10
  };
@@ -1,6 +0,0 @@
1
- import { ReactNode } from 'react';
2
- declare type SideBarProps = {
3
- children: ReactNode;
4
- };
5
- export declare const SideBar: import("react").ForwardRefExoticComponent<SideBarProps & import("react").RefAttributes<HTMLDivElement>>;
6
- export default SideBar;
@@ -1 +0,0 @@
1
- export * from './SideBar';
@@ -1,6 +0,0 @@
1
- import { ReactNode } from 'react';
2
- declare type SideBarProps = {
3
- children: ReactNode;
4
- };
5
- export declare const SideBar: import("react").ForwardRefExoticComponent<SideBarProps & import("react").RefAttributes<HTMLDivElement>>;
6
- export default SideBar;
@@ -1 +0,0 @@
1
- export * from './SideBar';
@@ -1 +0,0 @@
1
- export * from './SideBar';