@astral/ui 0.10.2 → 0.11.0

package/Grid/Grid.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { GridProps } from './types';
-export declare const Grid: ({ container, templateColumns, templateRows, templateAreas, columnSpacing, rowSpacing, spacing, autoColumns, autoRows, autoFlow, column, row, area, children, ...props }: GridProps) => JSX.Element;
+export declare const Grid: ({ container, templateColumns, templateRows, templateAreas, columnSpacing, rowSpacing, spacing, autoColumns, autoRows, autoFlow, column, row, area, component, children, ...props }: GridProps) => JSX.Element;

package/Grid/Grid.js

@@ -26,7 +26,7 @@ exports.Grid = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styled_1 = require("./styled");
 var Grid = function (_a) {
-    var _b = _a.container, container = _b === void 0 ? false : _b, templateColumns = _a.templateColumns, templateRows = _a.templateRows, templateAreas = _a.templateAreas, columnSpacing = _a.columnSpacing, rowSpacing = _a.rowSpacing, spacing = _a.spacing, autoColumns = _a.autoColumns, autoRows = _a.autoRows, autoFlow = _a.autoFlow, column = _a.column, row = _a.row, area = _a.area, children = _a.children, props = __rest(_a, ["container", "templateColumns", "templateRows", "templateAreas", "columnSpacing", "rowSpacing", "spacing", "autoColumns", "autoRows", "autoFlow", "column", "row", "area", "children"]);
-    return ((0, jsx_runtime_1.jsx)(styled_1.StyledGrid, __assign({ container: container, gridTemplateColumns: templateColumns, gridTemplateRows: templateRows, gridTemplateAreas: templateAreas, columnGap: columnSpacing, rowGap: rowSpacing, gap: spacing, gridAutoColumns: autoColumns, gridAutoRows: autoRows, gridAutoFlow: autoFlow, gridColumn: column, gridRow: row, gridArea: area }, props, { children: children }), void 0));
+    var _b = _a.container, container = _b === void 0 ? false : _b, templateColumns = _a.templateColumns, templateRows = _a.templateRows, templateAreas = _a.templateAreas, columnSpacing = _a.columnSpacing, rowSpacing = _a.rowSpacing, spacing = _a.spacing, autoColumns = _a.autoColumns, autoRows = _a.autoRows, autoFlow = _a.autoFlow, column = _a.column, row = _a.row, area = _a.area, _c = _a.component, component = _c === void 0 ? 'div' : _c, children = _a.children, props = __rest(_a, ["container", "templateColumns", "templateRows", "templateAreas", "columnSpacing", "rowSpacing", "spacing", "autoColumns", "autoRows", "autoFlow", "column", "row", "area", "component", "children"]);
+    return ((0, jsx_runtime_1.jsx)(styled_1.StyledGrid, __assign({ container: container, gridTemplateColumns: templateColumns, gridTemplateRows: templateRows, gridTemplateAreas: templateAreas, columnGap: columnSpacing, rowGap: rowSpacing, gap: spacing, gridAutoColumns: autoColumns, gridAutoRows: autoRows, gridAutoFlow: autoFlow, gridColumn: column, gridRow: row, gridArea: area, component: component }, props, { children: children }), void 0));
 };
 exports.Grid = Grid;

package/Grid/types.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import { CSSProperties, ElementType, ReactNode } from 'react';
 import { Breakpoint } from '@mui/material/styles';
-declare type StyleCSSType<Type extends keyof React.CSSProperties> = React.CSSProperties[Type] | Partial<Record<Breakpoint, React.CSSProperties[Type]>>;
+declare type StyleCSSType<Type extends keyof CSSProperties> = CSSProperties[Type] | Partial<Record<Breakpoint, CSSProperties[Type]>>;
 export declare type GridContainerProps = {
     container?: boolean;
     templateColumns?: StyleCSSType<'gridTemplateColumns'>;
@@ -16,6 +16,7 @@ export declare type GridContainerProps = {
     autoColumns?: StyleCSSType<'gridAutoColumns'>;
     autoRows?: StyleCSSType<'gridAutoRows'>;
     autoFlow?: StyleCSSType<'gridAutoFlow'>;
+    component?: ElementType;
 };
 export declare type GridElementsProps = {
     column?: StyleCSSType<'gridColumn'>;
@@ -25,6 +26,6 @@ export declare type GridElementsProps = {
     alignSelf?: StyleCSSType<'alignSelf'>;
 };
 export declare type GridProps = GridContainerProps & GridElementsProps & {
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 export {};

package/esm/Grid/Grid.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { GridProps } from './types';
-export declare const Grid: ({ container, templateColumns, templateRows, templateAreas, columnSpacing, rowSpacing, spacing, autoColumns, autoRows, autoFlow, column, row, area, children, ...props }: GridProps) => JSX.Element;
+export declare const Grid: ({ container, templateColumns, templateRows, templateAreas, columnSpacing, rowSpacing, spacing, autoColumns, autoRows, autoFlow, column, row, area, component, children, ...props }: GridProps) => JSX.Element;

package/esm/Grid/Grid.js

@@ -23,6 +23,6 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { StyledGrid } from './styled';
 export var Grid = function (_a) {
-    var _b = _a.container, container = _b === void 0 ? false : _b, templateColumns = _a.templateColumns, templateRows = _a.templateRows, templateAreas = _a.templateAreas, columnSpacing = _a.columnSpacing, rowSpacing = _a.rowSpacing, spacing = _a.spacing, autoColumns = _a.autoColumns, autoRows = _a.autoRows, autoFlow = _a.autoFlow, column = _a.column, row = _a.row, area = _a.area, children = _a.children, props = __rest(_a, ["container", "templateColumns", "templateRows", "templateAreas", "columnSpacing", "rowSpacing", "spacing", "autoColumns", "autoRows", "autoFlow", "column", "row", "area", "children"]);
-    return (_jsx(StyledGrid, __assign({ container: container, gridTemplateColumns: templateColumns, gridTemplateRows: templateRows, gridTemplateAreas: templateAreas, columnGap: columnSpacing, rowGap: rowSpacing, gap: spacing, gridAutoColumns: autoColumns, gridAutoRows: autoRows, gridAutoFlow: autoFlow, gridColumn: column, gridRow: row, gridArea: area }, props, { children: children }), void 0));
+    var _b = _a.container, container = _b === void 0 ? false : _b, templateColumns = _a.templateColumns, templateRows = _a.templateRows, templateAreas = _a.templateAreas, columnSpacing = _a.columnSpacing, rowSpacing = _a.rowSpacing, spacing = _a.spacing, autoColumns = _a.autoColumns, autoRows = _a.autoRows, autoFlow = _a.autoFlow, column = _a.column, row = _a.row, area = _a.area, _c = _a.component, component = _c === void 0 ? 'div' : _c, children = _a.children, props = __rest(_a, ["container", "templateColumns", "templateRows", "templateAreas", "columnSpacing", "rowSpacing", "spacing", "autoColumns", "autoRows", "autoFlow", "column", "row", "area", "component", "children"]);
+    return (_jsx(StyledGrid, __assign({ container: container, gridTemplateColumns: templateColumns, gridTemplateRows: templateRows, gridTemplateAreas: templateAreas, columnGap: columnSpacing, rowGap: rowSpacing, gap: spacing, gridAutoColumns: autoColumns, gridAutoRows: autoRows, gridAutoFlow: autoFlow, gridColumn: column, gridRow: row, gridArea: area, component: component }, props, { children: children }), void 0));
 };

package/esm/Grid/types.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import { CSSProperties, ElementType, ReactNode } from 'react';
 import { Breakpoint } from '@mui/material/styles';
-declare type StyleCSSType<Type extends keyof React.CSSProperties> = React.CSSProperties[Type] | Partial<Record<Breakpoint, React.CSSProperties[Type]>>;
+declare type StyleCSSType<Type extends keyof CSSProperties> = CSSProperties[Type] | Partial<Record<Breakpoint, CSSProperties[Type]>>;
 export declare type GridContainerProps = {
     container?: boolean;
     templateColumns?: StyleCSSType<'gridTemplateColumns'>;
@@ -16,6 +16,7 @@ export declare type GridContainerProps = {
     autoColumns?: StyleCSSType<'gridAutoColumns'>;
     autoRows?: StyleCSSType<'gridAutoRows'>;
     autoFlow?: StyleCSSType<'gridAutoFlow'>;
+    component?: ElementType;
 };
 export declare type GridElementsProps = {
     column?: StyleCSSType<'gridColumn'>;
@@ -25,6 +26,6 @@ export declare type GridElementsProps = {
     alignSelf?: StyleCSSType<'alignSelf'>;
 };
 export declare type GridProps = GridContainerProps & GridElementsProps & {
-    children?: React.ReactNode;
+    children?: ReactNode;
 };
 export {};

package/package.json

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