@codesandbox/sandpack-react
Version:
<img style="width:100%" src="https://user-images.githubusercontent.com/4838076/143581035-ebee5ba2-9cb1-4fe8-a05b-2f44bd69bb4b.gif" alt="Component toolkit for live running code editing experiences" />
58 lines (57 loc) • 1.77 kB
TypeScript
import * as React from "react";
export interface SandpackLayoutProps extends React.HtmlHTMLAttributes<unknown> {
children?: React.ReactNode;
}
export declare const layoutClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
[x: string]: string | number | {
flexGrow: number;
flexShrink: number;
flexBasis: string;
height: string;
overflow: string;
"@media print": {
height: string;
display: string;
};
"@media screen and (max-width: 768px)": {
"&:not(.sp-preview, .sp-editor, .sp-preset-column)": {
height: string;
};
minWidth: string;
flex?: undefined;
};
flex?: undefined;
minWidth?: undefined;
} | {
flex: number;
minWidth: number;
"@media screen and (max-width: 768px)": {
flex: number;
"&:not(.sp-preview, .sp-editor, .sp-preset-column)"?: undefined;
minWidth?: undefined;
};
flexGrow?: undefined;
flexShrink?: undefined;
flexBasis?: undefined;
height?: undefined;
overflow?: undefined;
"@media print"?: undefined;
};
border: string;
display: string;
flexWrap: string;
alignItems: string;
borderRadius: string;
overflow: string;
position: string;
backgroundColor: string;
gap: number;
"> .sp-file-explorer": {
flex: number;
minWidth: number;
"@media screen and (max-width: 768px)": {
flex: number;
};
};
}>;
export declare const SandpackLayout: React.ForwardRefExoticComponent<SandpackLayoutProps & React.RefAttributes<HTMLDivElement>>;