@astral/ui 1.14.1 → 1.15.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.
- package/Badge/Badge.d.ts +1 -2
- package/Badge/Badge.js +2 -1
- package/ConfigProvider/ConfigProvider.d.ts +10 -0
- package/ConfigProvider/ConfigProvider.js +35 -0
- package/ConfigProvider/index.d.ts +1 -0
- package/ConfigProvider/index.js +17 -0
- package/ContentState/ContentState.d.ts +2 -2
- package/ContentState/ContentState.js +11 -6
- package/DatePicker/DatePicker.d.ts +1 -1
- package/DatePicker/DatePicker.js +2 -2
- package/DatePicker/DatePickerHeader/DatePickerHeader.js +3 -3
- package/DatePickerProvider/DatePickerProvider.d.ts +4 -13
- package/DatePickerProvider/DatePickerProvider.js +11 -22
- package/ErrorBoundary/ErrorBoundary.d.ts +18 -0
- package/ErrorBoundary/ErrorBoundary.js +64 -0
- package/ErrorBoundary/index.d.ts +1 -0
- package/ErrorBoundary/index.js +17 -0
- package/Placeholder/styles.js +1 -1
- package/docs/Case/Case.d.ts +8 -0
- package/docs/Case/Case.js +31 -0
- package/docs/Case/index.d.ts +1 -0
- package/docs/Case/index.js +17 -0
- package/docs/Case/styles.d.ts +5 -0
- package/docs/Case/styles.js +16 -0
- package/docs/ExampleTemplate/ExampleTemplate.d.ts +13 -0
- package/docs/ExampleTemplate/ExampleTemplate.js +26 -0
- package/docs/ExampleTemplate/index.d.ts +1 -0
- package/docs/ExampleTemplate/index.js +17 -0
- package/docs/ExampleTemplate/styles.d.ts +9 -0
- package/docs/ExampleTemplate/styles.js +13 -0
- package/docs/index.d.ts +2 -0
- package/docs/index.js +18 -0
- package/esm/Badge/Badge.d.ts +1 -2
- package/esm/Badge/Badge.js +1 -2
- package/esm/ConfigProvider/ConfigProvider.d.ts +10 -0
- package/esm/ConfigProvider/ConfigProvider.js +28 -0
- package/esm/ConfigProvider/index.d.ts +1 -0
- package/esm/ConfigProvider/index.js +1 -0
- package/esm/ContentState/ContentState.d.ts +2 -2
- package/esm/ContentState/ContentState.js +10 -8
- package/esm/DatePicker/DatePicker.d.ts +1 -1
- package/esm/DatePicker/DatePicker.js +2 -2
- package/esm/DatePicker/DatePickerHeader/DatePickerHeader.js +3 -3
- package/esm/DatePickerProvider/DatePickerProvider.d.ts +4 -13
- package/esm/DatePickerProvider/DatePickerProvider.js +11 -19
- package/esm/ErrorBoundary/ErrorBoundary.d.ts +18 -0
- package/esm/ErrorBoundary/ErrorBoundary.js +59 -0
- package/esm/ErrorBoundary/index.d.ts +1 -0
- package/esm/ErrorBoundary/index.js +1 -0
- package/esm/Placeholder/styles.js +1 -1
- package/esm/docs/Case/Case.d.ts +8 -0
- package/esm/docs/Case/Case.js +27 -0
- package/esm/docs/Case/index.d.ts +1 -0
- package/esm/docs/Case/index.js +1 -0
- package/esm/docs/Case/styles.d.ts +5 -0
- package/esm/docs/Case/styles.js +13 -0
- package/esm/docs/ExampleTemplate/ExampleTemplate.d.ts +13 -0
- package/esm/docs/ExampleTemplate/ExampleTemplate.js +22 -0
- package/esm/docs/ExampleTemplate/index.d.ts +1 -0
- package/esm/docs/ExampleTemplate/index.js +1 -0
- package/esm/docs/ExampleTemplate/styles.d.ts +9 -0
- package/esm/docs/ExampleTemplate/styles.js +10 -0
- package/esm/docs/index.d.ts +2 -0
- package/esm/docs/index.js +2 -0
- package/esm/index.d.ts +2 -1
- package/esm/index.js +2 -1
- package/{theme → esm/theme/baseTheme}/baseTheme.d.ts +3 -3
- package/esm/theme/{baseTheme.js → baseTheme/baseTheme.js} +7 -7
- package/esm/theme/{__tests__/BaseTheme.test.d.ts → baseTheme/baseTheme.test.d.ts} +0 -0
- package/esm/theme/{__tests__/BaseTheme.test.js → baseTheme/baseTheme.test.js} +1 -1
- package/esm/theme/baseTheme/index.d.ts +1 -0
- package/esm/theme/baseTheme/index.js +1 -0
- package/index.d.ts +2 -1
- package/index.js +2 -1
- package/package.json +2 -7
- package/{esm/theme → theme/baseTheme}/baseTheme.d.ts +3 -3
- package/theme/{baseTheme.js → baseTheme/baseTheme.js} +7 -7
- package/theme/{__tests__/BaseTheme.test.d.ts → baseTheme/baseTheme.test.d.ts} +0 -0
- package/theme/{__tests__/BaseTheme.test.js → baseTheme/baseTheme.test.js} +1 -1
- package/theme/baseTheme/index.d.ts +1 -0
- package/theme/baseTheme/index.js +17 -0
|
@@ -31,5 +31,5 @@ declare type ContentStateProps = {
|
|
|
31
31
|
*/
|
|
32
32
|
children: ReactNode;
|
|
33
33
|
};
|
|
34
|
-
export declare const ContentState: (
|
|
35
|
-
export
|
|
34
|
+
export declare const ContentState: ({ isLoading, isError, isCustom, errorState, customState, children, loadingContent: LoadingContent, }: ContentStateProps) => JSX.Element;
|
|
35
|
+
export {};
|
|
@@ -9,12 +9,15 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
-
import { jsx as _jsx
|
|
13
|
-
import {
|
|
12
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
import { useContext } from 'react';
|
|
14
14
|
import { Button, CircularProgress, Placeholder, Typography } from '..';
|
|
15
|
+
import ErrorBoundary from '../ErrorBoundary/ErrorBoundary';
|
|
16
|
+
import { ConfigContext } from '../ConfigProvider';
|
|
15
17
|
import { LoadingContainer } from './styles';
|
|
16
|
-
export var ContentState = function (
|
|
17
|
-
var isLoading =
|
|
18
|
+
export var ContentState = function (_a) {
|
|
19
|
+
var isLoading = _a.isLoading, isError = _a.isError, isCustom = _a.isCustom, errorState = _a.errorState, customState = _a.customState, children = _a.children, _b = _a.loadingContent, LoadingContent = _b === void 0 ? _jsx(CircularProgress, { color: "primary" }) : _b;
|
|
20
|
+
var captureException = useContext(ConfigContext).captureException;
|
|
18
21
|
if (isLoading) {
|
|
19
22
|
return _jsx(LoadingContainer, { children: LoadingContent });
|
|
20
23
|
}
|
|
@@ -22,10 +25,9 @@ export var ContentState = function (props) {
|
|
|
22
25
|
return _jsx(Placeholder, __assign({}, customState));
|
|
23
26
|
}
|
|
24
27
|
if (isError && errorState) {
|
|
25
|
-
var
|
|
26
|
-
var description = errorList.map(function (
|
|
28
|
+
var _c = errorState.title, title = _c === void 0 ? 'Произошла ошибка' : _c, imgAlt = errorState.imgAlt, imgSrc = errorState.imgSrc, errorList = errorState.errorList, onRetry = errorState.onRetry, _d = errorState.actions, actions = _d === void 0 ? _jsx(Button, __assign({ onClick: onRetry }, { children: "\u041F\u043E\u043F\u0440\u043E\u0431\u043E\u0432\u0430\u0442\u044C \u0441\u043D\u043E\u0432\u0430" })) : _d;
|
|
29
|
+
var description = errorList.map(function (errorMessage) { return (_jsx(Typography, __assign({ component: "p" }, { children: errorMessage }), errorMessage)); });
|
|
27
30
|
return (_jsx(Placeholder, { title: title, description: description, imgAlt: imgAlt, imgSrc: imgSrc, Actions: actions }));
|
|
28
31
|
}
|
|
29
|
-
return _jsx(
|
|
32
|
+
return (_jsx(ErrorBoundary, __assign({ captureException: captureException }, { children: children })));
|
|
30
33
|
};
|
|
31
|
-
export default ContentState;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ReactDatePickerProps } from 'react-datepicker';
|
|
3
3
|
import { TextFieldProps } from '../TextField';
|
|
4
|
-
export declare type DatePickerProps = Omit<ReactDatePickerProps, 'renderCustomHeader' | 'locale' | '
|
|
4
|
+
export declare type DatePickerProps = Omit<ReactDatePickerProps, 'renderCustomHeader' | 'locale' | 'renderDayContents' | 'customInput' | 'selected' | 'value' | 'placeholderText'> & {
|
|
5
5
|
inputProps?: TextFieldProps;
|
|
6
6
|
value?: Date;
|
|
7
7
|
};
|
|
@@ -27,7 +27,7 @@ import { InputAdornment } from '@mui/material';
|
|
|
27
27
|
import { CalendarOutlineMd } from '@astral/icons';
|
|
28
28
|
import { isValid, parse } from 'date-fns';
|
|
29
29
|
import { MaskField } from '../MaskField';
|
|
30
|
-
import {
|
|
30
|
+
import { ConfigContext } from '../ConfigProvider';
|
|
31
31
|
import { DatePickerWrapper } from './styled';
|
|
32
32
|
import { DatePickerHeader } from './DatePickerHeader';
|
|
33
33
|
import { DatePickerDay } from './DatePickerDay';
|
|
@@ -35,7 +35,7 @@ var MIN_YEAR = 1000;
|
|
|
35
35
|
export var DatePicker = forwardRef(function (props, ref) {
|
|
36
36
|
var value = props.value, onChange = props.onChange, _a = props.inputProps, inputProps = _a === void 0 ? {} : _a, _b = props.dateFormat, dateFormat = _b === void 0 ? 'dd.MM.yyyy' : _b, restProps = __rest(props, ["value", "onChange", "inputProps", "dateFormat"]);
|
|
37
37
|
var placeholder = inputProps.placeholder, restInputProps = __rest(inputProps, ["placeholder"]);
|
|
38
|
-
var locale = useContext(
|
|
38
|
+
var locale = useContext(ConfigContext).locale;
|
|
39
39
|
// уберкостыль, react-date-picker забирает значение из event.target.value
|
|
40
40
|
var handleMaskFieldAccept = function (val, _maskRef, _e, onMaskFieldChange) {
|
|
41
41
|
onMaskFieldChange === null || onMaskFieldChange === void 0 ? void 0 : onMaskFieldChange({
|
|
@@ -14,11 +14,11 @@ import { useContext, useMemo } from 'react';
|
|
|
14
14
|
import { NextOutlineMd, PreviousOutlineMd } from '@astral/icons';
|
|
15
15
|
import format from 'date-fns/format';
|
|
16
16
|
import { IconButton } from '../../IconButton';
|
|
17
|
-
import {
|
|
17
|
+
import { ConfigContext } from '../../ConfigProvider';
|
|
18
18
|
import { DatePickerHeaderTitle, DatePickerHeaderWrapper } from './styled';
|
|
19
19
|
export var DatePickerHeader = function (props) {
|
|
20
20
|
var increaseMonth = props.increaseMonth, decreaseMonth = props.decreaseMonth, date = props.date;
|
|
21
|
-
var locale = useContext(
|
|
22
|
-
var localizedDate = useMemo(function () { return format(date, 'LLLL yyy', { locale: locale }); }, [date]);
|
|
21
|
+
var locale = useContext(ConfigContext).locale;
|
|
22
|
+
var localizedDate = useMemo(function () { return format(date, 'LLLL yyy', { locale: locale }); }, [date, locale]);
|
|
23
23
|
return (_jsxs(DatePickerHeaderWrapper, { children: [_jsx(IconButton, __assign({ variant: "text", onClick: decreaseMonth }, { children: _jsx(PreviousOutlineMd, {}) })), _jsx(DatePickerHeaderTitle, __assign({ variant: "h6" }, { children: localizedDate })), _jsx(IconButton, __assign({ variant: "text", onClick: increaseMonth }, { children: _jsx(NextOutlineMd, {}) }))] }));
|
|
24
24
|
};
|
|
@@ -1,13 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
}
|
|
5
|
-
declare type Props = {
|
|
6
|
-
children: ReactNode;
|
|
7
|
-
/**
|
|
8
|
-
* Локализация
|
|
9
|
-
*/
|
|
10
|
-
locale?: Locale;
|
|
11
|
-
};
|
|
12
|
-
export declare const DatePickerProvider: (props: Props) => JSX.Element;
|
|
13
|
-
export {};
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const DatePickerContext: import("react").Context<import("../ConfigProvider").ConfigContextProps>;
|
|
3
|
+
declare const DatePickerProvider: ({ children, locale, captureException, }: import("../ConfigProvider").ConfigProviderProps) => JSX.Element;
|
|
4
|
+
export { DatePickerContext, DatePickerProvider };
|
|
@@ -1,19 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
};
|
|
12
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
import { createContext } from 'react';
|
|
14
|
-
import ru from 'date-fns/locale/ru';
|
|
15
|
-
export var DatePickerContext = createContext({ locale: ru });
|
|
16
|
-
export var DatePickerProvider = function (props) {
|
|
17
|
-
var children = props.children, _a = props.locale, locale = _a === void 0 ? ru : _a;
|
|
18
|
-
return (_jsx(DatePickerContext.Provider, __assign({ value: { locale: locale } }, { children: children })));
|
|
19
|
-
};
|
|
1
|
+
import { ConfigContext } from '../ConfigProvider';
|
|
2
|
+
import { ConfigProvider } from '../ConfigProvider';
|
|
3
|
+
/*
|
|
4
|
+
* @deprecated Компонент будет удален с выходом версии 2.0. Используйте ConfigProvider
|
|
5
|
+
*/
|
|
6
|
+
var DatePickerContext = ConfigContext;
|
|
7
|
+
/*
|
|
8
|
+
* @deprecated Компонент будет удален с выходом версии 2.0. Используйте ConfigProvider
|
|
9
|
+
*/
|
|
10
|
+
var DatePickerProvider = ConfigProvider;
|
|
11
|
+
export { DatePickerContext, DatePickerProvider };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React, { ErrorInfo, ReactNode } from 'react';
|
|
2
|
+
declare type Props = {
|
|
3
|
+
children: ReactNode;
|
|
4
|
+
captureException?: (errorInfo: ErrorInfo, error: Error) => void;
|
|
5
|
+
};
|
|
6
|
+
declare type State = {
|
|
7
|
+
error: boolean;
|
|
8
|
+
};
|
|
9
|
+
declare class ErrorBoundary extends React.Component<Props, State> {
|
|
10
|
+
state: State;
|
|
11
|
+
static getDerivedStateFromError(): {
|
|
12
|
+
error: boolean;
|
|
13
|
+
};
|
|
14
|
+
componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
|
|
15
|
+
handleReloadPage(): void;
|
|
16
|
+
render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
|
|
17
|
+
}
|
|
18
|
+
export default ErrorBoundary;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
var __extends = (this && this.__extends) || (function () {
|
|
2
|
+
var extendStatics = function (d, b) {
|
|
3
|
+
extendStatics = Object.setPrototypeOf ||
|
|
4
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
5
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
6
|
+
return extendStatics(d, b);
|
|
7
|
+
};
|
|
8
|
+
return function (d, b) {
|
|
9
|
+
if (typeof b !== "function" && b !== null)
|
|
10
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
11
|
+
extendStatics(d, b);
|
|
12
|
+
function __() { this.constructor = d; }
|
|
13
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
14
|
+
};
|
|
15
|
+
})();
|
|
16
|
+
var __assign = (this && this.__assign) || function () {
|
|
17
|
+
__assign = Object.assign || function(t) {
|
|
18
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
19
|
+
s = arguments[i];
|
|
20
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
21
|
+
t[p] = s[p];
|
|
22
|
+
}
|
|
23
|
+
return t;
|
|
24
|
+
};
|
|
25
|
+
return __assign.apply(this, arguments);
|
|
26
|
+
};
|
|
27
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
28
|
+
import React from 'react';
|
|
29
|
+
import { Button } from '../Button';
|
|
30
|
+
import { Typography } from '../Typography';
|
|
31
|
+
import { Grid } from '../Grid';
|
|
32
|
+
var ErrorBoundary = /** @class */ (function (_super) {
|
|
33
|
+
__extends(ErrorBoundary, _super);
|
|
34
|
+
function ErrorBoundary() {
|
|
35
|
+
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
36
|
+
_this.state = {
|
|
37
|
+
error: false,
|
|
38
|
+
};
|
|
39
|
+
return _this;
|
|
40
|
+
}
|
|
41
|
+
ErrorBoundary.getDerivedStateFromError = function () {
|
|
42
|
+
return { error: true };
|
|
43
|
+
};
|
|
44
|
+
ErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
|
|
45
|
+
var _a, _b;
|
|
46
|
+
(_b = (_a = this.props).captureException) === null || _b === void 0 ? void 0 : _b.call(_a, errorInfo, error);
|
|
47
|
+
};
|
|
48
|
+
ErrorBoundary.prototype.handleReloadPage = function () {
|
|
49
|
+
location.reload();
|
|
50
|
+
};
|
|
51
|
+
ErrorBoundary.prototype.render = function () {
|
|
52
|
+
if (this.state.error) {
|
|
53
|
+
return (_jsxs(Grid, __assign({ alignItems: "center", justifyContent: "center" }, { children: [_jsx(Typography, __assign({ variant: "h4", paragraph: true }, { children: "\u041F\u0440\u043E\u0438\u0437\u043E\u0448\u043B\u0430 \u043E\u0448\u0438\u0431\u043A\u0430" })), _jsx(Button, __assign({ onClick: this.handleReloadPage }, { children: "\u041F\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044C \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0443" }))] })));
|
|
54
|
+
}
|
|
55
|
+
return this.props.children;
|
|
56
|
+
};
|
|
57
|
+
return ErrorBoundary;
|
|
58
|
+
}(React.Component));
|
|
59
|
+
export default ErrorBoundary;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ErrorBoundary';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ErrorBoundary';
|
|
@@ -12,7 +12,7 @@ export var PlaceholderRoot = styled.div(templateObject_1 || (templateObject_1 =
|
|
|
12
12
|
return theme.palette.background.paper;
|
|
13
13
|
});
|
|
14
14
|
export var PlaceholderInnerContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n max-width: 384px;\n"], ["\n max-width: 384px;\n"])));
|
|
15
|
-
export var PlaceholderImage = styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n width: 100%;\n height: 162px;\n margin: auto
|
|
15
|
+
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 display: block;\n width: 100%;\n height: 162px;\n margin: auto auto ", ";\n"])), function (_a) {
|
|
16
16
|
var theme = _a.theme;
|
|
17
17
|
return theme.spacing(8);
|
|
18
18
|
});
|
|
@@ -0,0 +1,27 @@
|
|
|
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, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import { useMemo } from 'react';
|
|
14
|
+
import { Typography } from '../../Typography';
|
|
15
|
+
import { CaseWrapper } from './styles';
|
|
16
|
+
export var Case = function (_a) {
|
|
17
|
+
var title = _a.title, _b = _a.descriptionList, descriptionList = _b === void 0 ? [] : _b, children = _a.children;
|
|
18
|
+
var subtitles = useMemo(function () {
|
|
19
|
+
return descriptionList === null || descriptionList === void 0 ? void 0 : descriptionList.map(function (text, index) { return (_jsx(Typography, __assign({ paragraph: true }, { children: text }), index)); });
|
|
20
|
+
}, [descriptionList]);
|
|
21
|
+
return (_jsxs(CaseWrapper, { children: [_jsx(Typography, __assign({ variant: "h5", paragraph: true }, { children: title })), subtitles, _jsx("div", __assign({ style: {
|
|
22
|
+
padding: '32px 0',
|
|
23
|
+
background: '#FAFBFC',
|
|
24
|
+
border: '1px solid #DDE2E8',
|
|
25
|
+
borderRadius: 3,
|
|
26
|
+
} }, { children: children }))] }));
|
|
27
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Case';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Case';
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const CaseWrapper: import("@emotion/styled").StyledComponent<{
|
|
3
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
4
|
+
as?: import("react").ElementType<any> | undefined;
|
|
5
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
import { styled } from '../../styles';
|
|
6
|
+
export var CaseWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-top: ", ";\n margin-bottom: ", ";\n"], ["\n margin-top: ", ";\n margin-bottom: ", ";\n"])), function (_a) {
|
|
7
|
+
var theme = _a.theme;
|
|
8
|
+
return theme.spacing(6);
|
|
9
|
+
}, function (_a) {
|
|
10
|
+
var theme = _a.theme;
|
|
11
|
+
return theme.spacing(6);
|
|
12
|
+
});
|
|
13
|
+
var templateObject_1;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
declare type ExampleTemplateProps = {
|
|
3
|
+
children?: ReactNode;
|
|
4
|
+
};
|
|
5
|
+
export declare const ExampleTemplate: {
|
|
6
|
+
({ children }: ExampleTemplateProps): JSX.Element;
|
|
7
|
+
Case: ({ title, descriptionList, children }: {
|
|
8
|
+
title: string;
|
|
9
|
+
descriptionList?: string[] | undefined;
|
|
10
|
+
children: ReactNode;
|
|
11
|
+
}) => JSX.Element;
|
|
12
|
+
};
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
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 { useMediaQuery, useTheme } from '@mui/material';
|
|
14
|
+
import { Case } from '../Case';
|
|
15
|
+
import { ExampleTemplateWrapper } from './styles';
|
|
16
|
+
export var ExampleTemplate = function (_a) {
|
|
17
|
+
var children = _a.children;
|
|
18
|
+
var theme = useTheme();
|
|
19
|
+
var matches = useMediaQuery(theme.breakpoints.down('sm'));
|
|
20
|
+
return (_jsx(ExampleTemplateWrapper, __assign({ matches: matches }, { children: children })));
|
|
21
|
+
};
|
|
22
|
+
ExampleTemplate.Case = Case;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ExampleTemplate';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './ExampleTemplate';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare type ExampleTemplateWrapperProps = {
|
|
3
|
+
matches: boolean;
|
|
4
|
+
};
|
|
5
|
+
export declare const ExampleTemplateWrapper: import("@emotion/styled").StyledComponent<{
|
|
6
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
7
|
+
as?: import("react").ElementType<any> | undefined;
|
|
8
|
+
} & ExampleTemplateWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
import { styled } from '../../styles';
|
|
6
|
+
export var ExampleTemplateWrapper = styled.section(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
7
|
+
var matches = _a.matches;
|
|
8
|
+
return (matches ? '100%' : '70%');
|
|
9
|
+
});
|
|
10
|
+
var templateObject_1;
|
package/esm/index.d.ts
CHANGED
|
@@ -4,16 +4,17 @@ export * from './Autocomplete';
|
|
|
4
4
|
export * from './BackdropStack';
|
|
5
5
|
export * from './Badge';
|
|
6
6
|
export * from './Button';
|
|
7
|
+
export * from './DatePickerProvider';
|
|
7
8
|
export * from './Description';
|
|
8
9
|
export * from './Divider';
|
|
9
10
|
export * from './ButtonBase';
|
|
10
11
|
export * from './Checkbox';
|
|
11
12
|
export * from './CircularProgress';
|
|
13
|
+
export * from './ConfigProvider';
|
|
12
14
|
export * from './DashboardLayout';
|
|
13
15
|
export * from './DataGrid';
|
|
14
16
|
export * from './DataGridPagination';
|
|
15
17
|
export * from './DatePicker';
|
|
16
|
-
export * from './DatePickerProvider';
|
|
17
18
|
export * from './Dialog';
|
|
18
19
|
export * from './DialogActions';
|
|
19
20
|
export * from './DialogContent';
|
package/esm/index.js
CHANGED
|
@@ -4,16 +4,17 @@ export * from './Autocomplete';
|
|
|
4
4
|
export * from './BackdropStack';
|
|
5
5
|
export * from './Badge';
|
|
6
6
|
export * from './Button';
|
|
7
|
+
export * from './DatePickerProvider';
|
|
7
8
|
export * from './Description';
|
|
8
9
|
export * from './Divider';
|
|
9
10
|
export * from './ButtonBase';
|
|
10
11
|
export * from './Checkbox';
|
|
11
12
|
export * from './CircularProgress';
|
|
13
|
+
export * from './ConfigProvider';
|
|
12
14
|
export * from './DashboardLayout';
|
|
13
15
|
export * from './DataGrid';
|
|
14
16
|
export * from './DataGridPagination';
|
|
15
17
|
export * from './DatePicker';
|
|
16
|
-
export * from './DatePickerProvider';
|
|
17
18
|
export * from './Dialog';
|
|
18
19
|
export * from './DialogActions';
|
|
19
20
|
export * from './DialogContent';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { BreakpointsOptions, Palette as MuiPalette, Theme as MuiTheme, PaletteColor, ThemeOptions } from '@mui/material/styles';
|
|
2
|
-
import { Background, Color } from '
|
|
3
|
-
import { FontsUrls } from '
|
|
4
|
-
import { Brand } from '
|
|
2
|
+
import { Background, Color } from '../palette';
|
|
3
|
+
import { FontsUrls } from '../components';
|
|
4
|
+
import { Brand } from '../constants';
|
|
5
5
|
export declare type Palette = Omit<MuiPalette, 'grey' | 'background'> & {
|
|
6
6
|
red: Color;
|
|
7
7
|
green: Color;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { createTheme as createMuiTheme, } from '@mui/material/styles';
|
|
2
2
|
import { merge } from 'lodash-es';
|
|
3
|
-
import { typography } from '
|
|
4
|
-
import { getPalette } from '
|
|
5
|
-
import { getComponents } from '
|
|
6
|
-
import { SPACING } from '
|
|
7
|
-
import { elevation } from '
|
|
8
|
-
import { shape } from '
|
|
9
|
-
import { defaultBreakpoints } from '
|
|
3
|
+
import { typography } from '../typography';
|
|
4
|
+
import { getPalette } from '../palette';
|
|
5
|
+
import { getComponents } from '../components';
|
|
6
|
+
import { SPACING } from '../constants';
|
|
7
|
+
import { elevation } from '../elevation';
|
|
8
|
+
import { shape } from '../shape';
|
|
9
|
+
import { defaultBreakpoints } from '../breakpoints';
|
|
10
10
|
export var createTheme = function (params) {
|
|
11
11
|
var brand = params.brand, options = params.options, fontsUrls = params.fontsUrls, _a = params.breakpoints, breakpoints = _a === void 0 ? defaultBreakpoints : _a;
|
|
12
12
|
var themeOptions = {
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './baseTheme';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './baseTheme';
|
package/index.d.ts
CHANGED
|
@@ -4,16 +4,17 @@ export * from './Autocomplete';
|
|
|
4
4
|
export * from './BackdropStack';
|
|
5
5
|
export * from './Badge';
|
|
6
6
|
export * from './Button';
|
|
7
|
+
export * from './DatePickerProvider';
|
|
7
8
|
export * from './Description';
|
|
8
9
|
export * from './Divider';
|
|
9
10
|
export * from './ButtonBase';
|
|
10
11
|
export * from './Checkbox';
|
|
11
12
|
export * from './CircularProgress';
|
|
13
|
+
export * from './ConfigProvider';
|
|
12
14
|
export * from './DashboardLayout';
|
|
13
15
|
export * from './DataGrid';
|
|
14
16
|
export * from './DataGridPagination';
|
|
15
17
|
export * from './DatePicker';
|
|
16
|
-
export * from './DatePickerProvider';
|
|
17
18
|
export * from './Dialog';
|
|
18
19
|
export * from './DialogActions';
|
|
19
20
|
export * from './DialogContent';
|
package/index.js
CHANGED
|
@@ -20,16 +20,17 @@ __exportStar(require("./Autocomplete"), exports);
|
|
|
20
20
|
__exportStar(require("./BackdropStack"), exports);
|
|
21
21
|
__exportStar(require("./Badge"), exports);
|
|
22
22
|
__exportStar(require("./Button"), exports);
|
|
23
|
+
__exportStar(require("./DatePickerProvider"), exports);
|
|
23
24
|
__exportStar(require("./Description"), exports);
|
|
24
25
|
__exportStar(require("./Divider"), exports);
|
|
25
26
|
__exportStar(require("./ButtonBase"), exports);
|
|
26
27
|
__exportStar(require("./Checkbox"), exports);
|
|
27
28
|
__exportStar(require("./CircularProgress"), exports);
|
|
29
|
+
__exportStar(require("./ConfigProvider"), exports);
|
|
28
30
|
__exportStar(require("./DashboardLayout"), exports);
|
|
29
31
|
__exportStar(require("./DataGrid"), exports);
|
|
30
32
|
__exportStar(require("./DataGridPagination"), exports);
|
|
31
33
|
__exportStar(require("./DatePicker"), exports);
|
|
32
|
-
__exportStar(require("./DatePickerProvider"), exports);
|
|
33
34
|
__exportStar(require("./Dialog"), exports);
|
|
34
35
|
__exportStar(require("./DialogActions"), exports);
|
|
35
36
|
__exportStar(require("./DialogContent"), exports);
|
package/package.json
CHANGED
|
@@ -1,13 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@astral/ui",
|
|
3
3
|
"browser": "./src/index.ts",
|
|
4
|
-
"jest": {
|
|
5
|
-
"moduleNameMapper": {
|
|
6
|
-
"^lodash-es$": "lodash"
|
|
7
|
-
}
|
|
8
|
-
},
|
|
9
4
|
"dependencies": {
|
|
10
|
-
"@astral/icons": "^1.
|
|
5
|
+
"@astral/icons": "^1.15.0",
|
|
11
6
|
"@emotion/cache": "11.7.1",
|
|
12
7
|
"@emotion/react": "11.9.0",
|
|
13
8
|
"@emotion/server": "11.4.0",
|
|
@@ -36,7 +31,7 @@
|
|
|
36
31
|
"require": "./server/index.js"
|
|
37
32
|
}
|
|
38
33
|
},
|
|
39
|
-
"version": "1.
|
|
34
|
+
"version": "1.15.0",
|
|
40
35
|
"author": "Astral.Soft",
|
|
41
36
|
"license": "MIT",
|
|
42
37
|
"repository": {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { BreakpointsOptions, Palette as MuiPalette, Theme as MuiTheme, PaletteColor, ThemeOptions } from '@mui/material/styles';
|
|
2
|
-
import { Background, Color } from '
|
|
3
|
-
import { FontsUrls } from '
|
|
4
|
-
import { Brand } from '
|
|
2
|
+
import { Background, Color } from '../palette';
|
|
3
|
+
import { FontsUrls } from '../components';
|
|
4
|
+
import { Brand } from '../constants';
|
|
5
5
|
export declare type Palette = Omit<MuiPalette, 'grey' | 'background'> & {
|
|
6
6
|
red: Color;
|
|
7
7
|
green: Color;
|
|
@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.createTheme = void 0;
|
|
4
4
|
var styles_1 = require("@mui/material/styles");
|
|
5
5
|
var lodash_es_1 = require("lodash-es");
|
|
6
|
-
var typography_1 = require("
|
|
7
|
-
var palette_1 = require("
|
|
8
|
-
var components_1 = require("
|
|
9
|
-
var constants_1 = require("
|
|
10
|
-
var elevation_1 = require("
|
|
11
|
-
var shape_1 = require("
|
|
12
|
-
var breakpoints_1 = require("
|
|
6
|
+
var typography_1 = require("../typography");
|
|
7
|
+
var palette_1 = require("../palette");
|
|
8
|
+
var components_1 = require("../components");
|
|
9
|
+
var constants_1 = require("../constants");
|
|
10
|
+
var elevation_1 = require("../elevation");
|
|
11
|
+
var shape_1 = require("../shape");
|
|
12
|
+
var breakpoints_1 = require("../breakpoints");
|
|
13
13
|
var createTheme = function (params) {
|
|
14
14
|
var brand = params.brand, options = params.options, fontsUrls = params.fontsUrls, _a = params.breakpoints, breakpoints = _a === void 0 ? breakpoints_1.defaultBreakpoints : _a;
|
|
15
15
|
var themeOptions = {
|
|
File without changes
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
var baseTheme_1 = require("../baseTheme");
|
|
4
3
|
var constants_1 = require("../constants");
|
|
4
|
+
var baseTheme_1 = require("./baseTheme");
|
|
5
5
|
describe('createTheme', function () {
|
|
6
6
|
var fontsUrls = {
|
|
7
7
|
bold: {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './baseTheme';
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
__exportStar(require("./baseTheme"), exports);
|