@astral/ui 0.44.0 → 0.45.0

package/ContentState/ContentState.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { PlaceholderProps } from '../Placeholder/types';
+import { PlaceholderProps } from '../Placeholder';
 import { ContentStateErrorProps } from './types';
 declare type ContentStateProps = {
     /**

package/Placeholder/Placeholder.d.ts

@@ -1,3 +1,24 @@
-/// <reference types="react" />
-import { PlaceholderProps } from './types';
+import { ReactNode } from 'react';
+export declare type PlaceholderProps = {
+    /**
+     * Ссылка на изображение
+     */
+    imgSrc: string;
+    /**
+     * Описание изображения
+     */
+    imgAlt: string;
+    /**
+     * Заголовок
+     */
+    title: string;
+    /**
+     * Описание
+     */
+    description?: string | ReactNode;
+    /**
+     * Действия
+     */
+    Actions?: ReactNode;
+};
 export declare const Placeholder: ({ title, imgSrc, imgAlt, description, Actions, }: PlaceholderProps) => JSX.Element;

package/Placeholder/Placeholder.js

@@ -13,9 +13,9 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Placeholder = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
-var styled_1 = require("./styled");
+var styles_1 = require("./styles");
 var Placeholder = function (_a) {
     var title = _a.title, imgSrc = _a.imgSrc, imgAlt = _a.imgAlt, description = _a.description, Actions = _a.Actions;
-    return ((0, jsx_runtime_1.jsxs)(styled_1.StyledContainer, { children: [(0, jsx_runtime_1.jsxs)(styled_1.StyledInnerContainer, { children: [imgSrc && (0, jsx_runtime_1.jsx)(styled_1.StyledImage, { src: imgSrc, alt: imgAlt }), title && (0, jsx_runtime_1.jsx)(styled_1.StyledTitle, __assign({ variant: "h4" }, { children: title })), description && ((0, jsx_runtime_1.jsx)(styled_1.StyledDescription, __assign({ variant: "ui" }, { children: description })))] }), Actions && (0, jsx_runtime_1.jsx)(styled_1.StyledActions, { children: Actions })] }));
+    return ((0, jsx_runtime_1.jsxs)(styles_1.PlaceholderRoot, { children: [(0, jsx_runtime_1.jsxs)(styles_1.PlaceholderInnerContainer, { children: [(0, jsx_runtime_1.jsx)(styles_1.PlaceholderImage, { src: imgSrc, alt: imgAlt }), (0, jsx_runtime_1.jsx)(styles_1.PlaceholderTitle, __assign({ variant: "h4" }, { children: title })), description && ((0, jsx_runtime_1.jsx)(styles_1.PlaceholderDescription, __assign({ variant: "ui" }, { children: description })))] }), Actions && (0, jsx_runtime_1.jsx)(styles_1.PlaceholderActions, { children: Actions })] }));
 };
 exports.Placeholder = Placeholder;

package/Placeholder/{styled.d.ts → styles.d.ts}

@@ -1,17 +1,17 @@
 /// <reference types="react" />
-export declare const StyledContainer: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderRoot: 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 StyledInnerContainer: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderInnerContainer: 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 StyledImage: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderImage: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-export declare const StyledTitle: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
+export declare const PlaceholderTitle: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
     align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
     children?: import("react").ReactNode;
     classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
@@ -26,7 +26,7 @@ export declare const StyledTitle: import("@emotion/styled").StyledComponent<impo
 }, "children" | "variant" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | ("fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const StyledDescription: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
+export declare const PlaceholderDescription: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
     align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
     children?: import("react").ReactNode;
     classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
@@ -41,7 +41,7 @@ export declare const StyledDescription: import("@emotion/styled").StyledComponen
 }, "children" | "variant" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | ("fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const StyledActions: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderActions: 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/Placeholder/styles.js

@@ -0,0 +1,34 @@
+"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.PlaceholderActions = exports.PlaceholderDescription = exports.PlaceholderTitle = exports.PlaceholderImage = exports.PlaceholderInnerContainer = exports.PlaceholderRoot = void 0;
+var styles_1 = require("../styles");
+var Typography_1 = require("../Typography");
+exports.PlaceholderRoot = styles_1.styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(4);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.background.paper;
+});
+exports.PlaceholderInnerContainer = styles_1.styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 384px;\n"], ["\n  max-width: 384px;\n"])));
+exports.PlaceholderImage = styles_1.styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"], ["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(8);
+});
+exports.PlaceholderTitle = (0, styles_1.styled)(Typography_1.Typography)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-bottom: ", ";\n\n  text-align: center;\n"], ["\n  margin-bottom: ", ";\n\n  text-align: center;\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(4);
+});
+exports.PlaceholderDescription = (0, styles_1.styled)(Typography_1.Typography)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  text-align: center;\n"], ["\n  display: block;\n\n  text-align: center;\n"])));
+exports.PlaceholderActions = styles_1.styled.footer(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(1);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(5);
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/esm/ContentState/ContentState.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { PlaceholderProps } from '../Placeholder/types';
+import { PlaceholderProps } from '../Placeholder';
 import { ContentStateErrorProps } from './types';
 declare type ContentStateProps = {
     /**

package/esm/Placeholder/Placeholder.d.ts

@@ -1,3 +1,24 @@
-/// <reference types="react" />
-import { PlaceholderProps } from './types';
+import { ReactNode } from 'react';
+export declare type PlaceholderProps = {
+    /**
+     * Ссылка на изображение
+     */
+    imgSrc: string;
+    /**
+     * Описание изображения
+     */
+    imgAlt: string;
+    /**
+     * Заголовок
+     */
+    title: string;
+    /**
+     * Описание
+     */
+    description?: string | ReactNode;
+    /**
+     * Действия
+     */
+    Actions?: ReactNode;
+};
 export declare const Placeholder: ({ title, imgSrc, imgAlt, description, Actions, }: PlaceholderProps) => JSX.Element;

package/esm/Placeholder/Placeholder.js

@@ -10,8 +10,8 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StyledActions, StyledContainer, StyledDescription, StyledImage, StyledInnerContainer, StyledTitle, } from './styled';
+import { PlaceholderActions, PlaceholderDescription, PlaceholderImage, PlaceholderInnerContainer, PlaceholderRoot, PlaceholderTitle, } from './styles';
 export var Placeholder = function (_a) {
     var title = _a.title, imgSrc = _a.imgSrc, imgAlt = _a.imgAlt, description = _a.description, Actions = _a.Actions;
-    return (_jsxs(StyledContainer, { children: [_jsxs(StyledInnerContainer, { children: [imgSrc && _jsx(StyledImage, { src: imgSrc, alt: imgAlt }), title && _jsx(StyledTitle, __assign({ variant: "h4" }, { children: title })), description && (_jsx(StyledDescription, __assign({ variant: "ui" }, { children: description })))] }), Actions && _jsx(StyledActions, { children: Actions })] }));
+    return (_jsxs(PlaceholderRoot, { children: [_jsxs(PlaceholderInnerContainer, { children: [_jsx(PlaceholderImage, { src: imgSrc, alt: imgAlt }), _jsx(PlaceholderTitle, __assign({ variant: "h4" }, { children: title })), description && (_jsx(PlaceholderDescription, __assign({ variant: "ui" }, { children: description })))] }), Actions && _jsx(PlaceholderActions, { children: Actions })] }));
 };

package/esm/Placeholder/{styled.d.ts → styles.d.ts}

@@ -1,17 +1,17 @@
 /// <reference types="react" />
-export declare const StyledContainer: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderRoot: 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 StyledInnerContainer: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderInnerContainer: 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 StyledImage: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderImage: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-export declare const StyledTitle: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
+export declare const PlaceholderTitle: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
     align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
     children?: import("react").ReactNode;
     classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
@@ -26,7 +26,7 @@ export declare const StyledTitle: import("@emotion/styled").StyledComponent<impo
 }, "children" | "variant" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | ("fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const StyledDescription: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
+export declare const PlaceholderDescription: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
     align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
     children?: import("react").ReactNode;
     classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
@@ -41,7 +41,7 @@ export declare const StyledDescription: import("@emotion/styled").StyledComponen
 }, "children" | "variant" | keyof import("@mui/material/OverridableComponent").CommonProps | "sx" | ("fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "p" | "color" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "typography" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const StyledActions: import("@emotion/styled").StyledComponent<{
+export declare const PlaceholderActions: 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/esm/Placeholder/styles.js

@@ -0,0 +1,31 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { styled } from '../styles';
+import { Typography } from '../Typography';
+export var PlaceholderRoot = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(4);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.palette.background.paper;
+});
+export var PlaceholderInnerContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 384px;\n"], ["\n  max-width: 384px;\n"])));
+export var PlaceholderImage = styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"], ["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(8);
+});
+export var PlaceholderTitle = styled(Typography)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-bottom: ", ";\n\n  text-align: center;\n"], ["\n  margin-bottom: ", ";\n\n  text-align: center;\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(4);
+});
+export var PlaceholderDescription = styled(Typography)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  text-align: center;\n"], ["\n  display: block;\n\n  text-align: center;\n"])));
+export var PlaceholderActions = styled.footer(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n\n  gap: ", ";\n  justify-content: center;\n\n  margin-top: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(1);
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing(5);
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/package.json

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

package/Placeholder/styled.js

@@ -1,34 +0,0 @@
-"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.StyledActions = exports.StyledDescription = exports.StyledTitle = exports.StyledImage = exports.StyledInnerContainer = exports.StyledContainer = void 0;
-var styles_1 = require("../styles");
-var Typography_1 = require("../Typography");
-exports.StyledContainer = styles_1.styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.background.paper;
-});
-exports.StyledInnerContainer = styles_1.styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 384px;\n"], ["\n  max-width: 384px;\n"])));
-exports.StyledImage = styles_1.styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"], ["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(8);
-});
-exports.StyledTitle = (0, styles_1.styled)(Typography_1.Typography)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-bottom: ", ";\n\n  text-align: center;\n"], ["\n  margin-bottom: ", ";\n\n  text-align: center;\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-});
-exports.StyledDescription = (0, styles_1.styled)(Typography_1.Typography)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  text-align: center;\n"], ["\n  display: block;\n\n  text-align: center;\n"])));
-exports.StyledActions = styles_1.styled.footer(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin-top: ", ";\n\n  > * {\n    margin: ", ";\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin-top: ", ";\n\n  > * {\n    margin: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(5);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/Placeholder/types.d.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from 'react';
-export declare type PlaceholderProps = {
-    imgSrc: string;
-    imgAlt: string;
-    title: string;
-    description?: string | ReactNode;
-    Actions?: ReactNode;
-};

package/Placeholder/types.js

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

package/esm/Placeholder/styled.js

@@ -1,31 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { styled } from '../styles';
-import { Typography } from '../Typography';
-export var StyledContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  padding: ", ";\n\n  background-color: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.palette.background.paper;
-});
-export var StyledInnerContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 384px;\n"], ["\n  max-width: 384px;\n"])));
-export var StyledImage = styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"], ["\n  display: block;\n  width: 100%;\n  height: 162px;\n  margin: auto;\n  margin-bottom: ", ";\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(8);
-});
-export var StyledTitle = styled(Typography)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  margin-bottom: ", ";\n\n  text-align: center;\n"], ["\n  margin-bottom: ", ";\n\n  text-align: center;\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(4);
-});
-export var StyledDescription = styled(Typography)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: block;\n\n  text-align: center;\n"], ["\n  display: block;\n\n  text-align: center;\n"])));
-export var StyledActions = styled.footer(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin-top: ", ";\n\n  > * {\n    margin: ", ";\n  }\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin-top: ", ";\n\n  > * {\n    margin: ", ";\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(5);
-}, function (_a) {
-    var theme = _a.theme;
-    return theme.spacing(1);
-});
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/esm/Placeholder/types.d.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from 'react';
-export declare type PlaceholderProps = {
-    imgSrc: string;
-    imgAlt: string;
-    title: string;
-    description?: string | ReactNode;
-    Actions?: ReactNode;
-};

package/esm/Placeholder/types.js

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