@astral/ui 0.9.0 → 0.10.0

package/Dialog/Dialog.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogProps } from './types';
+export declare const Dialog: ({ children, title, disableBackdropClick, onClose, ...props }: DialogProps) => JSX.Element;

package/Dialog/Dialog.js

@@ -0,0 +1,39 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dialog = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var index_1 = require("../index");
+var Dialog = function (_a) {
+    var children = _a.children, title = _a.title, disableBackdropClick = _a.disableBackdropClick, onClose = _a.onClose, props = __rest(_a, ["children", "title", "disableBackdropClick", "onClose"]);
+    var handleClose = onClose &&
+        (function (event, reason) {
+            if (disableBackdropClick && reason == 'backdropClick')
+                return;
+            onClose(event, reason);
+        });
+    return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, __assign({ onClose: handleClose }, props, { children: [title && (0, jsx_runtime_1.jsx)(index_1.DialogTitle, __assign({ onClose: onClose }, { children: title }), void 0), children] }), void 0));
+};
+exports.Dialog = Dialog;

package/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Dialog';
+export * from './types';

package/Dialog/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Dialog"), exports);
+__exportStar(require("./types"), exports);

package/Dialog/types.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DialogProps as MuiDialogProps } from '@mui/material';
+export declare type DialogProps = Omit<MuiDialogProps, 'onClose'> & {
+    title?: string;
+    disableBackdropClick?: boolean;
+    onClose?: (event?: React.MouseEvent<HTMLButtonElement>, reason?: 'backdropClick' | 'escapeKeyDown') => void;
+};

package/Dialog/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/DialogActions/DialogActions.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogActionsProps } from '@mui/material';
+export declare const DialogActions: ({ children, disableSpacing, ...props }: DialogActionsProps) => JSX.Element;

package/DialogActions/DialogActions.js

@@ -0,0 +1,33 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogActions = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var Grid_1 = require("../Grid");
+var DialogActions = function (_a) {
+    var children = _a.children, disableSpacing = _a.disableSpacing, props = __rest(_a, ["children", "disableSpacing"]);
+    return ((0, jsx_runtime_1.jsx)(material_1.DialogActions, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(Grid_1.Grid, __assign({ container: true, autoFlow: "column", justifyContent: "end", spacing: disableSpacing ? 0 : 2 }, { children: children }), void 0) }), void 0));
+};
+exports.DialogActions = DialogActions;

package/DialogActions/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogActions';

package/DialogActions/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DialogActions"), exports);

package/DialogContent/DialogContent.d.ts

@@ -0,0 +1 @@
+export { DialogContent } from '@mui/material';

package/DialogContent/DialogContent.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogContent = void 0;
+var material_1 = require("@mui/material");
+Object.defineProperty(exports, "DialogContent", { enumerable: true, get: function () { return material_1.DialogContent; } });

package/DialogContent/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogContent';

package/DialogContent/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DialogContent"), exports);

package/DialogContentText/DialogContentText.d.ts

@@ -0,0 +1 @@
+export { DialogContentText } from '@mui/material';

package/DialogContentText/DialogContentText.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogContentText = void 0;
+var material_1 = require("@mui/material");
+Object.defineProperty(exports, "DialogContentText", { enumerable: true, get: function () { return material_1.DialogContentText; } });

package/DialogContentText/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogContentText';

package/DialogContentText/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DialogContentText"), exports);

package/DialogTitle/DialogTitle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogTitleProps } from './types';
+export declare const DialogTitle: ({ children, onClose, ...props }: DialogTitleProps) => JSX.Element;

package/DialogTitle/DialogTitle.js

@@ -0,0 +1,34 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogTitle = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var icons_1 = require("@astral/icons");
+var IconButton_1 = require("../IconButton");
+var DialogTitle = function (_a) {
+    var children = _a.children, onClose = _a.onClose, props = __rest(_a, ["children", "onClose"]);
+    return ((0, jsx_runtime_1.jsxs)(material_1.DialogTitle, __assign({}, props, { children: [children, onClose && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, __assign({ variant: "text", onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(icons_1.CrossOutlineMd, {}, void 0) }), void 0))] }), void 0));
+};
+exports.DialogTitle = DialogTitle;

package/DialogTitle/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DialogTitle';
+export * from './types';

package/DialogTitle/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./DialogTitle"), exports);
+__exportStar(require("./types"), exports);

package/DialogTitle/types.d.ts

@@ -0,0 +1,4 @@
+import { DialogTitleProps as MuiDialogTitleProps } from '@mui/material';
+export declare type DialogTitleProps = MuiDialogTitleProps & {
+    onClose?: () => void;
+};

package/DialogTitle/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/esm/Dialog/Dialog.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogProps } from './types';
+export declare const Dialog: ({ children, title, disableBackdropClick, onClose, ...props }: DialogProps) => JSX.Element;

package/esm/Dialog/Dialog.js

@@ -0,0 +1,35 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Dialog as MuiDialog } from '@mui/material';
+import { DialogTitle } from '../index';
+export var Dialog = function (_a) {
+    var children = _a.children, title = _a.title, disableBackdropClick = _a.disableBackdropClick, onClose = _a.onClose, props = __rest(_a, ["children", "title", "disableBackdropClick", "onClose"]);
+    var handleClose = onClose &&
+        (function (event, reason) {
+            if (disableBackdropClick && reason == 'backdropClick')
+                return;
+            onClose(event, reason);
+        });
+    return (_jsxs(MuiDialog, __assign({ onClose: handleClose }, props, { children: [title && _jsx(DialogTitle, __assign({ onClose: onClose }, { children: title }), void 0), children] }), void 0));
+};

package/esm/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Dialog';
+export * from './types';

package/esm/Dialog/index.js

@@ -0,0 +1,2 @@
+export * from './Dialog';
+export * from './types';

package/esm/Dialog/types.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DialogProps as MuiDialogProps } from '@mui/material';
+export declare type DialogProps = Omit<MuiDialogProps, 'onClose'> & {
+    title?: string;
+    disableBackdropClick?: boolean;
+    onClose?: (event?: React.MouseEvent<HTMLButtonElement>, reason?: 'backdropClick' | 'escapeKeyDown') => void;
+};

package/esm/Dialog/types.js

@@ -0,0 +1 @@
+export {};

package/esm/DialogActions/DialogActions.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogActionsProps } from '@mui/material';
+export declare const DialogActions: ({ children, disableSpacing, ...props }: DialogActionsProps) => JSX.Element;

package/esm/DialogActions/DialogActions.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DialogActions as MuiDialogActions, } from '@mui/material';
+import { Grid } from '../Grid';
+export var DialogActions = function (_a) {
+    var children = _a.children, disableSpacing = _a.disableSpacing, props = __rest(_a, ["children", "disableSpacing"]);
+    return (_jsx(MuiDialogActions, __assign({}, props, { children: _jsx(Grid, __assign({ container: true, autoFlow: "column", justifyContent: "end", spacing: disableSpacing ? 0 : 2 }, { children: children }), void 0) }), void 0));
+};

package/esm/DialogActions/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogActions';

package/esm/DialogActions/index.js

@@ -0,0 +1 @@
+export * from './DialogActions';

package/esm/DialogContent/DialogContent.d.ts

@@ -0,0 +1 @@
+export { DialogContent } from '@mui/material';

package/esm/DialogContent/DialogContent.js

@@ -0,0 +1 @@
+export { DialogContent } from '@mui/material';

package/esm/DialogContent/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogContent';

package/esm/DialogContent/index.js

@@ -0,0 +1 @@
+export * from './DialogContent';

package/esm/DialogContentText/DialogContentText.d.ts

@@ -0,0 +1 @@
+export { DialogContentText } from '@mui/material';

package/esm/DialogContentText/DialogContentText.js

@@ -0,0 +1 @@
+export { DialogContentText } from '@mui/material';

package/esm/DialogContentText/index.d.ts

@@ -0,0 +1 @@
+export * from './DialogContentText';

package/esm/DialogContentText/index.js

@@ -0,0 +1 @@
+export * from './DialogContentText';

package/esm/DialogTitle/DialogTitle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { DialogTitleProps } from './types';
+export declare const DialogTitle: ({ children, onClose, ...props }: DialogTitleProps) => JSX.Element;

package/esm/DialogTitle/DialogTitle.js

@@ -0,0 +1,30 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DialogTitle as MuiDialogTitle } from '@mui/material';
+import { CrossOutlineMd } from '@astral/icons';
+import { IconButton } from '../IconButton';
+export var DialogTitle = function (_a) {
+    var children = _a.children, onClose = _a.onClose, props = __rest(_a, ["children", "onClose"]);
+    return (_jsxs(MuiDialogTitle, __assign({}, props, { children: [children, onClose && (_jsx(IconButton, __assign({ variant: "text", onClick: onClose }, { children: _jsx(CrossOutlineMd, {}, void 0) }), void 0))] }), void 0));
+};

package/esm/DialogTitle/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DialogTitle';
+export * from './types';

package/esm/DialogTitle/index.js

@@ -0,0 +1,2 @@
+export * from './DialogTitle';
+export * from './types';

package/esm/DialogTitle/types.d.ts

@@ -0,0 +1,4 @@
+import { DialogTitleProps as MuiDialogTitleProps } from '@mui/material';
+export declare type DialogTitleProps = MuiDialogTitleProps & {
+    onClose?: () => void;
+};

package/esm/DialogTitle/types.js

@@ -0,0 +1 @@
+export {};

package/esm/index.d.ts

@@ -22,3 +22,8 @@ export * from './TextArea';
 export * from './DashboardLayout';
 export * from './Autocomplete';
 export * from './Select';
+export * from './Dialog';
+export * from './DialogTitle';
+export * from './DialogContent';
+export * from './DialogContentText';
+export * from './DialogActions';

package/esm/index.js

@@ -22,3 +22,8 @@ export * from './TextArea';
 export * from './DashboardLayout';
 export * from './Autocomplete';
 export * from './Select';
+export * from './Dialog';
+export * from './DialogTitle';
+export * from './DialogContent';
+export * from './DialogContentText';
+export * from './DialogActions';

package/esm/theme/components/MuiDialog.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialog: Components<Theme>['MuiDialog'];

package/esm/theme/components/MuiDialog.js

@@ -0,0 +1,16 @@
+export var MuiDialog = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                background: theme.palette.background.modalShadow,
+            };
+        },
+        paper: function (_a) {
+            var theme = _a.theme;
+            return {
+                borderRadius: theme.shape.small,
+            };
+        },
+    },
+};

package/esm/theme/components/MuiDialogActions.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogActions: Components<Theme>['MuiDialogActions'];

package/esm/theme/components/MuiDialogActions.js

@@ -0,0 +1,13 @@
+export var MuiDialogActions = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(4, 6, 6, 6),
+                '>div': {
+                    width: '100%',
+                },
+            };
+        },
+    },
+};

package/esm/theme/components/MuiDialogContent.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogContent: Components<Theme>['MuiDialogContent'];

package/esm/theme/components/MuiDialogContent.js

@@ -0,0 +1,10 @@
+export var MuiDialogContent = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(0, 6),
+            };
+        },
+    },
+};

package/esm/theme/components/MuiDialogTitle.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogTitle: Components<Theme>['MuiDialogTitle'];

package/esm/theme/components/MuiDialogTitle.js

@@ -0,0 +1,19 @@
+export var MuiDialogTitle = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(6),
+                fontSize: theme.typography.h4.fontSize,
+                fontWeight: theme.typography.h4.fontWeight,
+                lineHeight: theme.typography.h4.lineHeight,
+                '& .ButtonUnstyled-root': {
+                    position: 'absolute',
+                    right: theme.spacing(5),
+                    top: theme.spacing(5),
+                    color: theme.palette.grey[800],
+                },
+            };
+        },
+    },
+};

package/esm/theme/components/components.js

@@ -6,6 +6,10 @@ import { MuiInputLabel } from './MuiInputLabel';
 import { MuiOutlinedInput } from './MuiOutlinedInput';
 import { MuiTypography } from './MuiTypography';
 import { MuiAutocomplete } from './MuiAutocomplete';
+import { MuiDialog } from './MuiDialog';
+import { MuiDialogTitle } from './MuiDialogTitle';
+import { MuiDialogContent } from './MuiDialogContent';
+import { MuiDialogActions } from './MuiDialogActions';
 var getMuiCssBaseline = function (fontUrls) { return ({
     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  "),
 }); };
@@ -68,4 +72,8 @@ export var getComponents = function (fontUrls) { return ({
     MuiMenu: MuiMenu,
     MuiMenuItem: MuiMenuItem,
     MuiRadio: MuiRadio,
+    MuiDialog: MuiDialog,
+    MuiDialogTitle: MuiDialogTitle,
+    MuiDialogContent: MuiDialogContent,
+    MuiDialogActions: MuiDialogActions,
 }); };

package/esm/theme/palette/palette.d.ts

@@ -16,6 +16,7 @@ export declare type PrimaryColorOptions = PaletteColorOptions & Color;
 export declare type Background = TypeBackground & {
     element: string;
     elementHover: string;
+    modalShadow: string;
 };
 declare type PaletteOptions = MuiPaletteOptions & {
     red: Color;

package/esm/theme/palette/palette.js

@@ -99,6 +99,7 @@ export var getPalette = function (brand) {
             paper: '#FFF',
             element: '#FAFBFC',
             elementHover: '#EBECF0',
+            modalShadow: '#142A438A',
         },
     };
 };

package/index.d.ts

@@ -22,3 +22,8 @@ export * from './TextArea';
 export * from './DashboardLayout';
 export * from './Autocomplete';
 export * from './Select';
+export * from './Dialog';
+export * from './DialogTitle';
+export * from './DialogContent';
+export * from './DialogContentText';
+export * from './DialogActions';

package/index.js

@@ -34,3 +34,8 @@ __exportStar(require("./TextArea"), exports);
 __exportStar(require("./DashboardLayout"), exports);
 __exportStar(require("./Autocomplete"), exports);
 __exportStar(require("./Select"), exports);
+__exportStar(require("./Dialog"), exports);
+__exportStar(require("./DialogTitle"), exports);
+__exportStar(require("./DialogContent"), exports);
+__exportStar(require("./DialogContentText"), exports);
+__exportStar(require("./DialogActions"), exports);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "browser": "./src/index.ts",
   "jest": {
     "moduleNameMapper": {
@@ -8,7 +8,7 @@
     }
   },
   "dependencies": {
-    "@astral/icons": "^0.9.0-preview",
+    "@astral/icons": "^0.9.0",
     "@emotion/cache": "11.7.1",
     "@emotion/react": "11.8.1",
     "@emotion/server": "11.4.0",

package/theme/components/MuiDialog.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialog: Components<Theme>['MuiDialog'];

package/theme/components/MuiDialog.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiDialog = void 0;
+exports.MuiDialog = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                background: theme.palette.background.modalShadow,
+            };
+        },
+        paper: function (_a) {
+            var theme = _a.theme;
+            return {
+                borderRadius: theme.shape.small,
+            };
+        },
+    },
+};

package/theme/components/MuiDialogActions.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogActions: Components<Theme>['MuiDialogActions'];

package/theme/components/MuiDialogActions.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiDialogActions = void 0;
+exports.MuiDialogActions = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(4, 6, 6, 6),
+                '>div': {
+                    width: '100%',
+                },
+            };
+        },
+    },
+};

package/theme/components/MuiDialogContent.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogContent: Components<Theme>['MuiDialogContent'];

package/theme/components/MuiDialogContent.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiDialogContent = void 0;
+exports.MuiDialogContent = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(0, 6),
+            };
+        },
+    },
+};

package/theme/components/MuiDialogTitle.d.ts

@@ -0,0 +1,3 @@
+import { Components } from '@mui/material';
+import type { Theme } from '../baseTheme';
+export declare const MuiDialogTitle: Components<Theme>['MuiDialogTitle'];

package/theme/components/MuiDialogTitle.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiDialogTitle = void 0;
+exports.MuiDialogTitle = {
+    styleOverrides: {
+        root: function (_a) {
+            var theme = _a.theme;
+            return {
+                padding: theme.spacing(6),
+                fontSize: theme.typography.h4.fontSize,
+                fontWeight: theme.typography.h4.fontWeight,
+                lineHeight: theme.typography.h4.lineHeight,
+                '& .ButtonUnstyled-root': {
+                    position: 'absolute',
+                    right: theme.spacing(5),
+                    top: theme.spacing(5),
+                    color: theme.palette.grey[800],
+                },
+            };
+        },
+    },
+};

package/theme/components/components.js

@@ -9,6 +9,10 @@ var MuiInputLabel_1 = require("./MuiInputLabel");
 var MuiOutlinedInput_1 = require("./MuiOutlinedInput");
 var MuiTypography_1 = require("./MuiTypography");
 var MuiAutocomplete_1 = require("./MuiAutocomplete");
+var MuiDialog_1 = require("./MuiDialog");
+var MuiDialogTitle_1 = require("./MuiDialogTitle");
+var MuiDialogContent_1 = require("./MuiDialogContent");
+var MuiDialogActions_1 = require("./MuiDialogActions");
 var getMuiCssBaseline = function (fontUrls) { return ({
     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  "),
 }); };
@@ -71,5 +75,9 @@ var getComponents = function (fontUrls) { return ({
     MuiMenu: MuiMenu,
     MuiMenuItem: MuiMenuItem,
     MuiRadio: MuiRadio,
+    MuiDialog: MuiDialog_1.MuiDialog,
+    MuiDialogTitle: MuiDialogTitle_1.MuiDialogTitle,
+    MuiDialogContent: MuiDialogContent_1.MuiDialogContent,
+    MuiDialogActions: MuiDialogActions_1.MuiDialogActions,
 }); };
 exports.getComponents = getComponents;

package/theme/palette/palette.d.ts

@@ -16,6 +16,7 @@ export declare type PrimaryColorOptions = PaletteColorOptions & Color;
 export declare type Background = TypeBackground & {
     element: string;
     elementHover: string;
+    modalShadow: string;
 };
 declare type PaletteOptions = MuiPaletteOptions & {
     red: Color;

package/theme/palette/palette.js

@@ -102,6 +102,7 @@ var getPalette = function (brand) {
             paper: '#FFF',
             element: '#FAFBFC',
             elementHover: '#EBECF0',
+            modalShadow: '#142A438A',
         },
     };
 };