@rufous/ui 0.3.59 → 0.3.61

package/dist/main.d.cts

@@ -1840,10 +1840,116 @@ interface ListSubheaderProps {
 }
 declare const ListSubheader: React__default.FC<ListSubheaderProps>;
 
-interface TypographyProps {
+/**
+ * Shared system-prop surface for the four system-prop components. All values
+ * are `string | number`; numeric spacing/border values are resolved through
+ * the sx engine (1 unit = 8px by default).
+ */
+interface SystemProps {
+    m?: number | string;
+    mt?: number | string;
+    mb?: number | string;
+    ml?: number | string;
+    mr?: number | string;
+    mx?: number | string;
+    my?: number | string;
+    margin?: number | string;
+    marginTop?: number | string;
+    marginBottom?: number | string;
+    marginLeft?: number | string;
+    marginRight?: number | string;
+    marginInline?: number | string;
+    marginInlineStart?: number | string;
+    marginInlineEnd?: number | string;
+    marginBlock?: number | string;
+    marginBlockStart?: number | string;
+    marginBlockEnd?: number | string;
+    p?: number | string;
+    pt?: number | string;
+    pb?: number | string;
+    pl?: number | string;
+    pr?: number | string;
+    px?: number | string;
+    py?: number | string;
+    padding?: number | string;
+    paddingTop?: number | string;
+    paddingBottom?: number | string;
+    paddingLeft?: number | string;
+    paddingRight?: number | string;
+    paddingInline?: number | string;
+    paddingInlineStart?: number | string;
+    paddingInlineEnd?: number | string;
+    paddingBlock?: number | string;
+    paddingBlockStart?: number | string;
+    paddingBlockEnd?: number | string;
+    gap?: number | string;
+    rowGap?: number | string;
+    columnGap?: number | string;
+    border?: number | string;
+    borderTop?: number | string;
+    borderRight?: number | string;
+    borderBottom?: number | string;
+    borderLeft?: number | string;
+    borderRadius?: number | string;
+    borderColor?: string;
+    width?: number | string;
+    height?: number | string;
+    minWidth?: number | string;
+    maxWidth?: number | string;
+    minHeight?: number | string;
+    maxHeight?: number | string;
+    boxSizing?: string;
+    bgcolor?: string;
+    color?: string;
+    boxShadow?: number | string;
+    zIndex?: number | string;
+    typography?: string;
+    display?: string;
+    alignContent?: string;
+    alignItems?: string;
+    alignSelf?: string;
+    flex?: number | string;
+    flexDirection?: string;
+    flexGrow?: number | string;
+    flexShrink?: number | string;
+    flexWrap?: string;
+    flexBasis?: number | string;
+    justifyContent?: string;
+    justifyItems?: string;
+    justifySelf?: string;
+    order?: number | string;
+    gridColumn?: number | string;
+    gridRow?: number | string;
+    gridAutoFlow?: string;
+    gridAutoColumns?: string;
+    gridAutoRows?: string;
+    gridTemplateColumns?: string;
+    gridTemplateRows?: string;
+    gridTemplateAreas?: string;
+    gridArea?: string;
+    position?: string;
+    top?: number | string;
+    right?: number | string;
+    bottom?: number | string;
+    left?: number | string;
+    fontFamily?: string;
+    fontSize?: number | string;
+    fontStyle?: string;
+    fontWeight?: number | string;
+    letterSpacing?: number | string;
+    lineHeight?: number | string;
+    textAlign?: string;
+    textTransform?: string;
+    overflow?: string;
+    overflowX?: string;
+    overflowY?: string;
+}
+
+interface TypographyProps extends Omit<React__default.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     variant?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overline" | "button";
     component?: keyof React__default.JSX.IntrinsicElements;
     align?: "inherit" | "left" | "center" | "right" | "justify";
+    /** Palette token (`primary`, `secondary`, `textPrimary`, …) or any CSS colour. */
     color?: "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | string;
     noWrap?: boolean;
     gutterBottom?: boolean;
@@ -1884,94 +1990,29 @@ interface TooltipProps {
 }
 declare const Tooltip: React__default.FC<TooltipProps>;
 
-interface BoxProps extends React.HTMLAttributes<HTMLElement> {
+interface BoxProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     component?: keyof React.JSX.IntrinsicElements;
     children?: ReactNode;
-    display?: string;
-    flexDirection?: string;
-    alignItems?: string;
-    justifyContent?: string;
-    gap?: string | number;
-    flex?: string | number;
-    flexWrap?: string;
-    flexGrow?: number;
-    flexShrink?: number;
-    overflow?: string;
-    position?: string;
-    top?: string | number;
-    right?: string | number;
-    bottom?: string | number;
-    left?: string | number;
-    borderRadius?: string | number;
-    bgcolor?: string;
-    color?: string;
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    margin?: string | number;
-    padding?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLElement>>;
 
-interface StackProps extends React.HTMLAttributes<HTMLElement> {
+interface StackProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
     spacing?: number | string;
-    alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
-    justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
     divider?: ReactNode;
-    flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
     useFlexGap?: boolean;
-    flex?: string | number;
-    overflow?: string;
     component?: keyof React.JSX.IntrinsicElements;
     children: ReactNode;
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLElement>>;
 
-interface GridProps extends React.HTMLAttributes<HTMLElement> {
+interface GridProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     container?: boolean;
     item?: boolean;
     xs?: number | "auto" | true;
@@ -1985,8 +2026,6 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
         md?: number;
     };
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
-    alignItems?: string;
-    justifyContent?: string;
     wrap?: "nowrap" | "wrap" | "wrap-reverse";
     zeroMinWidth?: boolean;
     component?: keyof React.JSX.IntrinsicElements;
@@ -1994,26 +2033,6 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLElement>>;
 

package/dist/main.d.ts

@@ -1840,10 +1840,116 @@ interface ListSubheaderProps {
 }
 declare const ListSubheader: React__default.FC<ListSubheaderProps>;
 
-interface TypographyProps {
+/**
+ * Shared system-prop surface for the four system-prop components. All values
+ * are `string | number`; numeric spacing/border values are resolved through
+ * the sx engine (1 unit = 8px by default).
+ */
+interface SystemProps {
+    m?: number | string;
+    mt?: number | string;
+    mb?: number | string;
+    ml?: number | string;
+    mr?: number | string;
+    mx?: number | string;
+    my?: number | string;
+    margin?: number | string;
+    marginTop?: number | string;
+    marginBottom?: number | string;
+    marginLeft?: number | string;
+    marginRight?: number | string;
+    marginInline?: number | string;
+    marginInlineStart?: number | string;
+    marginInlineEnd?: number | string;
+    marginBlock?: number | string;
+    marginBlockStart?: number | string;
+    marginBlockEnd?: number | string;
+    p?: number | string;
+    pt?: number | string;
+    pb?: number | string;
+    pl?: number | string;
+    pr?: number | string;
+    px?: number | string;
+    py?: number | string;
+    padding?: number | string;
+    paddingTop?: number | string;
+    paddingBottom?: number | string;
+    paddingLeft?: number | string;
+    paddingRight?: number | string;
+    paddingInline?: number | string;
+    paddingInlineStart?: number | string;
+    paddingInlineEnd?: number | string;
+    paddingBlock?: number | string;
+    paddingBlockStart?: number | string;
+    paddingBlockEnd?: number | string;
+    gap?: number | string;
+    rowGap?: number | string;
+    columnGap?: number | string;
+    border?: number | string;
+    borderTop?: number | string;
+    borderRight?: number | string;
+    borderBottom?: number | string;
+    borderLeft?: number | string;
+    borderRadius?: number | string;
+    borderColor?: string;
+    width?: number | string;
+    height?: number | string;
+    minWidth?: number | string;
+    maxWidth?: number | string;
+    minHeight?: number | string;
+    maxHeight?: number | string;
+    boxSizing?: string;
+    bgcolor?: string;
+    color?: string;
+    boxShadow?: number | string;
+    zIndex?: number | string;
+    typography?: string;
+    display?: string;
+    alignContent?: string;
+    alignItems?: string;
+    alignSelf?: string;
+    flex?: number | string;
+    flexDirection?: string;
+    flexGrow?: number | string;
+    flexShrink?: number | string;
+    flexWrap?: string;
+    flexBasis?: number | string;
+    justifyContent?: string;
+    justifyItems?: string;
+    justifySelf?: string;
+    order?: number | string;
+    gridColumn?: number | string;
+    gridRow?: number | string;
+    gridAutoFlow?: string;
+    gridAutoColumns?: string;
+    gridAutoRows?: string;
+    gridTemplateColumns?: string;
+    gridTemplateRows?: string;
+    gridTemplateAreas?: string;
+    gridArea?: string;
+    position?: string;
+    top?: number | string;
+    right?: number | string;
+    bottom?: number | string;
+    left?: number | string;
+    fontFamily?: string;
+    fontSize?: number | string;
+    fontStyle?: string;
+    fontWeight?: number | string;
+    letterSpacing?: number | string;
+    lineHeight?: number | string;
+    textAlign?: string;
+    textTransform?: string;
+    overflow?: string;
+    overflowX?: string;
+    overflowY?: string;
+}
+
+interface TypographyProps extends Omit<React__default.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     variant?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overline" | "button";
     component?: keyof React__default.JSX.IntrinsicElements;
     align?: "inherit" | "left" | "center" | "right" | "justify";
+    /** Palette token (`primary`, `secondary`, `textPrimary`, …) or any CSS colour. */
     color?: "primary" | "secondary" | "textPrimary" | "textSecondary" | "error" | string;
     noWrap?: boolean;
     gutterBottom?: boolean;
@@ -1884,94 +1990,29 @@ interface TooltipProps {
 }
 declare const Tooltip: React__default.FC<TooltipProps>;
 
-interface BoxProps extends React.HTMLAttributes<HTMLElement> {
+interface BoxProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     component?: keyof React.JSX.IntrinsicElements;
     children?: ReactNode;
-    display?: string;
-    flexDirection?: string;
-    alignItems?: string;
-    justifyContent?: string;
-    gap?: string | number;
-    flex?: string | number;
-    flexWrap?: string;
-    flexGrow?: number;
-    flexShrink?: number;
-    overflow?: string;
-    position?: string;
-    top?: string | number;
-    right?: string | number;
-    bottom?: string | number;
-    left?: string | number;
-    borderRadius?: string | number;
-    bgcolor?: string;
-    color?: string;
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    margin?: string | number;
-    padding?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<HTMLElement>>;
 
-interface StackProps extends React.HTMLAttributes<HTMLElement> {
+interface StackProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
     spacing?: number | string;
-    alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
-    justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
     divider?: ReactNode;
-    flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
     useFlexGap?: boolean;
-    flex?: string | number;
-    overflow?: string;
     component?: keyof React.JSX.IntrinsicElements;
     children: ReactNode;
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLElement>>;
 
-interface GridProps extends React.HTMLAttributes<HTMLElement> {
+interface GridProps extends Omit<React.HTMLAttributes<HTMLElement>, "color">, SystemProps {
     container?: boolean;
     item?: boolean;
     xs?: number | "auto" | true;
@@ -1985,8 +2026,6 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
         md?: number;
     };
     direction?: "row" | "row-reverse" | "column" | "column-reverse";
-    alignItems?: string;
-    justifyContent?: string;
     wrap?: "nowrap" | "wrap" | "wrap-reverse";
     zeroMinWidth?: boolean;
     component?: keyof React.JSX.IntrinsicElements;
@@ -1994,26 +2033,6 @@ interface GridProps extends React.HTMLAttributes<HTMLElement> {
     className?: string;
     style?: CSSProperties;
     sx?: SxProp;
-    width?: string | number;
-    height?: string | number;
-    minWidth?: string | number;
-    maxWidth?: string | number;
-    minHeight?: string | number;
-    maxHeight?: string | number;
-    m?: number | string;
-    mt?: number | string;
-    mr?: number | string;
-    mb?: number | string;
-    ml?: number | string;
-    mx?: number | string;
-    my?: number | string;
-    p?: number | string;
-    pt?: number | string;
-    pr?: number | string;
-    pb?: number | string;
-    pl?: number | string;
-    px?: number | string;
-    py?: number | string;
 }
 declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLElement>>;