@codesandbox/sandpack-react - npm Package Compare versions

Comparing version 2.9.0 to 2.10.0

dist/components/CodeEditor/CodeMirror.d.ts

@@ -6,3 +6,3 @@ import type { Extension } from "@codemirror/state";
 import type { CustomLanguage, EditorState as SandpackEditorState, SandpackInitMode } from "../../types";
-export declare type Decorators = Array<{
+export type Decorators = Array<{
     className?: string;
@@ -9,0 +9,0 @@ line: number;

dist/components/CodeEditor/index.d.ts

@@ -7,3 +7,3 @@ /// <reference types="react" />
 import type { CodeMirrorRef } from "./CodeMirror";
-export declare type CodeEditorRef = CodeMirrorRef;
+export type CodeEditorRef = CodeMirrorRef;
 export interface CodeEditorProps {
@@ -10,0 +10,0 @@ style?: React.CSSProperties;

dist/components/CodeEditor/styles.d.ts

@@ -1,5 +0,60 @@
-export declare const placeholderClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const tokensClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const editorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const cmClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const readOnlyClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const placeholderClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    margin: string;
+    display: string;
+    fontFamily: string;
+    fontSize: string;
+    color: string;
+    lineHeight: string;
+}>;
+export declare const tokensClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, Record<string, string>>;
+export declare const editorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | number | {
+        padding: string;
+        "@supports (-webkit-overflow-scrolling: touch)"?: undefined;
+    } | {
+        "@supports (-webkit-overflow-scrolling: touch)": {
+            ".cm-content": {
+                fontSize: string;
+            };
+        };
+        padding?: undefined;
+    };
+    flex: number;
+    position: string;
+    overflow: string;
+    background: string;
+    ".cm-scroller": {
+        padding: string;
+    };
+    /**
+     * For iOS: prevent browser zoom when clicking on sandbox.
+     * Does NOT apply to code blocks.
+     */
+    "@media screen and (max-width: 768px)": {
+        "@supports (-webkit-overflow-scrolling: touch)": {
+            ".cm-content": {
+                fontSize: string;
+            };
+        };
+    };
+}>;
+export declare const cmClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    margin: string;
+    outline: string;
+    height: string;
+}>;
+export declare const readOnlyClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        right: string;
+    };
+    fontFamily: string;
+    fontSize: string;
+    position: string;
+    right: string;
+    bottom: string;
+    zIndex: string;
+    color: string;
+    backgroundColor: string;
+    borderRadius: string;
+    padding: string;
+}>;

dist/components/CodeEditor/utils.d.ts

@@ -15,2 +15,2 @@ import type { LanguageSupport } from "@codemirror/language";
 export declare const getCodeMirrorLanguage: (extension: string, additionalLanguages: CustomLanguage[]) => LanguageSupport;
-export declare const useCombinedRefs: <T extends unknown>(...refs: React.Ref<T>[]) => React.Ref<T>;
+export declare const useCombinedRefs: <T>(...refs: React.Ref<T>[]) => React.Ref<T>;

dist/components/common/ErrorOverlay.d.ts

 import * as React from "react";
-export declare type ErrorOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
+export type ErrorOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
     children?: React.ReactNode;
 };
 export declare const ErrorOverlay: React.FC<ErrorOverlayProps>;

dist/components/common/Layout.d.ts

@@ -5,3 +5,54 @@ import * as React from "react";
 }
-export declare const layoutClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+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>>;

dist/components/common/Stack.d.ts

 import * as React from "react";
-export declare const stackClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const stackClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    display: string;
+    flexDirection: string;
+    width: string;
+    position: string;
+    backgroundColor: string;
+    gap: number;
+    "&:has(.sp-stack)": {
+        backgroundColor: string;
+    };
+}>;
 export declare const SandpackStack: React.FC<React.HTMLAttributes<HTMLDivElement> & {
     children?: React.ReactNode;
 }>;

dist/components/Console/utils/fromConsoleToString.d.ts

 import type { TransformsTypes } from "./transformers";
-export declare type Message = null | string | number | undefined | Array<any> | Record<any, any> | Boolean | Symbol | {
+export type Message = null | string | number | undefined | Array<any> | Record<any, any> | Boolean | Symbol | {
     "@r": number;
@@ -4,0 +4,0 @@ } | {

dist/components/Console/utils/getType.d.ts

 import type { SandpackMessageConsoleMethods } from "@codesandbox/sandpack-client";
 export declare const getType: (message: SandpackMessageConsoleMethods) => "info" | "warning" | "error" | "clear";
-export declare type SandpackConsoleData = Array<{
+export type SandpackConsoleData = Array<{
     data: Array<string | Record<string, string>> | undefined;
@@ -5,0 +5,0 @@ id: string;

dist/components/Console/utils/transformers.d.ts

@@ -1,4 +0,4 @@
-export declare type TransformsTypes = "Function" | "HTMLElement" | "[[NaN]]" | "[[undefined]]" | "[[Date]]" | "[[RegExp]]" | "[[Error]]" | "[[RegExp]]" | "[[Error]]" | "[[ArrayBuffer]]" | "[[TypedArray]]" | "[[Map]]" | "[[Set]]" | "Arithmetic";
-declare type Transforms = Record<TransformsTypes, (...params: any) => any>;
+export type TransformsTypes = "Function" | "HTMLElement" | "[[NaN]]" | "[[undefined]]" | "[[Date]]" | "[[RegExp]]" | "[[Error]]" | "[[RegExp]]" | "[[Error]]" | "[[ArrayBuffer]]" | "[[TypedArray]]" | "[[Map]]" | "[[Set]]" | "Arithmetic";
+type Transforms = Record<TransformsTypes, (...params: any) => any>;
 export declare const transformers: Transforms;
 export {};

dist/components/FileTabs/index.d.ts

 import * as React from "react";
-export declare const tabButton: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const tabButton: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        outline: string;
+        visibility?: undefined;
+    } | {
+        visibility: string;
+        outline?: undefined;
+    };
+    padding: string;
+    height: string;
+    whiteSpace: string;
+    "&:focus": {
+        outline: string;
+    };
+}>;
 export interface FileTabsProps {
@@ -4,0 +18,0 @@ /**

dist/components/ReactDevTools/index.d.ts

 import * as React from "react";
-declare type DevToolsTheme = "dark" | "light";
+type DevToolsTheme = "dark" | "light";
 export declare const SandpackReactDevTools: ({ clientId, theme, className, ...props }: {
@@ -4,0 +4,0 @@ clientId?: string | undefined;

dist/components/Tests/SandpackTests.d.ts

 import * as React from "react";
 import type { Spec } from "./Specs";
-export declare type Status = "initialising" | "idle" | "running" | "complete";
+export type Status = "initialising" | "idle" | "running" | "complete";
 export declare const SandpackTests: React.FC<{
@@ -5,0 +5,0 @@ verbose?: boolean;

dist/components/Tests/Specs.d.ts

@@ -5,3 +5,3 @@ import type { TestError } from "@codesandbox/sandpack-client";
 import type { Status } from "./SandpackTests";
-export declare type Spec = {
+export type Spec = {
     error?: TestError;
@@ -8,0 +8,0 @@ } & Describe;

dist/components/Tests/Tests.d.ts

 import type { TestError } from "@codesandbox/sandpack-client";
 import React from "react";
-declare type TestStatus = "idle" | "running" | "pass" | "fail";
+type TestStatus = "idle" | "running" | "pass" | "fail";
 export interface Test {
@@ -5,0 +5,0 @@ name: string;

dist/contexts/utils/useAppState.d.ts

@@ -7,4 +7,4 @@ import type { SandpackBundlerFiles } from "@codesandbox/sandpack-client";
 }
-declare type UseAppState = (props: SandpackProviderProps, files: SandpackBundlerFiles) => SandpackAppState;
+type UseAppState = (props: SandpackProviderProps, files: SandpackBundlerFiles) => SandpackAppState;
 export declare const useAppState: UseAppState;
 export {};

dist/contexts/utils/useClient.d.ts

@@ -5,3 +5,3 @@ /// <reference types="react" />
 import type { FilesState } from "./useFiles";
-declare type SandpackClientType = InstanceType<typeof SandpackClient>;
+type SandpackClientType = InstanceType<typeof SandpackClient>;
 interface SandpackConfigState {
@@ -31,4 +31,4 @@ reactDevTools?: ReactDevToolsMode;
 }
-declare type UseClient = (props: SandpackProviderProps, filesState: FilesState) => [SandpackConfigState, UseClientOperations];
+type UseClient = (props: SandpackProviderProps, filesState: FilesState) => [SandpackConfigState, UseClientOperations];
 export declare const useClient: UseClient;
 export {};

dist/contexts/utils/useFiles.d.ts

@@ -21,3 +21,3 @@ import type { SandpackBundlerFiles } from "@codesandbox/sandpack-client";
 }
-export declare type UseFiles = (props: SandpackProviderProps) => [
+export type UseFiles = (props: SandpackProviderProps) => [
     FilesState & {
@@ -24,0 +24,0 @@ visibleFilesFromProps: Array<TemplateFiles<SandpackPredefinedTemplate> | string>;

dist/hooks/useActiveCode.d.ts

@@ -10,3 +10,3 @@ /**
     readOnly: boolean;
-    updateCode: (newCode: string, shouldUpdatePreview?: boolean | undefined) => void;
+    updateCode: (newCode: string, shouldUpdatePreview?: boolean) => void;
 };

dist/hooks/useLoadingOverlayState.d.ts

@@ -1,2 +0,2 @@
-export declare type LoadingOverlayState = "LOADING" | "PRE_FADING" | "FADING" | "HIDDEN" | "TIMEOUT";
+export type LoadingOverlayState = "LOADING" | "PRE_FADING" | "FADING" | "HIDDEN" | "TIMEOUT";
 export declare const FADE_ANIMATION_DURATION = 200;
@@ -6,2 +6,2 @@ /**
  */
-export declare const useLoadingOverlayState: (clientId?: string | undefined, externalLoading?: boolean | undefined) => LoadingOverlayState;
+export declare const useLoadingOverlayState: (clientId?: string, externalLoading?: boolean) => LoadingOverlayState;

dist/hooks/useSandpackClient.d.ts

@@ -21,3 +21,3 @@ import type { ListenerFunction, SandpackClient, SandpackMessage, UnsubscribeFunction } from "@codesandbox/sandpack-client";
  */
-export declare const useSandpackClient: (clientPropsOverride?: ClientPropsOverride | undefined) => UseSandpackClient;
+export declare const useSandpackClient: (clientPropsOverride?: ClientPropsOverride) => UseSandpackClient;
 export {};

dist/hooks/useSandpackNavigation.d.ts

 /**
  * @category Hooks
  */
-export declare const useSandpackNavigation: (clientId?: string | undefined) => {
+export declare const useSandpackNavigation: (clientId?: string) => {
     refresh: () => void;
@@ -6,0 +6,0 @@ back: () => void;

dist/hooks/useSandpackShell.d.ts

 /**
  * @category Hooks
  */
-export declare const useSandpackShell: (clientId?: string | undefined) => {
+export declare const useSandpackShell: (clientId?: string) => {
     restart: () => void;
     openPreview: () => void;
 };

dist/styles/shared.d.ts

@@ -1,5 +0,100 @@
-export declare const iconStandaloneClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const buttonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const roundedButtonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const iconClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const iconStandaloneClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    svg: {
+        margin: string;
+    };
+}>;
+export declare const buttonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | number | {
+        color: string;
+        minWidth?: undefined;
+        width?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        minWidth: string;
+        width: string;
+        height: string;
+        color?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        padding: string;
+        height: string;
+        display: string;
+        color?: undefined;
+        minWidth?: undefined;
+        width?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        width: string;
+        color?: undefined;
+        minWidth?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        paddingRight: string;
+        paddingLeft: string;
+        gap: string;
+        color?: undefined;
+        minWidth?: undefined;
+        width?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+    };
+    appearance: string;
+    outline: string;
+    display: string;
+    alignItems: string;
+    fontSize: string;
+    fontFamily: string;
+    backgroundColor: string;
+    transition: string;
+    cursor: string;
+    color: string;
+    border: number;
+    textDecoration: string;
+    "&:disabled": {
+        color: string;
+    };
+    "&:hover:not(:disabled,[data-active='true'])": {
+        color: string;
+    };
+    '&[data-active="true"]': {
+        color: string;
+    };
+    svg: {
+        minWidth: string;
+        width: string;
+        height: string;
+    };
+}>;
+export declare const roundedButtonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    backgroundColor: string;
+    borderRadius: string;
+    border: string;
+    '&[data-active="true"]': {
+        color: string;
+        background: string;
+    };
+    "&:hover:not(:disabled,[data-active='true'])": {
+        backgroundColor: string;
+    };
+}>;
+export declare const iconClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    padding: number;
+}>;
 export declare const fadeIn: {
@@ -9,5 +104,28 @@ (): string;
 };
-export declare const absoluteClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorBundlerClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorMessageClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const absoluteClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    position: string;
+    bottom: string;
+    left: string;
+    right: string;
+    top: string;
+    margin: string;
+    overflow: string;
+    height: string;
+    zIndex: string;
+}>;
+export declare const errorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    backgroundColor: string;
+}>;
+export declare const errorBundlerClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        marginTop: string;
+        width: string;
+        gap: string;
+        padding: string;
+    };
+    padding: string;
+    backgroundColor: string;
+}>;
+export declare const errorMessageClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    fontFamily: string;
+}>;

dist/types.d.ts

@@ -213,7 +213,7 @@ import type { LanguageSupport } from "@codemirror/language";
  */
-export declare type SandboxEnvironment = "angular-cli" | "create-react-app" | "create-react-app-typescript" | "svelte" | "parcel" | "vue-cli" | "static" | "solid" | "node";
+export type SandboxEnvironment = "angular-cli" | "create-react-app" | "create-react-app-typescript" | "svelte" | "parcel" | "vue-cli" | "static" | "solid" | "node";
 /**
  * @category Setup
  */
-export declare type SandpackPredefinedTemplate = keyof typeof SANDBOX_TEMPLATES;
+export type SandpackPredefinedTemplate = keyof typeof SANDBOX_TEMPLATES;
 /**
@@ -243,3 +243,3 @@ * @category Setup
  */
-export declare type SandpackInitMode = "immediate" | "lazy" | "user-visible";
+export type SandpackInitMode = "immediate" | "lazy" | "user-visible";
 /**
@@ -256,3 +256,3 @@ * @category Setup
  */
-export declare type SandpackPredefinedTheme = "light" | "dark" | "auto";
+export type SandpackPredefinedTheme = "light" | "dark" | "auto";
 /**
@@ -306,3 +306,3 @@ * @category Theme
  */
-export declare type SandpackThemeProp = SandpackPredefinedTheme | DeepPartial<SandpackTheme>;
+export type SandpackThemeProp = SandpackPredefinedTheme | DeepPartial<SandpackTheme>;
 /**
@@ -318,3 +318,3 @@ *
  */
-export declare type TemplateFiles<Name extends SandpackPredefinedTemplate> = keyof typeof SANDBOX_TEMPLATES[Name]["files"];
+export type TemplateFiles<Name extends SandpackPredefinedTemplate> = keyof typeof SANDBOX_TEMPLATES[Name]["files"];
 export interface SandpackInternal {
@@ -399,5 +399,5 @@ <Files extends SandpackFiles | any, TemplateName extends SandpackPredefinedTemplate = "vanilla">(props: SandpackInternalProps<Files, TemplateName> & {
 }
-export declare type SandpackClientDispatch = (msg: SandpackMessage, clientId?: string) => void;
-export declare type SandpackClientListen = (listener: ListenerFunction, clientId?: string) => UnsubscribeFunction;
-export declare type SandpackContext = SandpackState & {
+export type SandpackClientDispatch = (msg: SandpackMessage, clientId?: string) => void;
+export type SandpackClientListen = (listener: ListenerFunction, clientId?: string) => UnsubscribeFunction;
+export type SandpackContext = SandpackState & {
     dispatch: SandpackClientDispatch;
@@ -462,6 +462,6 @@ listen: SandpackClientListen;
 }
-export declare type SandpackStatus = "initial" | "idle" | "running" | "timeout" | "done";
-export declare type EditorState = "pristine" | "dirty";
+export type SandpackStatus = "initial" | "idle" | "running" | "timeout" | "done";
+export type EditorState = "pristine" | "dirty";
 export interface SandboxTemplate {
-    files: SandpackFiles;
+    files: SandpackBundlerFiles;
     dependencies: Record<string, string>;
@@ -473,3 +473,3 @@ devDependencies?: Record<string, string>;
 }
-export declare type SandpackFiles = Record<string, string | SandpackFile>;
+export type SandpackFiles = Record<string, string | SandpackFile>;
 /**
@@ -497,3 +497,3 @@ * Custom properties to be used in the SandpackCodeEditor component,
 }
-export declare type DeepPartial<Type> = {
+export type DeepPartial<Type> = {
     [Property in keyof Type]?: DeepPartial<Type[Property]>;
@@ -500,0 +500,0 @@ };

dist/unstyled/components/CodeEditor/CodeMirror.d.ts

@@ -6,3 +6,3 @@ import type { Extension } from "@codemirror/state";
 import type { CustomLanguage, EditorState as SandpackEditorState, SandpackInitMode } from "../../types";
-export declare type Decorators = Array<{
+export type Decorators = Array<{
     className?: string;
@@ -9,0 +9,0 @@ line: number;

dist/unstyled/components/CodeEditor/index.d.ts

@@ -7,3 +7,3 @@ /// <reference types="react" />
 import type { CodeMirrorRef } from "./CodeMirror";
-export declare type CodeEditorRef = CodeMirrorRef;
+export type CodeEditorRef = CodeMirrorRef;
 export interface CodeEditorProps {
@@ -10,0 +10,0 @@ style?: React.CSSProperties;

dist/unstyled/components/CodeEditor/styles.d.ts

@@ -1,5 +0,60 @@
-export declare const placeholderClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const tokensClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const editorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const cmClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const readOnlyClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const placeholderClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    margin: string;
+    display: string;
+    fontFamily: string;
+    fontSize: string;
+    color: string;
+    lineHeight: string;
+}>;
+export declare const tokensClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, Record<string, string>>;
+export declare const editorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | number | {
+        padding: string;
+        "@supports (-webkit-overflow-scrolling: touch)"?: undefined;
+    } | {
+        "@supports (-webkit-overflow-scrolling: touch)": {
+            ".cm-content": {
+                fontSize: string;
+            };
+        };
+        padding?: undefined;
+    };
+    flex: number;
+    position: string;
+    overflow: string;
+    background: string;
+    ".cm-scroller": {
+        padding: string;
+    };
+    /**
+     * For iOS: prevent browser zoom when clicking on sandbox.
+     * Does NOT apply to code blocks.
+     */
+    "@media screen and (max-width: 768px)": {
+        "@supports (-webkit-overflow-scrolling: touch)": {
+            ".cm-content": {
+                fontSize: string;
+            };
+        };
+    };
+}>;
+export declare const cmClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    margin: string;
+    outline: string;
+    height: string;
+}>;
+export declare const readOnlyClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        right: string;
+    };
+    fontFamily: string;
+    fontSize: string;
+    position: string;
+    right: string;
+    bottom: string;
+    zIndex: string;
+    color: string;
+    backgroundColor: string;
+    borderRadius: string;
+    padding: string;
+}>;

dist/unstyled/components/CodeEditor/utils.d.ts

@@ -15,2 +15,2 @@ import type { LanguageSupport } from "@codemirror/language";
 export declare const getCodeMirrorLanguage: (extension: string, additionalLanguages: CustomLanguage[]) => LanguageSupport;
-export declare const useCombinedRefs: <T extends unknown>(...refs: React.Ref<T>[]) => React.Ref<T>;
+export declare const useCombinedRefs: <T>(...refs: React.Ref<T>[]) => React.Ref<T>;

dist/unstyled/components/common/ErrorOverlay.d.ts

 import * as React from "react";
-export declare type ErrorOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
+export type ErrorOverlayProps = React.HTMLAttributes<HTMLDivElement> & {
     children?: React.ReactNode;
 };
 export declare const ErrorOverlay: React.FC<ErrorOverlayProps>;

dist/unstyled/components/common/Layout.d.ts

@@ -5,3 +5,54 @@ import * as React from "react";
 }
-export declare const layoutClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+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>>;

dist/unstyled/components/common/Stack.d.ts

 import * as React from "react";
-export declare const stackClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const stackClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    display: string;
+    flexDirection: string;
+    width: string;
+    position: string;
+    backgroundColor: string;
+    gap: number;
+    "&:has(.sp-stack)": {
+        backgroundColor: string;
+    };
+}>;
 export declare const SandpackStack: React.FC<React.HTMLAttributes<HTMLDivElement> & {
     children?: React.ReactNode;
 }>;

dist/unstyled/components/Console/utils/fromConsoleToString.d.ts

 import type { TransformsTypes } from "./transformers";
-export declare type Message = null | string | number | undefined | Array<any> | Record<any, any> | Boolean | Symbol | {
+export type Message = null | string | number | undefined | Array<any> | Record<any, any> | Boolean | Symbol | {
     "@r": number;
@@ -4,0 +4,0 @@ } | {

dist/unstyled/components/Console/utils/getType.d.ts

 import type { SandpackMessageConsoleMethods } from "@codesandbox/sandpack-client";
 export declare const getType: (message: SandpackMessageConsoleMethods) => "info" | "warning" | "error" | "clear";
-export declare type SandpackConsoleData = Array<{
+export type SandpackConsoleData = Array<{
     data: Array<string | Record<string, string>> | undefined;
@@ -5,0 +5,0 @@ id: string;

dist/unstyled/components/Console/utils/transformers.d.ts

@@ -1,4 +0,4 @@
-export declare type TransformsTypes = "Function" | "HTMLElement" | "[[NaN]]" | "[[undefined]]" | "[[Date]]" | "[[RegExp]]" | "[[Error]]" | "[[RegExp]]" | "[[Error]]" | "[[ArrayBuffer]]" | "[[TypedArray]]" | "[[Map]]" | "[[Set]]" | "Arithmetic";
-declare type Transforms = Record<TransformsTypes, (...params: any) => any>;
+export type TransformsTypes = "Function" | "HTMLElement" | "[[NaN]]" | "[[undefined]]" | "[[Date]]" | "[[RegExp]]" | "[[Error]]" | "[[RegExp]]" | "[[Error]]" | "[[ArrayBuffer]]" | "[[TypedArray]]" | "[[Map]]" | "[[Set]]" | "Arithmetic";
+type Transforms = Record<TransformsTypes, (...params: any) => any>;
 export declare const transformers: Transforms;
 export {};

dist/unstyled/components/FileTabs/index.d.ts

 import * as React from "react";
-export declare const tabButton: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const tabButton: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        outline: string;
+        visibility?: undefined;
+    } | {
+        visibility: string;
+        outline?: undefined;
+    };
+    padding: string;
+    height: string;
+    whiteSpace: string;
+    "&:focus": {
+        outline: string;
+    };
+}>;
 export interface FileTabsProps {
@@ -4,0 +18,0 @@ /**

dist/unstyled/components/ReactDevTools/index.d.ts

 import * as React from "react";
-declare type DevToolsTheme = "dark" | "light";
+type DevToolsTheme = "dark" | "light";
 export declare const SandpackReactDevTools: ({ clientId, theme, className, ...props }: {
@@ -4,0 +4,0 @@ clientId?: string | undefined;

dist/unstyled/components/Tests/SandpackTests.d.ts

 import * as React from "react";
 import type { Spec } from "./Specs";
-export declare type Status = "initialising" | "idle" | "running" | "complete";
+export type Status = "initialising" | "idle" | "running" | "complete";
 export declare const SandpackTests: React.FC<{
@@ -5,0 +5,0 @@ verbose?: boolean;

dist/unstyled/components/Tests/Specs.d.ts

@@ -5,3 +5,3 @@ import type { TestError } from "@codesandbox/sandpack-client";
 import type { Status } from "./SandpackTests";
-export declare type Spec = {
+export type Spec = {
     error?: TestError;
@@ -8,0 +8,0 @@ } & Describe;

dist/unstyled/components/Tests/Tests.d.ts

 import type { TestError } from "@codesandbox/sandpack-client";
 import React from "react";
-declare type TestStatus = "idle" | "running" | "pass" | "fail";
+type TestStatus = "idle" | "running" | "pass" | "fail";
 export interface Test {
@@ -5,0 +5,0 @@ name: string;

dist/unstyled/contexts/utils/useAppState.d.ts

@@ -7,4 +7,4 @@ import type { SandpackBundlerFiles } from "@codesandbox/sandpack-client";
 }
-declare type UseAppState = (props: SandpackProviderProps, files: SandpackBundlerFiles) => SandpackAppState;
+type UseAppState = (props: SandpackProviderProps, files: SandpackBundlerFiles) => SandpackAppState;
 export declare const useAppState: UseAppState;
 export {};

dist/unstyled/contexts/utils/useClient.d.ts

@@ -5,3 +5,3 @@ /// <reference types="react" />
 import type { FilesState } from "./useFiles";
-declare type SandpackClientType = InstanceType<typeof SandpackClient>;
+type SandpackClientType = InstanceType<typeof SandpackClient>;
 interface SandpackConfigState {
@@ -31,4 +31,4 @@ reactDevTools?: ReactDevToolsMode;
 }
-declare type UseClient = (props: SandpackProviderProps, filesState: FilesState) => [SandpackConfigState, UseClientOperations];
+type UseClient = (props: SandpackProviderProps, filesState: FilesState) => [SandpackConfigState, UseClientOperations];
 export declare const useClient: UseClient;
 export {};

dist/unstyled/contexts/utils/useFiles.d.ts

@@ -21,3 +21,3 @@ import type { SandpackBundlerFiles } from "@codesandbox/sandpack-client";
 }
-export declare type UseFiles = (props: SandpackProviderProps) => [
+export type UseFiles = (props: SandpackProviderProps) => [
     FilesState & {
@@ -24,0 +24,0 @@ visibleFilesFromProps: Array<TemplateFiles<SandpackPredefinedTemplate> | string>;

dist/unstyled/hooks/useActiveCode.d.ts

@@ -10,3 +10,3 @@ /**
     readOnly: boolean;
-    updateCode: (newCode: string, shouldUpdatePreview?: boolean | undefined) => void;
+    updateCode: (newCode: string, shouldUpdatePreview?: boolean) => void;
 };

dist/unstyled/hooks/useLoadingOverlayState.d.ts

@@ -1,2 +0,2 @@
-export declare type LoadingOverlayState = "LOADING" | "PRE_FADING" | "FADING" | "HIDDEN" | "TIMEOUT";
+export type LoadingOverlayState = "LOADING" | "PRE_FADING" | "FADING" | "HIDDEN" | "TIMEOUT";
 export declare const FADE_ANIMATION_DURATION = 200;
@@ -6,2 +6,2 @@ /**
  */
-export declare const useLoadingOverlayState: (clientId?: string | undefined, externalLoading?: boolean | undefined) => LoadingOverlayState;
+export declare const useLoadingOverlayState: (clientId?: string, externalLoading?: boolean) => LoadingOverlayState;

dist/unstyled/hooks/useSandpackClient.d.ts

@@ -21,3 +21,3 @@ import type { ListenerFunction, SandpackClient, SandpackMessage, UnsubscribeFunction } from "@codesandbox/sandpack-client";
  */
-export declare const useSandpackClient: (clientPropsOverride?: ClientPropsOverride | undefined) => UseSandpackClient;
+export declare const useSandpackClient: (clientPropsOverride?: ClientPropsOverride) => UseSandpackClient;
 export {};

dist/unstyled/hooks/useSandpackNavigation.d.ts

 /**
  * @category Hooks
  */
-export declare const useSandpackNavigation: (clientId?: string | undefined) => {
+export declare const useSandpackNavigation: (clientId?: string) => {
     refresh: () => void;
@@ -6,0 +6,0 @@ back: () => void;

dist/unstyled/hooks/useSandpackShell.d.ts

 /**
  * @category Hooks
  */
-export declare const useSandpackShell: (clientId?: string | undefined) => {
+export declare const useSandpackShell: (clientId?: string) => {
     restart: () => void;
     openPreview: () => void;
 };

dist/unstyled/styles/shared.d.ts

@@ -1,5 +0,100 @@
-export declare const iconStandaloneClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const buttonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const roundedButtonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const iconClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const iconStandaloneClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    svg: {
+        margin: string;
+    };
+}>;
+export declare const buttonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | number | {
+        color: string;
+        minWidth?: undefined;
+        width?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        minWidth: string;
+        width: string;
+        height: string;
+        color?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        padding: string;
+        height: string;
+        display: string;
+        color?: undefined;
+        minWidth?: undefined;
+        width?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        width: string;
+        color?: undefined;
+        minWidth?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+        paddingRight?: undefined;
+        paddingLeft?: undefined;
+        gap?: undefined;
+    } | {
+        paddingRight: string;
+        paddingLeft: string;
+        gap: string;
+        color?: undefined;
+        minWidth?: undefined;
+        width?: undefined;
+        height?: undefined;
+        padding?: undefined;
+        display?: undefined;
+    };
+    appearance: string;
+    outline: string;
+    display: string;
+    alignItems: string;
+    fontSize: string;
+    fontFamily: string;
+    backgroundColor: string;
+    transition: string;
+    cursor: string;
+    color: string;
+    border: number;
+    textDecoration: string;
+    "&:disabled": {
+        color: string;
+    };
+    "&:hover:not(:disabled,[data-active='true'])": {
+        color: string;
+    };
+    '&[data-active="true"]': {
+        color: string;
+    };
+    svg: {
+        minWidth: string;
+        width: string;
+        height: string;
+    };
+}>;
+export declare const roundedButtonClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    backgroundColor: string;
+    borderRadius: string;
+    border: string;
+    '&[data-active="true"]': {
+        color: string;
+        background: string;
+    };
+    "&:hover:not(:disabled,[data-active='true'])": {
+        backgroundColor: string;
+    };
+}>;
+export declare const iconClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    padding: number;
+}>;
 export declare const fadeIn: {
@@ -9,5 +104,28 @@ (): string;
 };
-export declare const absoluteClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorBundlerClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
-export declare const errorMessageClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, import("@stitches/core/types/css-util").CSS<{}, {}, {}, {}>>;
+export declare const absoluteClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    position: string;
+    bottom: string;
+    left: string;
+    right: string;
+    top: string;
+    margin: string;
+    overflow: string;
+    height: string;
+    zIndex: string;
+}>;
+export declare const errorClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    backgroundColor: string;
+}>;
+export declare const errorBundlerClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    [x: string]: string | {
+        marginTop: string;
+        width: string;
+        gap: string;
+        padding: string;
+    };
+    padding: string;
+    backgroundColor: string;
+}>;
+export declare const errorMessageClassName: import("@stitches/core/types/styled-component").CssComponent<never, {}, {}, {
+    fontFamily: string;
+}>;

dist/unstyled/types.d.ts

@@ -213,7 +213,7 @@ import type { LanguageSupport } from "@codemirror/language";
  */
-export declare type SandboxEnvironment = "angular-cli" | "create-react-app" | "create-react-app-typescript" | "svelte" | "parcel" | "vue-cli" | "static" | "solid" | "node";
+export type SandboxEnvironment = "angular-cli" | "create-react-app" | "create-react-app-typescript" | "svelte" | "parcel" | "vue-cli" | "static" | "solid" | "node";
 /**
  * @category Setup
  */
-export declare type SandpackPredefinedTemplate = keyof typeof SANDBOX_TEMPLATES;
+export type SandpackPredefinedTemplate = keyof typeof SANDBOX_TEMPLATES;
 /**
@@ -243,3 +243,3 @@ * @category Setup
  */
-export declare type SandpackInitMode = "immediate" | "lazy" | "user-visible";
+export type SandpackInitMode = "immediate" | "lazy" | "user-visible";
 /**
@@ -256,3 +256,3 @@ * @category Setup
  */
-export declare type SandpackPredefinedTheme = "light" | "dark" | "auto";
+export type SandpackPredefinedTheme = "light" | "dark" | "auto";
 /**
@@ -306,3 +306,3 @@ * @category Theme
  */
-export declare type SandpackThemeProp = SandpackPredefinedTheme | DeepPartial<SandpackTheme>;
+export type SandpackThemeProp = SandpackPredefinedTheme | DeepPartial<SandpackTheme>;
 /**
@@ -318,3 +318,3 @@ *
  */
-export declare type TemplateFiles<Name extends SandpackPredefinedTemplate> = keyof typeof SANDBOX_TEMPLATES[Name]["files"];
+export type TemplateFiles<Name extends SandpackPredefinedTemplate> = keyof typeof SANDBOX_TEMPLATES[Name]["files"];
 export interface SandpackInternal {
@@ -399,5 +399,5 @@ <Files extends SandpackFiles | any, TemplateName extends SandpackPredefinedTemplate = "vanilla">(props: SandpackInternalProps<Files, TemplateName> & {
 }
-export declare type SandpackClientDispatch = (msg: SandpackMessage, clientId?: string) => void;
-export declare type SandpackClientListen = (listener: ListenerFunction, clientId?: string) => UnsubscribeFunction;
-export declare type SandpackContext = SandpackState & {
+export type SandpackClientDispatch = (msg: SandpackMessage, clientId?: string) => void;
+export type SandpackClientListen = (listener: ListenerFunction, clientId?: string) => UnsubscribeFunction;
+export type SandpackContext = SandpackState & {
     dispatch: SandpackClientDispatch;
@@ -462,6 +462,6 @@ listen: SandpackClientListen;
 }
-export declare type SandpackStatus = "initial" | "idle" | "running" | "timeout" | "done";
-export declare type EditorState = "pristine" | "dirty";
+export type SandpackStatus = "initial" | "idle" | "running" | "timeout" | "done";
+export type EditorState = "pristine" | "dirty";
 export interface SandboxTemplate {
-    files: SandpackFiles;
+    files: SandpackBundlerFiles;
     dependencies: Record<string, string>;
@@ -473,3 +473,3 @@ devDependencies?: Record<string, string>;
 }
-export declare type SandpackFiles = Record<string, string | SandpackFile>;
+export type SandpackFiles = Record<string, string | SandpackFile>;
 /**
@@ -497,3 +497,3 @@ * Custom properties to be used in the SandpackCodeEditor component,
 }
-export declare type DeepPartial<Type> = {
+export type DeepPartial<Type> = {
     [Property in keyof Type]?: DeepPartial<Type[Property]>;
@@ -500,0 +500,0 @@ };

dist/unstyled/utils/sandpackUtils.d.ts

@@ -33,2 +33,2 @@ import type { SandpackBundlerFile, SandpackBundlerFiles } from "@codesandbox/sandpack-client";
  */
-export declare const convertedFilesToBundlerFiles: (files?: SandpackFiles | undefined) => SandpackBundlerFiles;
+export declare const convertedFilesToBundlerFiles: (files?: SandpackFiles) => SandpackBundlerFiles;

dist/utils/sandpackUtils.d.ts

@@ -33,2 +33,2 @@ import type { SandpackBundlerFile, SandpackBundlerFiles } from "@codesandbox/sandpack-client";
  */
-export declare const convertedFilesToBundlerFiles: (files?: SandpackFiles | undefined) => SandpackBundlerFiles;
+export declare const convertedFilesToBundlerFiles: (files?: SandpackFiles) => SandpackBundlerFiles;

package.json

 {
   "name": "@codesandbox/sandpack-react",
-  "version": "2.9.0",
+  "version": "2.10.0",
   "description": "",
@@ -43,3 +43,3 @@ "keywords": [],
     "start": "tsc -p tsconfig.esm.json --watch",
-    "dev": "start-storybook -p 6006 --quiet",
+    "dev": "storybook dev -p 6006 --quiet",
     "typecheck": "tsc",
@@ -63,3 +63,3 @@ "format": "prettier --write '**/*.{ts,tsx,js,jsx}'",
     "@codemirror/view": "^6.7.1",
-    "@codesandbox/sandpack-client": "^2.9.0",
+    "@codesandbox/sandpack-client": "^2.10.0",
     "@lezer/highlight": "^1.1.3",
@@ -82,4 +82,4 @@ "@react-hook/intersection-observer": "^3.1.1",
     "@codesandbox/sandpack-themes": "^2.0.21",
-    "@storybook/builder-vite": "^0.2.5",
-    "@storybook/react": "^6.5.14",
+    "@storybook/react": "^7.5.1",
+    "@storybook/react-vite": "^7.5.1",
     "@testing-library/react-hooks": "8.0.1",
@@ -95,3 +95,4 @@ "@types/fs-extra": "^5.0.4",
     "rollup-plugin-filesize": "^10.0.0",
-    "typescript": "4.4.4"
+    "storybook": "^7.5.1",
+    "typescript": "^5.2.2"
   },
@@ -102,3 +103,3 @@ "peerDependencies": {
   },
-  "gitHead": "bfb14f1e7a253adb4be9265c6ff9ee78f4ede894"
+  "gitHead": "6b572496d691c4f3c43c3e251189a521b0b19aae"
 }

No alert changes

Improved metrics

Lines of code

27777

increased by0.92%

Worsened metrics

Total package byte prevSize

1152999

decreased by-0.37%

Dev dependency count

18

increased by5.88%

Dependency changes

• Updated@codesandbox/sandpack-client@^2.10.0