@astral/ui 0.4.0 → 0.4.1-alpha.10

package/{types/src/Badge → Badge}/styled.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import { Theme } from '../theme';
 import { BadgeColor, BadgeProps } from './types';
 export declare const StyledBadge: import("@emotion/styled").StyledComponent<{
     classes?: (Partial<import("@mui/material").BadgeUnstyledClasses> & {
@@ -43,8 +42,8 @@ export declare const StyledBadge: import("@emotion/styled").StyledComponent<{
     variant?: string | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, "components" | "color" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "componentsProps" | "invisible" | "anchorOrigin" | "overlap" | "badgeContent" | "max" | "showZero"> & {
-    theme?: Theme | undefined;
+}, "color" | "components" | keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | "componentsProps" | "invisible" | "anchorOrigin" | "overlap" | "badgeContent" | "max" | "showZero"> & {
+    theme?: import("@emotion/react").Theme | undefined;
 } & Omit<BadgeProps, "color"> & {
     customColor: BadgeColor;
 }, {}, {}>;

package/{types/src/Button → Button}/styled.d.ts

@@ -1,11 +1,10 @@
 /// <reference types="react" />
-import { Theme } from '../theme';
 export declare const StyledButton: import("@emotion/styled").StyledComponent<Omit<import("@mui/base/ButtonUnstyled/ButtonUnstyledProps").default<"button", {}>, "color" | "variant" | "size"> & {
     color?: "primary" | "error" | "warning" | "success" | undefined;
     variant?: "link" | "light" | "text" | "contained" | undefined;
     size?: "large" | "medium" | undefined;
 } & {
-    theme?: Theme | undefined;
+    theme?: import("@emotion/react").Theme | undefined;
 } & {
     loading?: boolean | undefined;
     startIcon?: import("react").ReactNode;

package/{types/src/ButtonBase → ButtonBase}/styled.d.ts

@@ -19,7 +19,7 @@ export declare const getDisabledBgColor: ({ theme, customVariant, }: StyledButto
 export declare const StyledButtonBase: import("@emotion/styled").StyledComponent<Pick<import("@mui/base/ButtonUnstyled").ButtonUnstyledOwnProps & Omit<any, keyof import("@mui/base/ButtonUnstyled").ButtonUnstyledOwnProps> & {
     component?: import("react").ElementType<any> | undefined;
 }, string | number | symbol> & import("react").RefAttributes<any> & {
-    theme?: Theme | undefined;
+    theme?: import("@emotion/react").Theme | undefined;
 } & Omit<BaseButtonProps, "color" | "variant"> & {
     customColor?: "primary" | "error" | "warning" | "success" | undefined;
     customVariant?: "link" | "light" | "text" | "contained" | undefined;

package/{types/src/Checkbox → Checkbox}/styled.d.ts

@@ -1,4 +1,4 @@
 import { CheckboxProps } from './types';
 export declare const StyledCheckbox: import("@emotion/styled").StyledComponent<import("@mui/material").CheckboxProps & {
-    theme?: import("..").Theme | undefined;
+    theme?: import("@emotion/react").Theme | undefined;
 } & CheckboxProps, {}, {}>;

package/{types/src/CircularProgress → CircularProgress}/styled.d.ts

@@ -1,7 +1,6 @@
-import { Theme } from '../theme';
 import { CircularProgressProps } from './types';
 export declare const StyledCircularProgress: import("@emotion/styled").StyledComponent<import("@mui/material").CircularProgressProps & {
-    theme?: Theme | undefined;
+    theme?: import("@emotion/react").Theme | undefined;
 } & Omit<CircularProgressProps, "color" | "size"> & {
     customColor?: "primary" | "inverted" | undefined;
 }, {}, {}>;

package/DashboardLayout/DashboardLayout.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+interface DashBoardLayoutProps {
+    children: ReactNode;
+}
+export declare const DashboardLayout: {
+    ({ children }: DashBoardLayoutProps): JSX.Element;
+    Header: import("react").ForwardRefExoticComponent<import("./Header/types").HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
+    SideBar: import("react").ForwardRefExoticComponent<{
+        children: ReactNode;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+    Main: import("react").ForwardRefExoticComponent<{
+        children: ReactNode;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};
+export default DashboardLayout;

package/DashboardLayout/DashboardLayout.js

@@ -0,0 +1,28 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DashboardLayout = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Header_1 = require("./Header/");
+var SideBar_1 = require("./SideBar/");
+var Main_1 = require("./Main/");
+var styled_1 = require("./styled");
+var DashboardLayout = function (_a) {
+    var children = _a.children;
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledDashboard, __assign({ container: true, templateColumns: "auto 1fr", templateRows: "auto 1fr" }, { children: children }), void 0));
+};
+exports.DashboardLayout = DashboardLayout;
+exports.DashboardLayout.Header = Header_1.Header;
+exports.DashboardLayout.SideBar = SideBar_1.SideBar;
+exports.DashboardLayout.Main = Main_1.Main;
+exports.default = exports.DashboardLayout;

package/DashboardLayout/Header/Header.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { HeaderProps } from './types';
+export declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Header;

package/DashboardLayout/Header/Header.js

@@ -0,0 +1,22 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = require("./styled");
+exports.Header = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, logoSrc = _a.logoSrc, logoAlt = _a.logoAlt, LogoLink = _a.LogoLink, Widget = _a.Widget;
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledHeader, __assign({ ref: ref }, { children: (0, jsx_runtime_1.jsxs)(styled_1.InnerContainer, { children: [(0, jsx_runtime_1.jsxs)(styled_1.LeftContainer, { children: [Widget && (0, jsx_runtime_1.jsx)(Widget, {}, void 0), (0, jsx_runtime_1.jsx)(styled_1.LogoContainer, __assign({ withWidget: !!Widget }, { children: (0, jsx_runtime_1.jsx)(LogoLink, { Logo: (0, jsx_runtime_1.jsx)(styled_1.LogoStyle, { src: logoSrc, alt: logoAlt }, void 0) }, void 0) }), void 0)] }, void 0), children] }, void 0) }), void 0));
+});
+exports.default = exports.Header;

package/DashboardLayout/Header/index.d.ts

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

package/DashboardLayout/Header/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("./Header"), exports);
+__exportStar(require("./types"), exports);

package/DashboardLayout/Header/styled.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+export declare const StyledHeader: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const InnerContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LeftContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LogoContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    withWidget: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LogoStyle: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

package/DashboardLayout/Header/styled.js

@@ -0,0 +1,32 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LogoStyle = exports.LogoContainer = exports.LeftContainer = exports.InnerContainer = exports.StyledHeader = void 0;
+var styles_1 = require("../../styles");
+exports.StyledHeader = (0, styles_1.styled)('header')(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  grid-column: 1 / -1;\n  min-height: 56px;\n  height: 56px;\n  width: 100%;\n  z-index: ", ";\n  box-shadow: ", ";\n  padding: 0 ", ";\n  background-color: ", ";\n"], ["\n  grid-column: 1 / -1;\n  min-height: 56px;\n  height: 56px;\n  width: 100%;\n  z-index: ", ";\n  box-shadow: ", ";\n  padding: 0 ", ";\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.zIndex.appBar;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.elevation[200];
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(5);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.background.default;
+});
+exports.InnerContainer = (0, styles_1.styled)('div')(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  height: 100%;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  height: 100%;\n"])));
+exports.LeftContainer = (0, styles_1.styled)('div')(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  height: 100%;\n  align-items: center;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  height: 100%;\n  align-items: center;\n"])));
+exports.LogoContainer = (0, styles_1.styled)('div')(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-left: ", ";\n  margin-right: ", ";\n  max-height: 24px;\n  height: 100%;\n  > * {\n    height: 100%;\n  }\n"], ["\n  margin-left: ", ";\n  margin-right: ", ";\n  max-height: 24px;\n  height: 100%;\n  > * {\n    height: 100%;\n  }\n"])), function (_a) {
+    var withWidget = _a.withWidget, theme = _a.theme;
+    return withWidget && theme.spacing(2);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(4);
+});
+exports.LogoStyle = (0, styles_1.styled)('img')(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: 100%;\n  cursor: pointer;\n"], ["\n  height: 100%;\n  cursor: pointer;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/DashboardLayout/Header/types.d.ts

@@ -0,0 +1,10 @@
+import { ElementType, FC, ReactNode } from 'react';
+export declare type HeaderProps = {
+    logoSrc: string;
+    logoAlt: string;
+    LogoLink: FC<LogoLinkProps>;
+    Widget?: ElementType;
+};
+export declare type LogoLinkProps = {
+    Logo: ReactNode;
+};

package/DashboardLayout/Main/Main.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+declare type MainProps = {
+    children: ReactNode;
+};
+export declare const Main: import("react").ForwardRefExoticComponent<MainProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Main;

package/DashboardLayout/Main/Main.js

@@ -0,0 +1,22 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Main = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = require("./styled");
+exports.Main = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children;
+    return (0, jsx_runtime_1.jsx)(styled_1.StyledMain, __assign({ ref: ref }, { children: children }), void 0);
+});
+exports.default = exports.Main;

package/DashboardLayout/Main/index.d.ts

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

package/{cjs → DashboardLayout/Main}/index.js

@@ -10,4 +10,4 @@ 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("./src"), exports);
+__exportStar(require("./Main"), exports);

package/DashboardLayout/Main/styled.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const StyledMain: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;

package/DashboardLayout/Main/styled.js

@@ -0,0 +1,10 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledMain = void 0;
+var styles_1 = require("../../styles");
+exports.StyledMain = (0, styles_1.styled)('main')(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  grid-row: 2;\n  grid-column: 2;\n  overflow: hidden;\n"], ["\n  grid-row: 2;\n  grid-column: 2;\n  overflow: hidden;\n"])));
+var templateObject_1;

package/DashboardLayout/SideBar/SideBar.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+declare type SideBarProps = {
+    children: ReactNode;
+};
+export declare const SideBar: import("react").ForwardRefExoticComponent<SideBarProps & import("react").RefAttributes<HTMLDivElement>>;
+export default SideBar;

package/DashboardLayout/SideBar/SideBar.js

@@ -0,0 +1,22 @@
+"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);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SideBar = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = require("./styled");
+exports.SideBar = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children;
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledDrawer, __assign({ ref: ref, open: true, variant: "persistent" }, { children: children }), void 0));
+});
+exports.default = exports.SideBar;

package/DashboardLayout/SideBar/index.d.ts

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

package/{cjs/src/styles/styled → DashboardLayout/SideBar}/index.js

@@ -10,4 +10,4 @@ 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("./styled"), exports);
+__exportStar(require("./SideBar"), exports);

package/DashboardLayout/SideBar/styled.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledDrawer: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/DashboardLayout/SideBar/styled.js

@@ -0,0 +1,23 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledDrawer = void 0;
+var material_1 = require("@mui/material");
+var styles_1 = require("../../styles");
+exports.StyledDrawer = (0, styles_1.styled)(material_1.Drawer)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  z-index: ", ";\n  grid-column: 1;\n  width: 241px;\n  position: relative;\n  .MuiPaper-root {\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    background-color: ", ";\n    padding: ", ";\n    border-right: 1px solid ", ";\n  }\n"], ["\n  z-index: ", ";\n  grid-column: 1;\n  width: 241px;\n  position: relative;\n  .MuiPaper-root {\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    background-color: ", ";\n    padding: ", ";\n    border-right: 1px solid ", ";\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.zIndex.appBar - 1;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.background.element;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(5, 0);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.grey[300];
+});
+var templateObject_1;

package/DashboardLayout/index.d.ts

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

package/DashboardLayout/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("./DashboardLayout"), exports);

package/DashboardLayout/styled.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const StyledDashboard: import("@emotion/styled").StyledComponent<import("../Grid").GridContainerProps & import("../Grid").GridElementsProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/DashboardLayout/styled.js

@@ -0,0 +1,11 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledDashboard = void 0;
+var Grid_1 = require("../Grid");
+var styles_1 = require("../styles");
+exports.StyledDashboard = (0, styles_1.styled)(Grid_1.Grid)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  min-height: 100vh;\n"], ["\n  min-height: 100vh;\n"])));
+var templateObject_1;

package/{types/src/FormControlLabel → FormControlLabel}/styled.d.ts

@@ -1,3 +1,3 @@
 export declare const StyledFormControlLabel: import("@emotion/styled").StyledComponent<import("@mui/material").FormControlLabelProps & {
-    theme?: import("..").Theme | undefined;
+    theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;