@astral/ui 0.15.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 (49) hide show
  1. package/DatePicker/DatePicker.d.ts +4 -0
  2. package/DatePicker/DatePicker.js +70 -0
  3. package/DatePicker/index.d.ts +1 -0
  4. package/DatePicker/index.js +13 -0
  5. package/DatePicker/types.d.ts +3 -0
  6. package/DatePicker/types.js +2 -0
  7. package/LocalizationProvider/LocalizationProvider.d.ts +4 -0
  8. package/LocalizationProvider/LocalizationProvider.js +27 -0
  9. package/LocalizationProvider/index.d.ts +1 -0
  10. package/LocalizationProvider/index.js +13 -0
  11. package/LocalizationProvider/types.d.ts +2 -0
  12. package/LocalizationProvider/types.js +2 -0
  13. package/esm/DatePicker/DatePicker.d.ts +4 -0
  14. package/esm/DatePicker/DatePicker.js +67 -0
  15. package/esm/DatePicker/index.d.ts +1 -0
  16. package/esm/DatePicker/index.js +1 -0
  17. package/esm/DatePicker/types.d.ts +3 -0
  18. package/esm/DatePicker/types.js +1 -0
  19. package/esm/LocalizationProvider/LocalizationProvider.d.ts +4 -0
  20. package/esm/LocalizationProvider/LocalizationProvider.js +20 -0
  21. package/esm/LocalizationProvider/index.d.ts +1 -0
  22. package/esm/LocalizationProvider/index.js +1 -0
  23. package/esm/LocalizationProvider/types.d.ts +2 -0
  24. package/esm/LocalizationProvider/types.js +1 -0
  25. package/esm/index.d.ts +2 -0
  26. package/esm/index.js +2 -0
  27. package/esm/theme/__tests__/BaseTheme.test.js +1 -1
  28. package/esm/theme/components/MuiCalendarPicker.d.ts +2 -0
  29. package/esm/theme/components/MuiCalendarPicker.js +16 -0
  30. package/esm/theme/components/MuiOutlinedInput.js +3 -0
  31. package/esm/theme/components/MuiPickersDay.d.ts +2 -0
  32. package/esm/theme/components/MuiPickersDay.js +46 -0
  33. package/esm/theme/components/MuiYearPicker.d.ts +2 -0
  34. package/esm/theme/components/MuiYearPicker.js +13 -0
  35. package/esm/theme/components/components.js +6 -0
  36. package/esm/theme/elevation.js +5 -5
  37. package/index.d.ts +2 -0
  38. package/index.js +2 -0
  39. package/package.json +3 -2
  40. package/theme/__tests__/BaseTheme.test.js +1 -1
  41. package/theme/components/MuiCalendarPicker.d.ts +2 -0
  42. package/theme/components/MuiCalendarPicker.js +19 -0
  43. package/theme/components/MuiOutlinedInput.js +3 -0
  44. package/theme/components/MuiPickersDay.d.ts +2 -0
  45. package/theme/components/MuiPickersDay.js +49 -0
  46. package/theme/components/MuiYearPicker.d.ts +2 -0
  47. package/theme/components/MuiYearPicker.js +16 -0
  48. package/theme/components/components.js +6 -0
  49. package/theme/elevation.js +5 -5
@@ -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 });
@@ -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
@@ -37,3 +37,5 @@ export * from './ThemeProvider';
37
37
  export * from './TextField';
38
38
  export * from './Typography';
39
39
  export * from './Tooltip';
40
+ export * from './DatePicker';
41
+ export * from './LocalizationProvider';
package/esm/index.js CHANGED
@@ -37,3 +37,5 @@ export * from './ThemeProvider';
37
37
  export * from './TextField';
38
38
  export * from './Typography';
39
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
@@ -37,3 +37,5 @@ export * from './ThemeProvider';
37
37
  export * from './TextField';
38
38
  export * from './Typography';
39
39
  export * from './Tooltip';
40
+ export * from './DatePicker';
41
+ export * from './LocalizationProvider';
package/index.js CHANGED
@@ -49,3 +49,5 @@ __exportStar(require("./ThemeProvider"), exports);
49
49
  __exportStar(require("./TextField"), exports);
50
50
  __exportStar(require("./Typography"), exports);
51
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.15.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.15.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
  };